@progress/kendo-charts 2.7.2-dev.202502101310 → 2.7.2-develop.1

package/dist/es/chart/constants.js

@@ -1,75 +1,75 @@
 import { support } from '@progress/kendo-drawing';
 
-var browser = support.browser || {};
+const browser = support.browser || {};
 
-var INITIAL_ANIMATION_DURATION = 600;
-var FADEIN = "fadeIn";
+const INITIAL_ANIMATION_DURATION = 600;
+const FADEIN = "fadeIn";
 
-var GLASS = "glass";
-var BORDER_BRIGHTNESS = 0.8;
-var TOOLTIP_OFFSET = 5;
-var START_SCALE = browser.msie ? 0.001 : 0;
-var ERROR_LOW_FIELD = "errorLow";
-var ERROR_HIGH_FIELD = "errorHigh";
-var X_ERROR_LOW_FIELD = "xErrorLow";
-var X_ERROR_HIGH_FIELD = "xErrorHigh";
-var Y_ERROR_LOW_FIELD = "yErrorLow";
-var Y_ERROR_HIGH_FIELD = "yErrorHigh";
-var LINE_MARKER_SIZE = 8;
-var ZERO = "zero";
-var INTERPOLATE = "interpolate";
-var GAP = "gap";
-var ABOVE = "above";
-var BELOW = "below";
-var BOTTOM = "bottom";
+const GLASS = "glass";
+const BORDER_BRIGHTNESS = 0.8;
+const TOOLTIP_OFFSET = 5;
+const START_SCALE = browser.msie ? 0.001 : 0;
+const ERROR_LOW_FIELD = "errorLow";
+const ERROR_HIGH_FIELD = "errorHigh";
+const X_ERROR_LOW_FIELD = "xErrorLow";
+const X_ERROR_HIGH_FIELD = "xErrorHigh";
+const Y_ERROR_LOW_FIELD = "yErrorLow";
+const Y_ERROR_HIGH_FIELD = "yErrorHigh";
+const LINE_MARKER_SIZE = 8;
+const ZERO = "zero";
+const INTERPOLATE = "interpolate";
+const GAP = "gap";
+const ABOVE = "above";
+const BELOW = "below";
+const BOTTOM = "bottom";
 
-var SMOOTH = "smooth";
-var STEP = "step";
+const SMOOTH = "smooth";
+const STEP = "step";
 
