{"version":"1.0","type":"rich","title":"Customizing axes","description":"This example demonstrates how to customize chart axes in D3.js, displaying population data for seven countries as horizontal bars. The y-axis uses a band scale for country names, while the x-axis applies a linear scale with custom tick formatting that converts large numbers to compact notation (e.g., \"2.2B\"). The code employs scaleLinear, scaleBand, axisBottom, axisLeft, and format from D3 v5 within a React framework, rendering to SVG with custom tick text styling and axis label positioning.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/b1103bf94e7841c993907f6fda751ec0?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}