{"version":"1.0","type":"rich","title":"Refarctored Bar Chart","description":"This example visualizes the population of the top 10 countries in 2020 using a horizontal bar chart. The bars are scaled proportionally to population values, with country names displayed on the vertical axis and population numbers on the horizontal scale. Built with React and D3 v5, the code loads CSV data via `d3.csv`, uses `scaleBand` and `scaleLinear` for axes, and renders SVG rectangles for each bar. The React component structure separates axes and marks into distinct modules, with data fetched asynchronously using a custom `useData` hook.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/1d4c4d197678487ba401975ac0cade4a?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}