@progress/kendo-charts 1.32.1 → 1.33.0-dev.202311081130

package/dist/es/chart/heatmap-chart/heatmap-point.js

@@ -1,7 +1,8 @@
 import { autoTextColor, deepExtend, getTemplate, valueOrDefault } from '../../common';
 import { CENTER, ROUNDED_RECT, BOTTOM, WHITE } from '../../common/constants';
 import { ChartElement, Point, rectToBox, ShapeElement, TextBox } from '../../core';
-import { TOOLTIP_OFFSET } from '../constants';
+import { CHART_POINT_CLASSNAME, CHART_POINT_ROLE, CHART_POINT_ROLE_DESCRIPTION, TOOLTIP_OFFSET } from '../constants';
+import AccessibilityAttributesMixin from '../mixins/accessibility-attributes-mixin';
 import NoteMixin from '../mixins/note-mixin';
 import PointEventsMixin from '../mixins/point-events-mixin';
 
@@ -35,38 +36,43 @@ var HeatmapPoint = (function (ChartElement) {
         var labels = options.labels;
 
         if (labels.visible) {
-            var pointData = this.pointData();
-            var labelTemplate = getTemplate(labels);
-            var labelText;
-            var labelColor = labels.color;
-
-            if (labelTemplate) {
-                labelText = labelTemplate(pointData);
-            } else {
-                labelText = this.formatValue(labels.format);
-            }
+            this.label = this.createLabelElement(labels);
+            this.append(this.label);
+        }
+    };
 
-            if (!labelColor) {
-                labelColor = autoTextColor(this.color);
-            }
+    HeatmapPoint.prototype.createLabelElement = function createLabelElement (options) {
+        var labelColor = options.color;
+
+        if (!labelColor) {
+            labelColor = autoTextColor(this.color);
+        }
 
-            this.label = new TextBox(labelText,
-                deepExtend({
-                    align: CENTER,
-                    vAlign: CENTER,
-                    margin: {
-                        left: 5,
-                        right: 5
-                    },
-                    zIndex: valueOrDefault(labels.zIndex, this.series.zIndex)
+        return new TextBox(this.getLabelText(options),
+            deepExtend({
+                align: CENTER,
+                vAlign: CENTER,
+                margin: {
+                    left: 5,
+                    right: 5
                 },
-                labels, {
-                    color: labelColor
-                }),
-                pointData
-            );
-            this.append(this.label);
+                zIndex: valueOrDefault(options.zIndex, this.series.zIndex)
+            },
+            options, {
+                color: labelColor
+            }),
+            this.pointData()
+        );
+    };
+
+    HeatmapPoint.prototype.getLabelText = function getLabelText (options) {
+        var labelTemplate = getTemplate(options);
+
+        if (labelTemplate) {
+            return labelTemplate(this.pointData());
         }
+
+        return this.formatValue(options.format);
     };
 
     HeatmapPoint.prototype.formatValue = function formatValue (format) {
@@ -91,6 +97,12 @@ var HeatmapPoint = (function (ChartElement) {
         this.marker.reflow(this.markerBox());
     };
 
+    HeatmapPoint.prototype.createVisual = function createVisual () {
+        ChartElement.prototype.createVisual.call(this);
+
+        this.addAccessibilityAttributesToVisual();
+    };
+
     HeatmapPoint.prototype.markerBox = function markerBox () {
         var options = this.options;
         var markers = options.markers;
@@ -193,6 +205,27 @@ var HeatmapPoint = (function (ChartElement) {
         };
     };
 
+    HeatmapPoint.prototype.createFocusHighlight = function createFocusHighlight () {
+        var markerOptions = this.options.markers;
+        var highlightOptions = this.options.accessibility.highlight;
+
+        var highlight = new ShapeElement({
+            type: valueOrDefault(markerOptions.type, 'rect'),
+            width: markerOptions.size,
+            height: markerOptions.size,
+            rotation: markerOptions.rotation,
+            background: highlightOptions.color,
+            border: highlightOptions.border,
+            borderRadius: markerOptions.borderRadius,
+            padding: highlightOptions.border.width / 2,
+            zIndex: highlightOptions.zIndex
+        });
+
+        highlight.reflow(this.markerBox());
+
+        return highlight.getElement();
+    };
+
     HeatmapPoint.prototype.tooltipAnchor = function tooltipAnchor () {
         var left = this.box.center().x;
         var top = this.box.y1 - TOOLTIP_OFFSET;
@@ -229,6 +262,7 @@ var HeatmapPoint = (function (ChartElement) {
 
 deepExtend(HeatmapPoint.prototype, PointEventsMixin);
 deepExtend(HeatmapPoint.prototype, NoteMixin);
+deepExtend(HeatmapPoint.prototype, AccessibilityAttributesMixin);
 
 HeatmapPoint.prototype.defaults = {
     markers: {
@@ -246,6 +280,11 @@ HeatmapPoint.prototype.defaults = {
     opacity: 1,
     notes: {
         label: {}
+    },
+    accessibility: {
+        role: CHART_POINT_ROLE,
+        className: CHART_POINT_CLASSNAME,
+        ariaRoleDescription: CHART_POINT_ROLE_DESCRIPTION
     }
 };
 

package/dist/es/chart/legend/legend-item.js

@@ -1,9 +1,11 @@
 import { drawing as draw } from '@progress/kendo-drawing';
 
 import { BoxElement, FloatElement, ShapeElement, TextBox } from '../../core';
-import { LEGEND_ITEM_CLICK, LEGEND_ITEM_HOVER, LEGEND_ITEM_LEAVE } from '../constants';
+import { LEGEND_ITEM_ARIA_ROLE_DESCRIPTION, LEGEND_ITEM_CLASSNAME, LEGEND_ITEM_CLICK, LEGEND_ITEM_HOVER, LEGEND_ITEM_LEAVE, LEGEND_ITEM_ROLE } from '../constants';
 import { CENTER, WHITE } from '../../common/constants';
-import { deepExtend, eventElement } from '../../common';
+import { deepExtend, eventElement, setDefaultOptions } from '../../common';
+import AccessibilityAttributesMixin from '../mixins/accessibility-attributes-mixin';
+import addAccessibilityAttributesToVisual from '../../core/utils/add-accessibility-attributes-to-visual';
 
 var LegendItem = (function (BoxElement) {
     function LegendItem(options) {
@@ -103,6 +105,19 @@ var LegendItem = (function (BoxElement) {
         };
     };
 
+    LegendItem.prototype.createVisual = function createVisual () {
+        BoxElement.prototype.createVisual.call(this);
+        var options = this.options;
+
+        if (this.options.visible) {
+            var accessibilityOptions = deepExtend({ ariaLabel: options.text }, options.accessibility);
+
+            addAccessibilityAttributesToVisual(this.visual, accessibilityOptions);
+
+            this.visual.options.ariaChecked = options.active;
+        }
+    };
+
     LegendItem.prototype.renderVisual = function renderVisual () {
         var this$1 = this;
 
@@ -137,7 +152,22 @@ var LegendItem = (function (BoxElement) {
         }
     };
 
+    LegendItem.prototype.createFocusHighlight = function createFocusHighlight (style) {
+        var borderWidth = style.stroke.width;
+        return draw.Path.fromRect(this.container.box.pad(borderWidth / 2).toRect(), style);
+    };
+
     return LegendItem;
 }(BoxElement));
 
+deepExtend(LegendItem.prototype, AccessibilityAttributesMixin);
+
+setDefaultOptions(LegendItem, {
+    accessibility: {
+        role: LEGEND_ITEM_ROLE,
+        className: LEGEND_ITEM_CLASSNAME,
+        ariaRoleDescription: LEGEND_ITEM_ARIA_ROLE_DESCRIPTION
+    }
+});
+
 export default LegendItem;

package/dist/es/chart/legend/legend.js

@@ -107,7 +107,8 @@ var Legend = (function (ChartElement) {
             innerElement.append(new LegendItem(deepExtend({}, {
                 markers: options.markers,
                 labels: options.labels,
-                rtl: chartService.rtl
+                rtl: chartService.rtl,
+                accessibility: options.accessibility
             }, options.item, item)));
         }
 
@@ -129,6 +130,10 @@ var Legend = (function (ChartElement) {
         return this.container.children[0].children.length > 0;
     };
 
+    Legend.prototype.getItems = function getItems () {
+        return this.container.children[0].children;
+    };
+
     Legend.prototype.reflow = function reflow (targetBox) {
         var options = this.options;
         var legendBox = targetBox.clone();

package/dist/es/chart/line-chart/line-point.js

@@ -4,10 +4,12 @@ import { ChartElement, TextBox, ShapeElement, Box, Point } from '../../core';
 
 import PointEventsMixin from '../mixins/point-events-mixin';
 import NoteMixin from '../mixins/note-mixin';
-import { LINE_MARKER_SIZE, FADEIN, INITIAL_ANIMATION_DURATION, BORDER_BRIGHTNESS, TOOLTIP_OFFSET, ABOVE, BELOW } from '../constants';
+import { LINE_MARKER_SIZE, FADEIN, INITIAL_ANIMATION_DURATION, BORDER_BRIGHTNESS, TOOLTIP_OFFSET, ABOVE, BELOW, CHART_POINT_ROLE, CHART_POINT_CLASSNAME, CHART_POINT_ROLE_DESCRIPTION } from '../constants';
 
 import { WHITE, CIRCLE, CENTER, TOP, BOTTOM, LEFT, HIGHLIGHT_ZINDEX } from '../../common/constants';
 import { deepExtend, defined, getTemplate, valueOrDefault, getSpacing } from '../../common';
+import TemplateService from '../../services/template-service';
+import guid from '../../core/utils/guid';
 
 var LinePoint = (function (ChartElement) {
     function LinePoint(value, options) {
@@ -26,7 +28,6 @@ var LinePoint = (function (ChartElement) {
     LinePoint.prototype.render = function render () {
         var ref = this.options;
         var markers = ref.markers;
-        var labels = ref.labels;
 
         if (this._rendered) {
             return;
@@ -39,35 +40,59 @@ var LinePoint = (function (ChartElement) {
             this.append(this.marker);
         }
 
+        this.createLabel();
+        this.createNote();
+
+        if (this.errorBar) {
+            this.append(this.errorBar);
+        }
+    };
+
+    LinePoint.prototype.createLabel = function createLabel () {
+        var options = this.options;
+        var labels = options.labels;
+
         if (labels.visible) {
-            var labelTemplate = getTemplate(labels);
-            var pointData = this.pointData();
-            var labelText = this.value;
-            if (labelTemplate) {
-                labelText = labelTemplate(pointData);
-            } else if (labels.format) {
-                labelText = this.formatValue(labels.format);
-            }
-            this.label = new TextBox(labelText,
-                deepExtend({
-                    align: CENTER,
-                    vAlign: CENTER,
-                    margin: {
-                        left: 5,
-                        right: 5
-                    },
-                    zIndex: valueOrDefault(labels.zIndex, this.series.zIndex)
-                }, labels),
-                pointData
-            );
+            this.label = this.createLabelElement(labels);
             this.append(this.label);
         }
+    };
 
-        this.createNote();
+    LinePoint.prototype.createLabelElement = function createLabelElement (options) {
+        return new TextBox(this.getLabelText(options),
+            deepExtend({
+                align: CENTER,
+                vAlign: CENTER,
+                margin: {
+                    left: 5,
+                    right: 5
+                },
+                zIndex: valueOrDefault(options.zIndex, this.series.zIndex)
+            }, options),
+            this.pointData()
+        );
+    };
 
-        if (this.errorBar) {
-            this.append(this.errorBar);
+    LinePoint.prototype.getLabelText = function getLabelText (options) {
+        var labelTemplate = getTemplate(options);
+
+        if (labelTemplate) {
+            return labelTemplate(this.pointData());
+        } else if (options.format) {
+            return this.formatValue(options.format);
         }
+
+        return this.value;
+    };
+
+    LinePoint.prototype.getAriaLabelText = function getAriaLabelText () {
+        var labels = this.options.labels;
+
+        if (labels.ariaTemplate) {
+            return TemplateService.compile(labels.ariaTemplate)(this.pointData());
+        }
+
+        return this.getLabelText(labels);
     };
 
     LinePoint.prototype.markerBorder = function markerBorder () {
@@ -96,7 +121,10 @@ var LinePoint = (function (ChartElement) {
             opacity: options.opacity,
             zIndex: valueOrDefault(options.zIndex, this.series.zIndex),
             animation: options.animation,
-            visual: options.visual
+            visual: options.visual,
+            accessibilityOptions: deepExtend({
+                ariaLabel: this.getAriaLabelText(this.options.labels)
+            }, this.options.accessibility)
         }, {
             dataItem: this.dataItem,
             value: this.value,
@@ -233,6 +261,28 @@ var LinePoint = (function (ChartElement) {
         };
     };
 
+    LinePoint.prototype.createFocusHighlight = function createFocusHighlight () {
+        var markerOptions = this.options.markers;
+        var highlightOptions = this.options.accessibility.highlight;
+        var size = markerOptions.size + (markerOptions.border.width || 0);
+
+        var highlight = new ShapeElement({
+            type: markerOptions.type,
+            width: size,
+            height: size,
+            rotation: markerOptions.rotation,
+            background: highlightOptions.color,
+            border: highlightOptions.border,
+            opacity: highlightOptions.opacity,
+            padding: highlightOptions.border.width / 2,
+            zIndex: highlightOptions.zIndex
+        });
+
+        highlight.reflow(this._childBox);
+
+        return highlight.getElement();
+    };
+
     LinePoint.prototype.tooltipAnchor = function tooltipAnchor () {
         var markerBox = this.markerBox();
         var clipBox = this.owner.pane.clipBox();
@@ -291,6 +341,33 @@ var LinePoint = (function (ChartElement) {
         };
     };
 
+    LinePoint.prototype.focusVisual = function focusVisual () {
+        if (this.marker) {
+            this._id = guid();
+
+            if (this.marker.visual) {
+                this.marker.visual.options.set("id", this._id);
+            }
+
+            this.toggleFocusHighlight(true);
+        }
+    };
+
+    LinePoint.prototype.clearFocusFromVisual = function clearFocusFromVisual () {
+        if (this.marker) {
+            if (this.marker.visual) {
+                this.marker.visual.options.set("id", "");
+            }
+
+            this._id = null;
+            this.toggleFocusHighlight(false);
+        }
+    };
+
+    LinePoint.prototype.getIndex = function getIndex () {
+        return defined(this.categoryIx) ? this.categoryIx : this.pointIx;
+    };
+
     return LinePoint;
 }(ChartElement));
 
@@ -332,6 +409,12 @@ LinePoint.prototype.defaults = {
         line: {
             width: 1
         }
+    },
+    accessibility: {
+        tabIndex: 0,
+        role: CHART_POINT_ROLE,
+        className: CHART_POINT_CLASSNAME,
+        ariaRoleDescription: CHART_POINT_ROLE_DESCRIPTION
     }
 };
 

package/dist/es/chart/mixins/accessibility-attributes-mixin.js

@@ -0,0 +1,36 @@
+import addAccessibilityAttributesToVisual from "../../core/utils/add-accessibility-attributes-to-visual";
+import { deepExtend } from "../../common";
+import guid from '../../core/utils/guid';
+import TemplateService from "../../services/template-service";
+
+var AccessibilityAttributesMixin = {
+    addAccessibilityAttributesToVisual: function() {
+        var accessibilityOptions = deepExtend({ ariaLabel: this.getAriaLabelText() }, this.options.accessibility);
+
+        addAccessibilityAttributesToVisual(this.visual, accessibilityOptions);
+    },
+
+    getAriaLabelText: function getAriaLabelText() {
+        var labels = this.options.labels;
+
+        if (labels.ariaTemplate) {
+            return TemplateService.compile(labels.ariaTemplate)(this.pointData());
+        }
+
+        return this.getLabelText(labels);
+    },
+
+    focusVisual: function focusVisual() {
+        this._id = guid();
+        this.visual.options.set("id", this._id);
+        this.toggleFocusHighlight(true);
+    },
+
+    clearFocusFromVisual: function clearFocusFromVisual() {
+        this.visual.options.set("id", "");
+        this._id = null;
+        this.toggleFocusHighlight(false);
+    }
+};
+
+export default AccessibilityAttributesMixin;

package/dist/es/chart/pie-chart/pie-chart.js

@@ -114,7 +114,7 @@ var PieChart = (function (ChartElement) {
             dataItem: fields.dataItem,
             category: fields.category,
             percentage: fields.percentage
-        }, { defaults: series._defaults, excluded: [ "data", "content", "template", "visual", "toggle" ] });
+        }, { defaults: series._defaults, excluded: [ "data", "content", "template", "visual", "toggle", "ariaTemplate" ] });
     };
 
     PieChart.prototype.addValue = function addValue (value, sector, fields) {

package/dist/es/chart/pie-chart/pie-segment.js

@@ -4,11 +4,12 @@ import { ChartElement, ShapeBuilder, TextBox, Box } from '../../core';
 
 import PointEventsMixin from '../mixins/point-events-mixin';
 
-import { OUTSIDE_END, INSIDE_END, PIE, FADEIN, TOOLTIP_OFFSET } from '../constants';
+import { OUTSIDE_END, INSIDE_END, PIE, FADEIN, TOOLTIP_OFFSET, CHART_POINT_ROLE, CHART_POINT_CLASSNAME, CHART_POINT_ROLE_DESCRIPTION } from '../constants';
 import hasGradientOverlay from '../utils/has-gradient-overlay';
 
 import { TOP, BOTTOM, LEFT, RIGHT, DEFAULT_FONT, CIRCLE, WHITE, CENTER, DEFAULT_PRECISION } from '../../common/constants';
 import { autoTextColor, setDefaultOptions, getSpacing, getTemplate, deepExtend, round, rad } from '../../common';
+import AccessibilityAttributesMixin from '../mixins/accessibility-attributes-mixin';
 
 var PieSegment = (function (ChartElement) {
     function PieSegment(value, sector, options) {
@@ -23,23 +24,18 @@ var PieSegment = (function (ChartElement) {
     PieSegment.prototype.constructor = PieSegment;
 
     PieSegment.prototype.render = function render () {
-        var labels = this.options.labels;
-        var chartService = this.owner.chartService;
-        var labelText = this.value;
-
         if (this._rendered || this.visible === false) {
             return;
         }
         this._rendered = true;
 
-        var labelTemplate = getTemplate(labels);
-        var pointData = this.pointData();
+        this.createLabel();
+    };
 
-        if (labelTemplate) {
-            labelText = labelTemplate(pointData);
-        } else if (labels.format) {
-            labelText = chartService.format.auto(labels.format, labelText);
-        }
+    PieSegment.prototype.createLabel = function createLabel () {
+        var labels = this.options.labels;
+        var chartService = this.owner.chartService;
+        var labelText = this.getLabelText(labels);
 
         if (labels.visible && (labelText || labelText === 0)) {
             if (labels.position === CENTER || labels.position === INSIDE_END) {
@@ -63,12 +59,22 @@ var PieSegment = (function (ChartElement) {
                     type: FADEIN,
                     delay: this.animationDelay
                 }
-            }), pointData);
+            }), this.pointData());
 
             this.append(this.label);
         }
     };
 
+    PieSegment.prototype.getLabelText = function getLabelText (options) {
+        var labelTemplate = getTemplate(options);
+
+        if (labelTemplate) {
+            return labelTemplate(this.pointData());
+        }
+
+        return this.owner.chartService.format.auto(options.format, this.value);
+    };
+
     PieSegment.prototype.reflow = function reflow (targetBox) {
         this.render();
         this.box = targetBox;
@@ -120,6 +126,8 @@ var PieSegment = (function (ChartElement) {
 
         ChartElement.prototype.createVisual.call(this);
 
+        this.addAccessibilityAttributesToVisual();
+
         if (this.value) {
             if (options.visual) {
                 var startAngle = (sector.startAngle + 180) % 360;
@@ -252,6 +260,24 @@ var PieSegment = (function (ChartElement) {
         };
     };
 
+    PieSegment.prototype.createFocusHighlight = function createFocusHighlight (style) {
+        var borderWidth = this.options.accessibility.highlight.border.width;
+        var result = this.createSegment(this.sector, deepExtend({}, style, {
+            stroke: {
+                width: borderWidth * 2
+            }
+        }));
+
+        var clipPath = new draw.MultiPath();
+
+        clipPath.paths.push(draw.Path.fromRect(result.bbox()));
+        clipPath.paths.push(this.createSegment(this.sector, {}));
+
+        result.clip(clipPath);
+
+        return result;
+    };
+
     PieSegment.prototype.tooltipAnchor = function tooltipAnchor () {
         var sector = this.sector.clone().expand(TOOLTIP_OFFSET);
         var midAndle = sector.middle();
@@ -277,6 +303,10 @@ var PieSegment = (function (ChartElement) {
         };
     };
 
+    PieSegment.prototype.getIndex = function getIndex () {
+        return this.index;
+    };
+
     return PieSegment;
 }(ChartElement));
 
@@ -339,9 +369,15 @@ setDefaultOptions(PieSegment, {
             width: 1
         }
     },
-    visible: true
+    visible: true,
+    accessibility: {
+        role: CHART_POINT_ROLE,
+        className: CHART_POINT_CLASSNAME,
+        ariaRoleDescription: CHART_POINT_ROLE_DESCRIPTION
+    }
 });
 
 deepExtend(PieSegment.prototype, PointEventsMixin);
+deepExtend(PieSegment.prototype, AccessibilityAttributesMixin);
 
 export default PieSegment;

package/dist/es/chart/plotarea/categorical-plotarea.js

@@ -24,10 +24,10 @@ import { appendIfNotNull, categoriesCount, createOutOfRangePoints, equalsIgnoreC
 
 import { BAR, COLUMN, BULLET, VERTICAL_BULLET, LINE, VERTICAL_LINE, AREA, VERTICAL_AREA,
     RANGE_AREA, VERTICAL_RANGE_AREA, RANGE_COLUMN, RANGE_BAR, WATERFALL, HORIZONTAL_WATERFALL,
-    BOX_PLOT, VERTICAL_BOX_PLOT, OHLC, CANDLESTICK, LOGARITHMIC, STEP, EQUALLY_SPACED_SERIES } from '../constants';
+    BOX_PLOT, VERTICAL_BOX_PLOT, OHLC, CANDLESTICK, LOGARITHMIC, STEP, EQUALLY_SPACED_SERIES, RADAR_LINE, RADAR_AREA } from '../constants';
 
 import { DATE, MAX_VALUE } from '../../common/constants';
-import { setDefaultOptions, inArray, deepExtend, defined, eventElement, grep } from '../../common';
+import { setDefaultOptions, inArray, deepExtend, defined, eventElement, grep, cycleIndex } from '../../common';
 
 var AREA_SERIES = [ AREA, VERTICAL_AREA, RANGE_AREA, VERTICAL_RANGE_AREA ];
 var OUT_OF_RANGE_SERIES = [ LINE, VERTICAL_LINE ].concat(AREA_SERIES);
@@ -841,6 +841,57 @@ var CategoricalPlotArea = (function (PlotAreaBase) {
         updateAxisOptions(this.originalOptions, axis, options);
     };
 
+    CategoricalPlotArea.prototype._pointsByVertical = function _pointsByVertical (basePoint, offset) {
+        if ( offset === void 0 ) offset = 0;
+
+        if (this.invertAxes) {
+            return this._siblingsBySeriesIndex(basePoint, offset);
+        }
+
+        return this._siblingsByPointIndex(basePoint, offset);
+    };
+
+    CategoricalPlotArea.prototype._pointsByHorizontal = function _pointsByHorizontal (basePoint, offset) {
+        if ( offset === void 0 ) offset = 0;
+
+        if (this.invertAxes) {
+            return this._siblingsByPointIndex(basePoint, offset);
+        }
+
+        return this._siblingsBySeriesIndex(basePoint, offset);
+    };
+
+    CategoricalPlotArea.prototype._siblingsByPointIndex = function _siblingsByPointIndex (basePoint) {
+        return this
+            .pointsByPointIndex(basePoint.getIndex())
+            .sort(this._getSeriesCompareFn(basePoint));
+    };
+
+    CategoricalPlotArea.prototype._siblingsBySeriesIndex = function _siblingsBySeriesIndex (basePoint, offset) {
+        var index = cycleIndex(basePoint.series.index + offset, this.series.length);
+
+        return this.pointsBySeriesIndex(index);
+    };
+
+    CategoricalPlotArea.prototype._getSeriesCompareFn = function _getSeriesCompareFn (point) {
+        var isStacked = this._isInStackedSeries(point);
+
+        if (isStacked && this.invertAxes || !isStacked && !this.invertAxes) {
+            return function (a, b) { return a.box.center().x - b.box.center().x; };
+        }
+
+        return function (a, b) { return a.box.center().y - b.box.center().y; };
+    };
+
+    CategoricalPlotArea.prototype._isInStackedSeries = function _isInStackedSeries (point) {
+        var sortableSeries = inArray(point.series.type,
+            [ AREA, VERTICAL_AREA, RANGE_AREA, VERTICAL_RANGE_AREA, LINE, VERTICAL_LINE, RADAR_LINE, RADAR_AREA]);
+
+        var stackableSeries = inArray(point.series.type, [ COLUMN, BAR]);
+
+        return sortableSeries || stackableSeries && point.options.isStacked;
+    };
+
     return CategoricalPlotArea;
 }(PlotAreaBase));
 

package/dist/es/chart/plotarea/funnel-plotarea.js

@@ -45,6 +45,14 @@ var FunnelPlotArea = (function (PlotAreaBase) {
         append(this.options.legend.items, chart.legendItems);
     };
 
+    FunnelPlotArea.prototype._pointsByVertical = function _pointsByVertical (basePoint) {
+        return this.pointsBySeriesIndex(basePoint.series.index);
+    };
+
+    FunnelPlotArea.prototype._pointsByHorizontal = function _pointsByHorizontal (basePoint) {
+        return [basePoint];
+    };
+
     return FunnelPlotArea;
 }(PlotAreaBase));