{"version":"1.0","type":"rich","title":"Corey's Responsive Axis","description":"This example demonstrates a D3.js visualization with labeled X and Y axes that adapt their tick density based on the chart's dimensions. It shows how a ResizeObserver monitors the container, and when resized, the axes recalculate tick counts relative to the inner plot area's width and height. The code uses d3.scaleLinear for the x and y scales, d3.axisBottom and d3.axisLeft to render the axes, and custom functions for the axis labels. A gray inner rectangle marks the plot region, with the axes positioned along its bottom and left edges.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/5a182289188543498751bee9cae10a01?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}