I would like to take one of the d3 color schemes but produce a pastel version of it. I don't want the light colors to be too light or the dark to be too dark.
Currently have:
intColor = d3.scaleOrdinal()
.domain(locations.map(d => d.id))
.range(d3.quantize(t => d3.interpolateSpectral(t * .8 .1), locations.length))
but the t function (* .8 to pull in right side and .1 to pull in left) is not controllable. Would like something where I can say use d3.interpolateRdYlGn with a certain lightness range.
CodePudding user response:
In the end I separated the color into its LCH components and gave specific values to Colorness and Lightness
intColor = d3.scaleOrdinal()
.domain(internalLocations.map(d => d.id))
.range(d3.quantize(t => {
const {l, c, h} = d3.lch(d3.interpolateSpectral()(t))
return d3.lch(80, 30, h) // 80 is high lightness and 30 is low colorness.
}, locations.length))