chartist 1.2.1 → 1.3.1

package/dist/index.js

@@ -225,7 +225,11 @@ function extend() {
     }
     for(let i = 0; i < sources.length; i++){
         const source = sources[i];
+        const targetProto = Object.getPrototypeOf(target);
         for(const prop in source){
+            if (targetProto !== null && prop in targetProto) {
+                continue; // prevent prototype pollution
+            }
             const sourceProp = source[prop];
             if (typeof sourceProp === "object" && sourceProp !== null && !(sourceProp instanceof Array)) {
                 target[prop] = extend(target[prop], sourceProp);
@@ -1123,16 +1127,16 @@ function createAnimation(element, attribute, animationDefinition) {
         return this;
     }
     /**
-   * Get element height using `getBoundingClientRect`
+   * Get element height using `clientHeight`
    * @return The elements height in pixels
    */ height() {
-        return this._node.getBoundingClientRect().height;
+        return this._node.clientHeight;
     }
     /**
-   * Get element width using `getBoundingClientRect`
+   * Get element width using `clientWidth`
    * @return The elements width in pixels
    */ width() {
-        return this._node.getBoundingClientRect().width;
+        return this._node.clientWidth;
     }
     /**
    * The animate function lets you animate the current element with SMIL animations. You can add animations for multiple attributes at the same time by using an animation definition object. This object should contain SMIL animation attributes. Please refer to http://www.w3.org/TR/SVG/animate.html for a detailed specification about the available animation attributes. Additionally an easing property can be passed in the animation definition object. This can be a string with a name of an easing function in `Svg.Easing` or an array with four numbers specifying a cubic Bézier curve.
@@ -1234,6 +1238,9 @@ function createAnimation(element, attribute, animationDefinition) {
  * @return The created/reinitialized SVG element
  */ function createSvg(container) {
     let width = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : "100%", height = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : "100%", className = arguments.length > 3 ? arguments[3] : void 0;
+    if (!container) {
+        throw new Error("Container element is not found");
+    }
     // Check if there is a previous SVG element in the container that contains the Chartist XML namespace and remove it
     // Since the DOM API does not support namespaces we need to manually search the returned list http://www.w3.org/TR/selectors-api/
     Array.from(container.querySelectorAll("svg")).filter((svg)=>svg.getAttributeNS(namespaces.xmlns, "ct")
@@ -1417,7 +1424,7 @@ function createAnimation(element, attribute, animationDefinition) {
             responsiveOptions.forEach((responsiveOption)=>{
                 const mql = window.matchMedia(responsiveOption[0]);
                 if (mql.matches) {
-                    currentOptions = extend(currentOptions, responsiveOption[1]);
+                    currentOptions = extend({}, currentOptions, responsiveOption[1]);
                 }
             });
         }
@@ -2266,7 +2273,7 @@ class BaseChart {
         , 0);
         const container = typeof query === "string" ? document.querySelector(query) : query;
         if (!container) {
-            throw new Error("Target element is not found");
+            throw new Error("Target element ".concat(typeof query === "string" ? '"'.concat(query, '"') : "", " is not found"));
         }
         this.container = container;
         const prevInstance = instances.get(container);
@@ -2915,8 +2922,9 @@ function getSerialSums(series) {
     seriesBarDistance: 15,
     // If set to true this property will cause the series bars to be stacked. Check the `stackMode` option for further stacking options.
     stackBars: false,
-    // If set to 'overlap' this property will force the stacked bars to draw from the zero line.
+    // If set to true this property will force the stacked bars to draw from the zero line.
     // If set to 'accumulate' this property will form a total for each series point. This will also influence the y-axis and the overall bounds of the chart. In stacked mode the seriesBarDistance property will have no effect.
+    // If set to 'accumulate-relative' positive and negative values will be handled separately.
     stackMode: "accumulate",
     // Inverts the axes of the bar chart in order to draw a horizontal bar chart. Be aware that you also need to invert your axis settings as the Y Axis will now display the labels and the X Axis the values.
     horizontalBars: false,
@@ -3025,8 +3033,12 @@ class BarChart extends BaseChart {
         }
         // Projected 0 point
         const zeroPoint = options.horizontalBars ? chartRect.x1 + valueAxis.projectValue(0) : chartRect.y1 - valueAxis.projectValue(0);
+        const isAccumulateStackMode = options.stackMode === "accumulate";
+        const isAccumulateRelativeStackMode = options.stackMode === "accumulate-relative";
         // Used to track the screen coordinates of stacked bars
-        const stackedBarValues = [];
+        const posStackedBarValues = [];
+        const negStackedBarValues = [];
+        let stackedBarValues = posStackedBarValues;
         labelAxis.createGridAndLabels(gridGroup, labelGroup, options, this.eventEmitter);
         valueAxis.createGridAndLabels(gridGroup, labelGroup, options, this.eventEmitter);
         if (options.showGridBackground) {
@@ -3073,6 +3085,8 @@ class BarChart extends BaseChart {
                 seriesClassName || "".concat(options.classNames.series, "-").concat(alphaNumerate(seriesIndex))
             ].join(" "));
             normalizedData.series[seriesIndex].forEach((value, valueIndex)=>{
+                const valueX = safeHasProperty(value, "x") && value.x;
+                const valueY = safeHasProperty(value, "y") && value.y;
                 let labelAxisValueIndex;
                 // We need to set labelAxisValueIndex based on some options combinations
                 if (options.distributeSeries && !options.stackBars) {
@@ -3091,13 +3105,13 @@ class BarChart extends BaseChart {
                 // We need to transform coordinates differently based on the chart layout
                 if (options.horizontalBars) {
                     projected = {
-                        x: chartRect.x1 + valueAxis.projectValue(safeHasProperty(value, "x") ? value.x : 0, valueIndex, normalizedData.series[seriesIndex]),
-                        y: chartRect.y1 - labelAxis.projectValue(safeHasProperty(value, "y") ? value.y : 0, labelAxisValueIndex, normalizedData.series[seriesIndex])
+                        x: chartRect.x1 + valueAxis.projectValue(valueX || 0, valueIndex, normalizedData.series[seriesIndex]),
+                        y: chartRect.y1 - labelAxis.projectValue(valueY || 0, labelAxisValueIndex, normalizedData.series[seriesIndex])
                     };
                 } else {
                     projected = {
-                        x: chartRect.x1 + labelAxis.projectValue(safeHasProperty(value, "x") ? value.x : 0, labelAxisValueIndex, normalizedData.series[seriesIndex]),
-                        y: chartRect.y1 - valueAxis.projectValue(safeHasProperty(value, "y") ? value.y : 0, valueIndex, normalizedData.series[seriesIndex])
+                        x: chartRect.x1 + labelAxis.projectValue(valueX || 0, labelAxisValueIndex, normalizedData.series[seriesIndex]),
+                        y: chartRect.y1 - valueAxis.projectValue(valueY || 0, valueIndex, normalizedData.series[seriesIndex])
                     };
                 }
                 // If the label axis is a step based axis we will offset the bar into the middle of between two steps using
@@ -3112,6 +3126,10 @@ class BarChart extends BaseChart {
                     // Using bi-polar offset for multiple series if no stacked bars or series distribution is used
                     projected[labelAxis.units.pos] += options.stackBars || options.distributeSeries ? 0 : biPol * options.seriesBarDistance * (options.horizontalBars ? -1 : 1);
                 }
+                // distinguish between positive and negative values in relative stack mode
+                if (isAccumulateRelativeStackMode) {
+                    stackedBarValues = valueY >= 0 || valueX >= 0 ? posStackedBarValues : negStackedBarValues;
+                }
                 // Enter value in stacked bar values used to remember previous screen value for stacking up bars
                 const previousStack = stackedBarValues[valueIndex] || zeroPoint;
                 stackedBarValues[valueIndex] = previousStack - (zeroPoint - projected[labelAxis.counterUnits.pos]);
@@ -3123,7 +3141,7 @@ class BarChart extends BaseChart {
                     ["".concat(labelAxis.units.pos, "1")]: projected[labelAxis.units.pos],
                     ["".concat(labelAxis.units.pos, "2")]: projected[labelAxis.units.pos]
                 };
-                if (options.stackBars && (options.stackMode === "accumulate" || !options.stackMode)) {
+                if (options.stackBars && (isAccumulateStackMode || isAccumulateRelativeStackMode || !options.stackMode)) {
                     // Stack mode: accumulate (default)
                     // If bars are stacked we use the stackedBarValues reference and otherwise base all bars off the zero line
                     // We want backwards compatibility, so the expected fallback without the 'stackMode' option
@@ -3145,8 +3163,8 @@ class BarChart extends BaseChart {
                 // Create bar element
                 const bar = seriesElement.elem("line", positions, options.classNames.bar).attr({
                     "ct:value": [
-                        safeHasProperty(value, "x") && value.x,
-                        safeHasProperty(value, "y") && value.y
+                        valueX,
+                        valueY
                     ].filter(isNumeric).join(","),
                     "ct:meta": serialize(metaData)
                 });