Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Color and Size Legends

Public visualization

Viewing a saved revision (read-only)

0bfc1fa219b24e3b942a21bd1fb79385

Color and Size Legends

0 stars0🌍 Public
KKevinw97
Last edited Feb 12, 2020
Created on Feb 12, 2020

This example demonstrates how to create custom legends for both ordinal color scales and quantitative size scales in D3 v5. The color legend displays four fruit categories with distinct colored circles, while the size legend uses a sqrt scale to show proportional circle radii for numeric tick values. The code exports reusable legend functions that use D3’s selection joins, `scaleOrdinal`, `scaleSqrt`, and generated SVG groups with circles and text labels.

AI-generated description