{"version":"1.0","type":"rich","title":"Rendering DATA with React","description":"This example shows the CSS Named Colors dataset rendered as a stacked sequence of 960-pixel-wide horizontal strips, one per color, with each strip’s background fill set directly from its RGB hex value. Using React’s `useState` and `useEffect`, the app fetches the CSV via `d3.csv`, then maps each row to a `<div>` element whose inline style sets the background color. The code relies on React 16.9, ReactDOM, and d3.v6, with no SVG or canvas—only plain HTML `<div>` elements. A loading state displays “Loading..” until the data arrives.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/cfb40221736d4bc19e0e07d66ccd4ed8?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}