@amcharts/amcharts5 5.2.49 → 5.3.0

package/.internal/charts/stock/drawing/DrawingSeries.js

@@ -1,4 +1,3 @@
-import { __extends } from "tslib";
 import { LineSeries } from "../../xy/series/LineSeries";
 import { Bullet } from "../../../core/render/Bullet";
 import { Circle } from "../../../core/render/Circle";
@@ -9,371 +8,323 @@ import * as $time from "../../../core/util/Time";
 import * as $type from "../../../core/util/Type";
 import * as $math from "../../../core/util/Math";
 import * as $object from "../../../core/util/Object";
-var DrawingSeries = /** @class */ (function (_super) {
-    __extends(DrawingSeries, _super);
-    function DrawingSeries() {
-        var _this = _super !== null && _super.apply(this, arguments) || this;
-        Object.defineProperty(_this, "_clickDp", {
+export class DrawingSeries extends LineSeries {
+    constructor() {
+        super(...arguments);
+        Object.defineProperty(this, "_clickDp", {
             enumerable: true,
             configurable: true,
             writable: true,
             value: void 0
         });
-        Object.defineProperty(_this, "_moveDp", {
+        Object.defineProperty(this, "_moveDp", {
             enumerable: true,
             configurable: true,
             writable: true,
             value: void 0
         });
-        Object.defineProperty(_this, "_downDp", {
+        Object.defineProperty(this, "_downDp", {
             enumerable: true,
             configurable: true,
             writable: true,
             value: void 0
         });
-        Object.defineProperty(_this, "_upDp", {
+        Object.defineProperty(this, "_upDp", {
             enumerable: true,
             configurable: true,
             writable: true,
             value: void 0
         });
-        Object.defineProperty(_this, "_drawingEnabled", {
+        Object.defineProperty(this, "_drawingEnabled", {
             enumerable: true,
             configurable: true,
             writable: true,
             value: false
         });
-        Object.defineProperty(_this, "_isDragging", {
+        Object.defineProperty(this, "_isDragging", {
             enumerable: true,
             configurable: true,
             writable: true,
             value: false
         });
-        Object.defineProperty(_this, "_clickPointerPoint", {
+        Object.defineProperty(this, "_clickPointerPoint", {
             enumerable: true,
             configurable: true,
             writable: true,
             value: void 0
         });
-        Object.defineProperty(_this, "_movePointerPoint", {
+        Object.defineProperty(this, "_movePointerPoint", {
             enumerable: true,
             configurable: true,
             writable: true,
             value: void 0
         });
-        Object.defineProperty(_this, "_isDrawing", {
+        Object.defineProperty(this, "_isDrawing", {
             enumerable: true,
             configurable: true,
             writable: true,
             value: false
         });
-        Object.defineProperty(_this, "_isPointerDown", {
+        Object.defineProperty(this, "_isPointerDown", {
             enumerable: true,
             configurable: true,
             writable: true,
             value: false
         });
-        Object.defineProperty(_this, "_index", {
+        Object.defineProperty(this, "_index", {
             enumerable: true,
             configurable: true,
             writable: true,
             value: 0
         });
-        Object.defineProperty(_this, "_di", {
+        Object.defineProperty(this, "_di", {
             enumerable: true,
             configurable: true,
             writable: true,
             value: []
         });
-        Object.defineProperty(_this, "_dragStartPX", {
+        Object.defineProperty(this, "_dragStartPX", {
             enumerable: true,
             configurable: true,
             writable: true,
             value: 0
         });
-        Object.defineProperty(_this, "_dragStartY", {
+        Object.defineProperty(this, "_dragStartY", {
             enumerable: true,
             configurable: true,
             writable: true,
             value: 0
         });
-        Object.defineProperty(_this, "_dvpX", {
+        Object.defineProperty(this, "_dvpX", {
             enumerable: true,
             configurable: true,
             writable: true,
             value: {}
         });
-        Object.defineProperty(_this, "_dvY", {
+        Object.defineProperty(this, "_dvY", {
             enumerable: true,
             configurable: true,
             writable: true,
             value: {}
         });
-        Object.defineProperty(_this, "_isHover", {
+        Object.defineProperty(this, "_isHover", {
             enumerable: true,
             configurable: true,
             writable: true,
             value: false
         });
-        Object.defineProperty(_this, "_erasingEnabled", {
+        Object.defineProperty(this, "_erasingEnabled", {
             enumerable: true,
             configurable: true,
             writable: true,
             value: false
         });
-        Object.defineProperty(_this, "_tag", {
+        Object.defineProperty(this, "_tag", {
             enumerable: true,
             configurable: true,
             writable: true,
             value: void 0
         });
-        return _this;
-    }
-    Object.defineProperty(DrawingSeries.prototype, "_afterNew", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function () {
-            var _this = this;
-            this.addTag("drawing");
-            if (this._tag) {
-                this.addTag(this._tag);
+    }
+    _afterNew() {
+        this.addTag("drawing");
+        if (this._tag) {
+            this.addTag(this._tag);
+        }
+        this.set("valueYField", "valueY");
+        this.set("valueXField", "valueX");
+        super._afterNew();
+        this.set("connect", false);
+        this.set("autoGapCount", Infinity);
+        this.set("ignoreMinMax", true);
+        this.set("groupDataDisabled", true);
+        const strokesTemplate = this.strokes.template;
+        strokesTemplate.set("templateField", "stroke");
+        const fillsTemplate = this.fills.template;
+        fillsTemplate.setAll({ templateField: "fill" });
+        fillsTemplate.events.on("dragstart", (e) => {
+            this._handleFillDragStart(e, this._getIndex(e.target));
+            this._isPointerDown = true;
+        });
+        fillsTemplate.events.on("pointerdown", (e) => {
+            const index = this._getIndex(e.target);
+            if (this._erasingEnabled) {
+                this._disposeIndex(index);
             }
-            this.set("valueYField", "valueY");
-            this.set("valueXField", "valueX");
-            _super.prototype._afterNew.call(this);
-            this._di[0] = {};
-            this.set("connect", false);
-            this.set("autoGapCount", Infinity);
-            this.set("ignoreMinMax", true);
-            var strokesTemplate = this.strokes.template;
-            strokesTemplate.set("templateField", "stroke");
-            var fillsTemplate = this.fills.template;
-            fillsTemplate.setAll({ templateField: "fill" });
-            fillsTemplate.events.on("dragstart", function (e) {
-                _this._handleFillDragStart(e, _this._getIndex(e.target));
-                _this._isPointerDown = true;
-            });
-            fillsTemplate.events.on("pointerdown", function (e) {
-                var index = _this._getIndex(e.target);
-                if (_this._erasingEnabled) {
-                    _this._disposeIndex(index);
-                }
-                else {
-                    var originalEvent = e.originalEvent;
-                    if (!originalEvent.button && _this._drawingEnabled) {
-                        _this._handlePointerDown(e);
-                    }
-                }
-                var stroke = _this.strokes.getIndex(_this._getStrokeIndex(index));
-                if (stroke) {
-                    stroke.dragStart(e);
+            else {
+                const originalEvent = e.originalEvent;
+                if (!originalEvent.button && this._drawingEnabled) {
+                    this._handlePointerDown(e);
                 }
-            });
-            strokesTemplate.events.on("pointerdown", function (e) {
-                if (_this._erasingEnabled) {
-                    _this._disposeIndex(_this._getIndex(e.target));
+            }
+            const stroke = this.strokes.getIndex(this._getStrokeIndex(index));
+            if (stroke) {
+                stroke.dragStart(e);
+            }
+        });
+        strokesTemplate.events.on("pointerdown", (e) => {
+            if (this._erasingEnabled) {
+                this._disposeIndex(this._getIndex(e.target));
+            }
+            else {
+                const originalEvent = e.originalEvent;
+                if (!originalEvent.button && this._drawingEnabled) {
+                    this._handlePointerDown(e);
                 }
-                else {
-                    var originalEvent = e.originalEvent;
-                    if (!originalEvent.button && _this._drawingEnabled) {
-                        _this._handlePointerDown(e);
+            }
+        });
+        fillsTemplate.events.on("dragstop", (e) => {
+            this._isPointerDown = false;
+            const index = this._getIndex(e.target);
+            this._handleFillDragStop(e, index);
+            const stroke = this.strokes.getIndex(this._getStrokeIndex(index));
+            if (stroke) {
+                stroke.dragStop(e);
+            }
+        });
+        fillsTemplate.events.on("pointerover", (e) => {
+            const index = this._getIndex(e.target);
+            const stroke = this.strokes.getIndex(this._getStrokeIndex(index));
+            if (stroke) {
+                stroke.hover();
+            }
+            this._isHover = true;
+            this._showSegmentBullets(index);
+        });
+        fillsTemplate.events.on("pointerout", () => {
+            this._isHover = false;
+            this._hideAllBullets();
+        });
+        strokesTemplate.events.on("pointerover", (e) => {
+            this._isHover = true;
+            this._showSegmentBullets(this._getIndex(e.target));
+        });
+        strokesTemplate.events.on("pointerout", () => {
+            this._isHover = false;
+            this._hideAllBullets();
+        });
+        strokesTemplate.events.on("dragstop", (e) => {
+            this._handleFillDragStop(e, this._getIndex(e.target));
+        });
+        strokesTemplate.events.on("dragstart", (e) => {
+            this._handleFillDragStart(e, this._getIndex(e.target));
+        });
+        this.bulletsContainer.states.create("hidden", { visible: true, opacity: 0 });
+        this.bullets.push((_root, _series, dataItem) => {
+            const dataContext = dataItem.dataContext;
+            const index = dataContext.index;
+            const di = this._di[index]["e"];
+            let color = this.get("strokeColor", this.get("stroke"));
+            if (di) {
+                const dc = di.dataContext;
+                if (dc) {
+                    const strokeTemplate = dc.stroke;
+                    if (strokeTemplate) {
+                        color = strokeTemplate.get("stroke");
                     }
                 }
+            }
+            const container = Container.new(this._root, {
+                themeTags: ["grip"],
+                setStateOnChildren: true,
+                draggable: true
             });
-            fillsTemplate.events.on("dragstop", function (e) {
-                _this._isPointerDown = false;
-                var index = _this._getIndex(e.target);
-                _this._handleFillDragStop(e, index);
-                var stroke = _this.strokes.getIndex(_this._getStrokeIndex(index));
-                if (stroke) {
-                    stroke.dragStop(e);
-                }
-            });
-            fillsTemplate.events.on("pointerover", function (e) {
-                var index = _this._getIndex(e.target);
-                var stroke = _this.strokes.getIndex(_this._getStrokeIndex(index));
-                if (stroke) {
-                    stroke.hover();
+            container.children.push(Circle.new(this._root, {
+                themeTags: ["outline"],
+                stroke: color
+            }));
+            container.children.push(Circle.new(this._root, {
+                stroke: color
+            }));
+            container.events.on("pointerover", (event) => {
+                const dataItem = event.target.dataItem;
+                if (dataItem) {
+                    const dataContext = dataItem.dataContext;
+                    this._showSegmentBullets(dataContext.index);
                 }
-                _this._isHover = true;
-                _this._showSegmentBullets(index);
-            });
-            fillsTemplate.events.on("pointerout", function () {
-                _this._isHover = false;
-                _this._hideAllBullets();
-            });
-            strokesTemplate.events.on("pointerover", function (e) {
-                _this._isHover = true;
-                _this._showSegmentBullets(_this._getIndex(e.target));
             });
-            strokesTemplate.events.on("pointerout", function () {
-                _this._isHover = false;
-                _this._hideAllBullets();
+            container.events.on("pointerout", () => {
+                this._hideAllBullets();
             });
-            strokesTemplate.events.on("dragstop", function (e) {
-                _this._handleFillDragStop(e, _this._getIndex(e.target));
+            this._addBulletInteraction(container);
+            this._tweakBullet(container, dataItem);
+            return Bullet.new(this._root, {
+                locationX: undefined,
+                sprite: container
             });
-            strokesTemplate.events.on("dragstart", function (e) {
-                _this._handleFillDragStart(e, _this._getIndex(e.target));
-            });
-            this.set("groupDataDisabled", true);
-            this.bulletsContainer.states.create("hidden", { visible: true, opacity: 0 });
-            this.bullets.push(function () {
-                var color = _this.get("strokeColor", _this.get("stroke"));
-                var container = Container.new(_this._root, {
-                    themeTags: ["grip"],
-                    setStateOnChildren: true,
-                    draggable: true
-                });
-                container.children.push(Circle.new(_this._root, {
-                    themeTags: ["outline"],
-                    stroke: color
-                }));
-                container.children.push(Circle.new(_this._root, {
-                    stroke: color
-                }));
-                container.events.on("pointerover", function (event) {
-                    var dataItem = event.target.dataItem;
-                    if (dataItem) {
-                        var dataContext = dataItem.dataContext;
-                        _this._showSegmentBullets(dataContext.index);
-                    }
-                });
-                container.events.on("pointerout", function () {
-                    _this._hideAllBullets();
-                });
-                _this._addBulletInteraction(container);
-                _this._tweakBullet(container);
-                return Bullet.new(_this._root, {
-                    locationX: undefined,
-                    sprite: container
-                });
-            });
-            this.events.on("pointerover", function () {
-                _this._handlePointerOver();
-            });
-            this.events.on("pointerout", function () {
-                _this._handlePointerOut();
-            });
-        }
-    });
-    Object.defineProperty(DrawingSeries.prototype, "_disposeIndex", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function (index) {
-            var _this = this;
-            var dataItems = this._di[index];
-            if (dataItems) {
-                $object.each(dataItems, function (_key, dataItem) {
-                    _this.data.removeValue(dataItem.dataContext);
-                });
-            }
-        }
-    });
-    Object.defineProperty(DrawingSeries.prototype, "clearDrawings", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function () {
-            var _this = this;
-            $array.each(this._di, function (_dataItems, index) {
-                _this._disposeIndex(index);
+        });
+        this.events.on("pointerover", () => {
+            this._handlePointerOver();
+        });
+        this.events.on("pointerout", () => {
+            this._handlePointerOut();
+        });
+    }
+    _disposeIndex(index) {
+        const dataItems = this._di[index];
+        if (dataItems) {
+            $object.each(dataItems, (_key, dataItem) => {
+                this.data.removeValue(dataItem.dataContext);
             });
         }
-    });
-    Object.defineProperty(DrawingSeries.prototype, "_getIndex", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function (sprite) {
-            var userData = sprite.get("userData");
-            if (userData && userData.length > 0) {
-                var dataItem = this.dataItems[userData[0]];
-                if (dataItem) {
-                    var dataContext = dataItem.dataContext;
-                    if (dataContext) {
-                        return dataContext.index;
-                    }
+    }
+    _afterDataChange() {
+        $array.each(this.dataItems, (dataItem) => {
+            const dataContext = dataItem.dataContext;
+            const index = dataContext.index;
+            const corner = dataContext.corner;
+            if (index != undefined) {
+                if (this._di[index] == undefined) {
+                    this._di[index] = {};
                 }
+                this._createElements(index, dataItem);
+                this._di[index][corner] = dataItem;
+                this._index = index;
             }
-            return 0;
-        }
-    });
-    Object.defineProperty(DrawingSeries.prototype, "_getStrokeIndex", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function (index) {
-            var _this = this;
-            var i = 0;
-            var c = index;
-            this.strokes.each(function (stroke) {
-                var strokeIndex = _this._getIndex(stroke);
-                if (strokeIndex == index) {
-                    c = i;
+        });
+    }
+    _createElements(_index, _dataItem) {
+    }
+    clearDrawings() {
+        $array.each(this._di, (_dataItems, index) => {
+            this._disposeIndex(index);
+        });
+        this.data.setAll([]);
+        this._index = 0;
+    }
+    _getIndex(sprite) {
+        const userData = sprite.get("userData");
+        if (userData && userData.length > 0) {
+            const dataItem = this.dataItems[userData[0]];
+            if (dataItem) {
+                const dataContext = dataItem.dataContext;
+                if (dataContext) {
+                    return dataContext.index;
                 }
-                i++;
-            });
-            return c;
-        }
-    });
-    Object.defineProperty(DrawingSeries.prototype, "_showSegmentBullets", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function (index) {
-            var dataItems = this._di[index];
-            if (dataItems) {
-                $object.each(dataItems, function (_key, dataItem) {
-                    var bullets = dataItem.bullets;
-                    if (bullets) {
-                        $array.each(bullets, function (bullet) {
-                            var sprite = bullet.get("sprite");
-                            if (sprite) {
-                                sprite.show();
-                            }
-                        });
-                    }
-                });
             }
         }
-    });
-    Object.defineProperty(DrawingSeries.prototype, "_hideAllBullets", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function () {
-            this.strokes.each(function (stroke) {
-                stroke.unhover();
-            });
-            if (!this._drawingEnabled && !this._isDragging) {
-                var dataItems = this.dataItems;
-                $array.each(dataItems, function (dataItem) {
-                    var bullets = dataItem.bullets;
-                    if (bullets) {
-                        $array.each(bullets, function (bullet) {
-                            var sprite = bullet.get("sprite");
-                            if (sprite) {
-                                sprite.hide();
-                            }
-                        });
-                    }
-                });
+        return 0;
+    }
+    _getStrokeIndex(index) {
+        let i = 0;
+        let c = index;
+        this.strokes.each((stroke) => {
+            const strokeIndex = this._getIndex(stroke);
+            if (strokeIndex == index) {
+                c = i;
             }
-        }
-    });
-    Object.defineProperty(DrawingSeries.prototype, "showAllBullets", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function () {
-            $array.each(this.dataItems, function (dataItem) {
-                var bullets = dataItem.bullets;
+            i++;
+        });
+        return c;
+    }
+    _showSegmentBullets(index) {
+        const dataItems = this._di[index];
+        if (dataItems) {
+            $object.each(dataItems, (_key, dataItem) => {
+                const bullets = dataItem.bullets;
                 if (bullets) {
-                    $array.each(bullets, function (bullet) {
-                        var sprite = bullet.get("sprite");
+                    $array.each(bullets, (bullet) => {
+                        const sprite = bullet.get("sprite");
                         if (sprite) {
                             sprite.show();
                         }
@@ -381,498 +332,354 @@ var DrawingSeries = /** @class */ (function (_super) {
                 }
             });
         }
-    });
-    Object.defineProperty(DrawingSeries.prototype, "_handleFillDragStart", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function (event, index) {
-            var _this = this;
-            var chart = this.chart;
-            if (chart) {
-                var xAxis_1 = this.get("xAxis");
-                var yAxis = this.get("yAxis");
-                var point = chart.plotContainer.toLocal(event.point);
-                this._dragStartPX = xAxis_1.coordinateToPosition(point.x);
-                this._dragStartY = this._getYValue(yAxis.positionToValue(yAxis.coordinateToPosition(point.y)));
-                var dataItems = this._di[index];
-                if (dataItems) {
-                    $object.each(dataItems, function (key, dataItem) {
-                        _this._dvpX[key] = xAxis_1.valueToPosition(dataItem.get("valueX", 0));
-                        _this._dvY[key] = dataItem.get("valueY");
-                    });
-                }
-            }
-        }
-    });
-    Object.defineProperty(DrawingSeries.prototype, "_handleFillDragStop", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function (event, index) {
-            var _this = this;
-            var chart = this.chart;
-            if (chart) {
-                var point = chart.plotContainer.toLocal(event.point);
-                var xAxis_2 = this.get("xAxis");
-                var yAxis = this.get("yAxis");
-                var posX = xAxis_2.coordinateToPosition(point.x);
-                var valueY = this._getYValue(yAxis.positionToValue(yAxis.coordinateToPosition(point.y)));
-                var dpx_1 = posX - this._dragStartPX;
-                var dy_1 = valueY - this._dragStartY;
-                var dataItems = this._di[index];
-                if (dataItems) {
-                    $object.each(dataItems, function (key, dataItem) {
-                        var dvpx = _this._dvpX[key];
-                        var dvy = _this._dvY[key];
-                        if ($type.isNumber(dvpx) && $type.isNumber(dvy)) {
-                            var vpx = dvpx + dpx_1;
-                            var vy = dvy + dy_1;
-                            var vx = _this._getXValue(xAxis_2.positionToValue(vpx));
-                            dataItem.set("valueX", vx);
-                            _this._setXLocation(dataItem, vx);
-                            dataItem.set("valueY", vy);
-                            dataItem.set("valueYWorking", vy);
-                            var dataContext = dataItem.dataContext;
-                            dataContext.valueX = vx;
-                            dataContext.valueY = vy;
+    }
+    _hideAllBullets() {
+        this.strokes.each((stroke) => {
+            stroke.unhover();
+        });
+        if (!this._drawingEnabled && !this._isDragging) {
+            const dataItems = this.dataItems;
+            $array.each(dataItems, (dataItem) => {
+                const bullets = dataItem.bullets;
+                if (bullets) {
+                    $array.each(bullets, (bullet) => {
+                        const sprite = bullet.get("sprite");
+                        if (sprite) {
+                            sprite.hide();
                         }
                     });
                 }
-            }
-            this._updateSegment(index);
-            this._updateElements();
-        }
-    });
-    Object.defineProperty(DrawingSeries.prototype, "_updateSegment", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function (_index) {
-        }
-    });
-    Object.defineProperty(DrawingSeries.prototype, "_updateChildren", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function () {
-            if (this.isDirty("strokeColor") || this.isDirty("fillColor") || this.isDirty("strokeOpacity") || this.isDirty("fillOpacity") || this.isDirty("strokeWidth") || this.isDirty("strokeDasharray")) {
-                this.data.push({ stroke: this._getStrokeTemplate(), fill: this._getFillTemplate() });
-            }
-            this._updateElements();
-            _super.prototype._updateChildren.call(this);
-        }
-    });
-    Object.defineProperty(DrawingSeries.prototype, "_getFillTemplate", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function () {
-            var fillTemplate = {};
-            var fillColor = this.get("fillColor");
-            if (fillColor != null) {
-                fillTemplate.fill = fillColor;
-            }
-            var fillOpacity = this.get("fillOpacity");
-            if (fillOpacity != null) {
-                fillTemplate.fillOpacity = fillOpacity;
-            }
-            return Template.new(fillTemplate);
+            });
         }
-    });
-    Object.defineProperty(DrawingSeries.prototype, "_getStrokeTemplate", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function () {
-            var strokeTemplate = {};
-            var strokeColor = this.get("strokeColor");
-            if (strokeColor != null) {
-                strokeTemplate.stroke = strokeColor;
-            }
-            var strokeOpacity = this.get("strokeOpacity");
-            if (strokeOpacity != null) {
-                strokeTemplate.strokeOpacity = strokeOpacity;
-            }
-            var strokeDasharray = this.get("strokeDasharray");
-            if (strokeDasharray != null) {
-                strokeTemplate.strokeDasharray = strokeDasharray;
+    }
+    showAllBullets() {
+        $array.each(this.dataItems, (dataItem) => {
+            const bullets = dataItem.bullets;
+            if (bullets) {
+                $array.each(bullets, (bullet) => {
+                    const sprite = bullet.get("sprite");
+                    if (sprite) {
+                        sprite.show();
+                    }
+                });
             }
-            var strokeWidth = this.get("strokeWidth");
-            if (strokeWidth != null) {
-                strokeTemplate.strokeWidth = strokeWidth;
+        });
+    }
+    _handleFillDragStart(event, index) {
+        const chart = this.chart;
+        if (chart) {
+            const xAxis = this.get("xAxis");
+            const yAxis = this.get("yAxis");
+            const point = chart.plotContainer.toLocal(event.point);
+            this._dragStartPX = xAxis.coordinateToPosition(point.x);
+            this._dragStartY = this._getYValue(yAxis.positionToValue(yAxis.coordinateToPosition(point.y)));
+            const dataItems = this._di[index];
+            if (dataItems) {
+                $object.each(dataItems, (key, dataItem) => {
+                    this._dvpX[key] = xAxis.valueToPosition(dataItem.get("valueX", 0));
+                    this._dvY[key] = dataItem.get("valueY");
+                });
             }
-            return Template.new(strokeTemplate);
-        }
-    });
-    Object.defineProperty(DrawingSeries.prototype, "_updateElements", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function () {
         }
-    });
-    Object.defineProperty(DrawingSeries.prototype, "_tweakBullet", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function (_container) {
-        }
-    });
-    Object.defineProperty(DrawingSeries.prototype, "_addBulletInteraction", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function (sprite) {
-            var _this = this;
-            sprite.events.on("dragged", function (e) {
-                _this._handleBulletDragged(e);
-                _this._isDragging = true;
-            });
-            sprite.events.on("dragstart", function (e) {
-                _this._handleBulletDragStart(e);
-            });
-            sprite.events.on("dragstop", function (e) {
-                _this._handleBulletDragStop(e);
-                _this.setTimeout(function () {
-                    _this._isDragging = false;
-                }, 100);
-            });
-            sprite.events.on("click", function (e) {
-                if (_this._erasingEnabled) {
-                    var dataItem = e.target.dataItem;
-                    if (dataItem) {
-                        var dataContext = dataItem.dataContext;
-                        if (dataContext) {
-                            _this._disposeIndex(dataContext.index);
-                        }
+    }
+    _handleFillDragStop(event, index) {
+        const chart = this.chart;
+        if (chart) {
+            const point = chart.plotContainer.toLocal(event.point);
+            const xAxis = this.get("xAxis");
+            const yAxis = this.get("yAxis");
+            const posX = xAxis.coordinateToPosition(point.x);
+            const valueY = this._getYValue(yAxis.positionToValue(yAxis.coordinateToPosition(point.y)));
+            const dpx = posX - this._dragStartPX;
+            const dy = valueY - this._dragStartY;
+            const dataItems = this._di[index];
+            if (dataItems) {
+                $object.each(dataItems, (key, dataItem) => {
+                    const dvpx = this._dvpX[key];
+                    const dvy = this._dvY[key];
+                    if ($type.isNumber(dvpx) && $type.isNumber(dvy)) {
+                        const vpx = dvpx + dpx;
+                        let vy = dvy + dy;
+                        const yAxis = this.get("yAxis");
+                        const roundTo = yAxis.getPrivate("stepDecimalPlaces", 0) + 1;
+                        vy = $math.round(vy, roundTo);
+                        const vx = this._getXValue(xAxis.positionToValue(vpx));
+                        this._setContext(dataItem, "valueX", vx);
+                        this._setContext(dataItem, "valueY", vy, true);
+                        this._setXLocation(dataItem, vx);
                     }
-                }
-                else {
-                    _this._handlePointerClick(e);
-                }
-            });
-        }
-    });
-    Object.defineProperty(DrawingSeries.prototype, "_handlePointerClick", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function (event) {
-            if (this._drawingEnabled) {
-                var chart = this.chart;
-                if (chart) {
-                    this._clickPointerPoint = chart.plotContainer.toLocal(event.point);
-                }
+                });
             }
         }
-    });
-    // need this in order bullets not to be placed to the charts bullets container
-    Object.defineProperty(DrawingSeries.prototype, "_placeBulletsContainer", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function () {
-            this.children.moveValue(this.bulletsContainer);
-        }
-    });
-    Object.defineProperty(DrawingSeries.prototype, "_handleBulletDragged", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function (event) {
-            var dataItem = event.target.dataItem;
-            var chart = this.chart;
-            if (chart) {
-                var target = event.target;
-                var point = { x: target.x(), y: target.y() };
-                this._handleBulletDraggedReal(dataItem, point);
-            }
-            var dataContext = dataItem.dataContext;
-            if (dataContext) {
-                var index = dataContext.index;
-                this._updateSegment(index);
-                this._updateElements();
-            }
+        this._updateSegment(index);
+    }
+    _updateSegment(_index) {
+        this._updateElements();
+    }
+    _updateChildren() {
+        this._updateElements();
+        super._updateChildren();
+    }
+    _updateElements() {
+    }
+    _getFillTemplate() {
+        const fillTemplate = {};
+        const fillColor = this.get("fillColor");
+        if (fillColor != null) {
+            fillTemplate.fill = fillColor;
         }
-    });
-    Object.defineProperty(DrawingSeries.prototype, "_handleBulletDraggedReal", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function (dataItem, point) {
-            var xAxis = this.get("xAxis");
-            var yAxis = this.get("yAxis");
-            var vx = this._getXValue(xAxis.positionToValue(xAxis.coordinateToPosition(point.x)));
-            var vy = this._getYValue(yAxis.positionToValue(yAxis.coordinateToPosition(point.y)));
-            dataItem.set("valueX", vx);
-            this._setXLocation(dataItem, vx);
-            dataItem.set("valueY", vy);
-            dataItem.set("valueYWorking", vy);
-            var dataContext = dataItem.dataContext;
-            dataContext.valueX = vx;
-            dataContext.valueY = vy;
-            this._positionBullets(dataItem);
+        const fillOpacity = this.get("fillOpacity");
+        if (fillOpacity != null) {
+            fillTemplate.fillOpacity = fillOpacity;
         }
-    });
-    Object.defineProperty(DrawingSeries.prototype, "_handleBulletDragStart", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function (_event) {
+        return Template.new(fillTemplate);
+    }
+    _getStrokeTemplate() {
+        const strokeTemplate = {};
+        const strokeColor = this.get("strokeColor");
+        if (strokeColor != null) {
+            strokeTemplate.stroke = strokeColor;
         }
-    });
-    Object.defineProperty(DrawingSeries.prototype, "_handleBulletDragStop", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function (_event) {
+        const strokeOpacity = this.get("strokeOpacity");
+        if (strokeOpacity != null) {
+            strokeTemplate.strokeOpacity = strokeOpacity;
         }
-    });
-    Object.defineProperty(DrawingSeries.prototype, "_handlePointerOver", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function () {
+        const strokeDasharray = this.get("strokeDasharray");
+        if (strokeDasharray != null) {
+            strokeTemplate.strokeDasharray = strokeDasharray;
         }
-    });
-    Object.defineProperty(DrawingSeries.prototype, "_handlePointerOut", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function () {
+        const strokeWidth = this.get("strokeWidth");
+        if (strokeWidth != null) {
+            strokeTemplate.strokeWidth = strokeWidth;
         }
-    });
-    Object.defineProperty(DrawingSeries.prototype, "_addContextInfo", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function (index, corner) {
-            var dataItems = this.dataItems;
-            var len = dataItems.length;
-            var dataItem = dataItems[len - 1];
-            var dataContext = dataItem.dataContext;
-            if (dataContext) {
-                dataContext.index = index;
-                if (corner != null) {
-                    dataContext.corner = corner;
+        return Template.new(strokeTemplate);
+    }
+    _tweakBullet(_container, _dataItem) {
+    }
+    _addBulletInteraction(sprite) {
+        sprite.events.on("dragged", (e) => {
+            this._handleBulletDragged(e);
+            this._isDragging = true;
+        });
+        sprite.events.on("dragstart", (e) => {
+            this._handleBulletDragStart(e);
+        });
+        sprite.events.on("dragstop", (e) => {
+            this._handleBulletDragStop(e);
+            this.setTimeout(() => {
+                this._isDragging = false;
+            }, 100);
+        });
+        sprite.events.on("click", (e) => {
+            if (this._erasingEnabled) {
+                const dataItem = e.target.dataItem;
+                if (dataItem) {
+                    const dataContext = dataItem.dataContext;
+                    if (dataContext) {
+                        this._disposeIndex(dataContext.index);
+                    }
                 }
             }
-            if (!this._di[index]) {
-                this._di[index] = {};
+            else {
+                this._handlePointerClick(e);
             }
-            this._di[index][corner] = dataItem;
-        }
-    });
-    Object.defineProperty(DrawingSeries.prototype, "enableDrawing", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function () {
-            var _this = this;
-            var chart = this.chart;
-            this._erasingEnabled = false;
-            this._drawingEnabled = true;
+        });
+    }
+    _handlePointerClick(event) {
+        if (this._drawingEnabled) {
+            const chart = this.chart;
             if (chart) {
-                if (!this._clickDp) {
-                    this._clickDp = chart.plotContainer.events.on("click", function (e) {
-                        var originalEvent = e.originalEvent;
-                        if (!originalEvent.button && !_this._erasingEnabled) {
-                            _this._handlePointerClick(e);
-                        }
-                    });
-                }
-                if (!this._downDp) {
-                    this._downDp = chart.plotContainer.events.on("pointerdown", function (e) {
-                        var originalEvent = e.originalEvent;
-                        if (!originalEvent.button && !_this._erasingEnabled) {
-                            _this._handlePointerDown(e);
-                        }
-                    });
-                }
-                if (!this._upDp) {
-                    this._upDp = chart.plotContainer.events.on("globalpointerup", function (e) {
-                        var originalEvent = e.originalEvent;
-                        if (!originalEvent.button && !_this._erasingEnabled) {
-                            _this._handlePointerUp(e);
-                        }
-                    });
-                }
-                if (!this._moveDp) {
-                    this._moveDp = chart.plotContainer.events.on("globalpointermove", function (e) {
-                        if (!_this._erasingEnabled) {
-                            _this._handlePointerMove(e);
-                        }
-                    });
-                }
+                this._clickPointerPoint = chart.plotContainer.toLocal(event.point);
             }
         }
-    });
-    Object.defineProperty(DrawingSeries.prototype, "enableErasing", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function () {
-            this._erasingEnabled = true;
-        }
-    });
-    Object.defineProperty(DrawingSeries.prototype, "disableErasing", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function () {
-            this._erasingEnabled = false;
+    }
+    // need this in order bullets not to be placed to the charts bullets container
+    _placeBulletsContainer() {
+        this.children.moveValue(this.bulletsContainer);
+        this.enableDrawing();
+        this.disableDrawing();
+    }
+    _handleBulletDragged(event) {
+        const dataItem = event.target.dataItem;
+        const chart = this.chart;
+        if (chart) {
+            const target = event.target;
+            const point = { x: target.x(), y: target.y() };
+            this._handleBulletDraggedReal(dataItem, point);
+        }
+        const dataContext = dataItem.dataContext;
+        if (dataContext) {
+            const index = dataContext.index;
+            this._updateSegment(index);
         }
-    });
-    Object.defineProperty(DrawingSeries.prototype, "disableDrawing", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function () {
-            this._erasingEnabled = false;
-            this._drawingEnabled = false;
-            this._isDrawing = false;
-            if (this._clickDp) {
-                this._clickDp.dispose();
-                this._clickDp = undefined;
+    }
+    _handleBulletDraggedReal(dataItem, point) {
+        const xAxis = this.get("xAxis");
+        const yAxis = this.get("yAxis");
+        const vx = this._getXValue(xAxis.positionToValue(xAxis.coordinateToPosition(point.x)));
+        const vy = this._getYValue(yAxis.positionToValue(yAxis.coordinateToPosition(point.y)));
+        this._setContext(dataItem, "valueX", vx);
+        this._setContext(dataItem, "valueY", vy, true);
+        this._setXLocation(dataItem, vx);
+        this._positionBullets(dataItem);
+    }
+    _handleBulletDragStart(_event) {
+    }
+    _handleBulletDragStop(_event) {
+    }
+    _handlePointerOver() {
+    }
+    _handlePointerOut() {
+    }
+    enableDrawing() {
+        const chart = this.chart;
+        this._erasingEnabled = false;
+        this._drawingEnabled = true;
+        if (chart) {
+            if (!this._clickDp) {
+                this._clickDp = chart.plotContainer.events.on("click", (e) => {
+                    const originalEvent = e.originalEvent;
+                    if (!originalEvent.button && !this._erasingEnabled) {
+                        this._handlePointerClick(e);
+                    }
+                });
             }
-            if (this._downDp) {
-                this._downDp.dispose();
-                this._downDp = undefined;
+            if (!this._downDp) {
+                this._downDp = chart.plotContainer.events.on("pointerdown", (e) => {
+                    const originalEvent = e.originalEvent;
+                    if (!originalEvent.button && !this._erasingEnabled) {
+                        this._handlePointerDown(e);
+                    }
+                });
             }
-            if (this._upDp) {
-                this._upDp.dispose();
-                this._upDp = undefined;
+            if (!this._upDp) {
+                this._upDp = chart.plotContainer.events.on("globalpointerup", (e) => {
+                    const originalEvent = e.originalEvent;
+                    if (!originalEvent.button && !this._erasingEnabled) {
+                        this._handlePointerUp(e);
+                    }
+                });
             }
-            this._hideAllBullets();
-        }
-    });
-    Object.defineProperty(DrawingSeries.prototype, "_handlePointerMove", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function (event) {
-            var chart = this.chart;
-            if (chart) {
-                this._movePointerPoint = chart.plotContainer.toLocal(event.point);
+            if (!this._moveDp) {
+                this._moveDp = chart.plotContainer.events.on("globalpointermove", (e) => {
+                    if (!this._erasingEnabled) {
+                        this._handlePointerMove(e);
+                    }
+                });
             }
         }
-    });
-    Object.defineProperty(DrawingSeries.prototype, "_handlePointerDown", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function (_event) {
-            this._isPointerDown = true;
-        }
-    });
-    Object.defineProperty(DrawingSeries.prototype, "_handlePointerUp", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function (_event) {
-            this._isPointerDown = false;
-        }
-    });
-    Object.defineProperty(DrawingSeries.prototype, "startIndex", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function () {
-            return 0;
-        }
-    });
-    Object.defineProperty(DrawingSeries.prototype, "endIndex", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function () {
-            return this.dataItems.length;
-        }
-    });
-    Object.defineProperty(DrawingSeries.prototype, "_setXLocation", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function (dataItem, value) {
-            this._setXLocationReal(dataItem, value);
-        }
-    });
-    Object.defineProperty(DrawingSeries.prototype, "_setXLocationReal", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function (dataItem, value) {
-            var xAxis = this.get("xAxis");
-            var baseInterval = xAxis.getPrivate("baseInterval");
-            var root = this._root;
-            var firstDayOfWeek = root.locale.firstDayOfWeek;
-            var open = $time.round(new Date(value), baseInterval.timeUnit, baseInterval.count, firstDayOfWeek, root.utc).getTime();
-            var close = open + $time.getDuration(baseInterval.timeUnit, baseInterval.count * 1.05);
-            close = $time.round(new Date(close), baseInterval.timeUnit, baseInterval.count, firstDayOfWeek, root.utc).getTime();
-            var locationX = (value - open) / (close - open);
-            dataItem.set("locationX", locationX);
+    }
+    enableErasing() {
+        this._erasingEnabled = true;
+    }
+    disableErasing() {
+        this._erasingEnabled = false;
+    }
+    disableDrawing() {
+        this._erasingEnabled = false;
+        this._drawingEnabled = false;
+        this._isDrawing = false;
+        if (this._clickDp) {
+            this._clickDp.dispose();
+            this._clickDp = undefined;
+        }
+        if (this._downDp) {
+            this._downDp.dispose();
+            this._downDp = undefined;
+        }
+        if (this._upDp) {
+            this._upDp.dispose();
+            this._upDp = undefined;
+        }
+        this._hideAllBullets();
+    }
+    _handlePointerMove(event) {
+        const chart = this.chart;
+        if (chart) {
+            this._movePointerPoint = chart.plotContainer.toLocal(event.point);
         }
-    });
-    Object.defineProperty(DrawingSeries.prototype, "disposeDataItem", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function (dataItem) {
-            var _this = this;
-            _super.prototype.disposeDataItem.call(this, dataItem);
-            var dataContext = dataItem.dataContext;
-            if (dataContext) {
-                var index = dataContext.index;
-                this.markDirtyValues();
-                var dataItems = this._di[index];
-                if (dataItems) {
-                    $object.each(dataItems, function (_key, dataItem) {
-                        _super.prototype.disposeDataItem.call(_this, dataItem);
-                    });
-                }
+    }
+    _handlePointerDown(_event) {
+        this._isPointerDown = true;
+    }
+    _handlePointerUp(_event) {
+        this._isPointerDown = false;
+    }
+    startIndex() {
+        return 0;
+    }
+    endIndex() {
+        return this.dataItems.length;
+    }
+    _setXLocation(dataItem, value) {
+        this._setXLocationReal(dataItem, value);
+    }
+    _setXLocationReal(dataItem, value) {
+        const xAxis = this.get("xAxis");
+        const baseInterval = xAxis.getPrivate("baseInterval");
+        const root = this._root;
+        const firstDayOfWeek = root.locale.firstDayOfWeek;
+        const open = $time.round(new Date(value), baseInterval.timeUnit, baseInterval.count, firstDayOfWeek, root.utc).getTime();
+        let close = open + $time.getDuration(baseInterval.timeUnit, baseInterval.count * 1.05);
+        close = $time.round(new Date(close), baseInterval.timeUnit, baseInterval.count, firstDayOfWeek, root.utc).getTime();
+        const locationX = (value - open) / (close - open);
+        dataItem.set("locationX", locationX);
+    }
+    disposeDataItem(dataItem) {
+        super.disposeDataItem(dataItem);
+        const dataContext = dataItem.dataContext;
+        if (dataContext) {
+            const index = dataContext.index;
+            this.markDirtyValues();
+            const dataItems = this._di[index];
+            if (dataItems) {
+                $object.each(dataItems, (_key, dataItem) => {
+                    super.disposeDataItem(dataItem);
+                });
             }
+            delete this._di[index];
         }
-    });
-    Object.defineProperty(DrawingSeries.prototype, "_getYValue", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function (value) {
-            if (this.get("valueYShow") == "valueYChangeSelectionPercent") {
-                var baseValueSeries = this.getPrivate("baseValueSeries");
-                if (baseValueSeries) {
-                    var baseValue = baseValueSeries._getBase("valueY");
-                    value = value / 100 * baseValue + baseValue;
-                }
+    }
+    _getYValue(value) {
+        if (this.get("valueYShow") == "valueYChangeSelectionPercent") {
+            const baseValueSeries = this.getPrivate("baseValueSeries");
+            if (baseValueSeries) {
+                const baseValue = baseValueSeries._getBase("valueY");
+                value = value / 100 * baseValue + baseValue;
             }
-            return value;
         }
-    });
-    Object.defineProperty(DrawingSeries.prototype, "_getXValue", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function (value) {
-            var xAxis = this.get("xAxis");
-            var min = xAxis.getPrivate("min", 0) + 1;
-            var max = xAxis.getPrivate("max", 1) - 1;
-            return $math.fitToRange(value, min, max);
+        const yAxis = this.get("yAxis");
+        const roundTo = yAxis.getPrivate("stepDecimalPlaces", 0) + 1;
+        return $math.round(value, roundTo);
+    }
+    _getXValue(value) {
+        const xAxis = this.get("xAxis");
+        const min = xAxis.getPrivate("min", 0) + 1;
+        const max = xAxis.getPrivate("max", 1) - 1;
+        return Math.round($math.fitToRange(value, min, max));
+    }
+    _setContext(dataItem, key, value, working) {
+        dataItem.set(key, value);
+        if (working) {
+            dataItem.set(key + "Working", value);
+        }
+        const dataContext = dataItem.dataContext;
+        const field = this.get(key + "Field");
+        if (field) {
+            dataContext[field] = value;
         }
-    });
-    Object.defineProperty(DrawingSeries, "className", {
-        enumerable: true,
-        configurable: true,
-        writable: true,
-        value: "DrawingSeries"
-    });
-    Object.defineProperty(DrawingSeries, "classNames", {
-        enumerable: true,
-        configurable: true,
-        writable: true,
-        value: LineSeries.classNames.concat([DrawingSeries.className])
-    });
-    return DrawingSeries;
-}(LineSeries));
-export { DrawingSeries };
+    }
+}
+Object.defineProperty(DrawingSeries, "className", {
+    enumerable: true,
+    configurable: true,
+    writable: true,
+    value: "DrawingSeries"
+});
+Object.defineProperty(DrawingSeries, "classNames", {
+    enumerable: true,
+    configurable: true,
+    writable: true,
+    value: LineSeries.classNames.concat([DrawingSeries.className])
+});
 //# sourceMappingURL=DrawingSeries.js.map