@progress/kendo-charts 1.31.0 → 1.32.0

package/dist/es/chart/register-charts.js

@@ -15,7 +15,7 @@ import { COLUMN, DONUT, PIE, FUNNEL, PYRAMID, BAR, LINE, VERTICAL_LINE, AREA, VE
     RANGE_BAR, WATERFALL, HORIZONTAL_WATERFALL, SCATTER, SCATTER_LINE, BUBBLE,
     POLAR_AREA, POLAR_LINE, POLAR_SCATTER, RADAR_AREA, RADAR_COLUMN, RADAR_LINE, CATEGORY,
     RANGE_AREA, VERTICAL_RANGE_AREA, X_ERROR_LOW_FIELD, X_ERROR_HIGH_FIELD, Y_ERROR_LOW_FIELD, Y_ERROR_HIGH_FIELD,
-    ERROR_LOW_FIELD, ERROR_HIGH_FIELD, HEATMAP, DRILLDOWN_FIELD } from './constants';
+    ERROR_LOW_FIELD, ERROR_HIGH_FIELD, HEATMAP, DRILLDOWN_FIELD, TRENDLINE_SERIES } from './constants';
 import { X, Y, VALUE } from '../common/constants';
 
 var COLOR = "color";
@@ -30,19 +30,24 @@ var TO = "to";
 PlotAreaFactory.current.register(CategoricalPlotArea, [
     BAR, COLUMN, LINE, VERTICAL_LINE, AREA, VERTICAL_AREA,
     CANDLESTICK, OHLC, BULLET, VERTICAL_BULLET, BOX_PLOT, VERTICAL_BOX_PLOT,
-    RANGE_COLUMN, RANGE_BAR, WATERFALL, HORIZONTAL_WATERFALL, RANGE_AREA, VERTICAL_RANGE_AREA
-]);
+    RANGE_COLUMN, RANGE_BAR, WATERFALL, HORIZONTAL_WATERFALL, RANGE_AREA, VERTICAL_RANGE_AREA ].concat( TRENDLINE_SERIES
+));
 
 PlotAreaFactory.current.register(XYPlotArea, [
-    SCATTER, SCATTER_LINE, BUBBLE
-]);
+    SCATTER, SCATTER_LINE, BUBBLE ].concat( TRENDLINE_SERIES
+));
 
 PlotAreaFactory.current.register(PiePlotArea, [ PIE ]);
 PlotAreaFactory.current.register(DonutPlotArea, [ DONUT ]);
 PlotAreaFactory.current.register(FunnelPlotArea, [ FUNNEL, PYRAMID ]);
 
-PlotAreaFactory.current.register(PolarPlotArea, [ POLAR_AREA, POLAR_LINE, POLAR_SCATTER ]);
-PlotAreaFactory.current.register(RadarPlotArea, [ RADAR_AREA, RADAR_COLUMN, RADAR_LINE ]);
+PlotAreaFactory.current.register(PolarPlotArea, [
+    POLAR_AREA, POLAR_LINE, POLAR_SCATTER ].concat( TRENDLINE_SERIES
+));
+
+PlotAreaFactory.current.register(RadarPlotArea, [
+    RADAR_AREA, RADAR_COLUMN, RADAR_LINE ].concat( TRENDLINE_SERIES
+));
 
 PlotAreaFactory.current.register(HeatmapPlotArea, [ HEATMAP ]);
 

package/dist/es/chart/scatter-charts/scatter-chart.js

@@ -4,10 +4,8 @@ import ClipAnimationMixin from '../mixins/clip-animation-mixin';
 import ErrorRangeCalculator from '../error-bars/error-range-calculator';
 import ScatterErrorBar from '../error-bars/scatter-error-bar';
 import LinePoint from '../line-chart/line-point';
-import CategoricalChart from '../categorical-chart';
 
-import hasValue from '../utils/has-value';
-import evalOptions from '../utils/eval-options';
+import { hasValue, evalOptions } from '../utils';
 
 import { deepExtend, isNumber, isString, defined, isFunction, setDefaultOptions } from '../../common';
 import { X, Y, MIN_VALUE, MAX_VALUE } from '../../common/constants';
