{"version":"1.0","type":"rich","title":"Responsive Axes","description":"This example demonstrates a visualization container with responsive axes that maintain consistent tick mark density as the window is resized. The code uses D3.js scales and axis components, including `scaleLinear`, `axisBottom`, and `axisLeft`, to render the chart. A `ResizeObserver` detects container dimension changes, and the tick count is recalculated based on the inner width and height divided by a fixed pixel density. The axes and their labels update dynamically to match the new size.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/f95198ee6da3474d9d3e8527c3acb9fa?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}