rangeDomainValue = [-24, 100]
data = [-1, 0, 0.01, 0.1, 0.45, 0.5, 0.51, 0.7, 0.75, 0.79, 0.799, 0.8, 0.9, 1, 20, 25, 25.1, 45, 49.9, 50, 50.01, 50.1, 74.9, 75, 75.1, 88, 99, 100]
dataPP = data.map(e => Math.round(e))
quantize(-1) // expected: #374151
quantize(0) // expected: #374151
quantize(0.9)
quantize(1) // expected: #55c56f
quantize(10) // expected: #55c56f
quantize(25) // expected "#55c56f"
quantize(45)
quantize(50)
quantize = d3.scaleQuantize()
.domain(rangeDomainValue) // extreme values to a scaleQuantize’s domain
.range([colorNR, colorCB, colorCM, colorCS, colorCA])
tscale = d3.scaleThreshold([0, 26, 51, 76], [colorNR, colorCB, colorCM, colorCS, colorCA]);
chart([undefined, -50, -20, -1, 0, 25, 26, 50, 51, 75, 76, 80, 100], tscale)
tscale(36)
dataPP
tmscale = d3.scaleThreshold([0, 26, 51, 76], [colorNR, 'none', colorCM, colorCS, colorCA]);
chart([undefined, -50, -20, -1, 0, 25, 26, 50, 51, 75, 76, 80, 100], tmscale)
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
