{"version":"1.0","type":"rich","title":"Fork of Fork of Fork of Fork of ICE-6: Rendering Marks and Channels with React & D3","description":"This example uses React and D3 to render a bar chart of the top 20 songs from a CSV dataset titled \"top 100 songs on spotify.\" The visualization maps song tempo to the y-axis and duration to the x-axis, using red rectangles displayed as SVG marks within a 960x500 canvas. The code imports the `csv`, `scaleBand`, `scaleLinear`, and `max` functions from D3 v5 to load data and compute scales, while a custom row function parses the `TotalDeaths` field. Axes are drawn with manually mapped tick marks using `<line>` and `<text>` elements, and React's `useState` and `useEffect` handle asynchronous data loading.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/3c4c0da743d848b9bfa8d3654c5fd36d?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}