highcharts-rails 4.2.5 → 4.2.6

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 2939d4feed91c6aa1664e68c33af311c52c7bccc
-  data.tar.gz: cee7f47daf110070a74c538933732d46f056e8ad
+  metadata.gz: f77a535a0b707c51c4f72e52ddf05fe4e3b911c3
+  data.tar.gz: 6c75ffb6a157954665f1abd492d403529a3b557e
 SHA512:
-  metadata.gz: df01b55b3c3e82c15e846e5f7f35fd0cfad67cbdbc67570ae7ebd737ff58d2c4cd19829ce599a08fb142ba771337f914b9079b688eef55dc8ae8e1079675fb1e
-  data.tar.gz: 54e18726fabf8b724ce627bd2538d4a8c6948d0da8fac305405e32eec19bd32229461455a11cb11a3895c21d1aab8d1602f58199775e45c7ef33cdbc92f45258
+  metadata.gz: af2b1ec95756ae60312e86e5b7bbbfd3af55d35e9df0b0a910bfd7e8499d4304e859c7da71f8d2fe2ad7b951c3b28405cb5a31bed565485578050f7294d4dabb
+  data.tar.gz: 76c61a2be05c827cf727b7ad23c99672f75d267646c977fc8f441365c6b6489d46d261001424be87d44e7a3e38155c1c7597bf466eff706b925a384bba00ae9b

data/CHANGELOG.markdown

@@ -1,3 +1,50 @@
+# 4.2.6 / 2017-01-25
+
+* Updated Highcharts to 4.2.6 (2016-08-02)
+  * Added crisp correction for crisper treemap points.
+  * Added support for animating graphs to the right when updating data or setting axis extremes. Related to #5294.
+  * Refactored sideways animation logic for graphs to better reflect shifting data. Closed #5294.
+  * Bug fixes
+    * Fixed tick animation when showFirstLabel or showLastLabel were set to false.
+    * Fixed #2522, point names should fill up categories when X is not set.
+    * Fixed #2597, data labels remained visible even though container was hidden.
+    * Fixed #3571, treat NaN in data as null.
+    * Fixed #4204, hover.brightness wasn't used for positive bars in waterfall.
+    * Fixed #4216, connectEnds with null as first point failed.
+    * Fixed #5052, wrong placement of ticks on opposite axis on 3D charts.
+    * Fixed #5197, JS error on hovering chart after setData before redraw.
+    * Fixed #5215, JS error when legend configuration object was set to false.
+    * Fixed #5280, stacked area was wrong with non-zero Y axis threshold and data points at 0.
+    * Fixed #5287, unsnapped crossshair was hidden after adding points.
+    * Fixed #5298, empty cells in Google Spreadsheet made the graph disappear.
+    * Fixed #5302, dateFormat didn't handle Date objects like before.
+    * Fixed #5310, global stacking affected polygon series.
+    * Fixed #5311, JS error when setting an event config to null.
+    * Fixed #5322, negative values in pie series was rendered incorrectly.
+    * Fixed #5324, calling Renderer.label with a shape of rect failed.
+    * Fixed #5332, last axis label was stuck when doing repetetive redraws.
+    * Fixed #5337, tooltip for polygon should not behave like scatter points.
+    * Fixed #5339, plot area disappeared when categories were too long.
+    * Fixed #5348, error in arearange series when trackByArea was false.
+    * Fixed #5350, 3D pies failed redraw when animation was off.
+    * Fixed #5352, treemap tooltip did not format point value.
+    * Fixed #5354, noSharedTooltip was undefined for gauge and solid gauge, which caused errors when shared tooltip was enabled.
+    * Fixed #5376, axis title position was wrong with font-size text values.
+    * Fixed #5396, drilldown activeDataLabelStyle color contrast did not work.
+    * Fixed #5417, regression causing HTML axis labels to misbehave with useHTML and rotation.
+    * Fixed #5442, incorrect clipRect counter causing points to disappear on series update.
+    * Fixed #5480, axis showed 0k or 0M. Suffix not needed for zero.
+    * Fixed #5486, threshold null caused wrong fill on all-negative axis.
+    * Fixed #5495, shared tooltips not always working because of rounding error.
+    * Fixed #5500, pyramid height caused wrong position.
+    * Fixed #5504, exporting module default settings was not compatible with https.
+    * Fixed #5513, Chart.setSize required both width and height to be set.
+    * Fixed #5519, issues with setting null colors in drilldown.
+    * Fixed #5522, 3D charts scale differently first time versus subsequent redraws.
+    * Fixed #5523, marker radius was incorrect when values were of type string.
+    * Fixed issues with PNG/JEPG in IE and Edge in offline exporting, ref #5410.
+    * Fixed issue #5410, offline exporting in IE/Edge failed with embedded images for PNG/JPEG.
+
 # 4.2.5 / 2016-05-06
 
 * Updated Highcharts to 4.2.5 (2016-05-06)

