🌍 Public
Viewing a saved revision (read-only)
f52c944c1f58436492242e6a1e3dd5c6
Responsive Axes
This example demonstrates how to build a responsive scatter plot visualization with labeled axes using D3.js. It renders a gray inner rectangle with linear scales for the x and y axes, both of which dynamically adjust their tick count based on the chart's dimensions. The code uses a ResizeObserver to monitor the container size and automatically update the SVG’s width and height on resize. Axes are drawn with `axisBottom` and `axisLeft`, while labels are added as rotated text elements, showcasing a modular structure split into separate axis and label modules.
AI-generated descriptionAdding labels to our X and Y axes with D3.