Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Color and Size Legends

Public visualization

Viewing a saved revision (read-only)

798ef82ba0f34df2aa9efd6a3a5a833f

Color and Size Legends

0 stars0🌍 Public
FFlying ACE
Last edited Jun 13, 2020
Created on Jun 13, 2020

This example demonstrates how to construct separate color and size legends using D3 v5. The color legend maps ordinal categories (apple, lemon, lime, orange) to distinct colors via `scaleOrdinal`, while the size legend uses `scaleSqrt` to represent numeric values with proportional circle radii. Both legends are built with reusable functions that accept `selection` and `props`, appending SVG groups with circles and text labels. The size legend filters out zero values and reverses tick order, displaying five ticks with semi-transparent black circles.

AI-generated description