Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Color and Size Legends

Public visualization

Viewing a saved revision (read-only)

7c0c02465cda4f3d95dad3d8746d6dfb

Color and Size Legends

0 stars0🌍 Public
Vvivianaaai@qq.com
Last edited Mar 16, 2023
Created on Mar 16, 2023

This example demonstrates how to build interactive legends for ordinal color scales, displaying circles and labels for each category. It uses D3 v5’s `scaleOrdinal` to map fruit types to colors, with a custom `colorLegend` function that appends SVG groups, circles, and text elements. The legend positions items horizontally based on index and vertically centered, with the color scale domain defining the data categories. The code also includes a YouTube video link in the README for additional guidance.

AI-generated description