Student of math, d3, svg, etc. Prototyper of visualizations for electronics design and test.
Value Generator FunctionColor Generator Function HSLDriving texgen with generators
Color Generator Function JCh
swatches([gc1, gc2, gc3])
function* genColorValue(
start,
jcent = 0.2,
ccent = 0.2,
hcent = 0.2,
frequency = 1
) {
const rgbColor = d3.color(start);
const jchColor = cam02.jch(rgbColor);
const jgen = genValue(jchColor.J, 0, 100, jcent, frequency);
const cgen = genValue(jchColor.C, 0, 100, ccent, frequency);
const hgen = genValue(jchColor.h, 0, 360, hcent, frequency);
while (true) {
const nextJ = jgen.next();
const nextC = cgen.next();
const nextH = hgen.next();
const nextColor = d3.color(
cam02.jch(nextJ.value, nextC.value, nextH.value)
);
yield nextColor;
}
}
gc1 = genColorValue("#99aaaa", 0.2, 0.2, 0.2, 0.5)
gc2 = genColorValue("#aa99aa", 0.2, 0.2, 0.2, 0.2)
gc3 = genColorValue("#aaaa99", 0.2, 0.2, 0.2, 0.1)
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.
