{"version":"1.0","type":"rich","title":"ICE-6: Rendering Marks and Channels with React & D3","description":"This example visualizes the number of gold medals won by the top ten countries in the Tokyo Olympics, using a horizontal bar chart ordered from highest to lowest medal count. The chart is rendered as SVG within a React application, with D3 v5 handling data loading via `d3.csv`, scaling through `scaleBand` and `scaleLinear`, and gridline creation with `xScale.ticks`. Each rectangular bar uses a distinct fill color from a hardcoded array, with the data sourced from a remote CSV file.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/9ee713a75e9e454099e30bc3b08aa0fe?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}