🌍 Public
Viewing a saved revision (read-only)
75a2f0c422bc43139e6653500e499c9c
Axes with Hover
This example demonstrates a responsive scatter plot with dynamic axes that update as the viewport resizes. It shows hover tracking by drawing crosshair lines that follow the mouse pointer across the plotting area, constrained within the inner region defined by the margins. Using D3.js, the visualization creates linear scales for the x and y axes, applies axis ticks via `d3.axisBottom` and `d3.axisLeft`, and renders axis labels as SVG text elements. The code employs a ResizeObserver to trigger re-rendering whenever the container size changes, ensuring the chart stays properly fitted.
AI-generated descriptionCreating circles with D3.
Challenge
- Fork this example
- Modify it
- Maybe make it Halloween themed
- Maybe make it Christmas themed
- Be creative