@carbon/charts 0.41.20 → 0.41.24

package/components/axes/two-dimensional-axes.js.map

@@ -1 +1 @@
-{"version":3,"file":"two-dimensional-axes.js","sourceRoot":"","sources":["two-dimensional-axes.ts"],"names":[],"mappings":"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","sourcesContent":["// Internal Imports\nimport { Component } from \"../component\";\nimport { AxisPositions, ScaleTypes, AxesOptions } from \"../../interfaces\";\nimport { Axis } from \"./axis\";\nimport { Tools } from \"../../tools\";\nimport { DOMUtils } from \"../../services\";\nimport { Threshold } from \"../essentials/threshold\";\nimport { Events } from \"./../../interfaces\";\n\nexport class TwoDimensionalAxes extends Component {\n\ttype = \"2D-axes\";\n\n\tchildren: any = {};\n\n\tthresholds: Threshold[] = [];\n\n\tmargins = {\n\t\ttop: 0,\n\t\tright: 0,\n\t\tbottom: 0,\n\t\tleft: 0\n\t};\n\n\trender(animate = false) {\n\t\tconst axes = {};\n\t\tconst axisPositions = Object.keys(AxisPositions);\n\t\tconst axesOptions = Tools.getProperty(this.getOptions(), \"axes\");\n\n\t\taxisPositions.forEach((axisPosition) => {\n\t\t\tconst axisOptions = axesOptions[AxisPositions[axisPosition]];\n\t\t\tif (axisOptions) {\n\t\t\t\taxes[AxisPositions[axisPosition]] = true;\n\t\t\t}\n\t\t});\n\n\t\tthis.configs.axes = axes;\n\n\t\t// Check the configs to know which axes need to be rendered\n\t\taxisPositions.forEach((axisPositionKey) => {\n\t\t\tconst axisPosition = AxisPositions[axisPositionKey];\n\t\t\tif (\n\t\t\t\tthis.configs.axes[axisPosition] &&\n\t\t\t\t!this.children[axisPosition]\n\t\t\t) {\n\t\t\t\tconst axisComponent = new Axis(this.model, this.services, {\n\t\t\t\t\tposition: axisPosition,\n\t\t\t\t\taxes: this.configs.axes,\n\t\t\t\t\tmargins: this.margins\n\t\t\t\t});\n\n\t\t\t\t// Set model, services & parent for the new axis component\n\t\t\t\taxisComponent.setModel(this.model);\n\t\t\t\taxisComponent.setServices(this.services);\n\t\t\t\taxisComponent.setParent(this.parent);\n\n\t\t\t\tthis.children[axisPosition] = axisComponent;\n\t\t\t}\n\t\t});\n\n\t\tObject.keys(this.children).forEach((childKey) => {\n\t\t\tconst child = this.children[childKey];\n\t\t\tchild.render(animate);\n\t\t});\n\n\t\tconst margins = {} as any;\n\n\t\tObject.keys(this.children).forEach((childKey) => {\n\t\t\tconst child = this.children[childKey];\n\t\t\tconst axisPosition = child.configs.position;\n\n\t\t\t// Grab the invisibly rendered axis' width & height, and set margins\n\t\t\t// Based off of that\n\t\t\t// We draw the invisible axis because of the async nature of d3 transitions\n\t\t\t// To be able to tell the final width & height of the axis when initiaing the transition\n\t\t\t// The invisible axis is updated instantly and without a transition\n\t\t\tconst invisibleAxisRef = child.getInvisibleAxisRef();\n\t\t\tconst {\n\t\t\t\twidth,\n\t\t\t\theight\n\t\t\t} = DOMUtils.getSVGElementSize(invisibleAxisRef, { useBBox: true });\n\n\t\t\tlet offset;\n\t\t\tif (child.getTitleRef().empty()) {\n\t\t\t\toffset = 0;\n\t\t\t} else {\n\t\t\t\toffset = DOMUtils.getSVGElementSize(child.getTitleRef(), {\n\t\t\t\t\tuseBBox: true\n\t\t\t\t}).height;\n\n\t\t\t\tif (\n\t\t\t\t\taxisPosition === AxisPositions.LEFT ||\n\t\t\t\t\taxisPosition === AxisPositions.RIGHT\n\t\t\t\t) {\n\t\t\t\t\toffset += 5;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tswitch (axisPosition) {\n\t\t\t\tcase AxisPositions.TOP:\n\t\t\t\t\tmargins.top = height + offset;\n\t\t\t\t\tbreak;\n\t\t\t\tcase AxisPositions.BOTTOM:\n\t\t\t\t\tmargins.bottom = height + offset;\n\t\t\t\t\tbreak;\n\t\t\t\tcase AxisPositions.LEFT:\n\t\t\t\t\tmargins.left = width + offset;\n\t\t\t\t\tbreak;\n\t\t\t\tcase AxisPositions.RIGHT:\n\t\t\t\t\tmargins.right = width + offset;\n\t\t\t\t\tbreak;\n\t\t\t}\n\n\t\t\t// Add thresholds\n\t\t\tthis.addAxisThresholds(animate, axisPosition);\n\t\t});\n\n\t\t// If the new margins are different than the existing ones\n\t\tconst isNotEqual = Object.keys(margins).some((marginKey) => {\n\t\t\treturn this.margins[marginKey] !== margins[marginKey];\n\t\t});\n\n\t\tif (isNotEqual) {\n\t\t\tthis.margins = Object.assign(this.margins, margins);\n\n\t\t\t// also set new margins to model to allow external components to access\n\t\t\tthis.model.set({ axesMargins: this.margins }, { skipUpdate: true });\n\t\t\tthis.services.events.dispatchEvent(Events.ZoomBar.UPDATE);\n\n\t\t\tObject.keys(this.children).forEach((childKey) => {\n\t\t\t\tconst child = this.children[childKey];\n\t\t\t\tchild.margins = this.margins;\n\t\t\t});\n\n\t\t\tthis.render(true);\n\t\t}\n\t}\n\n\taddAxisThresholds(animate, axisPosition) {\n\t\tconst axesOptions = Tools.getProperty(\n\t\t\tthis.getOptions(),\n\t\t\t\"axes\",\n\t\t\taxisPosition\n\t\t);\n\t\tconst { thresholds } = axesOptions;\n\n\t\tif (thresholds) {\n\t\t\tthresholds.forEach((thresholdConfig, i) => {\n\t\t\t\tconst thresholdComponent = new Threshold(\n\t\t\t\t\tthis.model,\n\t\t\t\t\tthis.services,\n\t\t\t\t\t{ ...thresholdConfig, axisPosition, index: i }\n\t\t\t\t);\n\t\t\t\tthis.thresholds.push(thresholdComponent);\n\t\t\t});\n\n\t\t\tthis.thresholds.forEach((threshold) => {\n\t\t\t\tthreshold.setParent(this.parent);\n\t\t\t\tthreshold.render(animate);\n\t\t\t});\n\t\t}\n\t}\n}\n"]}
+{"version":3,"file":"two-dimensional-axes.js","sourceRoot":"","sources":["two-dimensional-axes.ts"],"names":[],"mappings":"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","sourcesContent":["// Internal Imports\nimport { Component } from '../component';\nimport { AxisPositions, ScaleTypes, AxesOptions } from '../../interfaces';\nimport { Axis } from './axis';\nimport { Tools } from '../../tools';\nimport { DOMUtils } from '../../services';\nimport { Threshold } from '../essentials/threshold';\nimport { Events } from './../../interfaces';\n\nexport class TwoDimensionalAxes extends Component {\n\ttype = '2D-axes';\n\n\tchildren: any = {};\n\n\tthresholds: Threshold[] = [];\n\n\tmargins = {\n\t\ttop: 0,\n\t\tright: 0,\n\t\tbottom: 0,\n\t\tleft: 0,\n\t};\n\n\trender(animate = false) {\n\t\tconst axes = {};\n\t\tconst axisPositions = Object.keys(AxisPositions);\n\t\tconst axesOptions = Tools.getProperty(this.getOptions(), 'axes');\n\n\t\taxisPositions.forEach((axisPosition) => {\n\t\t\tconst axisOptions = axesOptions[AxisPositions[axisPosition]];\n\t\t\tif (axisOptions) {\n\t\t\t\taxes[AxisPositions[axisPosition]] = true;\n\t\t\t}\n\t\t});\n\n\t\tthis.configs.axes = axes;\n\n\t\t// Check the configs to know which axes need to be rendered\n\t\taxisPositions.forEach((axisPositionKey) => {\n\t\t\tconst axisPosition = AxisPositions[axisPositionKey];\n\t\t\tif (\n\t\t\t\tthis.configs.axes[axisPosition] &&\n\t\t\t\t!this.children[axisPosition]\n\t\t\t) {\n\t\t\t\tconst axisComponent = new Axis(this.model, this.services, {\n\t\t\t\t\tposition: axisPosition,\n\t\t\t\t\taxes: this.configs.axes,\n\t\t\t\t\tmargins: this.margins,\n\t\t\t\t});\n\n\t\t\t\t// Set model, services & parent for the new axis component\n\t\t\t\taxisComponent.setModel(this.model);\n\t\t\t\taxisComponent.setServices(this.services);\n\t\t\t\taxisComponent.setParent(this.parent);\n\n\t\t\t\tthis.children[axisPosition] = axisComponent;\n\t\t\t}\n\t\t});\n\n\t\tObject.keys(this.children).forEach((childKey) => {\n\t\t\tconst child = this.children[childKey];\n\t\t\tchild.render(animate);\n\t\t});\n\n\t\tconst margins = {} as any;\n\n\t\tObject.keys(this.children).forEach((childKey) => {\n\t\t\tconst child = this.children[childKey];\n\t\t\tconst axisPosition = child.configs.position;\n\n\t\t\t// Grab the invisibly rendered axis' width & height, and set margins\n\t\t\t// Based off of that\n\t\t\t// We draw the invisible axis because of the async nature of d3 transitions\n\t\t\t// To be able to tell the final width & height of the axis when initiaing the transition\n\t\t\t// The invisible axis is updated instantly and without a transition\n\t\t\tconst invisibleAxisRef = child.getInvisibleAxisRef();\n\t\t\tconst {\n\t\t\t\twidth,\n\t\t\t\theight,\n\t\t\t} = DOMUtils.getSVGElementSize(invisibleAxisRef, { useBBox: true });\n\n\t\t\tlet offset;\n\t\t\tif (child.getTitleRef().empty()) {\n\t\t\t\toffset = 0;\n\t\t\t} else {\n\t\t\t\toffset = DOMUtils.getSVGElementSize(child.getTitleRef(), {\n\t\t\t\t\tuseBBox: true,\n\t\t\t\t}).height;\n\n\t\t\t\tif (\n\t\t\t\t\taxisPosition === AxisPositions.LEFT ||\n\t\t\t\t\taxisPosition === AxisPositions.RIGHT\n\t\t\t\t) {\n\t\t\t\t\toffset += 5;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tswitch (axisPosition) {\n\t\t\t\tcase AxisPositions.TOP:\n\t\t\t\t\tmargins.top = height + offset;\n\t\t\t\t\tbreak;\n\t\t\t\tcase AxisPositions.BOTTOM:\n\t\t\t\t\tmargins.bottom = height + offset;\n\t\t\t\t\tbreak;\n\t\t\t\tcase AxisPositions.LEFT:\n\t\t\t\t\tmargins.left = width + offset;\n\t\t\t\t\tbreak;\n\t\t\t\tcase AxisPositions.RIGHT:\n\t\t\t\t\tmargins.right = width + offset;\n\t\t\t\t\tbreak;\n\t\t\t}\n\n\t\t\t// Add thresholds\n\t\t\tthis.addAxisThresholds(animate, axisPosition);\n\t\t});\n\n\t\t// If the new margins are different than the existing ones\n\t\tconst isNotEqual = Object.keys(margins).some((marginKey) => {\n\t\t\treturn this.margins[marginKey] !== margins[marginKey];\n\t\t});\n\n\t\tif (isNotEqual) {\n\t\t\tthis.margins = Object.assign(this.margins, margins);\n\n\t\t\t// also set new margins to model to allow external components to access\n\t\t\tthis.model.set({ axesMargins: this.margins }, { skipUpdate: true });\n\t\t\tthis.services.events.dispatchEvent(Events.ZoomBar.UPDATE);\n\n\t\t\tObject.keys(this.children).forEach((childKey) => {\n\t\t\t\tconst child = this.children[childKey];\n\t\t\t\tchild.margins = this.margins;\n\t\t\t});\n\n\t\t\tthis.render(true);\n\t\t}\n\t}\n\n\taddAxisThresholds(animate, axisPosition) {\n\t\tconst axesOptions = Tools.getProperty(\n\t\t\tthis.getOptions(),\n\t\t\t'axes',\n\t\t\taxisPosition\n\t\t);\n\t\tconst { thresholds } = axesOptions;\n\n\t\tif (thresholds) {\n\t\t\tthresholds.forEach((thresholdConfig, i) => {\n\t\t\t\tconst thresholdComponent = new Threshold(\n\t\t\t\t\tthis.model,\n\t\t\t\t\tthis.services,\n\t\t\t\t\t{ ...thresholdConfig, axisPosition, index: i }\n\t\t\t\t);\n\t\t\t\tthis.thresholds.push(thresholdComponent);\n\t\t\t});\n\n\t\t\tthis.thresholds.forEach((threshold) => {\n\t\t\t\tthreshold.setParent(this.parent);\n\t\t\t\tthreshold.render(animate);\n\t\t\t});\n\t\t}\n\t}\n}\n"]}

