d3-scale maps data domains to output ranges. An ordinal scale maps discrete labels, such as language families, to discrete values, such as colors. section 11.2.2
Build a color scale for a hierarchical circle pack:
- Install the module with npm install d3-scale. section 11.2.2
- Import scaleOrdinal and derive the domain and range with JavaScript map(). section 11.2.2
- Apply the scale to depth-1 language-family circles; interpolate parent colors toward white for deeper branches. section 11.2.2
Listing 11.11 Creating the color scale (scales.js)
import { scaleOrdinal } from "d3-scale";
import { languageFamilies } from "./helper";
export const colorScale = scaleOrdinal()
.domain(languageFamilies.map(d => d.label))
.range(languageFamilies.map(d => d.color));
Inspect the complete ordinal scale definition, including its language-family domain and associated color range. section 11.2.2
