颜色转换辅助函数
<pre><code class="language-javascript">import * as d3 from 'd3';
/**
* hsb 转rgb
* @param {*} hsb
* @returns
*/
export function HSBToRGB(hsb) {
const rgb = {};
let h = Math.round(hsb.h);
const s = Math.round(hsb.s * 255 / 100);
const v = Math.round(hsb.b * 255 / 100);
if (s === 0) {
rgb.r = rgb.g = rgb.b = v;
} else {
const t1 = v;
const t2 = (255 - s) * v / 255;
const t3 = (t1 - t2) * (h % 60) / 60;
if (h === 360) h = 0;
if (h &lt; 60) {
rgb.r = t1; rgb.b = t2; rgb.g = t2 + t3;
} else if (h &lt; 120) {
rgb.g = t1; rgb.b = t2; rgb.r = t1 - t3;
} else if (h &lt; 180) {
rgb.g = t1; rgb.r = t2; rgb.b = t2 + t3;
} else if (h &lt; 240) {
rgb.b = t1; rgb.r = t2; rgb.g = t1 - t3;
} else if (h &lt; 300) {
rgb.b = t1; rgb.g = t2; rgb.r = t2 + t3;
} else if (h &lt; 360) {
rgb.r = t1; rgb.g = t2; rgb.b = t1 - t3;
} else {
rgb.r = 0; rgb.g = 0; rgb.b = 0;
}
}
return { r: Math.round(rgb.r), g: Math.round(rgb.g), b: Math.round(rgb.b) };
}
/**
* rgb 转16进制
* @param {*} rgb
* @returns
*/
export function rgbToHex(rgb) {
const hex = [
(+rgb.r).toString(16),
(+rgb.g).toString(16),
(+rgb.b).toString(16)
];
hex.map((str, i) =&gt; {
if (str.length === 1) {
hex[i] = '0' + str;
}
return undefined;
});
return '#' + hex.join('');
}
/**
*
* @param {*} hex
* @returns
*/
// eslint-disable-next-line require-jsdoc
export function hexToRgb(hex) {
hex = parseInt(((hex.indexOf('#') &gt; -1) ? hex.substring(1) : hex), 16);
return { r: hex &gt;&gt; 16, g: (hex &amp; 0x00FF00) &gt;&gt; 8, b: (hex &amp; 0x0000FF) };
}
/**
*
* @param {*} hex
* @returns
*/
export function hexToHsb(hex) {
return rgbToHsb(hexToRgb(hex));
}
/**
*
* @param {*} rgb
* @returns
*/
export function rgbToHsb(rgb) {
const hsb = { h: 0, s: 0, b: 0 };
const min = Math.min(rgb.r, rgb.g, rgb.b);
const max = Math.max(rgb.r, rgb.g, rgb.b);
const delta = max - min;
hsb.b = max;
hsb.s = max !== 0 ? 255 * delta / max : 0;
if (hsb.s !== 0) {
if (rgb.r === max) hsb.h = (rgb.g - rgb.b) / delta;
else if (rgb.g === max) hsb.h = 2 + (rgb.b - rgb.r) / delta;
else hsb.h = 4 + (rgb.r - rgb.g) / delta;
} else hsb.h = -1;
hsb.h *= 60;
if (hsb.h &lt; 0) hsb.h += 360;
hsb.s *= 100 / 255;
hsb.b *= 100 / 255;
return hsb;
}
/**
* 计算颜色插值
* @param {*} colors 颜色数组
* @param {*} value 当前值
* @param {*} min 最小值
* @param {*} max 最大值
* @returns
*/
export function interpolateColor(colors, min, max) {
const ColorIndex = d3.interpolateNumber(0, colors.length - 1);
const scale = d3.scaleLinear().domain([min, max]).range([0, 1]);
return function (value, format) {
let valueMap = scale(value);
if (valueMap &gt; 1) {
valueMap = 1;
}
if (valueMap &lt; 0) {
valueMap = 0;
}
const index = ColorIndex(valueMap);
const startIndex = Math.floor(index);
const endIndex = Math.ceil(index);
if (startIndex === endIndex) {
return format &amp;&amp; format === 'hex' ? rgbToHex(d3.rgb(colors[startIndex])) : d3.rgb(colors[startIndex]);
} else {
const colorSplit = d3.interpolateRgb(colors[startIndex], colors[endIndex]);
const calc = index - startIndex;
return format &amp;&amp; format === 'hex' ? rgbToHex(d3.rgb(colorSplit(calc))) : d3.rgb(colorSplit(calc));
}
};
}
/**
* TODD
* $!CREATECOLORMAP
NAME = 'cmocean - curl'
NUMCONTROLPOINTS = 11
CONTROLPOINT 1 { COLORMAPFRACTION = 0.000000 LEADRGB { R = 20 G = 29 B = 67 } TRAILRGB { R = 20 G = 29 B = 67 } }
CONTROLPOINT 2 { COLORMAPFRACTION = 0.100000 LEADRGB { R = 28 G = 76 B = 96 } TRAILRGB { R = 28 G = 76 B = 96 }</code></pre>