🌍 Public
Viewing a saved revision (read-only)
14e2d90eb0e745ce9d68eda160ff8fa6
Distance Relay
Distance Relay is a D3.js visualization that renders three labeled distance vectors radiating from a central point, each paired with a circle whose diameter equals the vector's magnitude. The vectors use red, green, and magenta strokes, and their angles and lengths define the circle centers and radii. The code employs `d3.select`, `extent`, and SVG circle elements, with manual trigonometry converting polar coordinates to Cartesian positions. The viewBox is dynamically adjusted to fit all geometric elements, and the example invites creative theming variations like Halloween or Christmas modifications.
AI-generated descriptionCreating circles with D3.
Challenge
- Fork this example
- Modify it
- Maybe make it Halloween themed
- Maybe make it Christmas themed
- Be creative