data/app/assets/javascripts/highcharts.js

@@ -2,7 +2,7 @@
 // @compilation_level SIMPLE_OPTIMIZATIONS
 
 /**
- * @license Highcharts JS v4.2.5 (2016-05-06)
+ * @license Highcharts JS v4.2.6 (2016-08-02)
  *
  * (c) 2009-2016 Torstein Honsi
  *
@@ -59,7 +59,7 @@
         charts = [],
         chartCount = 0,
         PRODUCT = 'Highcharts',
-        VERSION = '4.2.5',
+        VERSION = '4.2.6',
 
         // some constants for frequently used strings
         DIV = 'div',
@@ -304,57 +304,83 @@
          */
         initPath: function (elem, fromD, toD) {
             fromD = fromD || '';
-            var shift = elem.shift,
+            var shift,
+                startX = elem.startX,
+                endX = elem.endX,
                 bezier = fromD.indexOf('C') > -1,
                 numParams = bezier ? 7 : 3,
-                endLength,
+                fullLength,
                 slice,
                 i,
                 start = fromD.split(' '),
-                end = [].concat(toD), // copy
+                end = toD.slice(), // copy
                 isArea = elem.isArea,
                 positionFactor = isArea ? 2 : 1,
-                sixify = function (arr) { // in splines make move points have six parameters like bezier curves
-                    i = arr.length;
-                    while (i--) {
-                        if (arr[i] === M || arr[i] === L) {
-                            arr.splice(i + 1, 0, arr[i + 1], arr[i + 2], arr[i + 1], arr[i + 2]);
-                        }
+                reverse;
+        
+            /**
+             * In splines make move points have six parameters like bezier curves
+             */
+            function sixify(arr) {
+                i = arr.length;
+                while (i--) {
+                    if (arr[i] === M || arr[i] === L) {
+                        arr.splice(i + 1, 0, arr[i + 1], arr[i + 2], arr[i + 1], arr[i + 2]);
                     }
-                };
+                }
+            }
 
-            if (bezier) {
-                sixify(start);
-                sixify(end);
+            /**
+             * Insert an array at the given position of another array
+             */
+            function insertSlice(arr, subArr, index) {
+                [].splice.apply(
+                    arr,
+                    [index, 0].concat(subArr)
+                );
             }
 
-            // If shifting points, prepend a dummy point to the end path. For areas,
-            // prepend both at the beginning and end of the path.
-            if (shift <= end.length / numParams && start.length === end.length) {
-                while (shift--) {
-                    end = end.slice(0, numParams).concat(end);
+            /**
+             * If shifting points, prepend a dummy point to the end path. 
+             */
+            function prepend(arr, other) {
+                while (arr.length < fullLength) {
+                
+                    // Move to, line to or curve to?
+                    arr[0] = other[fullLength - arr.length];
+
+                    // Prepend a copy of the first point
+                    insertSlice(arr, arr.slice(0, numParams), 0);
+
+                    // For areas, the bottom path goes back again to the left, so we need
+                    // to append a copy of the last point.
                     if (isArea) {
-                        end = end.concat(end.slice(end.length - numParams));
+                        insertSlice(arr, arr.slice(arr.length - numParams), arr.length);
+                        i--;
                     }
                 }
+                arr[0] = 'M';
             }
-            elem.shift = 0; // reset for following animations
 
-        
-            // Copy and append last point until the length matches the end length
-            if (start.length) {
-                endLength = end.length;
-                while (start.length < endLength) {
+            /**
+             * Copy and append last point until the length matches the end length
+             */
+            function append(arr, other) {
+                var i = (fullLength - arr.length) / numParams;
+                while (i > 0 && i--) {
 
                     // Pull out the slice that is going to be appended or inserted. In a line graph,
                     // the positionFactor is 1, and the last point is sliced out. In an area graph,
                     // the positionFactor is 2, causing the middle two points to be sliced out, since
                     // an area path starts at left, follows the upper path then turns and follows the
                     // bottom back. 
-                    slice = start.slice().splice(
-                        (start.length / positionFactor) - numParams, 
+                    slice = arr.slice().splice(
+                        (arr.length / positionFactor) - numParams, 
                         numParams * positionFactor
                     );
+
+                    // Move to, line to or curve to?
+                    slice[0] = other[fullLength - numParams - (i * numParams)];
                 
                     // Disable first control point
                     if (bezier) {
@@ -363,11 +389,49 @@
                     }
                 
                     // Now insert the slice, either in the middle (for areas) or at the end (for lines)
-                    [].splice.apply(
-                        start, 
-                        [(start.length / positionFactor), 0].concat(slice)
-                    );
+                    insertSlice(arr, slice, arr.length / positionFactor);
+
+                    if (isArea) {
+                        i--;
+                    }
+                }
+            }
+
+            if (bezier) {
+                sixify(start);
+                sixify(end);
+            }
 
+            // For sideways animation, find out how much we need to shift to get the start path Xs
+            // to match the end path Xs.
+            if (startX && endX) {
+                for (i = 0; i < startX.length; i++) {
+                    if (startX[i] === endX[0]) { // Moving left, new points coming in on right
+                        shift = i;
+                        break;
+                    } else if (startX[0] === endX[endX.length - startX.length + i]) { // Moving right
+                        shift = i;
+                        reverse = true;
+                        break;
+                    }
+                }
+                if (shift === undefined) {
+                    start = [];
+                }
+            }
+
+            if (start.length && Highcharts.isNumber(shift)) {
+
+                // The common target length for the start and end array, where both 
+                // arrays are padded in opposite ends
+                fullLength = end.length + shift * positionFactor * numParams;
+            
+                if (!reverse) {
+                    prepend(end, start);
+                    append(start, end);
+                } else {
+                    prepend(start, end);
+                    append(end, start);
                 }
             }
 
@@ -463,20 +527,22 @@
     }
 
     /**
-     * Check for object
+     * Check for array
      * @param {Object} obj
      */
-    function isObject(obj) {
-        return obj && typeof obj === 'object';
+    function isArray(obj) {
+        return Object.prototype.toString.call(obj) === '[object Array]';
     }
 
     /**
-     * Check for array
+     * Check for object
      * @param {Object} obj
+     * @param {Boolean} strict Also checks that the object is not an array
      */
-    function isArray(obj) {
-        return Object.prototype.toString.call(obj) === '[object Array]';
-    }
+    var isObject = Highcharts.isObject = function (obj, strict) {
+        //debugger;
+        return obj && typeof obj === 'object' && (!strict || !isArray(obj));
+    };
 
     /**
      * Check for number
@@ -676,7 +742,7 @@
      * @param {Boolean} capitalize
      */
     dateFormat = function (format, timestamp, capitalize) {
-        if (!isNumber(timestamp)) {
+        if (!defined(timestamp) || isNaN(timestamp)) {
             return defaultOptions.lang.invalidDate || '';
         }
         format = pick(format, '%Y-%m-%d %H:%M:%S');
@@ -1317,7 +1383,7 @@
                 fn = events[i];
 
                 // If the event handler return false, prevent the default handler from executing
-                if (fn.call(el, eventArguments) === false) {
+                if (fn && fn.call(el, eventArguments) === false) {
                     eventArguments.preventDefault();
                 }
             }
@@ -1535,7 +1601,7 @@
             useUTC: true,
             //timezoneOffset: 0,
             canvasToolsURL: 'http://code.highcharts.com/modules/canvas-tools.js',
-            VMLRadialGradientURL: 'http://code.highcharts.com/4.2.5/gfx/vml-radial-gradient.png'
+            VMLRadialGradientURL: 'http://code.highcharts.com/4.2.6/gfx/vml-radial-gradient.png'
         },
         chart: {
             //animation: true,
@@ -1581,7 +1647,9 @@
                     y: 10
                 }
                 // relativeTo: 'plot'
-            }
+            },
+            width: null,
+            height: null
         },
         title: {
             text: 'Chart title',
@@ -3513,7 +3581,7 @@
 
             // Skip tspans, add text directly to text node. The forceTSpan is a hook
             // used in text outline hack.
-            if (!hasMarkup && !textShadow && !ellipsis && textStr.indexOf(' ') === -1) {
+            if (!hasMarkup && !textShadow && !ellipsis && !width && textStr.indexOf(' ') === -1) {
                 textNode.appendChild(doc.createTextNode(unescapeAngleBrackets(textStr)));
 
             // Complex strings, add more logic
@@ -4526,8 +4594,7 @@
                         // create the border box if it is not already present
                         boxX = crispAdjust;
                         boxY = (baseline ? -baselineOffset : 0) + crispAdjust;
-
-                        wrapper.box = box = shape ?
+                        wrapper.box = box = renderer.symbols[shape] ? // Symbol definition exists (#5324)
                                 renderer.symbol(shape, boxX, boxY, wrapper.width, wrapper.height, deferredAttr) :
                                 renderer.rect(boxX, boxY, wrapper.width, wrapper.height, 0, deferredAttr[STROKE_WIDTH]);
 
@@ -4875,6 +4942,12 @@
                         wrapper.setSpanRotation(rotation, alignCorrection, baseline);
                     }
 
+                    // Reset multiline/ellipsis in order to read width (#4928, #5417)
+                    css(elem, {
+                        width: '',
+                        whiteSpace: whiteSpace || 'nowrap'
+                    });
+
                     // Update textWidth
                     if (elem.offsetWidth > textWidth && /[ \-]/.test(elem.textContent || elem.innerText)) { // #983, #1254
                         css(elem, {
@@ -4882,17 +4955,10 @@
                             display: 'block',
                             whiteSpace: whiteSpace || 'normal' // #3331
                         });
-                        wrapper.hasTextWidth = true;
-                    } else if (wrapper.hasTextWidth) { // #4928
-                        css(elem, {
-                            width: '',
-                            display: '',
-                            whiteSpace: whiteSpace || 'nowrap'
-                        });
-                        wrapper.hasTextWidth = false;
                     }
 
-                    wrapper.getSpanCorrection(wrapper.hasTextWidth ? textWidth : elem.offsetWidth, baseline, alignCorrection, rotation, align);
+
+                    wrapper.getSpanCorrection(elem.offsetWidth, baseline, alignCorrection, rotation, align);
                 }
 
                 // apply position with correction
@@ -6609,10 +6675,11 @@
                 if (show && isNumber(xy.y)) {
                     xy.opacity = opacity;
                     label[tick.isNew ? 'attr' : 'animate'](xy);
-                    tick.isNew = false;
                 } else {
+                    stop(label); // #5332
                     label.attr('y', -9999); // #1338
                 }
+                tick.isNew = false;
             }
         },
 
@@ -7299,7 +7366,7 @@
                 // logic to the numberFormatter and enable it by a parameter.
                 while (i-- && ret === UNDEFINED) {
                     multi = Math.pow(1000, i + 1);
-                    if (numericSymbolDetector >= multi && (value * 10) % multi === 0 && numericSymbols[i] !== null) {
+                    if (numericSymbolDetector >= multi && (value * 10) % multi === 0 && numericSymbols[i] !== null && value !== 0) { // #5480
                         ret = Highcharts.numberFormat(value / multi, -1) + numericSymbols[i];
                     }
                 }
@@ -7702,14 +7769,19 @@
          */
         getClosest: function () {
             var ret;
-            each(this.series, function (series) {
-                var seriesClosest = series.closestPointRange;
-                if (!series.noSharedTooltip && defined(seriesClosest)) {
-                    ret = defined(ret) ?
-                        mathMin(ret, seriesClosest) :
-                        seriesClosest;
-                }
-            });
+
+            if (this.categories) {
+                ret = 1;
+            } else {
+                each(this.series, function (series) {
+                    var seriesClosest = series.closestPointRange;
+                    if (!series.noSharedTooltip && defined(seriesClosest)) {
+                        ret = defined(ret) ?
+                            mathMin(ret, seriesClosest) :
+                            seriesClosest;
+                    }
+                });
+            }
             return ret;
         },
 
@@ -8410,10 +8482,8 @@
                 realMin = isLog ? lin2log(axis.min) : axis.min,
                 realMax = isLog ? lin2log(axis.max) : axis.max;
 
-            // With a threshold of null, make the columns/areas rise from the top or bottom
-            // depending on the value, assuming an actual threshold of 0 (#4233).
             if (threshold === null) {
-                threshold = realMax < 0 ? realMax : realMin;
+                threshold = realMin;
             } else if (realMin > threshold) {
                 threshold = realMin;
             } else if (realMax < threshold) {
@@ -8885,7 +8955,7 @@
                 offset = this.offset,
                 xOption = axisTitleOptions.x || 0,
                 yOption = axisTitleOptions.y || 0,
-                fontSize = pInt(axisTitleOptions.style.fontSize || 12),
+                fontSize = this.chart.renderer.fontMetrics(axisTitleOptions.style.fontSize).f,
 
                 // the position in the length direction of the axis
                 alongAxis = {
@@ -9160,17 +9230,15 @@
                 plotLinesAndBands[i].destroy();
             }
 
-            // Destroy local variables
-            each(['stackTotalGroup', 'axisLine', 'axisTitle', 'axisGroup', 'cross', 'gridGroup', 'labelGroup'], function (prop) {
+            // Destroy properties
+            each(['stackTotalGroup', 'axisLine', 'axisTitle', 'axisGroup', 'gridGroup', 'labelGroup', 'cross'], function (prop) {
                 if (axis[prop]) {
                     axis[prop] = axis[prop].destroy();
                 }
             });
 
-            // Destroy crosshair
-            if (this.cross) {
-                this.cross.destroy();
-            }
+
+            this._addedPlotLB = this.chart._labelPanes = this.ordinalSlope = undefined; // #1611, #2887, #4314, #5316
         },
 
         /**
@@ -9188,6 +9256,12 @@
                 categorized,
                 strokeWidth;
 
+            // Use last available event when updating non-snapped crosshairs without
+            // mouse interaction (#5287)
+            if (!e) {
+                e = this.cross && this.cross.e;
+            }
+
             if (
                 // Disabled in options
                 !this.crosshair ||
@@ -9195,7 +9269,6 @@
                 ((defined(point) || !pick(options.snap, true)) === false)
             ) {
                 this.hideCrosshair();
-
             } else {
 
                 // Get the path
@@ -9239,7 +9312,7 @@
                     }
                     this.cross = this.chart.renderer.path(path).attr(attribs).add();
                 }
-
+                this.cross.e = e;
             }
 
         },
@@ -9616,7 +9689,7 @@
                 .css(style)
                 .css({ padding: 0 }) // Remove it from VML, the padding is applied as an attribute instead (#1117)
                 .add()
-                .attr({ y: -9999 }); // #2301, #2657
+                .attr({ y: -9e9 }); // #2301, #2657, #3532
 
             // When using canVG the shadow shows up as a gray circle
             // even if the tooltip is hidden.
@@ -10055,18 +10128,18 @@
          * Format the footer/header of the tooltip
          * #3397: abstraction to enable formatting of footer and header
          */
-        tooltipFooterHeaderFormatter: function (point, isFooter) {
+        tooltipFooterHeaderFormatter: function (labelConfig, isFooter) {
             var footOrHead = isFooter ? 'footer' : 'header',
-                series = point.series,
+                series = labelConfig.series,
                 tooltipOptions = series.tooltipOptions,
                 xDateFormat = tooltipOptions.xDateFormat,
                 xAxis = series.xAxis,
-                isDateTime = xAxis && xAxis.options.type === 'datetime' && isNumber(point.key),
+                isDateTime = xAxis && xAxis.options.type === 'datetime' && isNumber(labelConfig.key),
                 formatString = tooltipOptions[footOrHead + 'Format'];
 
             // Guess the best date format based on the closest point distance (#568, #3418)
             if (isDateTime && !xDateFormat) {
-                xDateFormat = this.getXDateFormat(point, tooltipOptions, xAxis);
+                xDateFormat = this.getXDateFormat(labelConfig, tooltipOptions, xAxis);
             }
 
             // Insert the footer date format if any
@@ -10075,7 +10148,7 @@
             }
 
             return format(formatString, {
-                point: point,
+                point: labelConfig,
                 series: series
             });
         },
@@ -10255,7 +10328,7 @@
                     directTouch = !shared && s.directTouch;
                     if (s.visible && !noSharedTooltip && !directTouch && pick(s.options.enableMouseTracking, true)) { // #3821
                         kdpointT = s.searchPoint(e, !noSharedTooltip && s.kdDimensions === 1); // #3828
-                        if (kdpointT) {
+                        if (kdpointT && kdpointT.series) { // Point.series becomes null when reset and before redraw (#5197)
                             kdpoints.push(kdpointT);
                         }
                     }
@@ -10376,13 +10449,10 @@
                     if (hoverPoint) { // #2500
                         hoverPoint.setState(hoverPoint.state, true);
                         each(chart.axes, function (axis) {
-                            if (pick(axis.crosshair && axis.crosshair.snap, true)) {
+                            if (axis.crosshair) {
                                 axis.drawCrosshair(null, hoverPoint);
-                            }  else {
-                                axis.hideCrosshair();
                             }
                         });
-
                     }
                 }
 
@@ -10417,8 +10487,7 @@
                     axis.hideCrosshair();
                 });
 
-                pointer.hoverX = chart.hoverPoints = chart.hoverPoint = null;
-
+                pointer.hoverX = pointer.prevKDPoint = chart.hoverPoints = chart.hoverPoint = null;
             }
         },
 
@@ -11535,7 +11604,7 @@
                 // Use the first letter of each alignment option in order to detect the side
                 alignment = options.align.charAt(0) + options.verticalAlign.charAt(0) + options.layout.charAt(0); // #4189 - use charAt(x) notation instead of [x] for IE7
 
-            if (this.display && !options.floating) {
+            if (!options.floating) {
 
                 each([
                     /(lth|ct|rth)/,
@@ -12666,7 +12735,9 @@
             }
 
             // Adjust for legend
-            chart.legend.adjustMargins(margin, spacing);
+            if (chart.legend.display) {
+                chart.legend.adjustMargins(margin, spacing);
+            }
 
             // adjust for scroller
             if (chart.extraBottomMargin) {
@@ -12713,20 +12784,20 @@
             var chart = this,
                 optionsChart = chart.options.chart,
                 renderTo = chart.renderTo,
+                hasUserWidth = defined(optionsChart.width),
                 width = optionsChart.width || getStyle(renderTo, 'width'),
                 height = optionsChart.height || getStyle(renderTo, 'height'),
                 target = e ? e.target : win;
 
             // Width and height checks for display:none. Target is doc in IE8 and Opera,
             // win in Firefox, Chrome and IE9.
-            if (!chart.hasUserSize && !chart.isPrinting && width && height && (target === win || target === doc)) { // #1093
+            if (!hasUserWidth && !chart.isPrinting && width && height && (target === win || target === doc)) { // #1093
                 if (width !== chart.containerWidth || height !== chart.containerHeight) {
                     clearTimeout(chart.reflowTimeout);
                     // When called from window.resize, e is set, else it's called directly (#2224)
                     chart.reflowTimeout = syncTimeout(function () {
                         if (chart.container) { // It may have been destroyed in the meantime (#1257)
-                            chart.setSize(width, height, false);
-                            chart.hasUserSize = null;
+                            chart.setSize(undefined, undefined, false);
                         }
                     }, e ? 100 : 0);
                 }
@@ -12759,8 +12830,6 @@
          */
         setSize: function (width, height, animation) {
             var chart = this,
-                chartWidth,
-                chartHeight,
                 renderer = chart.renderer,
                 globalAnimation;
 
@@ -12772,23 +12841,23 @@
 
             chart.oldChartHeight = chart.chartHeight;
             chart.oldChartWidth = chart.chartWidth;
-            if (defined(width)) {
-                chart.chartWidth = chartWidth = mathMax(0, mathRound(width));
-                chart.hasUserSize = !!chartWidth;
+            if (width !== undefined) {
+                chart.options.chart.width = width;
             }
-            if (defined(height)) {
-                chart.chartHeight = chartHeight = mathMax(0, mathRound(height));
+            if (height !== undefined) {
+                chart.options.chart.height = height;
             }
+            chart.getChartSize();
 
             // Resize the container with the global animation applied if enabled (#2503)
             globalAnimation = renderer.globalAnimation;
             (globalAnimation ? animate : css)(chart.container, {
-                width: chartWidth + PX,
-                height: chartHeight + PX
+                width: chart.chartWidth + PX,
+                height: chart.chartHeight + PX
             }, globalAnimation);
 
             chart.setChartSize(true);
-            renderer.setSize(chartWidth, chartHeight, animation);
+            renderer.setSize(chart.chartWidth, chart.chartHeight, animation);
 
             // handle axes
             chart.maxTicks = null;
@@ -13509,12 +13578,21 @@
             if (pointValKey) {
                 point.y = point[pointValKey];
             }
-            point.isNull = point.x === null || point.y === null;
+            point.isNull = point.x === null || !isNumber(point.y, true); // #3571, check for NaN
 
             // If no x is set by now, get auto incremented value. All points must have an
             // x value, however the y value can be null to create a gap in the series
             if (point.x === undefined && series) {
-                point.x = x === undefined ? series.autoIncrement() : x;
+                if (x === undefined) {
+                    point.x = series.autoIncrement(point);
+                } else {
+                    point.x = x;
+                }
+            }
+
+            // Write the last point's name to the names array
+            if (series.xAxis && series.xAxis.names) {
+                series.xAxis.names[point.x] = point.name;
             }
 
             return point;
@@ -13881,18 +13959,38 @@
          * Return an auto incremented x value based on the pointStart and pointInterval options.
          * This is only used if an x value is not given for the point that calls autoIncrement.
          */
-        autoIncrement: function () {
+        autoIncrement: function (point) {
 
             var options = this.options,
                 xIncrement = this.xIncrement,
                 date,
                 pointInterval,
-                pointIntervalUnit = options.pointIntervalUnit;
+                pointIntervalUnit = options.pointIntervalUnit,
+                xAxis = this.xAxis,
+                explicitCategories,
+                names,
+                nameX;
 
             xIncrement = pick(xIncrement, options.pointStart, 0);
 
             this.pointInterval = pointInterval = pick(this.pointInterval, options.pointInterval, 1);
 
+            // When a point name is given and no x, search for the name in the existing categories,
+            // or if categories aren't provided, search names or create a new category (#2522).
+            if (xAxis && xAxis.categories && point.name) {
+                this.requireSorting = false;
+                explicitCategories = isArray(xAxis.categories);
+                names = explicitCategories ? xAxis.categories : xAxis.names;
+                nameX = inArray(point.name, names); // #2522
+                if (nameX === -1) { // The name is not found in currenct categories
+                    if (!explicitCategories) {
+                        xIncrement = names.length;
+                    }
+                } else {
+                    xIncrement = nameX;
+                }
+            }
+
             // Added code for pointInterval strings
             if (pointIntervalUnit) {
                 date = new Date(xIncrement);
@@ -14031,7 +14129,6 @@
                 chart = series.chart,
                 firstPoint = null,
                 xAxis = series.xAxis,
-                hasCategories = xAxis && !!xAxis.categories,
                 i,
                 turboThreshold = options.turboThreshold,
                 pt,
@@ -14113,9 +14210,6 @@
                             pt = { series: series };
                             series.pointClass.prototype.applyOptions.apply(pt, [data[i]]);
                             series.updateParallelArrays(pt, i);
-                            if (hasCategories && defined(pt.name)) { // #4401
-                                xAxis.names[pt.x] = pt.name; // #2046
-                            }
                         }
                     }
                 }
@@ -14451,7 +14545,7 @@
                     yBottom = stackValues[0];
                     yValue = stackValues[1];
 
-                    if (yBottom === stackThreshold) {
+                    if (yBottom === stackThreshold && stackIndicator.key === stack[xValue].base) {
                         yBottom = pick(threshold, yAxis.min);
                     }
                     if (yAxis.isLog && yBottom <= 0) { // #1200, #1232
@@ -14486,7 +14580,7 @@
 
 
                 // Set client related positions for mouse tracking
-                point.clientX = dynamicallyPlaced ? xAxis.translate(xValue, 0, 0, 0, 1) : plotX; // #1514
+                point.clientX = dynamicallyPlaced ? correctFloat(xAxis.translate(xValue, 0, 0, 0, 1)) : plotX; // #1514
 
                 point.negative = point.y < (threshold || 0);
 
@@ -14549,10 +14643,15 @@
                     );
                 }
                 chart[sharedClipKey] = clipRect = renderer.clipRect(clipBox);
+                // Create hashmap for series indexes
+                clipRect.count = { length: 0 };
 
             }
             if (animation) {
-                clipRect.count += 1;
+                if (!clipRect.count[this.index]) {
+                    clipRect.count[this.index] = true;
+                    clipRect.count.length += 1;
+                }
             }
 
             if (options.clip !== false) {
@@ -14563,8 +14662,12 @@
 
             // Remove the shared clipping rectangle when all series are shown
             if (!animation) {
-                clipRect.count -= 1;
-                if (clipRect.count <= 0 && sharedClipKey && chart[sharedClipKey]) {
+                if (clipRect.count[this.index]) {
+                    delete clipRect.count[this.index];
+                    clipRect.count.length -= 1;
+                }
+
+                if (clipRect.count.length === 0 && sharedClipKey && chart[sharedClipKey]) {
                     if (!seriesClipBox) {
                         chart[sharedClipKey] = chart[sharedClipKey].destroy();
                     }
@@ -14775,7 +14878,7 @@
             if (seriesOptions.marker) { // line, spline, area, areaspline, scatter
 
                 // if no hover radius is given, default to normal radius + 2
-                stateOptionsHover.radius = stateOptionsHover.radius || normalOptions.radius + stateOptionsHover.radiusPlus;
+                stateOptionsHover.radius = +stateOptionsHover.radius || +normalOptions.radius + +stateOptionsHover.radiusPlus;
                 stateOptionsHover.lineWidth = stateOptionsHover.lineWidth || normalOptions.lineWidth + stateOptionsHover.lineWidthPlus;
 
             } else { // column, bar, pie
@@ -14983,6 +15086,7 @@
                 step = options.step,
                 reversed,
                 graphPath = [],
+                xMap = [],
                 gap;
 
             points = points || series.points;
@@ -15008,7 +15112,7 @@
 
                 var plotX = point.plotX,
                     plotY = point.plotY,
-                    lastPoint = points[i - 1],                
+                    lastPoint = points[i - 1],
                     pathToPoint; // the path to this point from the previous
 
                 if ((point.leftCliff || (lastPoint && lastPoint.rightCliff)) && !connectCliffs) {
@@ -15069,12 +15173,18 @@
                         ];
                     }
 
+                    // Prepare for animation. When step is enabled, there are two path nodes for each x value.
+                    xMap.push(point.x);
+                    if (step) {
+                        xMap.push(point.x);
+                    }
 
                     graphPath.push.apply(graphPath, pathToPoint);
                     gap = false;
                 }
             });
 
+            graphPath.xMap = xMap;
             series.graphPath = graphPath;
 
             return graphPath;
@@ -15091,7 +15201,6 @@
                 lineWidth = options.lineWidth,
                 roundCap = options.linecap !== 'square',
                 graphPath = (this.gappedPath || this.getGraphPath).call(this),
-                fillColor = (this.fillGraph && this.color) || NONE, // polygon series use filled graph
                 zones = this.zones;
 
             each(zones, function (threshold, i) {
@@ -15105,13 +15214,14 @@
                     attribs;
 
                 if (graph) {
+                    graph.endX = graphPath.xMap;
                     graph.animate({ d: graphPath });
 
-                } else if ((lineWidth || fillColor) && graphPath.length) { // #1487
+                } else if (lineWidth && graphPath.length) { // #1487
                     attribs = {
                         stroke: prop[1],
                         'stroke-width': lineWidth,
-                        fill: fillColor,
+                        fill: 'none',
                         zIndex: 1 // #1069
                     };
                     if (prop[2]) {
@@ -15120,11 +15230,18 @@
                         attribs['stroke-linecap'] = attribs['stroke-linejoin'] = 'round';
                     }
 
-                    series[graphKey] = series.chart.renderer.path(graphPath)
+                    graph = series[graphKey] = series.chart.renderer.path(graphPath)
                         .attr(attribs)
                         .add(series.group)
                         .shadow((i < 2) && options.shadow); // add shadow to normal series (0) or to first zone (1) #3932
                 }
+
+                // Helpers for animation
+                if (graph) {
+                    graph.startX = graphPath.xMap;
+                    //graph.shiftUnit = options.step ? 2 : 1;
+                    graph.isArea = graphPath.isArea; // For arearange animation
+                }
             });
         },
 
@@ -15897,6 +16014,11 @@
             stack = stacks[key][x];
             if (y !== null) {
                 stack.points[pointKey] = stack.points[series.index] = [pick(stack.cum, stackThreshold)];
+
+                // Record the base of the stack
+                if (!defined(stack.cum)) {
+                    stack.base = pointKey;
+                }
                 stack.touched = yAxis.stacksTouched;
         
 
@@ -16159,7 +16281,7 @@
                 if (point.y === null && graphic) { // #4146
                     point.graphic = graphic.destroy();
                 }
-                if (isObject(options) && !isArray(options)) {
+                if (isObject(options, true)) {
                     // Defer the actual redraw until getAttribs has been called (#3260)
                     point.redraw = function () {
                         if (graphic && graphic.element) {
@@ -16183,7 +16305,7 @@
 
                 // Record the options to options.data. If there is an object from before,
                 // use point options, otherwise use raw options. (#4701)
-                seriesOptions.data[i] =  (isObject(seriesOptions.data[i]) && !isArray(seriesOptions.data[i])) ? point.options : options;
+                seriesOptions.data[i] = isObject(seriesOptions.data[i], true) ? point.options : options;
 
                 // redraw
                 series.isDirty = series.isDirtyData = true;
@@ -16233,12 +16355,8 @@
             var series = this,
                 seriesOptions = series.options,
                 data = series.data,
-                graph = series.graph,
-                area = series.area,
                 chart = series.chart,
                 names = series.xAxis && series.xAxis.names,
-                currentShift = (graph && graph.shift) || 0,
-                shiftShapes = ['graph', 'area'],
                 dataOptions = seriesOptions.data,
                 point,
                 isInTheMiddle,
@@ -16248,22 +16366,6 @@
 
             setAnimation(animation, chart);
 
-            // Make graph animate sideways
-            if (shift) {
-                i = series.zones.length;
-                while (i--) {
-                    shiftShapes.push('zoneGraph' + i, 'zoneArea' + i);
-                }
-                each(shiftShapes, function (shape) {
-                    if (series[shape]) {
-                        series[shape].shift = currentShift + (seriesOptions.step ? 2 : 1);
-                    }
-                });
-            }
-            if (area) {
-                area.isArea = true; // needed in animation, both with and without shift
-            }
-
             // Optional redraw, defaults to true
             redraw = pick(redraw, true);
 
@@ -16455,7 +16557,6 @@
             newOptions = chart.options[this.coll][this.options.index] = merge(this.userOptions, newOptions);
 
             this.destroy(true);
-            this._addedPlotLB = this.chart._labelPanes = UNDEFINED; // #1611, #2887, #4314
 
             this.init(chart, extend(newOptions, { events: UNDEFINED }));
 
@@ -16761,6 +16862,7 @@
             areaPath = topPath.concat(bottomPath);
             graphPath = getGraphPath.call(this, graphPoints, false, connectNulls); // TODO: don't set leftCliff and rightCliff when connectNulls?
 
+            areaPath.xMap = topPath.xMap;
             this.areaPath = areaPath;
             return graphPath;
         },
@@ -16795,6 +16897,7 @@
 
                 // Create or update the area
                 if (area) { // update
+                    area.endX = areaPath.xMap;
                     area.animate({ d: areaPath });
 
                 } else { // create
@@ -16805,10 +16908,13 @@
                     if (!prop[2]) {
                         attr['fill-opacity'] = pick(options.fillOpacity, 0.75);
                     }
-                    series[areaKey] = series.chart.renderer.path(areaPath)
+                    area = series[areaKey] = series.chart.renderer.path(areaPath)
                         .attr(attr)
                         .add(series.group);
+                    area.isArea = true;
                 }
+                area.startX = areaPath.xMap;
+                area.shiftUnit = options.step ? 2 : 1;
             });
         },
 
@@ -17611,6 +17717,10 @@
             // Get the total sum
             for (i = 0; i < len; i++) {
                 point = points[i];
+                // Disallow negative values (#1530, #3623, #5322)
+                if (point.y < 0) {
+                    point.y = null;
+                }
                 total += (ignoreHiddenPoint && !point.visible) ? 0 : point.y;
             }
             this.total = total;
@@ -17887,8 +17997,8 @@
                 dataLabelsGroup.attr({ opacity: +hasRendered }); // #3300
                 if (!hasRendered) {
                     addEvent(series, 'afterAnimate', function () {
-                        if (series.visible) { // #3023, #3024
-                            dataLabelsGroup.show();
+                        if (series.visible) { // #2597, #3023, #3024
+                            dataLabelsGroup.show(true);
                         }
                         dataLabelsGroup[seriesOptions.animation ? 'animate' : 'attr']({ opacity: 1 }, { duration: 200 });
                     });