all files / range-navigator/renderer/ chart-render.js

100% Statements 183/183
98.04% Branches 100/102
100% Functions 24/24
100% Lines 178/178
11 statements, 6 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 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 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 234 235 236 237 238 239 240 241 242 243 244 245 246 247 248 249 250 251 252          345× 345× 345× 345× 345× 345× 345× 345× 345× 345× 345× 345×   358× 358× 358× 358× 358× 358× 307× 342× 342× 342× 342×       51×     393× 393× 379× 379×   14× 14× 14×   383× 383× 383× 383× 383× 348× 348× 348× 348×     383× 383× 383× 383× 383× 68713× 68713× 68713× 59357× 59357× 59357× 59357× 59357× 2237× 2175× 2175×   2237×       9356×   68713× 67807×   68713× 68713× 68713× 68713× 68713× 68713×     349×           349× 349× 349× 349× 349× 349× 349× 349× 349× 349× 349× 349× 349× 349× 349× 339×   349× 349× 349× 349× 12×     349×           349× 349× 349× 349× 349× 349× 14× 14×   349× 349× 349× 349× 349× 349×   349× 349× 349× 349× 338× 338× 337× 337× 337× 337× 337× 337× 337× 337× 33× 2237×       337× 244×     93×   337× 337× 101× 18×               349× 349× 303×     337× 337× 337×         337×         337×   349× 349× 349× 349× 349× 349×   44×     349× 46× 46×     303× 303× 303×       303× 303×        
/* istanbul ignore next */ 
var __extends = (this && this.__extends) || (function () {
    var extendStatics = function (d, b) {
        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 extendStatics(d, b);
    };
    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", "../../chart/axis/axis-helper", "@syncfusion/ej2-data", "../utils/helper", "@syncfusion/ej2-base", "../../common/model/theme", "@syncfusion/ej2-svg-base", "../../common/model/data"], function (require, exports, helper_1, axis_helper_1, ej2_data_1, helper_2, ej2_base_1, theme_1, ej2_svg_base_1, data_1) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    var RangeSeries = (function (_super) {
        __extends(RangeSeries, _super);
        function RangeSeries(range) {
            var _this = _super.call(this) || this;
            _this.dataSource = range.dataSource;
            _this.xName = range.xName;
            _this.yName = range.yName;
            _this.query = range.query;
            _this.xMin = Infinity;
            _this.xMax = -Infinity;
            _this.yMin = Infinity;
            _this.yMax = -Infinity;
            _this.labels = [];
            _this.indexLabels = {};
            return _this;
        }
        RangeSeries.prototype.renderChart = function (control) {
            var _this = this;
            var dataSource;
            var query;
            this.seriesLength = 0;
            control.rangeSlider.points = [];
            if (control.series.length) {
                control.series.map(function (series) {
                    dataSource = series.dataSource || control.dataSource;
                    query = series.query || control.query;
                    series.points = [];
                    _this.processDataSource(dataSource, query, control, series);
                });
            }
            else {
                this.processDataSource(control.dataSource, control.query, control);
            }
        };
        RangeSeries.prototype.processDataSource = function (dataSource, query, control, series) {
            var _this = this;
            if (!(dataSource instanceof ej2_data_1.DataManager) && !ej2_base_1.isNullOrUndefined(dataSource) && ej2_base_1.isNullOrUndefined(query)) {
                this.dataManagerSuccess({ result: dataSource, count: dataSource.length }, control, series);
                return;
            }
            control.dataModule = new data_1.Data(dataSource, query);
            var dataManager = control.dataModule.getData(control.dataModule.generateQuery().requiresCount());
            dataManager.then(function (e) { return _this.dataManagerSuccess(e, control, series); });
        };
        RangeSeries.prototype.dataManagerSuccess = function (e, control, series) {
            var viewData = e.count ? e.result : [];
            control.allowServerDataBinding = false;
            this.processJsonData(viewData, control, Object.keys(viewData).length, series);
            this.seriesLength += series ? 1 : this.seriesLength;
            if (!series || this.seriesLength === control.series.length) {
                this.processXAxis(control);
                this.calculateGroupingBounds(control);
                this.processYAxis(control);
                control.renderChart();
            }
        };
        RangeSeries.prototype.processJsonData = function (viewData, control, len, series) {
            var i = 0;
            var point;
            var xName = (series && series.xName) || control.xName;
            var yName = (series && series.yName) || control.yName;
            while (i < len) {
                point = new helper_2.DataPoint(ej2_base_1.getValue(xName, viewData[i]), ej2_base_1.getValue(yName, viewData[i]));
                point.yValue = +point.y;
                if (control.valueType.indexOf('DateTime') > -1) {
                    var dateParser = control.intl.getDateParser({ skeleton: 'full', type: 'dateTime' });
                    var dateFormatter = control.intl.getDateFormat({ skeleton: 'full', type: 'dateTime' });
                    point.x = new Date(ej2_data_1.DataUtil.parse.parseJson({ val: point.x }).val);
                    point.xValue = Date.parse(dateParser(dateFormatter(point.x)));
                    if (control.valueType === 'DateTimeCategory') {
                        if (this.indexLabels[point.xValue.toString()] === undefined) {
                            this.indexLabels[point.xValue.toString()] = this.labels.length;
                            this.labels.push(point.xValue.toString());
                        }
                        point.xValue = this.indexLabels[point.xValue];
                    }
                }
                else {
                    point.xValue = +point.x;
                }
                if (series) {
                    series.points.push(point);
                }
                this.xMin = Math.min(this.xMin, point.xValue);
                this.yMin = Math.min(this.yMin, point.yValue);
                this.xMax = Math.max(this.xMax, point.xValue);
                this.yMax = Math.max(this.yMax, point.yValue);
                control.rangeSlider.points.push(point);
                i++;
            }
        };
        RangeSeries.prototype.processXAxis = function (control) {
            var axis = {
                minimum: control.minimum, maximum: control.maximum,
                interval: control.interval, valueType: control.valueType,
                isInversed: control.enableRtl, labelFormat: control.labelFormat,
                logBase: control.logBase, skeleton: control.skeleton, skeletonType: control.skeletonType
            };
            this.xAxis = axis;
            this.xAxis.intervalType = control.intervalType;
            this.xAxis.maximumLabels = 3;
            this.xAxis.skeleton = control.skeleton;
            this.xAxis.intervalDivs = [10, 5, 2, 1];
            this.xAxis.rect = control.bounds;
            this.xAxis.visibleLabels = [];
            this.xAxis.orientation = 'Horizontal';
            this.xAxis.labels = this.labels;
            this.xAxis.indexLabels = this.indexLabels;
            var axisModule = control[helper_1.firstToLowerCase(control.valueType) + 'Module'];
            axisModule.min = this.xMin;
            axisModule.max = this.xMax;
            axisModule.getActualRange(this.xAxis, control.bounds);
            if (this.xAxis.valueType === 'Double' || this.xAxis.valueType === 'DateTime' || this.xAxis.valueType === 'DateTimeCategory') {
                axisModule.updateActualRange(this.xAxis, this.xAxis.actualRange.min, this.xAxis.actualRange.max, this.xAxis.actualRange.interval);
            }
            this.xAxis.actualRange.delta = this.xAxis.actualRange.max - this.xAxis.actualRange.min;
            this.xAxis.visibleRange = this.xAxis.actualRange;
            axisModule.calculateVisibleLabels(this.xAxis, control);
            if (this.xAxis.valueType === 'DateTimeCategory' && control.periodSelectorModule) {
                control.periodSelectorModule.isDatetimeCategory = true;
                control.periodSelectorModule.sortedData = this.labels.map(function (label) { return parseInt(label, 10); });
            }
        };
        RangeSeries.prototype.processYAxis = function (control) {
            var axis = {
                majorGridLines: { width: 0 }, rangePadding: 'None',
                majorTickLines: { width: 0 }, labelStyle: { size: '0' },
                visible: false, valueType: 'Double', minimum: null, maximum: null,
                interval: null
            };
            this.yAxis = axis;
            this.yAxis.rect = control.bounds;
            this.yAxis.maximumLabels = 3;
            this.yAxis.intervalDivs = [10, 5, 2, 1];
            this.yAxis.orientation = 'Vertical';
            if (this.yMin === this.yMax) {
                this.yMax += 1;
                this.yMin -= 1;
            }
            control.doubleModule.min = this.yMin;
            control.doubleModule.max = this.yMax;
            control.doubleModule.getActualRange(this.yAxis, control.bounds);
            control.doubleModule.updateActualRange(this.yAxis, this.yAxis.actualRange.min, this.yAxis.actualRange.max, this.yAxis.actualRange.interval);
            this.yAxis.actualRange.delta = this.yAxis.actualRange.max - this.yAxis.actualRange.min;
            this.yAxis.visibleRange = this.yAxis.actualRange;
        };
        RangeSeries.prototype.renderSeries = function (control) {
            var _this = this;
            this.chartGroup = control.renderer.createGroup({ id: control.element.id + '_chart' });
            var colors = theme_1.getSeriesColor(control.theme);
            control.series.map(function (series, index) {
                var isSeriesVisible = control.stockChart ? control.stockChart.series[index].visible : true;
                if (isSeriesVisible) {
                    series.xAxis = _this.xAxis;
                    series.yAxis = _this.yAxis;
                    series.chart = control;
                    series.index = index;
                    series.xAxis.isInversed = control.enableRtl;
                    series.interior = series.fill || colors[index % colors.length];
                    _this.createSeriesElement(control, series, index);
                    if (series.xAxis.valueType === 'DateTimeCategory') {
                        for (var i = 0; i < series.points.length; i++) {
                            series.points[i].xValue =
                                _this.xAxis.labels.indexOf(Date.parse(series.points[i].x.toString()).toString());
                        }
                    }
                    if (control[helper_1.firstToLowerCase(series.type) + 'SeriesModule']) {
                        control[helper_1.firstToLowerCase(series.type) + 'SeriesModule'].render(series, _this.xAxis, _this.yAxis, false);
                    }
                    else {
                        control['line' + 'SeriesModule'].render(series, _this.xAxis, _this.yAxis, false);
                    }
                    _this.chartGroup.appendChild(series.seriesElement);
                    if (((series.animation.enable && ej2_base_1.animationMode !== 'Disable') || ej2_base_1.animationMode === 'Enable') && control.animateSeries) {
                        if (control[helper_1.firstToLowerCase(series.type) + 'SeriesModule']) {
                            control[helper_1.firstToLowerCase(series.type) + 'SeriesModule'].doAnimation(series);
                        }
                        else {
                        }
                    }
                }
            });
        };
        RangeSeries.prototype.appendSeriesElements = function (control) {
            control.svgObject.appendChild(this.chartGroup);
            if (control.series.length) {
                this.drawSeriesBorder(control);
            }
        };
        RangeSeries.prototype.createSeriesElement = function (control, series, index) {
            var elementId = control.element.id;
            series.clipRect = new ej2_svg_base_1.Rect(this.xAxis.rect.x, this.yAxis.rect.y, this.xAxis.rect.width, this.yAxis.rect.height);
            series.clipRectElement = control.renderer.drawClipPath(new helper_1.RectOption(elementId + '_RangeSeriesClipRect_' + index, 'transparent', { width: 1, color: 'Gray' }, 1, {
                x: 0, y: 0,
                width: series.clipRect.width,
                height: series.clipRect.height
            }));
            series.seriesElement = control.renderer.createGroup({
                'id': elementId + 'SeriesGroup' + index,
                'transform': 'translate(' + series.clipRect.x + ',' + (series.clipRect.y) + ')',
                'clip-path': 'url(#' + elementId + '_RangeSeriesClipRect_' + index + ')'
            });
            series.seriesElement.appendChild(series.clipRectElement);
        };
        RangeSeries.prototype.calculateGroupingBounds = function (control) {
            var padding = control.margin.bottom;
            var labelHeight = ej2_svg_base_1.measureText('string', control.labelStyle, control.themeStyle.axisLabelFont).height;
            var xMin = control.valueType === 'DateTimeCategory' ? parseInt(this.xAxis.labels[this.xMin], 10) : this.xMin;
            var xMax = control.valueType === 'DateTimeCategory' ? parseInt(this.xAxis.labels[this.xMax], 10) : this.xMax;
            this.calculateDateTimeNiceInterval(this.xAxis, new ej2_svg_base_1.Size(control.bounds.width, control.bounds.height), xMin, xMax, false);
            if (control.enableGrouping && (control.valueType === 'DateTime' || control.valueType === 'DateTimeCategory')
                && (this.xAxis.actualIntervalType !== 'Years' || !control.series.length)) {
                control.bounds.height -= (control.labelPosition === 'Outside' || control.series.length === 0) ? padding + labelHeight :
                    (labelHeight + 2 * padding);
            }
            if (!control.series.length) {
                control.bounds.y += control.bounds.height / 4;
                control.bounds.height = control.bounds.height / 2;
            }
        };
        RangeSeries.prototype.drawSeriesBorder = function (control) {
            var start = control.stockChart ? 'M' : 'L';
            var close = control.stockChart ? '' : 'Z';
            var options = new ej2_svg_base_1.PathOption(control.element.id + '_SeriesBorder', 'transparent', control.navigatorBorder.width, control.navigatorBorder.color || (control.theme.indexOf('Dark') > -1 ? '#49454F' : '#DDDDDD'), 1, control.navigatorBorder.dashArray, ('M ' + (control.bounds.x) + ' ' + (control.bounds.y) +
                ' L ' + (control.bounds.x + control.bounds.width) + ' ' + control.bounds.y +
                start + (control.bounds.x + control.bounds.width) + ' ' + (control.bounds.y + control.bounds.height) +
                ' L ' + (control.bounds.x) + ' ' + (control.bounds.y + control.bounds.height) + close));
            var htmlObject = control.renderer.drawPath(options);
            control.svgObject.appendChild(htmlObject);
        };
        return RangeSeries;
    }(axis_helper_1.NiceInterval));
    exports.RangeSeries = RangeSeries;
});