@@ -306,7 +304,7 @@ var ScatterChart = (function (ChartElement) {
             }
 
             for (var pointIx = 0; pointIx < currentSeries.data.length; pointIx++) {
-                var ref$1 = this$1._bindPoint(currentSeries, seriesIx, pointIx);
+                var ref$1 = this$1.plotArea.bindPoint(currentSeries, pointIx);
                 var value = ref$1.valueFields;
                 var fields = ref$1.fields;
 
@@ -347,8 +345,6 @@ setDefaultOptions(ScatterChart, {
     },
     clip: true
 });
-deepExtend(ScatterChart.prototype, ClipAnimationMixin, {
-    _bindPoint: CategoricalChart.prototype._bindPoint
-});
+deepExtend(ScatterChart.prototype, ClipAnimationMixin);
 
 export default ScatterChart;

package/dist/es/chart/trendlines/calculate-moving-average.js

@@ -0,0 +1,44 @@
+import { MIN_MOVING_AVERAGE_PERIOD } from '../constants';
+
+function calculateMovingAverage(sourceValues, valueGetter, period) {
+    var averagePoints = [];
+    var values = [];
+    var start = Math.max(MIN_MOVING_AVERAGE_PERIOD, period) - 1;
+
+    var end = 0;
+    var sum = 0;
+
+    for (var i = 0; i < sourceValues.length; i++) {
+        var value = sourceValues[i];
+        var ref = valueGetter(value);
+        var xValue = ref.xValue;
+        var yValue = ref.yValue;
+
+        if (isFinite(yValue) && yValue !== null) {
+            values.push(yValue);
+            sum += yValue;
+            end = Math.max(i, end);
+        } else {
+            values.push(null);
+        }
+
+        if (i >= start) {
+            var count = values.filter(function (value) { return value !== null; }).length;
+            var lastValue = values.shift() || 0;
+
+            if (count > 0) {
+                var average = sum / count;
+                averagePoints.push([xValue, average]);
+
+                sum -= lastValue;
+                continue;
+            }
+        }
+
+        averagePoints.push([xValue, null]);
+    }
+
+    return averagePoints.slice(0, end + 1);
+}
+
+export default calculateMovingAverage;

package/dist/es/chart/trendlines/calculate-slope.js

@@ -0,0 +1,37 @@
+function calculateSlope(sourceValues, valueGetter) {
+    var x = 0;
+    var y = 0;
+    var x2 = 0;
+    var xy = 0;
+    var count = 0;
+    var slope, intercept;
+    var xMin = Number.MAX_VALUE;
+    var xMax = Number.MIN_VALUE;
+
+    for (var i = 0; i < sourceValues.length; i++) {
+        var value = sourceValues[i];
+        var ref = valueGetter(value);
+        var xValue = ref.xValue;
+        var yValue = ref.yValue;
+
+        if (isFinite(xValue) && xValue !== null && isFinite(yValue) && yValue !== null) {
+            xMin = Math.min(xValue, xMin);
+            xMax = Math.max(xValue, xMax);
+
+            count++;
+            x += xValue;
+            y += yValue;
+            x2 += Math.pow(xValue, 2);
+            xy += xValue * yValue;
+        }
+    }
+
+    if (count > 0) {
+        slope = (count * xy - x * y) / (count * x2 - Math.pow(x, 2));
+        intercept = (y - slope * x) / count;
+    }
+
+    return { slope: slope, intercept: intercept, count: count, xMin: xMin, xMax: xMax };
+}
+
+export default calculateSlope;

package/dist/es/chart/trendlines/linear-trendline.js

@@ -0,0 +1,61 @@
+import calculateSlope from './calculate-slope';
+
+function linearTrendline(context) {
+    var options = context.options;
+    var categoryAxis = context.categoryAxis;
+    var seriesValues = context.seriesValues;
+
+    var ref = getData({ seriesValues: seriesValues, categoryAxis: categoryAxis, options: options });
+    var data = ref.data;
+    if (data) {
+        return Object.assign({}, options,
+
+            {type: 'line',
+            data: data,
+            categoryField: 'category',
+            field: 'value'});
+    }
+
+    return null;
+}
+
+var valueGetter = function (fieldName) { return function (ref) {
+        var categoryIx = ref.categoryIx;
+        var valueFields = ref.valueFields;
+
+        return ({ xValue: categoryIx + 1, yValue: valueFields[fieldName] });
+; }    };
+
+function getData(ref) {
+    var seriesValues = ref.seriesValues;
+    var categoryAxis = ref.categoryAxis;
+    var options = ref.options;
+
+    var ref$1 = calculateSlope(seriesValues(), valueGetter(options.field));
+    var slope = ref$1.slope;
+    var intercept = ref$1.intercept;
+    var count = ref$1.count;
+
+    if (count > 0) {
+        var data = [];
+        var totalRange = categoryAxis.totalRangeIndices();
+        var currentRange = categoryAxis.currentRangeIndices();
+        var range = {
+            min: Math.floor(Math.max(currentRange.min - 1, totalRange.min)),
+            max: Math.ceil(Math.min(currentRange.max + 2, totalRange.max))
+        };
+
+        for (var i = range.min; i < range.max; i++) {
+            data[i] = {
+                category: categoryAxis.categoryAt(i, true),
+                value: slope * (i + 1) + intercept
+            };
+        }
+
+        return { data: data };
+    }
+
+    return { data: null };
+}
+
+export default linearTrendline;

package/dist/es/chart/trendlines/moving-average.js

@@ -0,0 +1,65 @@
+import { MIN_MOVING_AVERAGE_PERIOD } from '../constants';
+import calculateMovingAverage from './calculate-moving-average';
+
+function movingAverageTrendline(context) {
+    var options = context.options;
+
+    var ref = getData(context);
+    var data = ref.data;
+    if (data) {
+        return Object.assign({}, options,
+
+            {type: 'line',
+            data: data,
+            categoryField: 'category',
+            field: 'value'});
+    }
+
+    return null;
+}
+
+var valueGetter = function (fieldName) { return function (ref) {
+        var categoryIx = ref.categoryIx;
+        var valueFields = ref.valueFields;
+
+        return ({ xValue: categoryIx, yValue: valueFields[fieldName] });
+; }    };
+
+function calculatePoints(ref) {
+    var options = ref.options;
+    var categoryAxis = ref.categoryAxis;
+    var seriesValues = ref.seriesValues;
+
+    var period = (options.trendline || {}).period || MIN_MOVING_AVERAGE_PERIOD;
+    var totalRange = categoryAxis.totalRangeIndices();
+    var currentRange = categoryAxis.currentRangeIndices();
+    var range = {
+        min: Math.floor(Math.max(currentRange.min - period, totalRange.min)),
+        max: Math.ceil(Math.min(currentRange.max + period + 2, totalRange.max))
+    };
+
+    return calculateMovingAverage(seriesValues(range), valueGetter(options.field), period);
+}
+
+function getData(context) {
+    var categoryAxis = context.categoryAxis;
+    var points = calculatePoints(context);
+    var data = [];
+    points.forEach(function (ref) {
+        var categoryIx = ref[0];
+        var value = ref[1];
+
+        data[categoryIx] = {
+            category: categoryAxis.categoryAt(categoryIx, true),
+            value: value
+        };
+    });
+
+    if (data.length > 0) {
+        return { data: data };
+    }
+
+    return { data: null };
+}
+
+export default movingAverageTrendline;

package/dist/es/chart/trendlines/scatter-linear-trendline.js

@@ -0,0 +1,63 @@
+import autoMajorUnit from '../../core/utils/auto-major-unit';
+import { valueOrDefault } from '../../common';
+import calculateSlope from './calculate-slope';
+import scatterValueGetter from './scatter-value-getter';
+
+function scatterLinearTrendLine(context) {
+    var options = context.options;
+    var seriesValues = context.seriesValues;
+
+    var data = getData({ seriesValues: seriesValues, options: options });
+    if (data) {
+        return Object.assign({}, options,
+
+            {type: 'scatterLine',
+            data: data});
+    }
+
+    return null;
+}
+
+function getData(ref) {
+    var seriesValues = ref.seriesValues;
+    var options = ref.options;
+
+    var ref$1 = calculateSlope(seriesValues(), scatterValueGetter(options.field));
+    var slope = ref$1.slope;
+    var intercept = ref$1.intercept;
+    var count = ref$1.count;
+    var xMin = ref$1.xMin;
+    var xMax = ref$1.xMax;
+
+    if (count > 0) {
+        var data = [];
+        var forecast = (options.trendline || {}).forecast;
+        if (forecast) {
+            if (forecast.before > 0) {
+                xMin -= forecast.before;
+            }
+
+            if (forecast.after > 0) {
+                xMax += forecast.after;
+            }
+        }
+
+        var samplingInterval = (options.trendline || {}).samplingInterval;
+        var delta = valueOrDefault(samplingInterval,  autoMajorUnit(xMin, xMax) / 10);
+        if (samplingInterval <= 0) {
+            delta = xMax - xMin;
+        }
+
+        for (var x = xMin; x <= xMax; x += delta) {
+            data.push([ x,
+                slope * x + intercept
+            ]);
+        }
+
+        return data;
+    }
+
+    return null;
+}
+
+export default scatterLinearTrendLine;

package/dist/es/chart/trendlines/scatter-moving-average.js

@@ -0,0 +1,34 @@
+import calculateMovingAverage from './calculate-moving-average';
+import { MIN_MOVING_AVERAGE_PERIOD } from '../constants';
+import scatterValueGetter from './scatter-value-getter';
+
+function scatterMovingAverageTrendline(context) {
+    var options = context.options;
+
+    var data = getData(context);
+    if (data) {
+        return Object.assign({}, options,
+
+            {type: 'scatterLine',
+            data: data});
+    }
+
+    return null;
+}
+
+function getData(ref) {
+    var options = ref.options;
+    var seriesValues = ref.seriesValues;
+
+    var period = (options.trendline || {}).period || MIN_MOVING_AVERAGE_PERIOD;
+    var range = { before: period, after: period };
+    var data = calculateMovingAverage(seriesValues(range), scatterValueGetter(options.field), period);
+
+    if (data.length > 0) {
+        return data;
+    }
+
+    return null;
+}
+
+export default scatterMovingAverageTrendline;

package/dist/es/chart/trendlines/scatter-trendline-registry.js

@@ -0,0 +1,9 @@
+import scatterLinearTrendLine from './scatter-linear-trendline';
+import scatterMovingAverageTrendline from './scatter-moving-average';
+import { TRENDLINE_LINEAR, TRENDLINE_MOVING_AVERAGE } from '../constants';
+
+var scatterRegistry = {};
+scatterRegistry[TRENDLINE_LINEAR] = scatterLinearTrendLine;
+scatterRegistry[TRENDLINE_MOVING_AVERAGE] = scatterMovingAverageTrendline;
+
+export default scatterRegistry;

package/dist/es/chart/trendlines/scatter-value-getter.js

@@ -0,0 +1,7 @@
+var scatterValueGetter = function (fieldName) { return function (ref) {
+        var valueFields = ref.valueFields;
+
+        return ({ xValue: valueFields.x, yValue: valueFields[fieldName] });
+; }    };
+
+export default scatterValueGetter;

package/dist/es/chart/trendlines/trendline-factory.js

@@ -0,0 +1,10 @@
+function trendlineFactory(registry, type, context) {
+    var impl = registry[String(type)];
+    if (impl) {
+        return impl(context);
+    }
+
+    return null;
+}
+
+export default trendlineFactory;

package/dist/es/chart/trendlines/trendline-registry.js

@@ -0,0 +1,9 @@
+import linearTrendline from './linear-trendline';
+import movingAverageTrendline from './moving-average';
+import { TRENDLINE_LINEAR, TRENDLINE_MOVING_AVERAGE } from '../constants';
+
+var registry = {};
+registry[TRENDLINE_LINEAR] = linearTrendline;
+registry[TRENDLINE_MOVING_AVERAGE] = movingAverageTrendline;
+
+export default registry;

package/dist/es/chart/utils.js

@@ -15,5 +15,3 @@ export { default as isDateAxis } from './utils/is-date-axis';
 export { default as segmentVisible } from './utils/segment-visible';
 export { default as singleItemOrArray } from './utils/single-item-or-array';
 export { default as createOutOfRangePoints } from './utils/create-out-of-range-points';
-
-

package/dist/es/common/constants.js

@@ -16,6 +16,7 @@ export var FORMAT_REGEX = /\{\d+:?/;
 export var HEIGHT = "height";
 export var HIGHLIGHT_ZINDEX = 100;
 export var INSIDE = "inside";
+export var INHERIT = "inherit";
 export var LEFT = "left";
 export var MAX_VALUE = Number.MAX_VALUE;
 export var MIN_VALUE = -Number.MAX_VALUE;

package/dist/es/common/hash-map.js

@@ -1,18 +1,14 @@
-
+// TODO: Remove and replace with Map/WeakMap.
 var HashMap = function HashMap() {
-    this._map = {};
-};
-
-HashMap.prototype.get = function get (name) {
-    return this._map[this._key(name)];
+    this._map = new Map();
 };
 
-HashMap.prototype.set = function set (name, value) {
-    this._map[this._key(name)] = value;
+HashMap.prototype.get = function get (key) {
+    return this._map.get(key);
 };
 
-HashMap.prototype._key = function _key (name) {
-    return name instanceof Date ? name.getTime() : name;
+HashMap.prototype.set = function set (key, value) {
+    this._map.set(key, value);
 };
 
-export default HashMap;
+export default HashMap;

package/dist/es/core/category-axis.js

@@ -89,31 +89,6 @@ var CategoryAxis = (function (Axis) {
         };
     };
 
-    CategoryAxis.prototype.totalRangeIndices = function totalRangeIndices (limit) {
-        var options = this.options;
-        var min = isNumber(options.min) ? options.min : 0;
-        var max;
-
-        if (isNumber(options.max)) {
-            max = options.max;
-        } else if (isNumber(options.min)) {
-            max = min + options.categories.length;
-        } else {
-            max = this.totalRange().max || 1;
-        }
-
-        if (limit) {
-            var totalRange = this.totalRange();
-            min = limitValue(min, 0, totalRange.max);
-            max = limitValue(max, 0, totalRange.max);
-        }
-
-        return {
-            min: min,
-            max: max
-        };
-    };
-
     CategoryAxis.prototype.range = function range () {
         var options = this.options;
         var min = isNumber(options.min) ? options.min : 0;
@@ -444,7 +419,7 @@ var CategoryAxis = (function (Axis) {
 
     CategoryAxis.prototype.scaleRange = function scaleRange (scale, cursor) {
         var position = Math.abs(this.pointOffset(cursor));
-        var rangeIndices = this.totalRangeIndices();
+        var rangeIndices = this.limitedRangeIndices();
         var range = rangeIndices.max - rangeIndices.min;
         var delta = this.scaleToDelta(scale, range);
         var minDelta = position * delta;
@@ -484,7 +459,7 @@ var CategoryAxis = (function (Axis) {
         var options = this.options;
         var justified = options.justified;
         var labelOptions = options.labels;
-        var ref = this.totalRangeIndices(true);
+        var ref = this.limitedRangeIndices(true);
         var min = ref.min;
         var max = ref.max;
         var start = Math.floor(min);
@@ -523,7 +498,7 @@ var CategoryAxis = (function (Axis) {
     };
 
     CategoryAxis.prototype.shouldRenderNote = function shouldRenderNote (value) {
-        var range = this.totalRangeIndices();
+        var range = this.limitedRangeIndices();
 
         return Math.floor(range.min) <= value && value <= Math.ceil(range.max);
     };
@@ -558,7 +533,7 @@ var CategoryAxis = (function (Axis) {
     };
 
     CategoryAxis.prototype.pan = function pan (delta) {
-        var range = this.totalRangeIndices(true);
+        var range = this.limitedRangeIndices(true);
         var ref = this.scaleOptions();
         var scale = ref.scale;
         var offset = round(delta / scale, DEFAULT_PRECISION);
@@ -574,7 +549,7 @@ var CategoryAxis = (function (Axis) {
         var reverse = ref.reverse;
         var vertical = ref.vertical;
         var valueAxis = vertical ? Y : X;
-        var range = this.totalRangeIndices(true);
+        var range = this.limitedRangeIndices(true);
         var ref$1 = this.scaleOptions();
         var scale = ref$1.scale;
         var box = ref$1.box;
@@ -629,6 +604,38 @@ var CategoryAxis = (function (Axis) {
         };
     };
 
+    CategoryAxis.prototype.limitedRangeIndices = function limitedRangeIndices (totalLimit) {
+        var options = this.options;
+        var min = isNumber(options.min) ? options.min : 0;
+        var max;
+
+        if (isNumber(options.max)) {
+            max = options.max;
+        } else if (isNumber(options.min)) {
+            max = min + options.categories.length;
+        } else {
+            max = this.totalRange().max || 1;
+        }
+
+        if (totalLimit) {
+            var totalRange = this.totalRange();
+            min = limitValue(min, 0, totalRange.max);
+            max = limitValue(max, 0, totalRange.max);
+        }
+
+        return {
+            min: min,
+            max: max
+        };
+    };
+
+    CategoryAxis.prototype.totalRangeIndices = function totalRangeIndices () {
+        return {
+            min: 0,
+            max: this.totalRange().max || 1
+        };
+    };
+
     CategoryAxis.prototype.mapCategories = function mapCategories () {
         if (!this._categoriesMap) {
             var map = this._categoriesMap = new HashMap();

package/dist/es/core/date-category-axis.js

@@ -20,7 +20,11 @@ var BASE_UNITS = [
 var FIT = "fit";
 
 
-function categoryRange(categories) {
+function categoryRange(categories, clearCache) {
+    if (clearCache) {
+        categories._range = undefined;
+    }
+
     var range = categories._range;
     if (!range) {
         range = categories._range = sparseArrayLimits(categories);
@@ -368,10 +372,22 @@ var DateCategoryAxis = (function (CategoryAxis) {
         options.srcCategories = categories;
 
         if (categories.length > 0) {
-            var range = categoryRange(categories);
+            var range = categoryRange(categories, true);
             var maxDivisions = options.maxDivisions;
+            var safeOptions = initUnit(options);
+
+            var forecast = options._forecast;
+            if (forecast) {
+                if (forecast.before > 0) {
+                    range.min = addDuration(range.min, -forecast.before, safeOptions.baseUnit, safeOptions.weekStartDay);
+                }
+
+                if (forecast.after > 0) {
+                    range.max = addDuration(range.max, forecast.after, safeOptions.baseUnit, safeOptions.weekStartDay);
+                }
+            }
 
-            this.dataRange = new DateRange(range.min, range.max, initUnit(options));
+            this.dataRange = new DateRange(range.min, range.max, safeOptions);
 
             if (maxDivisions) {
                 var dataRange = this.dataRange.displayRange();
@@ -906,6 +922,14 @@ var DateCategoryAxis = (function (CategoryAxis) {
         return this.dataRange.total();
     };
 
+    DateCategoryAxis.prototype.totalRangeIndices = function totalRangeIndices () {
+        var range = this.dataRange.total();
+        return {
+            min: this.dataRange.totalIndex(range.min),
+            max: this.dataRange.totalIndex(range.max)
+        };
+    };
+
     DateCategoryAxis.prototype.totalCount = function totalCount () {
         return this.dataRange.totalCount();
     };

package/dist/es2015/chart/base-theme.js

@@ -1,3 +1,6 @@
+import { TRENDLINE_SERIES } from './constants';
+import { INHERIT } from '../common/constants';
+
 const BAR_GAP = 1.5;
 const BAR_SPACING = 0.4;
 const BLACK = '#000';
@@ -262,7 +265,22 @@ const heatmapSeries = () => ({
     }
 });
 
-const seriesDefaults = (options) => ({
+const trendlineSeriesDefaults = () => TRENDLINE_SERIES.reduce(
+    (options, type) => {
+        options[type] = {
+            color: INHERIT,
+            trendline: {},
+            markers: {
+                visible: false
+            },
+            width: 1,
+            dashType: 'longDash'
+        };
+
+        return options;
+    }, {});
+
+const seriesDefaults = (options) => (Object.assign({
     visible: true,
     labels: {
         font: SANS11
@@ -300,7 +318,9 @@ const seriesDefaults = (options) => ({
     verticalBullet: bulletSeries(),
     verticalLine: lineSeries(),
     waterfall: waterfallSeries()
-});
+},
+    trendlineSeriesDefaults()
+));
 
 const title = () => ({
     font: SANS16