{"version":"1.0","type":"rich","title":"Flower of Colors Rendering Data with React","description":"This example shows a flower-like radial visualization of 148 named CSS colors, with each color occupying a wedge-shaped slice arranged in a circular pattern. The code loads the color data asynchronously using `d3.csv` and manages the loading state with React’s `useState` and `useEffect` hooks. Each slice is rendered as an SVG `<path>` element using the `d3.arc` generator, with angles computed proportionally from the data’s index. The visualization centers the flower by translating the SVG group to the middle of the canvas.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/0dc5dfb529c140c7b8993b3699fdfbbe?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}