all files / maps/layers/ color-mapping.js

98.2% Statements 109/111
95.15% Branches 98/103
100% Functions 13/13
98.2% Lines 109/111
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204     44729× 44729×   44729× 44729× 44729×   47455× 6957×   40498× 40498× 40498× 40498× 132010× 132010×     25809× 329× 180×     149× 149×       25480×     132010×   230×   132010×   83×     40498×   230× 230× 230×   230×   230×   125×   375× 375×   149× 149× 149× 12×   137× 12×     125× 125×   149×   125× 125× 125× 125× 125× 125× 125× 125× 125× 66× 66×       59× 59×   59× 59× 59× 59× 59× 59× 59× 76× 76× 76× 76×   59× 76× 42×   42× 42×     34× 13×   13× 13×     76× 17×             125×   125× 125× 125× 125× 125× 125×   375× 375×   207×                                                                           207×     207× 207×            
define(["require", "exports", "../index", "@syncfusion/ej2-base", "../utils/helper"], function (require, exports, index_1, ej2_base_1, helper_1) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    var ColorMapping = (function () {
        function ColorMapping(maps) {
        }
        ColorMapping.prototype.getShapeColorMapping = function (shapeSettings, layerData, color) {
            var colorValuePath = shapeSettings.colorValuePath ? shapeSettings.colorValuePath : shapeSettings.valuePath;
            var equalValue = (!ej2_base_1.isNullOrUndefined(colorValuePath)) ? ((colorValuePath.indexOf('.') > -1) ?
                helper_1.getValueFromObject(layerData, colorValuePath) : layerData[colorValuePath]) : layerData[colorValuePath];
            var colorValue = Number(equalValue);
            var shapeColor = this.getColorByValue(shapeSettings.colorMapping, colorValue, equalValue);
            return !ej2_base_1.isNullOrUndefined(shapeColor) ? shapeColor : color;
        };
        ColorMapping.prototype.getColorByValue = function (colorMapping, colorValue, equalValue) {
            if (isNaN(colorValue) && ej2_base_1.isNullOrUndefined(equalValue)) {
                return null;
            }
            var fill = '';
            var opacity;
            var gradientFill;
            for (var _i = 0, colorMapping_1 = colorMapping; _i < colorMapping_1.length; _i++) {
                var colorMap = colorMapping_1[_i];
                if ((!ej2_base_1.isNullOrUndefined(colorMap.from) && !ej2_base_1.isNullOrUndefined(colorMap.to)
                    && (colorValue >= colorMap.from && colorValue <= colorMap.to)) ||
                    (colorMap.value === equalValue)) {
                    if (Object.prototype.toString.call(colorMap.color) === '[object Array]') {
                        if (!ej2_base_1.isNullOrUndefined(colorMap.value)) {
                            fill = colorMap.color[0];
                        }
                        else {
                            gradientFill = this.getColor(colorMap, colorValue);
                            fill = gradientFill;
                        }
                    }
                    else {
                        fill = colorMap.color;
                    }
                }
                if (((colorValue >= colorMap.from && colorValue <= colorMap.to) || (colorMap.value === equalValue))
                    && (!ej2_base_1.isNullOrUndefined(colorMap.minOpacity) && !ej2_base_1.isNullOrUndefined(colorMap.maxOpacity) && fill)) {
                    opacity = this.deSaturationColor(colorMap, fill, colorValue, equalValue);
                }
                if ((fill === '' || ej2_base_1.isNullOrUndefined(fill)) && ej2_base_1.isNullOrUndefined(colorMap.from) && ej2_base_1.isNullOrUndefined(colorMap.to)
                    && ej2_base_1.isNullOrUndefined(colorMap.minOpacity) && ej2_base_1.isNullOrUndefined(colorMap.maxOpacity) && ej2_base_1.isNullOrUndefined(colorMap.value)) {
                    fill = Object.prototype.toString.call(colorMap.color) === '[object Array]' ? colorMap.color[0] : colorMap.color;
                }
            }
            return { fill: fill || ((!colorMapping.length) ? equalValue : null), opacity: opacity };
        };
        ColorMapping.prototype.deSaturationColor = function (colorMapping, color, rangeValue, equalValue) {
            var opacity = 1;
            Eif (((rangeValue >= colorMapping.from && rangeValue <= colorMapping.to) || colorMapping.value === equalValue)) {
                var ratio = !isNaN(rangeValue) ? (rangeValue - colorMapping.from) / (colorMapping.to - colorMapping.from) :
                    colorMapping.from / (colorMapping.to - colorMapping.from);
                opacity = (ratio * (colorMapping.maxOpacity - colorMapping.minOpacity)) + colorMapping.minOpacity;
            }
            return opacity;
        };
        ColorMapping.prototype.rgbToHex = function (r, g, b) {
            return '#' + this.componentToHex(r) + this.componentToHex(g) + this.componentToHex(b);
        };
        ColorMapping.prototype.componentToHex = function (value) {
            var hex = value.toString(16);
            return hex.length === 1 ? '0' + hex : hex;
        };
        ColorMapping.prototype.getColor = function (colorMap, value) {
            var color = '';
            var rbg;
            if (Number(value) === colorMap.from) {
                color = colorMap.color[0];
            }
            else if (Number(value) === colorMap.to) {
                color = colorMap.color[colorMap.color.length - 1];
            }
            else {
                rbg = this.getGradientColor(Number(value), colorMap);
                color = this.rgbToHex(rbg.r, rbg.g, rbg.b);
            }
            return color;
        };
        ColorMapping.prototype.getGradientColor = function (value, colorMap) {
            var previousOffset = colorMap.from;
            var nextOffset = colorMap.to;
            var percent = 0;
            var full = nextOffset - previousOffset;
            var midColor;
            percent = (value - previousOffset) / full;
            var previousColor;
            var nextColor;
            if (colorMap.color.length <= 2) {
                previousColor = colorMap.color[0].charAt(0) === '#' ? colorMap.color[0] : this._colorNameToHex(colorMap.color[0]);
                nextColor = colorMap.color[colorMap.color.length - 1].charAt(0) === '#' ?
                    colorMap.color[colorMap.color.length - 1] : this._colorNameToHex(colorMap.color[colorMap.color.length - 1]);
            }
            else {
                previousColor = colorMap.color[0].charAt(0) === '#' ? colorMap.color[0] : this._colorNameToHex(colorMap.color[0]);
                nextColor = colorMap.color[colorMap.color.length - 1].charAt(0) === '#' ?
                    colorMap.color[colorMap.color.length - 1] : this._colorNameToHex(colorMap.color[colorMap.color.length - 1]);
                var a = full / (colorMap.color.length - 1);
                var b = void 0;
                var c = void 0;
                var length_1 = colorMap.color.length - 1;
                var splitColorValueOffset = [];
                var splitColor = {};
                for (var j = 1; j < length_1; j++) {
                    c = j * a;
                    b = previousOffset + c;
                    splitColor = { b: b, color: colorMap.color[j] };
                    splitColorValueOffset.push(splitColor);
                }
                for (var i = 0; i < splitColorValueOffset.length; i++) {
                    if (previousOffset <= value && value <= splitColorValueOffset[i]['b'] && i === 0) {
                        midColor = splitColorValueOffset[i]['color'].charAt(0) === '#' ?
                            splitColorValueOffset[i]['color'] : this._colorNameToHex(splitColorValueOffset[i]['color']);
                        nextColor = midColor;
                        percent = value < splitColorValueOffset[i]['b'] ? 1 - Math.abs((value - splitColorValueOffset[i]['b']) / a)
                            : (value - splitColorValueOffset[i]['b']) / a;
                    }
                    else if (splitColorValueOffset[i]['b'] <= value && value <= nextOffset && i === (splitColorValueOffset.length - 1)) {
                        midColor = splitColorValueOffset[i]['color'].charAt(0) === '#' ?
                            splitColorValueOffset[i]['color'] : this._colorNameToHex(splitColorValueOffset[i]['color']);
                        previousColor = midColor;
                        percent = value < splitColorValueOffset[i]['b'] ?
                            1 - Math.abs((value - splitColorValueOffset[i]['b']) / a) : (value - splitColorValueOffset[i]['b']) / a;
                    }
                    if (i !== splitColorValueOffset.length - 1 && i < splitColorValueOffset.length) {
                        if (splitColorValueOffset[i]['b'] <= value && value <= splitColorValueOffset[i + 1]['b']) {
                            midColor = splitColorValueOffset[i]['color'].charAt(0) === '#' ?
                                splitColorValueOffset[i]['color'] : this._colorNameToHex(splitColorValueOffset[i]['color']);
                            previousColor = midColor;
                            nextColor = splitColorValueOffset[i + 1]['color'].charAt(0) === '#' ?
                                splitColorValueOffset[i + 1]['color'] : this._colorNameToHex(splitColorValueOffset[i + 1]['color']);
                            percent = Math.abs((value - splitColorValueOffset[i + 1]['b'])) / a;
                        }
                    }
                }
            }
            return this.getPercentageColor(percent, previousColor, nextColor);
        };
        ColorMapping.prototype.getPercentageColor = function (percent, previous, next) {
            var nextColor = next.split('#')[1];
            var prevColor = previous.split('#')[1];
            var r = this.getPercentage(percent, parseInt(prevColor.substr(0, 2), 16), parseInt(nextColor.substr(0, 2), 16));
            var g = this.getPercentage(percent, parseInt(prevColor.substr(2, 2), 16), parseInt(nextColor.substr(2, 2), 16));
            var b = this.getPercentage(percent, parseInt(prevColor.substr(4, 2), 16), parseInt(nextColor.substr(4, 2), 16));
            return new index_1.ColorValue(r, g, b);
        };
        ColorMapping.prototype.getPercentage = function (percent, previous, next) {
            var full = next - previous;
            return Math.round((previous + (full * percent)));
        };
        ColorMapping.prototype._colorNameToHex = function (color) {
            var colors = {
                'aliceblue': '#f0f8ff', 'antiquewhite': '#faebd7', 'aqua': '#00ffff', 'aquamarine': '#7fffd4', 'azure': '#f0ffff',
                'beige': '#f5f5dc', 'bisque': '#ffe4c4', 'black': '#000000', 'blanchedalmond': '#ffebcd', 'blue': '#0000ff',
                'blueviolet': '#8a2be2', 'brown': '#a52a2a', 'burlywood': '#deb887',
                'cadetblue': '#5f9ea0', 'chartreuse': '#7fff00', 'chocolate': '#d2691e', 'coral': '#ff7f50',
                'cornflowerblue': '#6495ed', 'cornsilk': '#fff8dc', 'crimson': '#dc143c', 'cyan': '#00ffff',
                'darkblue': '#00008b', 'darkcyan': '#008b8b', 'darkgoldenrod': '#b8860b', 'darkgray': '#a9a9a9', 'darkgreen': '#006400',
                'darkkhaki': '#bdb76b', 'darkmagenta': '#8b008b', 'darkolivegreen': '#556b2f',
                'darkorange': '#ff8c00', 'darkorchid': '#9932cc', 'darkred': '#8b0000', 'darksalmon': '#e9967a', 'darkseagreen': '#8fbc8f',
                'darkslateblue': '#483d8b', 'darkslategray': '#2f4f4f', 'darkturquoise': '#00ced1',
                'darkviolet': '#9400d3', 'deeppink': '#ff1493', 'deepskyblue': '#00bfff', 'dimgray': '#696969', 'dodgerblue': '#1e90ff',
                'firebrick': '#b22222', 'floralwhite': '#fffaf0', 'forestgreen': '#228b22', 'fuchsia': '#ff00ff',
                'gainsboro': '#dcdcdc', 'ghostwhite': '#f8f8ff', 'gold': '#ffd700', 'goldenrod': '#daa520', 'gray': '#808080',
                'green': '#008000', 'greenyellow': '#adff2f',
                'honeydew': '#f0fff0', 'hotpink': '#ff69b4',
                'indianred ': '#cd5c5c', 'indigo ': '#4b0082', 'ivory': '#fffff0', 'khaki': '#f0e68c',
                'lavender': '#e6e6fa', 'lavenderblush': '#fff0f5', 'lawngreen': '#7cfc00', 'lemonchiffon': '#fffacd', 'lightblue': '#add8e6',
                'lightcoral': '#f08080', 'lightcyan': '#e0ffff', 'lightgoldenrodyellow': '#fafad2',
                'lightgrey': '#d3d3d3', 'lightgreen': '#90ee90', 'lightpink': '#ffb6c1', 'lightsalmon': '#ffa07a', 'lightseagreen': '#20b2aa',
                'lightskyblue': '#87cefa', 'lightslategray': '#778899', 'lightsteelblue': '#b0c4de',
                'lightyellow': '#ffffe0', 'lime': '#00ff00', 'limegreen': '#32cd32', 'linen': '#faf0e6',
                'magenta': '#ff00ff', 'maroon': '#800000', 'mediumaquamarine': '#66cdaa', 'mediumblue': '#0000cd', 'mediumorchid': '#ba55d3',
                'mediumpurple': '#9370d8', 'mediumseagreen': '#3cb371', 'mediumslateblue': '#7b68ee',
                'mediumspringgreen': '#00fa9a', 'mediumturquoise': '#48d1cc', 'mediumvioletred': '#c71585', 'midnightblue': '#191970',
                'mintcream': '#f5fffa', 'mistyrose': '#ffe4e1', 'moccasin': '#ffe4b5',
                'navajowhite': '#ffdead', 'navy': '#000080', 'orchid': '#da70d6', 'papayawhip': '#ffefd5',
                'oldlace': '#fdf5e6', 'olive': '#808000', 'olivedrab': '#6b8e23', 'orange': '#ffa500', 'orangered': '#ff4500',
                'palegoldenrod': '#eee8aa', 'palegreen': '#98fb98', 'paleturquoise': '#afeeee', 'palevioletred': '#d87093',
                'peachpuff': '#ffdab9', 'peru': '#cd853f', 'pink': '#ffc0cb', 'plum': '#dda0dd', 'powderblue': '#b0e0e6', 'purple': '#800080',
                'red': '#ff0000', 'rosybrown': '#bc8f8f', 'royalblue': '#4169e1',
                'saddlebrown': '#8b4513', 'salmon': '#fa8072', 'sandybrown': '#f4a460', 'seagreen': '#2e8b57', 'seashell': '#fff5ee',
                'sienna': '#a0522d', 'silver': '#c0c0c0', 'skyblue': '#87ceeb', 'slateblue': '#6a5acd',
                'slategray': '#708090', 'snow': '#fffafa', 'springgreen': '#00ff7f', 'steelblue': '#4682b4',
                'tan': '#d2b48c', 'teal': '#008080', 'thistle': '#d8bfd8', 'tomato': '#ff6347', 'turquoise': '#40e0d0',
                'violet': '#ee82ee',
                'wheat': '#f5deb3', 'white': '#ffffff', 'whitesmoke': '#f5f5f5',
                'yellow': '#ffff00', 'yellowgreen': '#9acd32'
            };
            Iif (Object.prototype.toString.call(color) === '[object Array]') {
                return color;
            }
            Eif (typeof colors[color.toLowerCase()] !== 'undefined') {
                return colors[color.toLowerCase()];
            }
            return color;
        };
        return ColorMapping;
    }());
    exports.ColorMapping = ColorMapping;
});