all files / chart/series/ marker.js

100% Statements 99/99
93.67% Branches 74/79
100% Functions 15/15
100% Lines 96/96
9 statements, 5 functions, 9 branches Ignored     
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        2399× 2399× 2399×   1166× 1166× 1166× 8635× 8053× 8426×       1166× 8635× 8635×     8426× 8426× 8426×       8426× 8426× 8426× 8426× 8426× 8426× 8426×     8426× 8426×   8426×                           8426× 8426× 8426× 8426× 8421× 8421× 746×   7675× 194×     7481×   8421× 8421× 8421×   8421×                           1166× 1166× 1166× 1166× 1166× 1166× 1166× 1166× 1166× 1166× 1124×             42×   1166×         1166×             181×   150× 150× 150× 150× 150× 887× 39×   848× 848×   848×            
/* istanbul ignore next */ 
var __extends = (this && this.__extends) || (function () {
    var extendStatics = Object.setPrototypeOf ||
        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
        function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
    return function (d, b) {
        extendStatics(d, b);
        function __() { this.constructor = d; }
        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
    };
})();
define(["require", "exports", "../../common/utils/helper", "../../common/utils/helper", "@syncfusion/ej2-base", "../../common/model/constants", "./marker-explode", "../../common/utils/helper"], function (require, exports, helper_1, helper_2, ej2_base_1, constants_1, marker_explode_1, helper_3) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    var Marker = (function (_super) {
        __extends(Marker, _super);
        function Marker(chart) {
            var _this = _super.call(this, chart) || this;
            _this.addEventListener();
            return _this;
        }
        Marker.prototype.render = function (series) {
            var _this = this;
            this.createElement(series);
            var _loop_1 = function (point) {
                if (point.visible && point.symbolLocations.length) {
                    point.symbolLocations.map(function (location, index) {
                        _this.renderMarker(series, point, location, index);
                    });
                }
            };
            for (var _i = 0, _a = series.points; _i < _a.length; _i++) {
                var point = _a[_i];
                _loop_1(point);
            }
        };
        Marker.prototype.renderMarker = function (series, point, location, index) {
            var seriesIndex = series.index;
            var marker = series.marker;
            var border = {
                color: marker.border.color,
                width: marker.border.width
            };
            var borderColor = marker.border.color;
            var symbolId;
            var shapeOption;
            var isBoxPlot = series.type === 'BoxAndWhisker';
            var fill = marker.fill || (isBoxPlot ? point.interior || series.interior : '#ffffff');
            var argsData;
            var parentElement = isBoxPlot ?
                helper_2.findlElement(series.seriesElement.childNodes, 'Series_' + series.index + '_Point_' + point.index)
                : series.symbolElement;
            border.color = borderColor || series.setPointColor(point, series.interior);
            symbolId = this.elementId + '_Series_' + seriesIndex + '_Point_' + point.index + '_Symbol' +
                (index ? index : '');
            argsData = {
                cancel: false, name: constants_1.pointRender, series: series, point: point,
                fill: point.isEmpty ? (series.emptyPointSettings.fill || fill) : fill,
                border: {
                    color: series.type === 'BoxAndWhisker' ?
                        (!ej2_base_1.isNullOrUndefined(borderColor) && borderColor !== 'transparent') ? borderColor :
                            helper_3.getSaturationColor(fill, -0.6)
                        : border.color,
                    width: border.width
                },
                height: marker.height,
                width: marker.width,
                shape: marker.shape
            };
            argsData.border = series.setBorderColor(point, { width: argsData.border.width, color: argsData.border.color });
            this.chart.trigger(constants_1.pointRender, argsData);
            point.color = argsData.fill;
            if (!argsData.cancel) {
                var y = void 0;
                if (series.type === 'RangeArea') {
                    y = index ? point.low : point.high;
                }
                else if (isBoxPlot) {
                    y = point.outliers[index];
                }
                else {
                    y = point.y;
                }
                shapeOption = new helper_1.PathOption(symbolId, argsData.fill, argsData.border.width, argsData.border.color, marker.opacity, null);
                Eif (parentElement !== undefined && parentElement !== null) {
                    parentElement.appendChild(helper_1.drawSymbol(location, argsData.shape, new helper_1.Size(argsData.width, argsData.height), marker.imageUrl, shapeOption, point.x.toString() + ':' + y.toString()));
                }
                point.marker = {
                    border: argsData.border,
                    fill: argsData.fill,
                    height: argsData.height,
                    visible: true,
                    shape: argsData.shape,
                    width: argsData.width
                };
            }
            else {
                location = null;
                point.marker = {
                    visible: false
                };
            }
        };
        Marker.prototype.createElement = function (series) {
            var markerClipRect;
            var marker = series.marker;
            var explodeValue = marker.border.width + 8 + 5;
            var render = series.chart.renderer;
            var transform;
            transform = series.chart.chartAreaType === 'Cartesian' ? 'translate(' + series.clipRect.x + ',' + (series.clipRect.y) + ')' : '';
            Eif (marker.visible) {
                var markerHeight = (marker.height + explodeValue) / 2;
                var markerWidth = (marker.width + explodeValue) / 2;
                if (series.chart.chartAreaType === 'Cartesian') {
                    markerClipRect = render.drawClipPath(new helper_1.RectOption(this.elementId + '_ChartMarkerClipRect_' + series.index, 'transparent', { width: 1, color: 'Gray' }, 1, {
                        x: -markerWidth, y: -markerHeight,
                        width: series.clipRect.width + markerWidth * 2,
                        height: series.clipRect.height + markerHeight * 2
                    }));
                }
                else {
                    markerClipRect = render.drawCircularClipPath(new helper_1.CircleOption(this.elementId + '_ChartMarkerClipRect_' + series.index, 'transparent', { width: 1, color: 'Gray' }, 1, series.clipRect.width / 2 + series.clipRect.x, series.clipRect.height / 2 + series.clipRect.y, series.chart.radius + Math.max(markerHeight, markerWidth)));
                }
                series.symbolElement = render.createGroup({
                    'id': this.elementId + 'SymbolGroup' + series.index,
                    'transform': transform,
                    'clip-path': 'url(#' + this.elementId + '_ChartMarkerClipRect_' + series.index + ')'
                });
                series.symbolElement.appendChild(markerClipRect);
            }
        };
        Marker.prototype.getRangeLowPoint = function (region, series) {
            var x = region.x;
            var y = region.y;
            if (series.chart.requireInvertedAxis) {
                y += region.height / 2;
                x += series.yAxis.isInversed ? region.width : 0;
            }
            else {
                y += series.yAxis.isInversed ? 0 : region.height;
                x += region.width / 2;
            }
            return { x: x, y: y };
        };
        Marker.prototype.doMarkerAnimation = function (series) {
            if (!(series.isRectSeries || series.type === 'Scatter' || series.type === 'Bubble' ||
                (series.chart.chartAreaType === 'PolarRadar' && (series.drawType === 'Scatter' || series.drawType.indexOf('Column') > -1)))) {
                var markerElements = series.symbolElement.childNodes;
                var delay = series.animation.delay + series.animation.duration;
                var j = 1;
                var incFactor = series.type === 'RangeArea' ? 2 : 1;
                for (var i = 0; i < series.points.length; i++) {
                    if (!series.points[i].symbolLocations.length || !markerElements[j]) {
                        continue;
                    }
                    helper_1.markerAnimate(markerElements[j], delay, 200, series, i, series.points[i].symbolLocations[0], false);
                    if (incFactor === 2) {
                        var lowPoint = this.getRangeLowPoint(series.points[i].regions[0], series);
                        helper_1.markerAnimate(markerElements[j + 1], delay, 200, series, i, lowPoint, false);
                    }
                    j += incFactor;
                }
            }
        };
        return Marker;
    }(marker_explode_1.MarkerExplode));
    exports.Marker = Marker;
});