{"version":"1.0","type":"rich","title":"Shoot Straight - React with D3 Transitions","description":"This example shows a scatterplot of a custom dataset, where each point animates from a central \"firing\" position to its final coordinate. The visualization combines React components with D3.js version 5 to manage the SVG rendering and the transition animations. The `Mark` component uses a D3 selection and the `transition` method with a delay to animate each circle's `cx` and `cy` attributes, while `AxisBottom` and `AxisLeft` render linear scales using `scaleLinear`. The data is generated in `useData` using a greatest common denominator calculation.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/0c1d5f3de20f4e8897c46b4e02bcd55c?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}