Published
Edited
Oct 23, 2019
Importers
class RGB {
constructor(r, g, b) {
this.r = r;
this.g = g;
this.b = b;
}
static fromHSV(h, s, v) {
const {r, g, b} = HSVtoRGB(h, s, v);
return new RGB(r, g, b);
}
static fromHS1(h, s) {
const {r, g, b} = HS1toRGB(h, s);
return new RGB(r, g, b);
}
static fromGrayscale(val) {
return new RGB(val, val, val);
}
// Interpolate between two RGB colors
static interpolate(a, b, n) {
const m = 1 - n;
return new RGB(
Math.round(a.r * n + b.r * m),
Math.round(a.g * n + b.g * m),
Math.round(a.b * n + b.b * m),
);
}
toHex() {
return RGBtoHEX(this.r, this.g, this.b);
}
static fromArray(arr) {
return new RGB(arr[0], arr[1], arr[2]);
}
// Preset colors
static get Black() { return new RGB(0, 0, 0); }
static get White() { return new RGB(255, 255, 255); }
static get Red() { return new RGB(255, 0, 0); }
static get Green() { return new RGB(0, 255, 0); }
static get Blue() { return new RGB(0, 0, 255); }
static get Yellow() { return new RGB(255, 255, 0); }
static get Cyan() { return new RGB(0, 255, 255); }
static get Magenta () { return new RGB(255, 0, 255); }
}
class HSV {
constructor(h, s, v) {
this.h = h;
this.s = s;
this.v = v;
}
static fromRGB(r, g, b) {
const {h, s, v} = RGBtoHSV(r, g, b);
return new HSV(h, s, v);
}
// Interpolate between two HSV colors
static interpolate(a, b, n) {
const m = 1 - n;
return new HSV(
Math.round(a.h * n + b.h * m),
Math.round(a.s * n + b.s * m),
Math.round(a.v * n + b.v * m),
);
}
// Preset colors
static get Black() { return new HSV(0, 0.0, 0.0); }
static get White() { return new HSV(0, 0.0, 1.0); }
static get Red() { return new HSV(0, 1.0, 1.0); }
static get Green() { return new HSV(120, 1.0, 1.0); }
static get Blue() { return new HSV(240, 1.0, 1.0); }
}
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.