-var AREA = "area";
-var BAR = "bar";
-var BOX_PLOT = "boxPlot";
-var BUBBLE = "bubble";
-var BULLET = "bullet";
-var CANDLESTICK = "candlestick";
-var COLUMN = "column";
-var DONUT = "donut";
-var FUNNEL = "funnel";
-var PYRAMID = "pyramid";
-var HEATMAP = "heatmap";
-var HORIZONTAL_WATERFALL = "horizontalWaterfall";
-var LINE = "line";
-var OHLC = "ohlc";
-var PIE = "pie";
-var POLAR_AREA = "polarArea";
-var POLAR_LINE = "polarLine";
-var POLAR_SCATTER = "polarScatter";
-var RADAR_AREA = "radarArea";
-var RADAR_COLUMN = "radarColumn";
-var RADAR_LINE = "radarLine";
-var RANGE_AREA = "rangeArea";
-var RANGE_BAR = "rangeBar";
-var RANGE_COLUMN = "rangeColumn";
-var SCATTER = "scatter";
-var SCATTER_LINE = "scatterLine";
-var VERTICAL_AREA = "verticalArea";
-var VERTICAL_BOX_PLOT = "verticalBoxPlot";
-var VERTICAL_BULLET = "verticalBullet";
-var VERTICAL_LINE = "verticalLine";
-var VERTICAL_RANGE_AREA = "verticalRangeArea";
-var WATERFALL = "waterfall";
-var EQUALLY_SPACED_SERIES = [
+const AREA = "area";
+const BAR = "bar";
+const BOX_PLOT = "boxPlot";
+const BUBBLE = "bubble";
+const BULLET = "bullet";
+const CANDLESTICK = "candlestick";
+const COLUMN = "column";
+const DONUT = "donut";
+const FUNNEL = "funnel";
+const PYRAMID = "pyramid";
+const HEATMAP = "heatmap";
+const HORIZONTAL_WATERFALL = "horizontalWaterfall";
+const LINE = "line";
+const OHLC = "ohlc";
+const PIE = "pie";
+const POLAR_AREA = "polarArea";
+const POLAR_LINE = "polarLine";
+const POLAR_SCATTER = "polarScatter";
+const RADAR_AREA = "radarArea";
+const RADAR_COLUMN = "radarColumn";
+const RADAR_LINE = "radarLine";
+const RANGE_AREA = "rangeArea";
+const RANGE_BAR = "rangeBar";
+const RANGE_COLUMN = "rangeColumn";
+const SCATTER = "scatter";
+const SCATTER_LINE = "scatterLine";
+const VERTICAL_AREA = "verticalArea";
+const VERTICAL_BOX_PLOT = "verticalBoxPlot";
+const VERTICAL_BULLET = "verticalBullet";
+const VERTICAL_LINE = "verticalLine";
+const VERTICAL_RANGE_AREA = "verticalRangeArea";
+const WATERFALL = "waterfall";
+const EQUALLY_SPACED_SERIES = [
     BAR, COLUMN, OHLC, CANDLESTICK, BOX_PLOT, VERTICAL_BOX_PLOT,
     BULLET, RANGE_COLUMN, RANGE_BAR, WATERFALL, HORIZONTAL_WATERFALL
 ];
 
-var TRENDLINE_EXPONENTIAL = 'exponentialTrendline';
-var TRENDLINE_LINEAR = 'linearTrendline';
-var TRENDLINE_LOGARITHMIC = 'logarithmicTrendline';
-var TRENDLINE_MOVING_AVERAGE = 'movingAverageTrendline';
-var TRENDLINE_POLYNOMIAL = 'polynomialTrendline';
-var TRENDLINE_POWER = 'powerTrendline';
-var TRENDLINE_SERIES = [
+const TRENDLINE_EXPONENTIAL = 'exponentialTrendline';
+const TRENDLINE_LINEAR = 'linearTrendline';
+const TRENDLINE_LOGARITHMIC = 'logarithmicTrendline';
+const TRENDLINE_MOVING_AVERAGE = 'movingAverageTrendline';
+const TRENDLINE_POLYNOMIAL = 'polynomialTrendline';
+const TRENDLINE_POWER = 'powerTrendline';
+const TRENDLINE_SERIES = [
     TRENDLINE_EXPONENTIAL,
     TRENDLINE_LINEAR,
     TRENDLINE_LOGARITHMIC,
@@ -78,54 +78,54 @@ var TRENDLINE_SERIES = [
     TRENDLINE_POWER
 ];
 
-var LEGEND_ITEM_CLICK = "legendItemClick";
-var LEGEND_ITEM_HOVER = "legendItemHover";
-var LEGEND_ITEM_LEAVE = "legendItemLeave";
-var SERIES_CLICK = "seriesClick";
-var SERIES_HOVER = "seriesHover";
-var SERIES_OVER = "seriesOver";
-var SERIES_LEAVE = "seriesLeave";
-var PLOT_AREA_CLICK = "plotAreaClick";
-var PLOT_AREA_HOVER = "plotAreaHover";
-var PLOT_AREA_LEAVE = "plotAreaLeave";
-var DRAG = "drag";
-var DRAG_END = "dragEnd";
-var DRAG_START = "dragStart";
-var ZOOM_START = "zoomStart";
-var ZOOM = "zoom";
-var ZOOM_END = "zoomEnd";
-var SELECT_START = "selectStart";
-var SELECT = "select";
-var SELECT_END = "selectEnd";
-var RENDER = "render";
-var SHOW_TOOLTIP = "showTooltip";
-var HIDE_TOOLTIP = "hideTooltip";
-var PANE_RENDER = "paneRender";
+const LEGEND_ITEM_CLICK = "legendItemClick";
+const LEGEND_ITEM_HOVER = "legendItemHover";
+const LEGEND_ITEM_LEAVE = "legendItemLeave";
+const SERIES_CLICK = "seriesClick";
+const SERIES_HOVER = "seriesHover";
+const SERIES_OVER = "seriesOver";
+const SERIES_LEAVE = "seriesLeave";
+const PLOT_AREA_CLICK = "plotAreaClick";
+const PLOT_AREA_HOVER = "plotAreaHover";
+const PLOT_AREA_LEAVE = "plotAreaLeave";
+const DRAG = "drag";
+const DRAG_END = "dragEnd";
+const DRAG_START = "dragStart";
+const ZOOM_START = "zoomStart";
+const ZOOM = "zoom";
+const ZOOM_END = "zoomEnd";
+const SELECT_START = "selectStart";
+const SELECT = "select";
+const SELECT_END = "selectEnd";
+const RENDER = "render";
+const SHOW_TOOLTIP = "showTooltip";
+const HIDE_TOOLTIP = "hideTooltip";
+const PANE_RENDER = "paneRender";
 
 
-var CHART_POINT_ROLE = "graphics-symbol";
-var CHART_POINT_CLASSNAME = "k-chart-point";
-var CHART_POINT_ROLE_DESCRIPTION = "Point";
-var LEGEND_ITEM_ROLE = "checkbox";
-var LEGEND_ITEM_CLASSNAME = "k-chart-legend-item";
-var LEGEND_ITEM_ARIA_ROLE_DESCRIPTION = "Legend item";
+const CHART_POINT_ROLE = "graphics-symbol";
+const CHART_POINT_CLASSNAME = "k-chart-point";
+const CHART_POINT_ROLE_DESCRIPTION = "Point";
+const LEGEND_ITEM_ROLE = "checkbox";
+const LEGEND_ITEM_CLASSNAME = "k-chart-legend-item";
+const LEGEND_ITEM_ARIA_ROLE_DESCRIPTION = "Legend item";
 
-var LOGARITHMIC = "log";
-var CATEGORY = "category";
+const LOGARITHMIC = "log";
+const CATEGORY = "category";
 
-var INSIDE_END = "insideEnd";
-var INSIDE_BASE = "insideBase";
-var OUTSIDE_END = "outsideEnd";
+const INSIDE_END = "insideEnd";
+const INSIDE_BASE = "insideBase";
+const OUTSIDE_END = "outsideEnd";
 
-var MOUSEWHEEL = "wheel";
-var MOUSEWHEEL_DELAY = 150;
-var MOUSEWHEEL_ZOOM_RATE = 0.3;
+const MOUSEWHEEL = "wheel";
+const MOUSEWHEEL_DELAY = 150;
+const MOUSEWHEEL_ZOOM_RATE = 0.3;
 
-var DRILLDOWN = "drilldown";
-var DRILLDOWN_FIELD = "drilldown";
-var PATTERN_FIELD = "pattern";
+const DRILLDOWN = "drilldown";
+const DRILLDOWN_FIELD = "drilldown";
+const PATTERN_FIELD = "pattern";
 
-var MIN_MOVING_AVERAGE_PERIOD = 2;
+const MIN_MOVING_AVERAGE_PERIOD = 2;
 
 export {
     INITIAL_ANIMATION_DURATION, FADEIN,

package/dist/es/chart/crosshair/crosshair-tooltip.js

@@ -4,37 +4,31 @@ import { HIDE_TOOLTIP } from '../constants';
 import { TOP, BOTTOM, LEFT, RIGHT, CENTER, DATE } from '../../common/constants';
 import { setDefaultOptions } from '../../common';
 
-var CrosshairTooltip = (function (BaseTooltip) {
-    function CrosshairTooltip(chartService, crosshair, options) {
-        BaseTooltip.call(this, chartService, options);
+class CrosshairTooltip extends BaseTooltip {
+    constructor(chartService, crosshair, options) {
+        super(chartService, options);
 
         this.crosshair = crosshair;
         this.formatService = chartService.format;
         this.initAxisName();
     }
 
-    if ( BaseTooltip ) CrosshairTooltip.__proto__ = BaseTooltip;
-    CrosshairTooltip.prototype = Object.create( BaseTooltip && BaseTooltip.prototype );
-    CrosshairTooltip.prototype.constructor = CrosshairTooltip;
-
-    CrosshairTooltip.prototype.initAxisName = function initAxisName () {
-        var axis = this.crosshair.axis;
-        var plotArea = axis.plotArea;
-        var name;
+    initAxisName() {
+        const axis = this.crosshair.axis;
+        const plotArea = axis.plotArea;
+        let name;
         if (plotArea.categoryAxis) {
             name = axis.getCategory ? "categoryAxis" : "valueAxis";
         } else {
             name = axis.options.vertical ? "yAxis" : "xAxis";
         }
         this.axisName = name;
-    };
+    }
 
-    CrosshairTooltip.prototype.showAt = function showAt (point) {
-        var ref = this;
-        var axis = ref.crosshair.axis;
-        var options = ref.options;
-        var value = axis[options.stickyMode ? "getCategory" : "getValue"](point);
-        var formattedValue = value;
+    showAt(point) {
+        const { crosshair: { axis }, options } = this;
+        let value = axis[options.stickyMode ? "getCategory" : "getValue"](point);
+        let formattedValue = value;
 
         if (options.format) {
             formattedValue = this.formatService.auto(options.format, value);
@@ -50,25 +44,21 @@ var CrosshairTooltip = (function (BaseTooltip) {
             axisName: this.axisName,
             axisIndex: this.crosshair.axis.axisIndex
         }, this.options);
-    };
+    }
 
-    CrosshairTooltip.prototype.hide = function hide () {
+    hide() {
         this.chartService.notify(HIDE_TOOLTIP, {
             crosshair: this.crosshair,
             axisName: this.axisName,
             axisIndex: this.crosshair.axis.axisIndex
         });
-    };
+    }
 
-    CrosshairTooltip.prototype.getAnchor = function getAnchor () {
-        var ref = this;
-        var crosshair = ref.crosshair;
-        var ref_options = ref.options;
-        var position = ref_options.position;
-        var padding = ref_options.padding;
-        var vertical = !crosshair.axis.options.vertical;
-        var lineBox = crosshair.line.bbox();
-        var horizontalAlign, verticalAlign, point;
+    getAnchor() {
+        const { crosshair, options: { position, padding } } = this;
+        const vertical = !crosshair.axis.options.vertical;
+        const lineBox = crosshair.line.bbox();
+        let horizontalAlign, verticalAlign, point;
 
         if (vertical) {
             horizontalAlign = CENTER;
@@ -97,10 +87,8 @@ var CrosshairTooltip = (function (BaseTooltip) {
                 vertical: verticalAlign
             }
         };
-    };
-
-    return CrosshairTooltip;
-}(BaseTooltip));
+    }
+}
 
 setDefaultOptions(CrosshairTooltip, {
     padding: 10

package/dist/es/chart/crosshair/crosshair.js

@@ -6,14 +6,14 @@ import CrosshairTooltip from './crosshair-tooltip';
 import { BLACK, X, Y } from '../../common/constants';
 import { deepExtend, setDefaultOptions } from '../../common';
 
-var Crosshair = (function (ChartElement) {
-    function Crosshair(chartService, axis, options) {
-        ChartElement.call(this, options);
+class Crosshair extends ChartElement {
+    constructor(chartService, axis, options) {
+        super(options);
 
         this.axis = axis;
         this.stickyMode = axis instanceof CategoryAxis;
 
-        var tooltipOptions = this.options.tooltip;
+        const tooltipOptions = this.options.tooltip;
 
         if (tooltipOptions.visible) {
             this.tooltip = new CrosshairTooltip(chartService, this,
@@ -22,11 +22,7 @@ var Crosshair = (function (ChartElement) {
         }
     }
 
-    if ( ChartElement ) Crosshair.__proto__ = ChartElement;
-    Crosshair.prototype = Object.create( ChartElement && ChartElement.prototype );
-    Crosshair.prototype.constructor = Crosshair;
-
-    Crosshair.prototype.showAt = function showAt (point) {
+    showAt(point) {
         this.point = point;
         this.moveLine();
         this.line.visible(true);
@@ -34,25 +30,23 @@ var Crosshair = (function (ChartElement) {
         if (this.tooltip) {
             this.tooltip.showAt(point);
         }
-    };
+    }
 
-    Crosshair.prototype.hide = function hide () {
+    hide() {
         this.line.visible(false);
 
         if (this.tooltip) {
             this.tooltip.hide();
         }
-    };
-
-    Crosshair.prototype.moveLine = function moveLine () {
-        var ref = this;
-        var axis = ref.axis;
-        var point = ref.point;
-        var vertical = axis.options.vertical;
-        var box = this.getBox();
-        var dim = vertical ? Y : X;
-        var lineStart = new geom.Point(box.x1, box.y1);
-        var lineEnd;
+    }
+
+    moveLine() {
+        const { axis, point } = this;
+        const vertical = axis.options.vertical;
+        const box = this.getBox();
+        const dim = vertical ? Y : X;
+        const lineStart = new geom.Point(box.x1, box.y1);
+        let lineEnd;
 
         if (vertical) {
             lineEnd = new geom.Point(box.x2, box.y1);
@@ -62,7 +56,7 @@ var Crosshair = (function (ChartElement) {
 
         if (point) {
             if (this.stickyMode) {
-                var slot = axis.getSlot(axis.pointCategoryIndex(point));
+                const slot = axis.getSlot(axis.pointCategoryIndex(point));
                 lineStart[dim] = lineEnd[dim] = slot.center()[dim];
             } else {
                 lineStart[dim] = lineEnd[dim] = point[dim];
@@ -72,19 +66,19 @@ var Crosshair = (function (ChartElement) {
         this.box = box;
 
         this.line.moveTo(lineStart).lineTo(lineEnd);
-    };
-
-    Crosshair.prototype.getBox = function getBox () {
-        var axis = this.axis;
-        var axes = axis.pane.axes;
-        var length = axes.length;
-        var vertical = axis.options.vertical;
-        var box = axis.lineBox().clone();
-        var dim = vertical ? X : Y;
-        var axisLineBox;
-
-        for (var i = 0; i < length; i++) {
-            var currentAxis = axes[i];
+    }
+
+    getBox() {
+        const axis = this.axis;
+        const axes = axis.pane.axes;
+        const length = axes.length;
+        const vertical = axis.options.vertical;
+        const box = axis.lineBox().clone();
+        const dim = vertical ? X : Y;
+        let axisLineBox;
+
+        for (let i = 0; i < length; i++) {
+            const currentAxis = axes[i];
             if (currentAxis.options.vertical !== vertical) {
                 if (!axisLineBox) {
                     axisLineBox = currentAxis.lineBox().clone();
@@ -98,12 +92,12 @@ var Crosshair = (function (ChartElement) {
         box[dim + 2] = axisLineBox[dim + 2];
 
         return box;
-    };
+    }
 
-    Crosshair.prototype.createVisual = function createVisual () {
-        ChartElement.prototype.createVisual.call(this);
+    createVisual() {
+        super.createVisual();
 
-        var options = this.options;
+        const options = this.options;
         this.line = new draw.Path({
             stroke: {
                 color: options.color,
@@ -116,18 +110,16 @@ var Crosshair = (function (ChartElement) {
 
         this.moveLine();
         this.visual.append(this.line);
-    };
+    }
 
-    Crosshair.prototype.destroy = function destroy () {
+    destroy() {
         if (this.tooltip) {
             this.tooltip.destroy();
         }
 
-        ChartElement.prototype.destroy.call(this);
-    };
-
-    return Crosshair;
-}(ChartElement));
+        super.destroy();
+    }
+}
 
 setDefaultOptions(Crosshair, {
     color: BLACK,

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

@@ -5,19 +5,11 @@ import { INITIAL_ANIMATION_DURATION } from '../constants';
 
 import { deepExtend, defined, setDefaultOptions, valueOrDefault } from '../../common';
 
-var DONUT_SECTOR_ANIM_DELAY = 50;
+const DONUT_SECTOR_ANIM_DELAY = 50;
 
-var DonutChart = (function (PieChart) {
-    function DonutChart () {
-        PieChart.apply(this, arguments);
-    }
-
-    if ( PieChart ) DonutChart.__proto__ = PieChart;
-    DonutChart.prototype = Object.create( PieChart && PieChart.prototype );
-    DonutChart.prototype.constructor = DonutChart;
-
-    DonutChart.prototype.addValue = function addValue (value, sector, fields) {
-        var segmentOptions = deepExtend({}, fields.series, { index: fields.index });
+class DonutChart extends PieChart {
+    addValue(value, sector, fields) {
+        const segmentOptions = deepExtend({}, fields.series, { index: fields.index });
         segmentOptions.pattern = fields.pattern || segmentOptions.pattern;
 
         this.evalSegmentOptions(segmentOptions, value, fields);
@@ -28,34 +20,32 @@ var DonutChart = (function (PieChart) {
             return;
         }
 
-        var segment = new DonutSegment(value, sector, segmentOptions);
+        const segment = new DonutSegment(value, sector, segmentOptions);
 
         Object.assign(segment, fields);
         this.append(segment);
         this.points.push(segment);
-    };
-
-    DonutChart.prototype.reflow = function reflow (targetBox) {
-        var this$1 = this;
-
-        var options = this.options;
-        var box = targetBox.clone();
-        var space = 5;
-        var minWidth = Math.min(box.width(), box.height());
-        var halfMinWidth = minWidth / 2;
-        var defaultPadding = minWidth - minWidth * 0.85;
-        var series = options.series;
-        var seriesCount = series.length;
+    }
 
-        var padding = valueOrDefault(options.padding, defaultPadding);
+    reflow(targetBox) {
+        const options = this.options;
+        const box = targetBox.clone();
+        const space = 5;
+        const minWidth = Math.min(box.width(), box.height());
+        const halfMinWidth = minWidth / 2;
+        const defaultPadding = minWidth - minWidth * 0.85;
+        const series = options.series;
+        const seriesCount = series.length;
+
+        let padding = valueOrDefault(options.padding, defaultPadding);
         padding = padding > halfMinWidth - space ? halfMinWidth - space : padding;
 
-        var totalSize = halfMinWidth - padding;
-        var seriesWithoutSize = 0;
-        var holeSize;
+        let totalSize = halfMinWidth - padding;
+        let seriesWithoutSize = 0;
+        let holeSize;
 
-        for (var i = 0; i < seriesCount; i++) {
-            var currentSeries = series[i];
+        for (let i = 0; i < seriesCount; i++) {
+            const currentSeries = series[i];
             if (i === 0) {
                 if (defined(currentSeries.holeSize)) {
                     holeSize = currentSeries.holeSize;
@@ -75,37 +65,35 @@ var DonutChart = (function (PieChart) {
         }
 
         if (!defined(holeSize)) {
-            var currentSize = (halfMinWidth - padding) / (seriesCount + 0.75);
+            const currentSize = (halfMinWidth - padding) / (seriesCount + 0.75);
             holeSize = currentSize * 0.75;
             totalSize -= holeSize;
         }
 
-        var innerRadius = holeSize;
-        var margin = 0;
-        var size, radius;
+        let innerRadius = holeSize;
+        let margin = 0;
+        let size, radius;
 
         this.seriesConfigs = [];
 
-        for (var i$1 = 0; i$1 < seriesCount; i$1++) {
-            var currentSeries$1 = series[i$1];
-            size = valueOrDefault(currentSeries$1.size, totalSize / seriesWithoutSize);
+        for (let i = 0; i < seriesCount; i++) {
+            const currentSeries = series[i];
+            size = valueOrDefault(currentSeries.size, totalSize / seriesWithoutSize);
             innerRadius += margin;
             radius = innerRadius + size;
-            this$1.seriesConfigs.push({ innerRadius: innerRadius, radius: radius });
-            margin = currentSeries$1.margin || 0;
+            this.seriesConfigs.push({ innerRadius: innerRadius, radius: radius });
+            margin = currentSeries.margin || 0;
             innerRadius = radius;
         }
 
-        PieChart.prototype.reflow.call(this, targetBox);
-    };
+        super.reflow(targetBox);
+    }
 
-    DonutChart.prototype.animationDelay = function animationDelay (categoryIndex, seriesIndex, seriesCount) {
+    animationDelay(categoryIndex, seriesIndex, seriesCount) {
         return categoryIndex * DONUT_SECTOR_ANIM_DELAY +
             (INITIAL_ANIMATION_DURATION * (seriesIndex + 1) / (seriesCount + 1));
-    };
-
-    return DonutChart;
-}(PieChart));
+    }
+}
 
 
 setDefaultOptions(DonutChart, {

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

@@ -8,42 +8,30 @@ import { ShapeBuilder, Box } from '../../core';
 import { CENTER } from '../../common/constants';
 import { deepExtend, setDefaultOptions } from '../../common';
 
-var DonutSegment = (function (PieSegment) {
-    function DonutSegment () {
-        PieSegment.apply(this, arguments);
-    }
-
-    if ( PieSegment ) DonutSegment.__proto__ = PieSegment;
-    DonutSegment.prototype = Object.create( PieSegment && PieSegment.prototype );
-    DonutSegment.prototype.constructor = DonutSegment;
-
-    DonutSegment.prototype.reflowLabel = function reflowLabel () {
-        var ref = this;
-        var labelsOptions = ref.options.labels;
-        var label = ref.label;
-        var sector = this.sector.clone();
-        var angle = sector.middle();
+class DonutSegment extends PieSegment {
+    reflowLabel() {
+        const { options: { labels: labelsOptions }, label } = this;
+        const sector = this.sector.clone();
+        const angle = sector.middle();
 
         if (label) {
-            var labelHeight = label.box.height();
+            const labelHeight = label.box.height();
             if (labelsOptions.position === CENTER) {
                 sector.radius -= (sector.radius - sector.innerRadius) / 2;
 
-                var lp = sector.point(angle);
+                const lp = sector.point(angle);
 
                 label.reflow(new Box(lp.x, lp.y - labelHeight / 2, lp.x, lp.y));
             } else {
-                PieSegment.prototype.reflowLabel.call(this);
+                super.reflowLabel();
             }
         }
-    };
+    }
 
-    DonutSegment.prototype.createSegment = function createSegment (sector, options) {
+    createSegment(sector, options) {
         return ShapeBuilder.current.createRing(sector, options);
-    };
-
-    return DonutSegment;
-}(PieSegment));
+    }
+}
 
 setDefaultOptions(DonutSegment, {
     overlay: {