Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Fork of Project Momentum v3

Public visualization

Viewing a saved revision (read-only)

710c5baae70a4e478ccb8394acd69516

Fork of Project Momentum v3

0 stars1🌍 Public
IIan Wright
Last edited Nov 13, 2024
Created on Nov 4, 2024

This visualization displays the distribution of LEGO sets by theme, using a nested donut chart where three concentric arcs per slice show the total count, the number of sets priced under $100, and those under $50. Hovering dims non-selected arcs via opacity adjustments. The chart is built with D3’s `pie` and `arc` generators, with data imported from the `@Landaman/lego-csv` package and grouped by theme. Color mapping uses `scaleOrdinal` with `schemeCategory10`, while labels and leader lines are positioned using `arc().centroid`.

AI-generated description

An approximation of a line chart using D3.js!

Watch the video and study the code to learn about:

  • SVG Path Elements
  • fill, stroke, stroke-width
  • stroke-linecap, stroke-linejoin
  • Vanilla HTML SVG Paths
  • D3.line
  • AI Assist

See also:

Full Playlist: Constructing Visualizations