{"version":"1.0","type":"rich","title":"Fork of ICE-6: Rendering Marks and Channels with React & D3","description":"This example shows a horizontal bar chart of city temperatures, using React to render SVG marks and D3 to compute scales. It loads city data from a CSV file, slices the first 15 rows, and maps each city’s `Basic_length` value to a bar’s width. The code uses `d3.csv` for parsing, `d3.scaleBand` for the y-axis, `d3.scaleLinear` for the x-axis, and `d3.max` for domain calculation. Grid lines and axis ticks are drawn manually with SVG elements, while React’s `useEffect` and `useState` manage asynchronous data loading.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/6f6ef4fd12014afdb7718dcf2bc55137?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}