Published
Edited
Feb 4, 2019
1 star
gradient = (start, end, position) => {
// start = [r, g, b], end = [r, g, b], position = float between 0 and 1
let [r1, g1, b1] = start;
let [r2, g2, b2] = end;
let r3, g3, b3;
r3 = Math.round(r1 + (r2 - r1) * position);
g3 = Math.round(g1 + (g2 - g1) * position);
b3 = Math.round(b1 + (b2 - b1) * position);
return `rgb(${r3}, ${g3}, ${b3})`;
}
from_ = [255, 128, 128]
to_ = [128, 255, 128];
blah = [...Array(21).keys()].map(i => i / 20).map(d => `
<span style="background-color: ${gradient(from_, to_, d)}">
${d}
</span>`).join(" ")
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.
