{"version":"1.0","type":"rich","title":"Loading Data with React & D3","description":"This example shows a React component that loads a CSV file of CSS named colors using D3’s `d3.csv` utility, then displays summary statistics about the dataset within a `<pre>` element. The code relies on React hooks (`useState`, `useEffect`) to manage the asynchronous data loading and render a \"Loading...\" message until the data arrives. Once loaded, it uses `d3.csvFormat` to calculate the data size in kilobytes, along with row and column counts. The data comes from a gist hosted CSV file, and the interface is built with React 16.9 and D3 v5.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/ab360c63216744c88874f092700d4ab6?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}