{"version":"1.0","type":"rich","title":"D3 + React + useData","description":"This example demonstrates how to build a D3.js visualization within a React application using a custom `useData` hook to load CSV data from a GitHub gist. It shows a set of circles whose count and size are dynamically controlled by input fields. The code combines React's `useRef`, `useState`, `useMemo`, and `useCallback` with D3's `select` API for incremental updates, and uses a `VizContainer` component to structure the SVG with margin conventions.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/0261f285f16147b9bbd4e645927d9e96?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}