viridis
Version:
Color gradients for data visualization
160 lines (159 loc) • 5.98 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.Color = void 0;
var SMath = require("smath");
var lib_1 = require("./lib");
/**
* Structure for storing colors based on RGBa values.
*/
var Color = /** @class */ (function () {
/**
* Define a new color from RGBa values.
* @param red Red channel intensity [0, 255]
* @param green Green channel intensity [0, 255]
* @param blue Blue channel intensity [0, 255]
* @param alpha Alpha channel transparency [0, 100]
* @example
* ```js
* const red = new Color(255, 0, 0);
* ```
*/
function Color(red, green, blue, alpha) {
if (alpha === void 0) { alpha = 100; }
this.red = red;
this.green = green;
this.blue = blue;
this.alpha = alpha;
this.red = SMath.clamp(red, 0, 255) | 0;
this.green = SMath.clamp(green, 0, 255) | 0;
this.blue = SMath.clamp(blue, 0, 255) | 0;
this.alpha = SMath.clamp(alpha, 0, 100) | 0;
// Compute HSL color values
var hsl = (0, lib_1.rgb2hsl)({ red: this.red, green: this.green, blue: this.blue });
this.hue = (hsl.hue % 360) | 0;
this.saturation = SMath.clamp(hsl.saturation, 0, 100) | 0;
this.lightness = SMath.clamp(hsl.lightness, 0, 100) | 0;
}
/**
* Return the most contrasting color for
* text on a background of this color.
* @returns Black or white
* @example
* ```js
* const contrast = red.getContrastingColor(); // #FFFFFF
* ```
*/
Color.prototype.getContrastingColor = function () {
if (this.lightness > 50) {
return new Color(0, 0, 0);
}
else {
return new Color(255, 255, 255);
}
};
/**
* Return a string representation of this color.
* @param type The color encoding to use
* @returns A valid CSS color code
* @example
* ```js
* const css = red.toString(); // #FF0000
* ```
*/
Color.prototype.toString = function (type) {
if (type === void 0) { type = 'hex'; }
switch (type) {
case ('rgb'): {
if (this.alpha < 100) {
return "rgb(".concat(this.red, ",").concat(this.green, ",").concat(this.blue, ",").concat(this.alpha, "%)");
}
else {
return "rgb(".concat(this.red, ",").concat(this.green, ",").concat(this.blue, ")");
}
}
case ('hsl'): {
if (this.alpha < 100) {
return "hsl(".concat(this.hue, "deg,").concat(this.saturation, "%,").concat(this.lightness, "%,").concat(this.alpha, "%)");
}
else {
return "hsl(".concat(this.hue, "deg,").concat(this.saturation, "%,").concat(this.lightness, "%)");
}
}
case ('hex'): {
var noTransparency = "#".concat(SMath.toHex(this.red, 2)).concat(SMath.toHex(this.green, 2)).concat(SMath.toHex(this.blue, 2));
if (this.alpha < 100) {
var alpha255 = SMath.clamp(SMath.translate(this.alpha, 0, 100, 0, 255) | 0, 0, 255);
return noTransparency + SMath.toHex(alpha255, 2);
}
else {
return noTransparency;
}
}
default: {
throw new Error('Invalid color type: ' + type);
}
}
};
/**
* @deprecated Use `Color.hex('#code')` instead
*/
Color.from = function (hex) {
return Color.hex(hex);
};
/**
* Create a new color given a hexadecimal string.
* Will throw an error if the string is invalid.
* - Expects 2 bits [0-F] for red, green, blue channels each
* - String can optionally start with the character '#'
* - Alpha channel can be included in the final 2 bits
* @param hex Hexadecimal string
* @returns A new color defined by the hexadecimal string
* @example
* ```js
* const red = Color.hex('#ff0000');
* ```
*/
Color.hex = function (hex) {
var _a;
var regex = /^#?([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})?$/.exec(hex);
if (regex === null) {
throw new Error('Invalid hexadecimal string: ' + hex);
}
return new Color(parseInt(regex[1], 16), parseInt(regex[2], 16), parseInt(regex[3], 16), SMath.translate(parseInt((_a = regex[4]) !== null && _a !== void 0 ? _a : 'FF', 16), 0, 255, 0, 100));
};
/**
* Define a new color from RGBa values. Alias for `new Color(...)`
* @param red Red channel intensity [0, 255]
* @param green Green channel intensity [0, 255]
* @param blue Blue channel intensity [0, 255]
* @param alpha Alpha channel transparency [0, 100]
* @returns A new color defined by color channel intensity values
* @example
* ```js
* const red = Color.rgb(255, 0, 0); // #FF0000
* ```
*/
Color.rgb = function (red, green, blue, alpha) {
if (alpha === void 0) { alpha = 100; }
return new Color(red, green, blue, alpha);
};
/**
*
* @param hue The color hue, in degrees [0, 360)
* @param saturation The saturation percent [0, 100]
* @param lightness The lightness percent [0, 100]
* @param alpha Alpha channel intensity [0, 100]
* @returns A new color defined by hue, sautration, and lightness
* @example
* ```js
* const red = Color.hsl(0, 100, 50); // #FF0000
* ```
*/
Color.hsl = function (hue, saturation, lightness, alpha) {
if (alpha === void 0) { alpha = 100; }
var rgb = (0, lib_1.hsl2rgb)({ hue: hue, saturation: saturation, lightness: lightness });
return new Color(rgb.red, rgb.green, rgb.blue, alpha);
};
return Color;
}());
exports.Color = Color;