highcharts 9.3.3 → 10.0.0

package/es-modules/Core/HttpUtilities.js

@@ -63,21 +63,26 @@ function ajax(attr) {
     objectEach(options.headers, function (val, key) {
         r.setRequestHeader(key, val);
     });
+    if (options.responseType) {
+        r.responseType = options.responseType;
+    }
     // @todo lacking timeout handling
     r.onreadystatechange = function () {
         var res;
         if (r.readyState === 4) {
             if (r.status === 200) {
-                res = r.responseText;
-                if (options.dataType === 'json') {
-                    try {
-                        res = JSON.parse(res);
-                    }
-                    catch (e) {
-                        return handleError(r, e);
+                if (options.responseType !== 'blob') {
+                    res = r.responseText;
+                    if (options.dataType === 'json') {
+                        try {
+                            res = JSON.parse(res);
+                        }
+                        catch (e) {
+                            return handleError(r, e);
+                        }
                     }
                 }
-                return options.success && options.success(res);
+                return options.success && options.success(res, r);
             }
             handleError(r, r.responseText);
         }

package/es-modules/Core/Legend/Legend.js

@@ -68,7 +68,7 @@ var Legend = /** @class */ (function () {
         this.maxItemWidth = 0;
         this.maxLegendWidth = 0;
         this.offsetWidth = 0;
-        this.options = {};
+        this.options = void 0;
         this.padding = 0;
         this.pages = [];
         this.proximate = false;
@@ -378,7 +378,7 @@ var Legend = /** @class */ (function () {
                  * @name Highcharts.Legend#title
                  * @type {Highcharts.SVGElement}
                  */
-                this.title = this.chart.renderer.label(titleOptions.text, padding - 3, padding - 4, null, null, null, options.useHTML, null, 'legend-title')
+                this.title = this.chart.renderer.label(titleOptions.text, padding - 3, padding - 4, void 0, void 0, void 0, options.useHTML, void 0, 'legend-title')
                     .attr({ zIndex: 1 });
                 if (!this.chart.styledMode) {
                     this.title.css(titleOptions.style);
@@ -704,8 +704,7 @@ var Legend = /** @class */ (function () {
         legend.lastItemY = 0;
         legend.widthOption = relativeLength(options.width, chart.spacingBox.width - padding);
         // Compute how wide the legend is allowed to be
-        allowedWidth =
-            chart.spacingBox.width - 2 * padding - options.x;
+        allowedWidth = chart.spacingBox.width - 2 * padding - options.x;
         if (['rm', 'lm'].indexOf(legend.getAlignment().substring(0, 2)) > -1) {
             allowedWidth /= 2;
         }
@@ -778,7 +777,6 @@ var Legend = /** @class */ (function () {
                 r: options.borderRadius
             })
                 .add(legendGroup);
-            box.isNew = true;
         }
         // Presentational
         if (!chart.styledMode) {
@@ -791,13 +789,12 @@ var Legend = /** @class */ (function () {
                 .shadow(options.shadow);
         }
         if (legendWidth > 0 && legendHeight > 0) {
-            box[box.isNew ? 'attr' : 'animate'](box.crisp.call({}, {
+            box[box.placed ? 'animate' : 'attr'](box.crisp.call({}, {
                 x: 0,
                 y: 0,
                 width: legendWidth,
                 height: legendHeight
             }, box.strokeWidth()));
-            box.isNew = false;
         }
         // hide the border if no items
         box[display ? 'show' : 'hide']();
@@ -839,6 +836,11 @@ var Legend = /** @class */ (function () {
         if (y !== alignTo.y) {
             alignTo = merge(alignTo, { y: y });
         }
+        if (!chart.hasRendered) {
+            // Avoid animation when adjusting alignment for responsiveness and
+            // colorAxis label layout
+            this.group.placed = false;
+        }
         this.group.align(merge(options, {
             width: this.legendWidth,
             height: this.legendHeight,
@@ -953,7 +955,7 @@ var Legend = /** @class */ (function () {
                 });
                 this.pager = renderer.text('', 15, 10)
                     .addClass('highcharts-legend-navigation');
-                if (!chart.styledMode) {
+                if (!chart.styledMode && navOptions.style) {
                     this.pager.css(navOptions.style);
                 }
                 this.pager.add(nav);

package/es-modules/Core/Navigator.js

@@ -747,19 +747,21 @@ var Navigator = /** @class */ (function () {
             maskInside,
             !maskInside
         ].forEach(function (hasMask, index) {
-            navigator.shades[index] = renderer.rect()
+            var shade = renderer.rect()
                 .addClass('highcharts-navigator-mask' +
                 (index === 1 ? '-inside' : '-outside'))
                 .add(navigatorGroup);
             if (!chart.styledMode) {
-                navigator.shades[index]
-                    .attr({
+                shade.attr({
                     fill: hasMask ?
                         navigatorOptions.maskFill :
                         'rgba(0,0,0,0)'
-                })
-                    .css((index === 1) && mouseCursor);
+                });
+                if (index === 1) {
+                    shade.css(mouseCursor);
+                }
             }
+            navigator.shades[index] = shade;
         });
         // Create the outline:
         navigator.outline = renderer.path()
@@ -1643,7 +1645,8 @@ var Navigator = /** @class */ (function () {
     Navigator.prototype.getBaseSeriesMin = function (currentSeriesMin) {
         return this.baseSeries.reduce(function (min, series) {
             // (#10193)
-            return Math.min(min, series.xData ? series.xData[0] : min);
+            return Math.min(min, series.xData && series.xData.length ?
+                series.xData[0] : min);
         }, currentSeriesMin);
     };
     /**

package/es-modules/Core/Pointer.js

@@ -600,9 +600,9 @@ var Pointer = /** @class */ (function () {
      * name.
      */
     Pointer.prototype.inClass = function (element, className) {
-        var elemClassName;
-        while (element) {
-            elemClassName = attr(element, 'class');
+        var elem = element, elemClassName;
+        while (elem) {
+            elemClassName = attr(elem, 'class');
             if (elemClassName) {
                 if (elemClassName.indexOf(className) !== -1) {
                     return true;
@@ -611,7 +611,7 @@ var Pointer = /** @class */ (function () {
                     return false;
                 }
             }
-            element = element.parentNode;
+            elem = elem.parentElement;
         }
     };
     /**
@@ -652,6 +652,9 @@ var Pointer = /** @class */ (function () {
      * properties `chartX` and `chartY` in order to work on the internal
      * coordinate system.
      *
+     * On map charts, the properties `lon` and `lat` are added to the event
+     * object given that the chart has projection information.
+     *
      * @function Highcharts.Pointer#normalize
      *
      * @param {global.MouseEvent|global.PointerEvent|global.TouchEvent} e
@@ -1199,11 +1202,12 @@ var Pointer = /** @class */ (function () {
              * The mouseOver event should be triggered when hoverPoint
              * is correct.
              */
-            hoverPoint.firePointEvent('mouseOver');
-            // Draw tooltip if necessary
-            if (tooltip) {
-                tooltip.refresh(useSharedTooltip ? points : hoverPoint, e);
-            }
+            hoverPoint.firePointEvent('mouseOver', void 0, function () {
+                // Draw tooltip if necessary
+                if (tooltip && hoverPoint) {
+                    tooltip.refresh(useSharedTooltip ? points : hoverPoint, e);
+                }
+            });
             // Update positions (regardless of kdpoint or hoverPoint)
         }
         else if (followPointer && tooltip && !tooltip.isHidden) {
@@ -1232,7 +1236,7 @@ var Pointer = /** @class */ (function () {
                 point = chart.hoverPoint; // #13002
                 if (!point || point.series[axis.coll] !== axis) {
                     point = find(points, function (p) {
-                        return p.series[axis.coll] === axis;
+                        return p.series && p.series[axis.coll] === axis;
                     });
                 }
             }
@@ -1320,7 +1324,7 @@ var Pointer = /** @class */ (function () {
         var hoverChart = H.charts[pick(Pointer.hoverChartIndex, -1)];
         if (hoverChart &&
             hoverChart !== chart) {
-            hoverChart.pointer.onContainerMouseLeave({ relatedTarget: true });
+            hoverChart.pointer.onContainerMouseLeave({ relatedTarget: chart.container });
         }
         if (!hoverChart ||
             !hoverChart.mouseIsDown) {

package/es-modules/Core/Renderer/HTML/AST.js

@@ -11,7 +11,7 @@
 import H from '../../Globals.js';
 var SVG_NS = H.SVG_NS, win = H.win;
 import U from '../../Utilities.js';
-var attr = U.attr, createElement = U.createElement, error = U.error, isFunction = U.isFunction, isString = U.isString, objectEach = U.objectEach, splat = U.splat;
+var attr = U.attr, createElement = U.createElement, css = U.css, error = U.error, isFunction = U.isFunction, isString = U.isString, objectEach = U.objectEach, splat = U.splat;
 var trustedTypes = win.trustedTypes;
 /* *
  *
@@ -97,6 +97,17 @@ var AST = /** @class */ (function () {
         });
         return attributes;
     };
+    AST.parseStyle = function (style) {
+        return style
+            .split(';')
+            .reduce(function (styles, line) {
+            var pair = line.split(':').map(function (s) { return s.trim(); }), key = pair[0].replace(/-([a-z])/g, function (g) { return g[1].toUpperCase(); });
+            if (pair[1]) {
+                styles[key] = pair[1];
+            }
+            return styles;
+        }, {});
+    };
     /**
      * Utility function to set html content for an element by passing in a
      * markup string. The markup is safely parsed by the AST class to avoid
@@ -152,12 +163,15 @@ var AST = /** @class */ (function () {
                 var textNode = item.textContent ?
                     H.doc.createTextNode(item.textContent) :
                     void 0;
+                // Whether to ignore the AST filtering totally, #15345
+                var bypassHTMLFiltering = AST.bypassHTMLFiltering;
                 var node;
                 if (tagName) {
                     if (tagName === '#text') {
                         node = textNode;
                     }
-                    else if (AST.allowedTags.indexOf(tagName) !== -1) {
+                    else if (AST.allowedTags.indexOf(tagName) !== -1 ||
+                        bypassHTMLFiltering) {
                         var NS = tagName === 'svg' ?
                             SVG_NS :
                             (subParent.namespaceURI || SVG_NS);
@@ -169,11 +183,17 @@ var AST = /** @class */ (function () {
                             if (key !== 'tagName' &&
                                 key !== 'attributes' &&
                                 key !== 'children' &&
+                                key !== 'style' &&
                                 key !== 'textContent') {
                                 attributes_1[key] = val;
                             }
                         });
-                        attr(element, AST.filterUserAttributes(attributes_1));
+                        attr(element, bypassHTMLFiltering ?
+                            attributes_1 :
+                            AST.filterUserAttributes(attributes_1));
+                        if (item.style) {
+                            css(element, item.style);
+                        }
                         // Add text content
                         if (textNode) {
                             element.appendChild(textNode);
@@ -212,7 +232,11 @@ var AST = /** @class */ (function () {
      */
     AST.prototype.parseMarkup = function (markup) {
         var nodes = [];
-        markup = markup.trim();
+        markup = markup
+            .trim()
+            // The style attribute throws a warning when parsing when CSP is
+            // enabled (#6884), so use an alias and pick it up below
+            .replace(/ style="/g, ' data-style="');
         var doc;
         if (hasValidDOMParser) {
             doc = new DOMParser().parseFromString(trustedTypesPolicy ?
@@ -238,7 +262,12 @@ var AST = /** @class */ (function () {
             if (parsedAttributes) {
                 var attributes_2 = {};
                 [].forEach.call(parsedAttributes, function (attrib) {
-                    attributes_2[attrib.name] = attrib.value;
+                    if (attrib.name === 'data-style') {
+                        astNode.style = AST.parseStyle(attrib.value);
+                    }
+                    else {
+                        attributes_2[attrib.name] = attrib.value;
+                    }
                 });
                 astNode.attributes = attributes_2;
             }
@@ -442,6 +471,34 @@ var AST = /** @class */ (function () {
         '#text'
     ];
     AST.emptyHTML = emptyHTML;
+    /**
+     * Allow all custom SVG and HTML attributes, references and tags (together
+     * with potentially harmful ones) to be added to the DOM from the chart
+     * configuration. In other words, disable the the allow-listing which is the
+     * primary functionality of the AST.
+     *
+     * WARNING: Setting this property to `true` while allowing untrusted user
+     * data in the chart configuration will expose your application to XSS
+     * security risks!
+     *
+     * Note that in case you want to allow a known set of tags or attributes,
+     * you should allow-list them instead of disabling the filtering totally.
+     * See [allowedAttributes](Highcharts.AST#.allowedAttributes),
+     * [allowedReferences](Highcharts.AST#.allowedReferences) and
+     * [allowedTags](Highcharts.AST#.allowedTags). The `bypassHTMLFiltering`
+     * setting is intended only for those cases where allow-listing is not
+     * practical, and the chart configuration already comes from a secure
+     * source.
+     *
+     * @example
+     * // Allow all custom attributes, references and tags (disable DOM XSS
+     * // filtering)
+     * Highcharts.AST.bypassHTMLFiltering = true;
+     *
+     * @name Highcharts.AST.bypassHTMLFiltering
+     * @static
+     */
+    AST.bypassHTMLFiltering = false;
     return AST;
 }());
 /* *

package/es-modules/Core/Renderer/SVG/SVGElement.js

@@ -351,7 +351,7 @@ var SVGElement = /** @class */ (function () {
             }, deferTime);
         }
         else {
-            this.attr(params, void 0, complete);
+            this.attr(params, void 0, complete || animOptions.complete);
             // Call the end step synchronously
             objectEach(params, function (val, prop) {
                 if (animOptions.step) {
@@ -731,22 +731,17 @@ var SVGElement = /** @class */ (function () {
      *         Return the SVG element for chaining.
      */
     SVGElement.prototype.css = function (styles) {
-        var oldStyles = this.styles, newStyles = {}, elem = this.element, 
-        // These CSS properties are interpreted internally by the SVG
-        // renderer, but are not supported by SVG and should not be added to
-        // the DOM. In styled mode, no CSS should find its way to the DOM
-        // whatsoever (#6173, #6474).
-        svgPseudoProps = ['textOutline', 'textOverflow', 'width'];
-        var textWidth, serializedCss = '', hyphenate, hasNew = !oldStyles;
+        var oldStyles = this.styles, newStyles = {}, elem = this.element;
+        var textWidth, hasNew = !oldStyles;
         // convert legacy
-        if (styles && styles.color) {
+        if (styles.color) {
             styles.fill = styles.color;
         }
         // Filter out existing styles to increase performance (#2640)
         if (oldStyles) {
-            objectEach(styles, function (style, n) {
-                if (oldStyles && oldStyles[n] !== style) {
-                    newStyles[n] = style;
+            objectEach(styles, function (value, n) {
+                if (oldStyles && oldStyles[n] !== value) {
+                    newStyles[n] = value;
                     hasNew = true;
                 }
             });
@@ -757,41 +752,30 @@ var SVGElement = /** @class */ (function () {
                 styles = extend(oldStyles, newStyles);
             }
             // Get the text width from style
-            if (styles) {
-                // Previously set, unset it (#8234)
-                if (styles.width === null || styles.width === 'auto') {
-                    delete this.textWidth;
-                    // Apply new
-                }
-                else if (elem.nodeName.toLowerCase() === 'text' &&
-                    styles.width) {
-                    textWidth = this.textWidth = pInt(styles.width);
-                }
+            // Previously set, unset it (#8234)
+            if (styles.width === null || styles.width === 'auto') {
+                delete this.textWidth;
+                // Apply new
+            }
+            else if (elem.nodeName.toLowerCase() === 'text' &&
+                styles.width) {
+                textWidth = this.textWidth = pInt(styles.width);
             }
             // store object
             this.styles = styles;
             if (textWidth && (!svg && this.renderer.forExport)) {
                 delete styles.width;
             }
-            // Serialize and set style attribute
-            if (elem.namespaceURI === this.SVG_NS) { // #7633
-                hyphenate = function (a, b) {
-                    return '-' + b.toLowerCase();
-                };
-                objectEach(styles, function (style, n) {
-                    if (svgPseudoProps.indexOf(n) === -1) {
-                        serializedCss +=
-                            n.replace(/([A-Z])/g, hyphenate) + ':' +
-                                style + ';';
-                    }
-                });
-                if (serializedCss) {
-                    attr(elem, 'style', serializedCss); // #1881
-                }
-            }
-            else {
-                css(elem, styles);
+            var stylesToApply_1 = merge(styles);
+            if (elem.namespaceURI === this.SVG_NS) {
+                // These CSS properties are interpreted internally by the SVG
+                // renderer, but are not supported by SVG and should not be
+                // added to the DOM. In styled mode, no CSS should find its way
+                // to the DOM whatsoever (#6173, #6474).
+                ['textOutline', 'textOverflow', 'width'].forEach(function (key) { return (stylesToApply_1 &&
+                    delete stylesToApply_1[key]); });
             }
+            css(elem, stylesToApply_1);
             if (this.added) {
                 // Rebuild text after added. Cache mechanisms in the buildText
                 // will prevent building if there are no significant changes.
@@ -799,7 +783,7 @@ var SVGElement = /** @class */ (function () {
                     this.renderer.buildText(this);
                 }
                 // Apply text outline after added
-                if (styles && styles.textOutline) {
+                if (styles.textOutline) {
                     this.applyTextOutline(styles.textOutline);
                 }
             }

package/es-modules/Core/Renderer/SVG/SVGElement3D.js

@@ -31,10 +31,21 @@ SVGElement3D.base = {
         var elem3d = this, renderer = elem3d.renderer, paths = renderer[elem3d.pathType + 'Path'](args), zIndexes = paths.zIndexes;
         // build parts
         elem3d.parts.forEach(function (part) {
-            elem3d[part] = renderer.path(paths[part]).attr({
+            var attribs = {
                 'class': 'highcharts-3d-' + part,
                 zIndex: zIndexes[part] || 0
-            }).add(elem3d);
+            };
+            if (renderer.styledMode) {
+                if (part === 'top') {
+                    attribs.filter = 'url(#highcharts-brighter)';
+                }
+                else if (part === 'side') {
+                    attribs.filter = 'url(#highcharts-darker)';
+                }
+            }
+            elem3d[part] = renderer.path(paths[part])
+                .attr(attribs)
+                .add(elem3d);
         });
         elem3d.attr({
             'stroke-linejoin': 'round',
@@ -126,11 +137,12 @@ SVGElement3D.cuboid = merge(SVGElement3D.base, {
             this.attr({
                 zIndex: paths.zIndexes.group
             });
-            // If sides that are forced to render changed, recalculate
-            // colors.
+            // If sides that are forced to render changed, recalculate colors.
             if (forcedSides !== this.forcedSides) {
                 this.forcedSides = forcedSides;
-                SVGElement3D.cuboid.fillSetter.call(this, this.fill);
+                if (!this.renderer.styledMode) {
+                    SVGElement3D.cuboid.fillSetter.call(this, this.fill);
+                }
             }
         }
         else {

package/es-modules/Core/Renderer/SVG/SVGRenderer.js

@@ -193,7 +193,7 @@ var SVGRenderer = /** @class */ (function () {
         this.url = this.getReferenceURL();
         // Add description
         var desc = this.createElement('desc').add();
-        desc.element.appendChild(doc.createTextNode('Created with Highcharts 9.3.3'));
+        desc.element.appendChild(doc.createTextNode('Created with Highcharts 10.0.0'));
         renderer.defs = this.createElement('defs').add();
         renderer.allowHTML = allowHTML;
         renderer.forExport = forExport;
@@ -523,29 +523,26 @@ var SVGRenderer = /** @class */ (function () {
         // Make a copy of normalState (#13798)
         // (reference to options.rangeSelector.buttonTheme)
         normalState = theme ? merge(theme) : {};
-        var userNormalStyle = normalState && normalState.style || {};
+        var normalStyle = merge({
+            color: "#333333" /* neutralColor80 */,
+            cursor: 'pointer',
+            fontWeight: 'normal'
+        }, normalState.style);
+        delete normalState.style;
         // Remove stylable attributes
         normalState = AST.filterUserAttributes(normalState);
         // Default, non-stylable attributes
         label.attr(merge({ padding: 8, r: 2 }, normalState));
-        // Presentational
-        var normalStyle, hoverStyle, pressedStyle, disabledStyle;
+        // Presentational. The string type is a mistake, it is just for
+        // compliance with SVGAttribute and is not used in button theme.
+        var hoverStyle, pressedStyle, disabledStyle;
         if (!styledMode) {
             // Normal state - prepare the attributes
             normalState = merge({
                 fill: "#f7f7f7" /* neutralColor3 */,
                 stroke: "#cccccc" /* neutralColor20 */,
-                'stroke-width': 1,
-                style: {
-                    color: "#333333" /* neutralColor80 */,
-                    cursor: 'pointer',
-                    fontWeight: 'normal'
-                }
-            }, {
-                style: userNormalStyle
+                'stroke-width': 1
             }, normalState);
-            normalStyle = normalState.style;
-            delete normalState.style;
             // Hover state
             hoverState = merge(normalState, {
                 fill: "#e6e6e6" /* neutralColor10 */
@@ -600,13 +597,16 @@ var SVGRenderer = /** @class */ (function () {
                     hoverState,
                     pressedState,
                     disabledState
-                ][state || 0])
-                    .css([
+                ][state || 0]);
+                var css_1 = [
                     normalStyle,
                     hoverStyle,
                     pressedStyle,
                     disabledStyle
-                ][state || 0]);
+                ][state || 0];
+                if (isObject(css_1)) {
+                    label.css(css_1);
+                }
             }
         };
         // Presentational attributes

package/es-modules/Core/Renderer/SVG/TextBuilder.js

@@ -12,7 +12,7 @@ import AST from '../HTML/AST.js';
 import H from '../../Globals.js';
 var doc = H.doc, SVG_NS = H.SVG_NS, win = H.win;
 import U from '../../Utilities.js';
-var attr = U.attr, isString = U.isString, objectEach = U.objectEach, pick = U.pick;
+var attr = U.attr, extend = U.extend, isString = U.isString, objectEach = U.objectEach, pick = U.pick;
 /* *
  *
  *  Class
@@ -280,27 +280,29 @@ var TextBuilder = /** @class */ (function () {
     TextBuilder.prototype.modifyTree = function (nodes) {
         var _this = this;
         var modifyChild = function (node, i) {
-            var _a = node.attributes, attributes = _a === void 0 ? {} : _a, children = node.children, tagName = node.tagName, styledMode = _this.renderer.styledMode;
+            var _a = node.attributes, attributes = _a === void 0 ? {} : _a, children = node.children, _b = node.style, style = _b === void 0 ? {} : _b, tagName = node.tagName, styledMode = _this.renderer.styledMode;
             // Apply styling to text tags
             if (tagName === 'b' || tagName === 'strong') {
                 if (styledMode) {
-                    attributes['class'] = 'highcharts-strong'; // eslint-disable-line dot-notation
+                    // eslint-disable-next-line dot-notation
+                    attributes['class'] = 'highcharts-strong';
                 }
                 else {
-                    attributes.style = ('font-weight:bold;' + (attributes.style || ''));
+                    style.fontWeight = 'bold';
                 }
             }
             else if (tagName === 'i' || tagName === 'em') {
                 if (styledMode) {
-                    attributes['class'] = 'highcharts-emphasized'; // eslint-disable-line dot-notation
+                    // eslint-disable-next-line dot-notation
+                    attributes['class'] = 'highcharts-emphasized';
                 }
                 else {
-                    attributes.style = ('font-style:italic;' + (attributes.style || ''));
+                    style.fontStyle = 'italic';
                 }
             }
-            // Modify attributes
-            if (isString(attributes.style)) {
-                attributes.style = attributes.style.replace(/(;| |^)color([ :])/, '$1fill$2');
+            // Modify styling
+            if (style && style.color) {
+                style.fill = style.color;
             }
             // Handle breaks
             if (tagName === 'br') {
@@ -325,7 +327,7 @@ var TextBuilder = /** @class */ (function () {
             if (tagName !== '#text' && tagName !== 'a') {
                 node.tagName = 'tspan';
             }
-            node.attributes = attributes;
+            extend(node, { attributes: attributes, style: style });
             // Recurse
             if (children) {
                 children

package/es-modules/Core/Series/DataLabel.js

@@ -259,8 +259,8 @@ var DataLabel;
                         point.connectors[i] :
                         point.connector;
                     var labelConfig, formatString, labelText, style, rotation, attr, dataLabel = point.dataLabels ?
-                        point.dataLabels[i] : point.dataLabel;
-                    var labelDistance = pick(labelOptions.distance, point.labelDistance), isNew = !dataLabel;
+                        point.dataLabels[i] : point.dataLabel, isNew = !dataLabel;
+                    var labelDistance = pick(labelOptions.distance, point.labelDistance);
                     if (labelEnabled) {
                         // Create individual options structure that can be
                         // extended without affecting others
@@ -314,7 +314,15 @@ var DataLabel;
                     // #820
                     if (dataLabel && (!labelEnabled ||
                         !defined(labelText) ||
-                        !!dataLabel.div !== !!labelOptions.useHTML)) {
+                        !!dataLabel.div !== !!labelOptions.useHTML ||
+                        (
+                        // Change from no rotation to rotation and
+                        // vice versa. Don't use defined() because
+                        // rotation = 0 means also rotation = undefined
+                        (!dataLabel.rotation ||
+                            !labelOptions.rotation) &&
+                            dataLabel.rotation !== labelOptions.rotation))) {
+                        isNew = true;
                         point.dataLabel = dataLabel =
                             point.dataLabel && point.dataLabel.destroy();
                         if (point.dataLabels) {

package/es-modules/Core/Series/Point.js

@@ -1133,7 +1133,7 @@ export default Point;
 * @type {Highcharts.Point}
 */
 /**
- * Configuration hash for the data label and tooltip formatters.
+ * Configuration for the data label and tooltip formatters.
  *
  * @interface Highcharts.PointLabelObject
  */ /**
@@ -1175,7 +1175,7 @@ export default Point;
 */ /**
 * The y value of the point.
 * @name Highcharts.PointLabelObject#y
-* @type {number|undefined}
+* @type {number|null|undefined}
 */
 /**
  * Gets fired when the mouse leaves the area close to the point.