package/components/axes/zero-line.d.ts

@@ -1,4 +1,4 @@
-import { Component } from "../component";
+import { Component } from '../component';
 export declare class ZeroLine extends Component {
     type: string;
     render(animate: boolean): void;

package/components/axes/zero-line.js

@@ -12,14 +12,14 @@ var __extends = (this && this.__extends) || (function () {
     };
 })();
 // Internal Imports
-import { Component } from "../component";
-import { DOMUtils } from "../../services";
-import { Tools } from "../../tools";
+import { Component } from '../component';
+import { DOMUtils } from '../../services';
+import { Tools } from '../../tools';
 var ZeroLine = /** @class */ (function (_super) {
     __extends(ZeroLine, _super);
     function ZeroLine() {
         var _this = _super !== null && _super.apply(this, arguments) || this;
-        _this.type = "zero-line";
+        _this.type = 'zero-line';
         return _this;
     }
     ZeroLine.prototype.render = function (animate) {
@@ -35,7 +35,7 @@ var ZeroLine = /** @class */ (function (_super) {
         // previously had a domain that went into negatives
         if (!drawZeroLine) {
             // otherwise if a chart draws a zero line and then the domain change the zero line is still in the DOM
-            svg.selectAll("line.domain").remove();
+            svg.selectAll('line.domain').remove();
             return;
         }
         // Get x & y position of the line
@@ -51,14 +51,14 @@ var ZeroLine = /** @class */ (function (_super) {
             x0: x0,
             x1: x1,
             y0: yPosition,
-            y1: yPosition
+            y1: yPosition,
         }, this.services.cartesianScales.getOrientation());
-        var line = DOMUtils.appendOrSelect(svg, "line.domain");
-        line.transition(this.services.transitions.getTransition("zero-line-update", animate))
-            .attr("y1", lineCoordinates.y0)
-            .attr("y2", lineCoordinates.y1)
-            .attr("x1", lineCoordinates.x0)
-            .attr("x2", lineCoordinates.x1);
+        var line = DOMUtils.appendOrSelect(svg, 'line.domain');
+        line.transition(this.services.transitions.getTransition('zero-line-update', animate))
+            .attr('y1', lineCoordinates.y0)
+            .attr('y2', lineCoordinates.y1)
+            .attr('x1', lineCoordinates.x0)
+            .attr('x2', lineCoordinates.x1);
     };
     return ZeroLine;
 }(Component));

package/components/axes/zero-line.js.map

@@ -1 +1 @@
-{"version":3,"file":"zero-line.js","sourceRoot":"","sources":["zero-line.ts"],"names":[],"mappings":";;;;;;;;;;;;;AAAA,mBAAmB;AACnB,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAEpC;IAA8B,4BAAS;IAAvC;QAAA,qEA0DC;QAzDA,UAAI,GAAG,WAAW,CAAC;;IAyDpB,CAAC;IAvDA,yBAAM,GAAN,UAAO,OAAgB;QACtB,IAAM,YAAY,GAAG,IAAI,CAAC,QAAQ,CAAC,eAAe,CAAC,oBAAoB,CACtE,EAAE,MAAM,EAAE,IAAI,CAAC,OAAO,CAAC,MAAM,EAAE,CAC/B,CAAC;QACF,IAAM,UAAU,GAAG,IAAI,CAAC,QAAQ,CAAC,eAAe,CAAC,kBAAkB,CAClE,YAAY,CACZ,CAAC;QACF,mBAAmB;QACb,IAAA,wBAAsD,EAArD,sBAAc,EAAE,sBAAqC,CAAC;QAE7D,IAAM,YAAY,GACjB,CAAC,cAAc,GAAG,CAAC,IAAI,cAAc,GAAG,CAAC,CAAC;YAC1C,CAAC,cAAc,GAAG,CAAC,IAAI,cAAc,GAAG,CAAC,CAAC,CAAC;QAE5C,qBAAqB;QACrB,IAAM,GAAG,GAAG,IAAI,CAAC,eAAe,EAAE,CAAC;QAEnC,6FAA6F;QAC7F,mDAAmD;QACnD,IAAI,CAAC,YAAY,EAAE;YAClB,sGAAsG;YACtG,GAAG,CAAC,SAAS,CAAC,aAAa,CAAC,CAAC,MAAM,EAAE,CAAC;YACtC,OAAO;SACP;QAED,iCAAiC;QAC3B,IAAA,2DAAiE,EAAhE,UAAE,EAAE,UAA4D,CAAC;QACxE,IAAI,SAAS,GAAG,CAAC,UAAU,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC;QAErC,oEAAoE;QACpE,uEAAuE;QACvE,4DAA4D;QAC5D,IAAI,CAAC,SAAS,EAAE;YACf,SAAS,GAAG,UAAU,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC,CAAC;SAClC;QAED,IAAM,eAAe,GAAG,KAAK,CAAC,oCAAoC,CACjE;YACC,EAAE,IAAA;YACF,EAAE,IAAA;YACF,EAAE,EAAE,SAAS;YACb,EAAE,EAAE,SAAS;SACb,EACD,IAAI,CAAC,QAAQ,CAAC,eAAe,CAAC,cAAc,EAAE,CAC9C,CAAC;QAEF,IAAM,IAAI,GAAG,QAAQ,CAAC,cAAc,CAAC,GAAG,EAAE,aAAa,CAAC,CAAC;QACzD,IAAI,CAAC,UAAU,CACd,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,aAAa,CAAC,kBAAkB,EAAE,OAAO,CAAC,CACpE;aACC,IAAI,CAAC,IAAI,EAAE,eAAe,CAAC,EAAE,CAAC;aAC9B,IAAI,CAAC,IAAI,EAAE,eAAe,CAAC,EAAE,CAAC;aAC9B,IAAI,CAAC,IAAI,EAAE,eAAe,CAAC,EAAE,CAAC;aAC9B,IAAI,CAAC,IAAI,EAAE,eAAe,CAAC,EAAE,CAAC,CAAC;IAClC,CAAC;IACF,eAAC;AAAD,CAAC,AA1DD,CAA8B,SAAS,GA0DtC","sourcesContent":["// Internal Imports\nimport { Component } from \"../component\";\nimport { DOMUtils } from \"../../services\";\nimport { Tools } from \"../../tools\";\n\nexport class ZeroLine extends Component {\n\ttype = \"zero-line\";\n\n\trender(animate: boolean) {\n\t\tconst axisPosition = this.services.cartesianScales.getRangeAxisPosition(\n\t\t\t{ groups: this.configs.groups }\n\t\t);\n\t\tconst rangeScale = this.services.cartesianScales.getScaleByPosition(\n\t\t\taxisPosition\n\t\t);\n\t\t// check the domain\n\t\tconst [minDomainValue, maxDomainValue] = rangeScale.domain();\n\n\t\tconst drawZeroLine =\n\t\t\t(minDomainValue > 0 && maxDomainValue < 0) ||\n\t\t\t(minDomainValue < 0 && maxDomainValue > 0);\n\n\t\t// Grab container SVG\n\t\tconst svg = this.getContainerSVG();\n\n\t\t// show zero line only if is necessary, otherwise make sure tto remove zero line if the chart\n\t\t// previously had a domain that went into negatives\n\t\tif (!drawZeroLine) {\n\t\t\t// otherwise if a chart draws a zero line and then the domain change the zero line is still in the DOM\n\t\t\tsvg.selectAll(\"line.domain\").remove();\n\t\t\treturn;\n\t\t}\n\n\t\t// Get x & y position of the line\n\t\tconst [x0, x1] = this.services.cartesianScales.getDomainScale().range();\n\t\tlet yPosition = +rangeScale(0) + 0.5;\n\n\t\t// if scale domain contains NaN, return the first value of the range\n\t\t// this is necessary for the zero line y position that otherwise is NaN\n\t\t// so on the top of the chart while we want it on the bottom\n\t\tif (!yPosition) {\n\t\t\tyPosition = rangeScale.range()[0];\n\t\t}\n\n\t\tconst lineCoordinates = Tools.flipSVGCoordinatesBasedOnOrientation(\n\t\t\t{\n\t\t\t\tx0,\n\t\t\t\tx1,\n\t\t\t\ty0: yPosition,\n\t\t\t\ty1: yPosition\n\t\t\t},\n\t\t\tthis.services.cartesianScales.getOrientation()\n\t\t);\n\n\t\tconst line = DOMUtils.appendOrSelect(svg, \"line.domain\");\n\t\tline.transition(\n\t\t\tthis.services.transitions.getTransition(\"zero-line-update\", animate)\n\t\t)\n\t\t\t.attr(\"y1\", lineCoordinates.y0)\n\t\t\t.attr(\"y2\", lineCoordinates.y1)\n\t\t\t.attr(\"x1\", lineCoordinates.x0)\n\t\t\t.attr(\"x2\", lineCoordinates.x1);\n\t}\n}\n"]}
+{"version":3,"file":"zero-line.js","sourceRoot":"","sources":["zero-line.ts"],"names":[],"mappings":";;;;;;;;;;;;;AAAA,mBAAmB;AACnB,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAEpC;IAA8B,4BAAS;IAAvC;QAAA,qEA0DC;QAzDA,UAAI,GAAG,WAAW,CAAC;;IAyDpB,CAAC;IAvDA,yBAAM,GAAN,UAAO,OAAgB;QACtB,IAAM,YAAY,GAAG,IAAI,CAAC,QAAQ,CAAC,eAAe,CAAC,oBAAoB,CACtE,EAAE,MAAM,EAAE,IAAI,CAAC,OAAO,CAAC,MAAM,EAAE,CAC/B,CAAC;QACF,IAAM,UAAU,GAAG,IAAI,CAAC,QAAQ,CAAC,eAAe,CAAC,kBAAkB,CAClE,YAAY,CACZ,CAAC;QACF,mBAAmB;QACb,IAAA,wBAAsD,EAArD,sBAAc,EAAE,sBAAqC,CAAC;QAE7D,IAAM,YAAY,GACjB,CAAC,cAAc,GAAG,CAAC,IAAI,cAAc,GAAG,CAAC,CAAC;YAC1C,CAAC,cAAc,GAAG,CAAC,IAAI,cAAc,GAAG,CAAC,CAAC,CAAC;QAE5C,qBAAqB;QACrB,IAAM,GAAG,GAAG,IAAI,CAAC,eAAe,EAAE,CAAC;QAEnC,6FAA6F;QAC7F,mDAAmD;QACnD,IAAI,CAAC,YAAY,EAAE;YAClB,sGAAsG;YACtG,GAAG,CAAC,SAAS,CAAC,aAAa,CAAC,CAAC,MAAM,EAAE,CAAC;YACtC,OAAO;SACP;QAED,iCAAiC;QAC3B,IAAA,2DAAiE,EAAhE,UAAE,EAAE,UAA4D,CAAC;QACxE,IAAI,SAAS,GAAG,CAAC,UAAU,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC;QAErC,oEAAoE;QACpE,uEAAuE;QACvE,4DAA4D;QAC5D,IAAI,CAAC,SAAS,EAAE;YACf,SAAS,GAAG,UAAU,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC,CAAC;SAClC;QAED,IAAM,eAAe,GAAG,KAAK,CAAC,oCAAoC,CACjE;YACC,EAAE,IAAA;YACF,EAAE,IAAA;YACF,EAAE,EAAE,SAAS;YACb,EAAE,EAAE,SAAS;SACb,EACD,IAAI,CAAC,QAAQ,CAAC,eAAe,CAAC,cAAc,EAAE,CAC9C,CAAC;QAEF,IAAM,IAAI,GAAG,QAAQ,CAAC,cAAc,CAAC,GAAG,EAAE,aAAa,CAAC,CAAC;QACzD,IAAI,CAAC,UAAU,CACd,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,aAAa,CAAC,kBAAkB,EAAE,OAAO,CAAC,CACpE;aACC,IAAI,CAAC,IAAI,EAAE,eAAe,CAAC,EAAE,CAAC;aAC9B,IAAI,CAAC,IAAI,EAAE,eAAe,CAAC,EAAE,CAAC;aAC9B,IAAI,CAAC,IAAI,EAAE,eAAe,CAAC,EAAE,CAAC;aAC9B,IAAI,CAAC,IAAI,EAAE,eAAe,CAAC,EAAE,CAAC,CAAC;IAClC,CAAC;IACF,eAAC;AAAD,CAAC,AA1DD,CAA8B,SAAS,GA0DtC","sourcesContent":["// Internal Imports\nimport { Component } from '../component';\nimport { DOMUtils } from '../../services';\nimport { Tools } from '../../tools';\n\nexport class ZeroLine extends Component {\n\ttype = 'zero-line';\n\n\trender(animate: boolean) {\n\t\tconst axisPosition = this.services.cartesianScales.getRangeAxisPosition(\n\t\t\t{ groups: this.configs.groups }\n\t\t);\n\t\tconst rangeScale = this.services.cartesianScales.getScaleByPosition(\n\t\t\taxisPosition\n\t\t);\n\t\t// check the domain\n\t\tconst [minDomainValue, maxDomainValue] = rangeScale.domain();\n\n\t\tconst drawZeroLine =\n\t\t\t(minDomainValue > 0 && maxDomainValue < 0) ||\n\t\t\t(minDomainValue < 0 && maxDomainValue > 0);\n\n\t\t// Grab container SVG\n\t\tconst svg = this.getContainerSVG();\n\n\t\t// show zero line only if is necessary, otherwise make sure tto remove zero line if the chart\n\t\t// previously had a domain that went into negatives\n\t\tif (!drawZeroLine) {\n\t\t\t// otherwise if a chart draws a zero line and then the domain change the zero line is still in the DOM\n\t\t\tsvg.selectAll('line.domain').remove();\n\t\t\treturn;\n\t\t}\n\n\t\t// Get x & y position of the line\n\t\tconst [x0, x1] = this.services.cartesianScales.getDomainScale().range();\n\t\tlet yPosition = +rangeScale(0) + 0.5;\n\n\t\t// if scale domain contains NaN, return the first value of the range\n\t\t// this is necessary for the zero line y position that otherwise is NaN\n\t\t// so on the top of the chart while we want it on the bottom\n\t\tif (!yPosition) {\n\t\t\tyPosition = rangeScale.range()[0];\n\t\t}\n\n\t\tconst lineCoordinates = Tools.flipSVGCoordinatesBasedOnOrientation(\n\t\t\t{\n\t\t\t\tx0,\n\t\t\t\tx1,\n\t\t\t\ty0: yPosition,\n\t\t\t\ty1: yPosition,\n\t\t\t},\n\t\t\tthis.services.cartesianScales.getOrientation()\n\t\t);\n\n\t\tconst line = DOMUtils.appendOrSelect(svg, 'line.domain');\n\t\tline.transition(\n\t\t\tthis.services.transitions.getTransition('zero-line-update', animate)\n\t\t)\n\t\t\t.attr('y1', lineCoordinates.y0)\n\t\t\t.attr('y2', lineCoordinates.y1)\n\t\t\t.attr('x1', lineCoordinates.x0)\n\t\t\t.attr('x2', lineCoordinates.x1);\n\t}\n}\n"]}

package/components/axes/zoom-bar.d.ts

@@ -1,5 +1,5 @@
-import { Component } from "../component";
-import { ChartModelCartesian } from "../../model-cartesian-charts";
+import { Component } from '../component';
+import { ChartModelCartesian } from '../../model-cartesian-charts';
 export declare class ZoomBar extends Component {
     type: string;
     MIN_SELECTION_DIFF: number;

package/components/axes/zoom-bar.js

@@ -12,37 +12,37 @@ var __extends = (this && this.__extends) || (function () {
     };
 })();
 // Internal Imports
-import { Component } from "../component";
-import { Tools } from "../../tools";
-import { AxisPositions, Events, ScaleTypes, ZoomBarTypes } from "../../interfaces";
-import { DOMUtils } from "../../services";
-import * as Configuration from "../../configuration";
+import { Component } from '../component';
+import { Tools } from '../../tools';
+import { AxisPositions, Events, ScaleTypes, ZoomBarTypes, } from '../../interfaces';
+import { DOMUtils } from '../../services';
+import * as Configuration from '../../configuration';
 // D3 Imports
-import { extent } from "d3-array";
-import { brushX } from "d3-brush";
-import { area, line } from "d3-shape";
-import { event } from "d3-selection";
+import { extent } from 'd3-array';
+import { brushX } from 'd3-brush';
+import { area, line } from 'd3-shape';
+import { event } from 'd3-selection';
 var ZoomBar = /** @class */ (function (_super) {
     __extends(ZoomBar, _super);
     function ZoomBar() {
         var _this = _super !== null && _super.apply(this, arguments) || this;
-        _this.type = "zoom-bar";
+        _this.type = 'zoom-bar';
         // The minimum selection x range to trigger handler update
         // Smaller number may introduce a handler flash during initialization
         // Bigger number may not trigger handler update while selection area on chart is very small
         _this.MIN_SELECTION_DIFF = 9e-10;
         // needs to match the style in _zoom-bar.scss
-        _this.brushSelector = "g.zoom-bar-brush";
+        _this.brushSelector = 'g.zoom-bar-brush';
         // Give every zoomBarClip a distinct ID
         // so they don't interfere the other zoom bars in a page
-        _this.clipId = "zoomBarClip-" + Math.floor(Math.random() * 99999999999);
+        _this.clipId = 'zoomBarClip-' + Math.floor(Math.random() * 99999999999);
         _this.brush = brushX();
         return _this;
     }
     ZoomBar.prototype.init = function () {
         this.services.events.addEventListener(Events.ZoomBar.UPDATE, this.render.bind(this));
         // check if pre-defined zoom bar data exists
-        var definedZoomBarData = Tools.getProperty(this.getOptions(), "zoomBar", AxisPositions.TOP, "data");
+        var definedZoomBarData = Tools.getProperty(this.getOptions(), 'zoomBar', AxisPositions.TOP, 'data');
         // load up the zoomBarData into this model
         this.model.setZoomBarData(definedZoomBarData);
     };
@@ -52,10 +52,10 @@ var ZoomBar = /** @class */ (function (_super) {
         var svg = this.getContainerSVG();
         var isTopZoomBarLoading = this.services.zoom.isZoomBarLoading(AxisPositions.TOP);
         var isTopZoomBarLocked = this.services.zoom.isZoomBarLocked(AxisPositions.TOP);
-        var zoombarType = Tools.getProperty(this.getOptions(), "zoomBar", AxisPositions.TOP, "type");
+        var zoombarType = Tools.getProperty(this.getOptions(), 'zoomBar', AxisPositions.TOP, 'type');
         var zoombarHeight = Configuration.zoomBar.height[zoombarType];
         var width = DOMUtils.getSVGElementSize(this.parent, {
-            useAttrs: true
+            useAttrs: true,
         }).width;
         // initialization is not completed yet
         if (width === 0) {
@@ -63,38 +63,38 @@ var ZoomBar = /** @class */ (function (_super) {
         }
         // get axes margins
         var axesLeftMargin = 0;
-        var axesMargins = this.model.get("axesMargins");
+        var axesMargins = this.model.get('axesMargins');
         if (axesMargins && axesMargins.left) {
             axesLeftMargin = axesMargins.left;
         }
-        var container = DOMUtils.appendOrSelect(svg, "svg.zoom-container")
-            .attr("width", "100%")
-            .attr("height", zoombarHeight)
-            .attr("opacity", 1);
-        var spacer = DOMUtils.appendOrSelect(svg, "rect.zoom-spacer")
-            .attr("x", 0)
-            .attr("y", zoombarHeight)
-            .attr("width", "100%")
-            .attr("height", Configuration.zoomBar.spacerHeight)
-            .attr("opacity", 1)
-            .attr("fill", "none");
+        var container = DOMUtils.appendOrSelect(svg, 'svg.zoom-container')
+            .attr('width', '100%')
+            .attr('height', zoombarHeight)
+            .attr('opacity', 1);
+        var spacer = DOMUtils.appendOrSelect(svg, 'rect.zoom-spacer')
+            .attr('x', 0)
+            .attr('y', zoombarHeight)
+            .attr('width', '100%')
+            .attr('height', Configuration.zoomBar.spacerHeight)
+            .attr('opacity', 1)
+            .attr('fill', 'none');
         if (zoombarType === ZoomBarTypes.GRAPH_VIEW) {
             // Draw zoombar background rectangle
-            DOMUtils.appendOrSelect(container, "rect.zoom-bg")
-                .attr("x", axesLeftMargin)
-                .attr("y", 0)
-                .attr("width", width - axesLeftMargin)
-                .attr("height", "100%")
-                .classed("zoom-bg-skeleton", isTopZoomBarLoading);
+            DOMUtils.appendOrSelect(container, 'rect.zoom-bg')
+                .attr('x', axesLeftMargin)
+                .attr('y', 0)
+                .attr('width', width - axesLeftMargin)
+                .attr('height', '100%')
+                .classed('zoom-bg-skeleton', isTopZoomBarLoading);
         }
         else if (zoombarType === ZoomBarTypes.SLIDER_VIEW) {
             // Draw zoombar background line
-            DOMUtils.appendOrSelect(container, "rect.zoom-slider-bg")
-                .attr("x", axesLeftMargin)
-                .attr("y", zoombarHeight / 2 - 1)
-                .attr("width", width - axesLeftMargin)
-                .attr("height", 2)
-                .classed("zoom-slider-bg-skeleton", isTopZoomBarLoading);
+            DOMUtils.appendOrSelect(container, 'rect.zoom-slider-bg')
+                .attr('x', axesLeftMargin)
+                .attr('y', zoombarHeight / 2 - 1)
+                .attr('width', width - axesLeftMargin)
+                .attr('height', 2)
+                .classed('zoom-slider-bg-skeleton', isTopZoomBarLoading);
         }
         if (isTopZoomBarLoading) {
             this.renderSkeleton(container, axesLeftMargin, width);
@@ -116,9 +116,9 @@ var ZoomBar = /** @class */ (function (_super) {
             // add value 0 to the extended domain for zoom bar area graph
             zoomBarData = this.compensateDataForDefaultDomain(zoomBarData, defaultDomain);
             // get old initialZoomDomain from model
-            var oldInitialZoomDomain = this.model.get("initialZoomDomain");
+            var oldInitialZoomDomain = this.model.get('initialZoomDomain');
             // get new initialZoomDomain from option
-            var newInitialZoomDomain = Tools.getProperty(this.getOptions(), "zoomBar", AxisPositions.TOP, "initialZoomDomain");
+            var newInitialZoomDomain = Tools.getProperty(this.getOptions(), 'zoomBar', AxisPositions.TOP, 'initialZoomDomain');
             // change string date to Date object if necessary
             if (newInitialZoomDomain &&
                 newInitialZoomDomain[0] &&
@@ -139,7 +139,7 @@ var ZoomBar = /** @class */ (function (_super) {
                     initialZoomDomain: newInitialZoomDomain,
                     zoomDomain: newInitialZoomDomain
                         ? newInitialZoomDomain
-                        : defaultDomain
+                        : defaultDomain,
                 }, { skipUpdate: true });
             }
             this.xScale.range([axesLeftMargin, width]).domain(defaultDomain);
@@ -148,11 +148,11 @@ var ZoomBar = /** @class */ (function (_super) {
             this.yScale
                 .range([0, zoombarHeight - 6])
                 .domain(extent(zoomBarData, function (d) { return d.value; }));
-            var zoomDomain = this.model.get("zoomDomain");
+            var zoomDomain = this.model.get('zoomDomain');
             if (zoombarType === ZoomBarTypes.GRAPH_VIEW) {
-                this.renderZoomBarArea(container, "path.zoom-graph-area-unselected", zoomBarData, null);
+                this.renderZoomBarArea(container, 'path.zoom-graph-area-unselected', zoomBarData, null);
                 this.updateClipPath(svg, this.clipId, 0, 0, 0, 0);
-                this.renderZoomBarArea(container, "path.zoom-graph-area", zoomBarData, this.clipId);
+                this.renderZoomBarArea(container, 'path.zoom-graph-area', zoomBarData, this.clipId);
                 // Draw the zoom bar base line
                 this.renderZoomBarBaseline(container, axesLeftMargin, width);
             }
@@ -186,7 +186,7 @@ var ZoomBar = /** @class */ (function (_super) {
                     return false;
                 });
                 // reset all cursor to auto
-                brushArea.selectAll("rect").attr("cursor", "auto");
+                brushArea.selectAll('rect').attr('cursor', 'auto');
             }
         }
     };
@@ -206,34 +206,34 @@ var ZoomBar = /** @class */ (function (_super) {
                 _this.handleBrushedEvent(zoomDomain, _this.xScale, selection);
             }
         };
-        var zoombarType = Tools.getProperty(this.getOptions(), "zoomBar", AxisPositions.TOP, "type");
+        var zoombarType = Tools.getProperty(this.getOptions(), 'zoomBar', AxisPositions.TOP, 'type');
         var zoombarHeight = Configuration.zoomBar.height[zoombarType];
         // Initialize the d3 brush
         this.brush
             .extent([
             [axesLeftMargin, 0],
-            [width, zoombarHeight]
+            [width, zoombarHeight],
         ])
-            .on("start brush end", null) // remove old listener first
-            .on("start brush end", brushEventListener);
+            .on('start brush end', null) // remove old listener first
+            .on('start brush end', brushEventListener);
     };
     // brush event listener
     ZoomBar.prototype.handleBrushedEvent = function (zoomDomain, scale, selection) {
         var newDomain = [
             scale.invert(selection[0]),
-            scale.invert(selection[1])
+            scale.invert(selection[1]),
         ];
         // update brush handle position
         this.updateBrushHandle(this.getContainerSVG(), selection, newDomain);
         // be aware that the value of d3.event changes during an event!
         // update zoomDomain only if the event comes from mouse/touch event
         if (event.sourceEvent != null &&
-            (event.sourceEvent.type === "mousemove" ||
-                event.sourceEvent.type === "mouseup" ||
-                event.sourceEvent.type === "mousedown" ||
-                event.sourceEvent.type === "touchstart" ||
-                event.sourceEvent.type === "touchmove" ||
-                event.sourceEvent.type === "touchend")) {
+            (event.sourceEvent.type === 'mousemove' ||
+                event.sourceEvent.type === 'mouseup' ||
+                event.sourceEvent.type === 'mousedown' ||
+                event.sourceEvent.type === 'touchstart' ||
+                event.sourceEvent.type === 'touchmove' ||
+                event.sourceEvent.type === 'touchend')) {
             // only if zoomDomain is never set or needs update
             if (zoomDomain === undefined ||
                 zoomDomain[0] !== newDomain[0] ||
@@ -241,34 +241,34 @@ var ZoomBar = /** @class */ (function (_super) {
                 // don't dispatch event for all event types
                 // let the following code to dispatch necessary events
                 this.services.zoom.handleDomainChange(newDomain, {
-                    dispatchEvent: false
+                    dispatchEvent: false,
                 });
             }
             // dispatch selection events
             var zoomBarEventType = void 0;
-            if (event.type === "start") {
+            if (event.type === 'start') {
                 zoomBarEventType = Events.ZoomBar.SELECTION_START;
             }
-            else if (event.type === "brush") {
+            else if (event.type === 'brush') {
                 zoomBarEventType = Events.ZoomBar.SELECTION_IN_PROGRESS;
             }
-            else if (event.type === "end") {
+            else if (event.type === 'end') {
                 zoomBarEventType = Events.ZoomBar.SELECTION_END;
                 // only dispatch zoom domain change event for triggering api call when event type equals to end
                 this.services.events.dispatchEvent(Events.ZoomDomain.CHANGE, {
-                    newDomain: newDomain
+                    newDomain: newDomain,
                 });
             }
             this.services.events.dispatchEvent(zoomBarEventType, {
                 selection: selection,
-                newDomain: newDomain
+                newDomain: newDomain,
             });
         }
     };
     ZoomBar.prototype.updateBrushHandle = function (svg, selection, domain) {
         var self = this;
         var handleWidth = Configuration.zoomBar.handleWidth;
-        var zoombarType = Tools.getProperty(this.getOptions(), "zoomBar", AxisPositions.TOP, "type");
+        var zoombarType = Tools.getProperty(this.getOptions(), 'zoomBar', AxisPositions.TOP, 'type');
         var handleHeight = Configuration.zoomBar.height[zoombarType];
         var handleXDiff = -handleWidth / 2;
         var handleBarWidth = Configuration.zoomBar.handleBarWidth;
@@ -279,49 +279,49 @@ var ZoomBar = /** @class */ (function (_super) {
         var handleYBarDiff = (handleHeight - handleBarHeight) / 2;
         // handle
         svg.select(this.brushSelector)
-            .selectAll("rect.handle")
-            .data([{ type: "w" }, { type: "e" }])
-            .attr("x", function (d) {
-            if (d.type === "w") {
+            .selectAll('rect.handle')
+            .data([{ type: 'w' }, { type: 'e' }])
+            .attr('x', function (d) {
+            if (d.type === 'w') {
                 // handle should not exceed zoom bar range
                 return Math.max(selection[0] + handleXDiff, self.maxSelectionRange[0]);
             }
-            else if (d.type === "e") {
+            else if (d.type === 'e') {
                 // handle should not exceed zoom bar range
                 return Math.min(selection[1] + handleXDiff, self.maxSelectionRange[1] - handleWidth);
             }
         })
-            .attr("y", 0)
-            .attr("width", handleWidth)
-            .attr("height", handleHeight)
-            .attr("cursor", "ew-resize")
-            .style("display", null); // always display
+            .attr('y', 0)
+            .attr('width', handleWidth)
+            .attr('height', handleHeight)
+            .attr('cursor', 'ew-resize')
+            .style('display', null); // always display
         // handle-bar
         var handleBars = svg
             .select(this.brushSelector)
-            .selectAll("rect.handle-bar")
-            .data([{ type: "w" }, { type: "e" }]);
+            .selectAll('rect.handle-bar')
+            .data([{ type: 'w' }, { type: 'e' }]);
         // create rect if not exists
         handleBars
             .enter()
-            .append("rect")
-            .attr("class", function (d) {
-            return "handle-bar handle-bar--" + d.type;
+            .append('rect')
+            .attr('class', function (d) {
+            return 'handle-bar handle-bar--' + d.type;
         });
         // update positions
         handleBars
-            .attr("x", function (d) {
-            if (d.type === "w") {
+            .attr('x', function (d) {
+            if (d.type === 'w') {
                 return Math.max(selection[0] + handleBarXDiff, self.maxSelectionRange[0] - handleXDiff + handleBarXDiff);
             }
-            else if (d.type === "e") {
+            else if (d.type === 'e') {
                 return Math.min(selection[1] + handleBarXDiff, self.maxSelectionRange[1] + handleXDiff + handleBarXDiff);
             }
         })
-            .attr("y", handleYBarDiff)
-            .attr("width", handleBarWidth)
-            .attr("height", handleBarHeight)
-            .attr("cursor", "ew-resize");
+            .attr('y', handleYBarDiff)
+            .attr('width', handleBarWidth)
+            .attr('height', handleBarHeight)
+            .attr('cursor', 'ew-resize');
         // Update slider selected area
         if (zoombarType === ZoomBarTypes.SLIDER_VIEW) {
             this.updateSliderSelectedArea(selection);
@@ -329,25 +329,25 @@ var ZoomBar = /** @class */ (function (_super) {
         this.updateClipPath(svg, this.clipId, selection[0], 0, selection[1] - selection[0], handleHeight);
     };
     ZoomBar.prototype.updateSliderSelectedArea = function (selection) {
-        var zoombarType = Tools.getProperty(this.getOptions(), "zoomBar", AxisPositions.TOP, "type");
+        var zoombarType = Tools.getProperty(this.getOptions(), 'zoomBar', AxisPositions.TOP, 'type');
         var zoombarHeight = Configuration.zoomBar.height[zoombarType];
         var width = DOMUtils.getSVGElementSize(this.parent, {
-            useAttrs: true
+            useAttrs: true,
         }).width;
         // get axes margins
         var axesLeftMargin = 0;
-        var axesMargins = this.model.get("axesMargins");
+        var axesMargins = this.model.get('axesMargins');
         if (axesMargins && axesMargins.left) {
             axesLeftMargin = axesMargins.left;
         }
         var svg = this.getContainerSVG();
-        var container = svg.select("svg.zoom-container");
+        var container = svg.select('svg.zoom-container');
         // Draw zoombar background line
-        DOMUtils.appendOrSelect(container, "rect.zoom-slider-selected-area")
-            .attr("x", selection[0])
-            .attr("y", zoombarHeight / 2 - 1)
-            .attr("width", selection[1] - selection[0])
-            .attr("height", 2);
+        DOMUtils.appendOrSelect(container, 'rect.zoom-slider-selected-area')
+            .attr('x', selection[0])
+            .attr('y', zoombarHeight / 2 - 1)
+            .attr('width', selection[1] - selection[0])
+            .attr('height', 2);
     };
     ZoomBar.prototype.renderZoomBarArea = function (container, querySelector, data, clipId) {
         var cartesianScales = this.services.cartesianScales;
@@ -362,7 +362,7 @@ var ZoomBar = /** @class */ (function (_super) {
         };
         var xAccessor = accessorFunction(this.xScale, mainXScaleType, mainXAxisPosition);
         var yAccessor = accessorFunction(this.yScale, mainYScaleType, mainYAxisPosition);
-        var zoombarType = Tools.getProperty(this.getOptions(), "zoomBar", AxisPositions.TOP, "type");
+        var zoombarType = Tools.getProperty(this.getOptions(), 'zoomBar', AxisPositions.TOP, 'type');
         var zoombarHeight = Configuration.zoomBar.height[zoombarType];
         var areaGenerator = area()
             .x(function (d, i) { return xAccessor(d, i); })
@@ -370,18 +370,18 @@ var ZoomBar = /** @class */ (function (_super) {
             .y1(function (d, i) { return zoombarHeight - yAccessor(d, i); });
         var areaGraph = DOMUtils.appendOrSelect(container, querySelector)
             .datum(data)
-            .attr("d", areaGenerator);
+            .attr('d', areaGenerator);
         if (clipId) {
-            areaGraph.attr("clip-path", "url(#" + clipId + ")");
+            areaGraph.attr('clip-path', "url(#" + clipId + ")");
         }
     };
     ZoomBar.prototype.updateClipPath = function (svg, clipId, x, y, width, height) {
-        var zoomBarClipPath = DOMUtils.appendOrSelect(svg, "clipPath").attr("id", clipId);
-        DOMUtils.appendOrSelect(zoomBarClipPath, "rect")
-            .attr("x", x)
-            .attr("y", y)
-            .attr("width", width)
-            .attr("height", height);
+        var zoomBarClipPath = DOMUtils.appendOrSelect(svg, "clipPath").attr('id', clipId);
+        DOMUtils.appendOrSelect(zoomBarClipPath, 'rect')
+            .attr('x', x)
+            .attr('y', y)
+            .attr('width', width)
+            .attr('height', height);
     };
     // assume the domains in data are already sorted
     ZoomBar.prototype.compensateDataForDefaultDomain = function (data, defaultDomain) {
@@ -410,32 +410,32 @@ var ZoomBar = /** @class */ (function (_super) {
     };
     ZoomBar.prototype.renderZoomBarBaseline = function (container, startX, endX, skeletonClass) {
         if (skeletonClass === void 0) { skeletonClass = false; }
-        var zoombarType = Tools.getProperty(this.model.getOptions(), "zoomBar", AxisPositions.TOP, "type");
+        var zoombarType = Tools.getProperty(this.model.getOptions(), 'zoomBar', AxisPositions.TOP, 'type');
         var zoombarHeight = Configuration.zoomBar.height[zoombarType];
         var baselineGenerator = line()([
             [startX, zoombarHeight],
-            [endX, zoombarHeight]
+            [endX, zoombarHeight],
         ]);
-        DOMUtils.appendOrSelect(container, "path.zoom-bg-baseline")
-            .attr("d", baselineGenerator)
-            .classed("zoom-bg-baseline-skeleton", skeletonClass);
+        DOMUtils.appendOrSelect(container, 'path.zoom-bg-baseline')
+            .attr('d', baselineGenerator)
+            .classed('zoom-bg-baseline-skeleton', skeletonClass);
     };
     ZoomBar.prototype.renderSkeleton = function (container, startX, endX) {
         // need to clear current zoom bar area
-        this.renderZoomBarArea(container, "path.zoom-graph-area-unselected", [], null);
-        this.renderZoomBarArea(container, "path.zoom-graph-area", [], this.clipId);
+        this.renderZoomBarArea(container, 'path.zoom-graph-area-unselected', [], null);
+        this.renderZoomBarArea(container, 'path.zoom-graph-area', [], this.clipId);
         // remove brush listener
-        this.brush.on("start brush end", null);
+        this.brush.on('start brush end', null);
         // clear d3 brush
         DOMUtils.appendOrSelect(this.getContainerSVG(), this.brushSelector).html(null);
         // re-render baseline because no axis labels in skeleton so the baseline length needs to change
-        var zoombarType = Tools.getProperty(this.getOptions(), "zoomBar", AxisPositions.TOP, "type");
+        var zoombarType = Tools.getProperty(this.getOptions(), 'zoomBar', AxisPositions.TOP, 'type');
         if (zoombarType === ZoomBarTypes.GRAPH_VIEW) {
             this.renderZoomBarBaseline(container, startX, endX, true);
         }
     };
     ZoomBar.prototype.destroy = function () {
-        this.brush.on("start brush end", null); // remove event listener
+        this.brush.on('start brush end', null); // remove event listener
         this.services.events.removeEventListener(Events.ZoomBar.UPDATE, this.render.bind(this));
     };
     return ZoomBar;