彩色地图在100%的情况下不工作

color map not working in the case of 100% percent

本文关键字：情况下 工作 100% 地图 彩色      更新时间：2023-09-26

我有这个很棒的代码

var percentColors = [
    { pct: 0.0, color: { r: 0xff, g: 0x00, b: 0 } },
    { pct: 0.5, color: { r: 0xff, g: 0xff, b: 0 } },
    { pct: 1.0, color: { r: 0x00, g: 0xff, b: 0 } } ];
var getColorForPercentage = function(pct) {
    for (var i = 0; i < percentColors.length; i++) {
        if (pct < percentColors[i].pct) {
            var lower = percentColors[i - 1];
            var upper = percentColors[i];
            var range = upper.pct - lower.pct;
            var rangePct = (pct - lower.pct) / range;
            var pctLower = 1 - rangePct;
            var pctUpper = rangePct;
            var color = {
                r: Math.floor(lower.color.r * pctLower + upper.color.r * pctUpper),
                g: Math.floor(lower.color.g * pctLower + upper.color.g * pctUpper),
                b: Math.floor(lower.color.b * pctLower + upper.color.b * pctUpper)
            };
            return 'rgb(' + [color.r, color.g, color.b].join(',') + ')';
            // or output as hex if preferred
        }
    }
}

当我使用

alert(getColorForPercentage(90/100));//red

或

alert(getColorForPercentage(0/100));//green

但当

alert(getColorForPercentage(100/100));

应该显示完整的红色但是它显示的是undefined

变化:

if (pct < percentColors[i].pct) {


if (pct <= percentColors[i].pct) {

因为代码是1 < 1.0 // false

替换for语句，key change: var lower = percentColors[i - 1] || {pct:0}; 

for (var i = 0; i < percentColors.length; i++) {
    if (pct <= percentColors[i].pct) {
        var lower = percentColors[i - 1] || { pct: 0.1, color: { r: 0x0, g: 0x00, b: 0 } };
        var upper = percentColors[i];
        var range = upper.pct - lower.pct;
        var rangePct = (pct - lower.pct) / range;
        var pctLower = 1 - rangePct;
        var pctUpper = rangePct;
        var color = {
            r: Math.floor(lower.color.r * pctLower + upper.color.r * pctUpper),
            g: Math.floor(lower.color.g * pctLower + upper.color.g * pctUpper),
            b: Math.floor(lower.color.b * pctLower + upper.color.b * pctUpper)
        };
        return 'rgb(' + [color.r, color.g, color.b].join(',') + ')';
        // or output as hex if preferred
    }
}
相关文章：