highcharts 10.3.1 → 10.3.2

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

@@ -1780,7 +1780,10 @@ var Series = /** @class */ (function () {
                     else if (isInside &&
                         ((markerAttribs.width || 0) > 0 || point.hasImage)) {
                         /**
-                         * The graphic representation of the point.
+                         * SVG graphic representing the point in the chart. In
+                         * some cases it may be a hidden graphic to improve
+                         * accessibility.
+                         *
                          * Typically this is a simple shape, like a `rect`
                          * for column charts or `path` for line markers, but
                          * for some complex series types like boxplot or 3D
@@ -1789,8 +1792,10 @@ var Series = /** @class */ (function () {
                          * the first time {@link Series#drawPoints} runs,
                          * and updated and moved on subsequent runs.
                          *
-                         * @name Point#graphic
-                         * @type {SVGElement}
+                         * @see Highcharts.Point#graphics
+                         *
+                         * @name Highcharts.Point#graphic
+                         * @type {Highcharts.SVGElement|undefined}
                          */
                         point.graphic = graphic = chart.renderer
                             .symbol(symbol, markerAttribs.x, markerAttribs.y, markerAttribs.width, markerAttribs.height, hasPointMarker ?
@@ -2111,47 +2116,6 @@ var Series = /** @class */ (function () {
             }
         }
     };
-    /**
-     * Initialize and perform group inversion on series.group and
-     * series.markerGroup.
-     *
-     * @private
-     * @function Highcharts.Series#invertGroups
-     */
-    Series.prototype.invertGroups = function (inverted) {
-        var series = this, chart = series.chart;
-        /**
-         * @private
-         */
-        function setInvert() {
-            ['group', 'markerGroup'].forEach(function (groupName) {
-                if (series[groupName]) {
-                    // VML/HTML needs explicit attributes for flipping
-                    if (chart.renderer.isVML) {
-                        series[groupName].attr({
-                            width: series.yAxis.len,
-                            height: series.xAxis.len
-                        });
-                    }
-                    series[groupName].width = series.yAxis.len;
-                    series[groupName].height = series.xAxis.len;
-                    // If inverted polar, don't invert series group
-                    series[groupName].invert(series.isRadialSeries ? false : inverted);
-                }
-            });
-        }
-        // Pie, go away (#1736)
-        if (!series.xAxis) {
-            return;
-        }
-        // A fixed size is needed for inversion to work
-        series.eventsToUnbind.push(addEvent(chart, 'resize', setInvert));
-        // Do it now
-        setInvert();
-        // On subsequent render and redraw, just do setInvert without
-        // setting up events again
-        series.invertGroups = setInvert;
-    };
     /**
      * General abstraction for creating plot groups like series.group,
      * series.dataLabelsGroup and series.markerGroup. On subsequent calls,
@@ -2191,7 +2155,7 @@ var Series = /** @class */ (function () {
                 ' highcharts-tracker' :
                 '')), true);
         // Place it on first and subsequent (redraw) calls
-        group.attr(attrs)[isNew ? 'attr' : 'animate'](this.getPlotBox());
+        group.attr(attrs)[isNew ? 'attr' : 'animate'](this.getPlotBox(name));
         return group;
     };
     /**
@@ -2199,18 +2163,29 @@ var Series = /** @class */ (function () {
      *
      * @function Highcharts.Series#getPlotBox
      */
-    Series.prototype.getPlotBox = function () {
-        var chart = this.chart;
-        var xAxis = this.xAxis, yAxis = this.yAxis;
+    Series.prototype.getPlotBox = function (name) {
+        var horAxis = this.xAxis, vertAxis = this.yAxis;
+        var chart = this.chart, inverted = (chart.inverted &&
+            !chart.polar &&
+            horAxis &&
+            this.invertible !== false &&
+            (name === 'markers' || name === 'series'));
         // Swap axes for inverted (#2339)
         if (chart.inverted) {
-            xAxis = yAxis;
-            yAxis = this.xAxis;
+            horAxis = vertAxis;
+            vertAxis = this.xAxis;
         }
         return {
-            translateX: xAxis ? xAxis.left : chart.plotLeft,
-            translateY: yAxis ? yAxis.top : chart.plotTop,
-            scaleX: 1,
+            translateX: horAxis ? horAxis.left : chart.plotLeft,
+            translateY: vertAxis ? vertAxis.top : chart.plotTop,
+            rotation: inverted ? 90 : 0,
+            rotationOriginX: inverted ?
+                (horAxis.len - vertAxis.len) / 2 :
+                0,
+            rotationOriginY: inverted ?
+                (horAxis.len + vertAxis.len) / 2 :
+                0,
+            scaleX: inverted ? -1 : 1,
             scaleY: 1
         };
     };
@@ -2263,10 +2238,6 @@ var Series = /** @class */ (function () {
         if (series.animate && animDuration) {
             series.animate(true);
         }
-        // SVGRenderer needs to know this before drawing elements (#1089,
-        // #1795)
-        group.inverted = pick(series.invertible, series.isCartesian) ?
-            inverted : false;
         // Draw the graph if any
         if (series.drawGraph) {
             series.drawGraph();
@@ -2290,8 +2261,6 @@ var Series = /** @class */ (function () {
             series.options.enableMouseTracking !== false) {
             series.drawTracker();
         }
-        // Handle inverted series and tracker groups
-        series.invertGroups(inverted);
         // Run the animation
         if (series.animate && animDuration) {
             series.animate();
@@ -2323,24 +2292,10 @@ var Series = /** @class */ (function () {
      * @function Highcharts.Series#redraw
      */
     Series.prototype.redraw = function () {
-        var series = this, chart = series.chart, 
-        // cache it here as it is set to false in render, but used after
-        wasDirty = series.isDirty || series.isDirtyData, group = series.group, xAxis = series.xAxis, yAxis = series.yAxis;
-        // reposition on resize
-        if (group) {
-            if (chart.inverted) {
-                group.attr({
-                    width: chart.plotWidth,
-                    height: chart.plotHeight
-                });
-            }
-            group.animate({
-                translateX: pick(xAxis && xAxis.left, chart.plotLeft),
-                translateY: pick(yAxis && yAxis.top, chart.plotTop)
-            });
-        }
-        series.translate();
-        series.render();
+        // Cache it here as it is set to false in render, but used after
+        var wasDirty = this.isDirty || this.isDirtyData;
+        this.translate();
+        this.render();
         if (wasDirty) { // #3868, #3945
             delete this.kdTree;
         }
@@ -3152,7 +3107,7 @@ var Series = /** @class */ (function () {
                         lineWidth + (stateOptions[state].lineWidthPlus || 0)); // #4035
                     opacity = pick(stateOptions[state].opacity, opacity);
                 }
-                if (graph && !graph.dashstyle) {
+                if (graph && !graph.dashstyle && isNumber(lineWidth)) {
                     attribs = {
                         'stroke-width': lineWidth
                     };

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

@@ -172,7 +172,10 @@ var seriesDefaults = {
     /**
      * An additional class name to apply to the series' graphical elements.
      * This option does not replace default class names of the graphical
-     * element.
+     * element. Changes to the series' color will also be reflected in a
+     * chart's legend and tooltip.
+     *
+     * @sample {highcharts} highcharts/css/point-series-classname
      *
      * @type      {string}
      * @since     5.0.0

package/es-modules/Core/Tooltip.js

@@ -263,6 +263,26 @@ var Tooltip = /** @class */ (function () {
         }
         return ret.map(Math.round);
     };
+    /**
+     * Get the CSS class names for the tooltip's label. Styles the label
+     * by `colorIndex` or user-defined CSS.
+     *
+     * @function Highcharts.Tooltip#getClassName
+     *
+     * @return {string}
+     *         The class names.
+     */
+    Tooltip.prototype.getClassName = function (point, isSplit, isHeader) {
+        var options = this.options, series = point.series, seriesOptions = series.options;
+        return [
+            options.className,
+            'highcharts-label',
+            isHeader && 'highcharts-tooltip-header',
+            isSplit ? 'highcharts-tooltip-box' : 'highcharts-tooltip',
+            !isHeader && 'highcharts-color-' + pick(point.colorIndex, series.colorIndex),
+            (seriesOptions && seriesOptions.className)
+        ].filter(isString).join(' ');
+    };
     /**
      * Creates the Tooltip label element if it does not exist, then returns it.
      *
@@ -272,9 +292,7 @@ var Tooltip = /** @class */ (function () {
      * Tooltip label
      */
     Tooltip.prototype.getLabel = function () {
-        var tooltip = this, styledMode = this.chart.styledMode, options = this.options, doSplit = this.split && this.allowShared, className = ('tooltip' + (defined(options.className) ?
-            ' ' + options.className :
-            '')), pointerEvents = (options.style.pointerEvents ||
+        var tooltip = this, styledMode = this.chart.styledMode, options = this.options, doSplit = this.split && this.allowShared, pointerEvents = (options.style.pointerEvents ||
             (this.shouldStickOnContact() ? 'auto' : 'none'));
         var container, renderer = this.chart.renderer;
         // If changing from a split tooltip to a non-split tooltip, we must
@@ -317,11 +335,11 @@ var Tooltip = /** @class */ (function () {
             }
             // Create the label
             if (doSplit) {
-                this.label = renderer.g(className);
+                this.label = renderer.g('tooltip');
             }
             else {
                 this.label = renderer
-                    .label('', 0, 0, options.shape, void 0, void 0, options.useHTML, void 0, className)
+                    .label('', 0, 0, options.shape, void 0, void 0, options.useHTML, void 0, 'tooltip')
                     .attr({
                     padding: options.padding,
                     r: options.borderRadius
@@ -704,7 +722,7 @@ var Tooltip = /** @class */ (function () {
      *        used for the tooltip update.
      */
     Tooltip.prototype.refresh = function (pointOrPoints, mouseEvent) {
-        var tooltip = this, chart = this.chart, options = tooltip.options, points = splat(pointOrPoints), point = points[0], pointConfig = [], formatter = options.formatter || tooltip.defaultFormatter, shared = tooltip.shared, styledMode = chart.styledMode;
+        var tooltip = this, chart = this.chart, options = tooltip.options, pointer = chart.pointer, points = splat(pointOrPoints), point = points[0], pointConfig = [], formatter = options.formatter || tooltip.defaultFormatter, shared = tooltip.shared, styledMode = chart.styledMode;
         var textConfig = {};
         if (!options.enabled || !point.series) { // #16820
             return;
@@ -720,7 +738,7 @@ var Tooltip = /** @class */ (function () {
         var anchor = tooltip.getAnchor(pointOrPoints, mouseEvent), x = anchor[0], y = anchor[1];
         // shared tooltip, array is sent over
         if (shared && tooltip.allowShared) {
-            chart.pointer.applyInactiveState(points);
+            pointer.applyInactiveState(points);
             // Now set hover state for the choosen ones:
             points.forEach(function (item) {
                 item.setState('hover');
@@ -753,7 +771,7 @@ var Tooltip = /** @class */ (function () {
             else {
                 var checkX_1 = x;
                 var checkY_1 = y;
-                if (mouseEvent && chart.pointer.isDirectTouch) {
+                if (mouseEvent && pointer.isDirectTouch) {
                     checkX_1 = mouseEvent.chartX - chart.plotLeft;
                     checkY_1 = mouseEvent.chartY - chart.plotTop;
                 }
@@ -761,14 +779,15 @@ var Tooltip = /** @class */ (function () {
                 if (chart.polar ||
                     currentSeries.options.clip === false ||
                     points.some(function (p) {
-                        return p.series.shouldShowTooltip(checkX_1, checkY_1);
+                        return pointer.isDirectTouch || // ##17929
+                            p.series.shouldShowTooltip(checkX_1, checkY_1);
                     })) {
                     var label = tooltip.getLabel();
                     // Prevent the tooltip from flowing over the chart box
                     // (#6659)
                     if (!options.style.width || styledMode) {
                         label.css({
-                            width: this.chart.spacingBox.width + 'px'
+                            width: chart.spacingBox.width + 'px'
                         });
                     }
                     label.attr({
@@ -777,9 +796,7 @@ var Tooltip = /** @class */ (function () {
                             text
                     });
                     // Set the stroke color of the box to reflect the point
-                    label.removeClass(/highcharts-color-[\d]+/g)
-                        .addClass('highcharts-color-' +
-                        pick(point.colorIndex, currentSeries.colorIndex));
+                    label.addClass(tooltip.getClassName(point), true);
                     if (!styledMode) {
                         label.attr({
                             stroke: (options.borderColor ||
@@ -928,7 +945,6 @@ var Tooltip = /** @class */ (function () {
         function updatePartialTooltip(partialTooltip, point, str) {
             var tt = partialTooltip;
             var isHeader = point.isHeader, series = point.series;
-            var colorClass = 'highcharts-color-' + pick(point.colorIndex, series.colorIndex, 'none');
             if (!tt) {
                 var attribs = {
                     padding: options.padding,
@@ -940,9 +956,7 @@ var Tooltip = /** @class */ (function () {
                 }
                 tt = ren
                     .label('', 0, 0, (options[isHeader ? 'headerShape' : 'shape']), void 0, void 0, options.useHTML)
-                    .addClass((isHeader ? 'highcharts-tooltip-header ' : '') +
-                    'highcharts-tooltip-box ' +
-                    colorClass)
+                    .addClass(tooltip.getClassName(point, true, isHeader))
                     .attr(attribs)
                     .add(tooltipLabel);
             }
@@ -1075,7 +1089,7 @@ var Tooltip = /** @class */ (function () {
                  * to avoid breaking change. Remove distributionBoxTop to make
                  * it consistent.
                  */
-                y: pos + distributionBoxTop,
+                y: (pos || 0) + distributionBoxTop,
                 anchorX: anchorX,
                 anchorY: anchorY
             };
@@ -1174,7 +1188,9 @@ var Tooltip = /** @class */ (function () {
     Tooltip.prototype.styledModeFormat = function (formatString) {
         return formatString
             .replace('style="font-size: 10px"', 'class="highcharts-header"')
-            .replace(/style="color:{(point|series)\.color}"/g, 'class="highcharts-color-{$1.colorIndex}"');
+            .replace(/style="color:{(point|series)\.color}"/g, 'class="highcharts-color-{$1.colorIndex} ' +
+            '{series.options.className} ' +
+            '{point.options.className}"');
     };
     /**
      * Format the footer/header of the tooltip

package/es-modules/Extensions/Annotations/NavigationBindingsDefaults.js

@@ -319,7 +319,7 @@ var navigation = {
      * from a different server.
      *
      * @type      {string}
-     * @default   https://code.highcharts.com/10.3.1/gfx/stock-icons/
+     * @default   https://code.highcharts.com/10.3.2/gfx/stock-icons/
      * @since     7.1.3
      * @apioption navigation.iconsURL
      */

package/es-modules/Extensions/Annotations/Popup/Popup.js

@@ -141,7 +141,12 @@ var Popup = /** @class */ (function () {
         ['click', 'touchstart'].forEach(function (eventName) {
             addEvent(closeBtn, eventName, function () {
                 if (_this.chart) {
-                    fireEvent(_this.chart.navigationBindings, 'closePopup');
+                    var navigationBindings = _this.chart.navigationBindings;
+                    fireEvent(navigationBindings, 'closePopup');
+                    if (navigationBindings &&
+                        navigationBindings.selectedButtonElement) {
+                        fireEvent(navigationBindings, 'deselectButton', { button: navigationBindings.selectedButtonElement });
+                    }
                 }
                 else {
                     _this.closePopup();

package/es-modules/Extensions/Annotations/Popup/PopupComposition.js

@@ -55,7 +55,7 @@ function onNavigationBindingsShowPopup(config) {
         this.popup = new Popup(this.chart.container, (this.chart.options.navigation.iconsURL ||
             (this.chart.options.stockTools &&
                 this.chart.options.stockTools.gui.iconsURL) ||
-            'https://code.highcharts.com/10.3.1/gfx/stock-icons/'), this.chart);
+            'https://code.highcharts.com/10.3.2/gfx/stock-icons/'), this.chart);
     }
     this.popup.showForm(config.formType, this.chart, config.options, config.onSubmit);
 }

package/es-modules/Extensions/OfflineExporting/OfflineExportingDefaults.js

@@ -14,7 +14,7 @@
  *
  * */
 var OfflineExportingDefaults = {
-    libURL: 'https://code.highcharts.com/10.3.1/lib/',
+    libURL: 'https://code.highcharts.com/10.3.2/lib/',
     // When offline-exporting is loaded, redefine the menu item definitions
     // related to download.
     menuItemDefinitions: {

package/es-modules/Extensions/Oldie/Oldie.js

@@ -36,7 +36,7 @@ var VMLRenderer, VMLElement;
  * @apioption global.VMLRadialGradientURL
  */
 getOptions().global.VMLRadialGradientURL =
-    'http://code.highcharts.com/10.3.1/gfx/vml-radial-gradient.png';
+    'http://code.highcharts.com/10.3.2/gfx/vml-radial-gradient.png';
 // Utilites
 if (doc && !doc.defaultView) {
     H.getStyle = U.getStyle = function getStyle(el, prop) {

package/es-modules/Extensions/PatternFill.js

@@ -424,16 +424,18 @@ addEvent(Chart, 'endResize', function () {
         // We have non-default patterns to fix. Find them by looping through
         // all points.
         this.series.forEach(function (series) {
-            series.points.forEach(function (point) {
-                var colorOptions = point.options && point.options.color;
-                if (colorOptions &&
-                    colorOptions.pattern) {
-                    colorOptions.pattern
-                        ._width = 'defer';
-                    colorOptions.pattern
-                        ._height = 'defer';
-                }
-            });
+            if (series.visible) {
+                series.points.forEach(function (point) {
+                    var colorOptions = point.options && point.options.color;
+                    if (colorOptions &&
+                        colorOptions.pattern) {
+                        colorOptions.pattern
+                            ._width = 'defer';
+                        colorOptions.pattern
+                            ._height = 'defer';
+                    }
+                });
+            }
         });
         // Redraw without animation
         this.redraw(false);

package/es-modules/Extensions/ScrollablePlotArea.js

@@ -134,9 +134,14 @@ Chart.prototype.setUpScrolling = function () {
     }, css, this.scrollingParent);
     // On scroll, reset the chart position because it applies to the scrolled
     // container
+    var lastHoverPoint;
     addEvent(this.scrollingContainer, 'scroll', function () {
         if (_this.pointer) {
             delete _this.pointer.chartPosition;
+            if (_this.hoverPoint) {
+                lastHoverPoint = _this.hoverPoint;
+            }
+            _this.pointer.runPointActions(void 0, lastHoverPoint, true);
         }
     });
     this.innerContainer = createElement('div', {