{"version":"1.0","type":"rich","title":"Load D3 Util and use React state","description":"This example shows a minimal React application that loads D3 utilities and uses React state to manage fetched data. The interface renders empty placeholder divs, while a script appends a new paragraph and sets all div text content to a numeric value. The code initializes a React component with a `useState` hook for storing data, and a `useEffect` hook for fetching a JSON dataset from the Vega movies URL. It also constructs a vega-lite-api mark bar chart specification referencing the same data source, though the chart itself is not rendered. The example demonstrates integrating D3 v7, React 16.9, and vega-lite-api.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/ec2a87ab02614bceb54b12ba7f31a7d4?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}