{"version":"1.0","type":"rich","title":"React + D3 Hooks template","description":"This visualization displays a scatterplot of student eye colors, with each circle’s position and size derived from the red, green, and blue components of the eye color. The example shows how to combine React hooks with D3 v5 by using a custom `CirclePlot` component that wraps D3 logic in a `useEffect` hook. It uses `d3.json` to load data from a GitHub gist, filters for valid hex colors, and applies `d3.scaleLinear` with `d3.easeBounce` transitions to animate the circles as they scale.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/03e199a9c4d6447ab6e2cc080eace56b?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}