counterpart, and avoid\n // triggering mouseenter/mouseleave when hovering from one to the\n // other (#17440).\n if (useHTML) {\n label.text.css({ pointerEvents: 'none' });\n }\n }\n return label\n .on('touchstart', function (e) { return e.stopPropagation(); })\n .on('click', function (e) {\n if (curState !== 3) {\n callback.call(label, e);\n }\n });\n };\n /**\n * Make a straight line crisper by not spilling out to neighbour pixels.\n *\n * @function Highcharts.SVGRenderer#crispLine\n *\n * @param {Highcharts.SVGPathArray} points\n * The original points on the format `[['M', 0, 0], ['L', 100, 0]]`.\n *\n * @param {number} width\n * The width of the line.\n *\n * @param {string} [roundingFunction=round]\n * The rounding function name on the `Math` object, can be one of\n * `round`, `floor` or `ceil`.\n *\n * @return {Highcharts.SVGPathArray}\n * The original points array, but modified to render crisply.\n */\n SVGRenderer.prototype.crispLine = function (points, width, roundingFunction) {\n if (roundingFunction === void 0) { roundingFunction = 'round'; }\n var start = points[0];\n var end = points[1];\n // Normalize to a crisp line\n if (defined(start[1]) && start[1] === end[1]) {\n // Substract due to #1129. Now bottom and left axis gridlines behave\n // the same.\n start[1] = end[1] =\n Math[roundingFunction](start[1]) - (width % 2 / 2);\n }\n if (defined(start[2]) && start[2] === end[2]) {\n start[2] = end[2] =\n Math[roundingFunction](start[2]) + (width % 2 / 2);\n }\n return points;\n };\n /**\n * Draw a path, wraps the SVG `path` element.\n *\n * @sample highcharts/members/renderer-path-on-chart/\n * Draw a path in a chart\n * @sample highcharts/members/renderer-path/\n * Draw a path independent from a chart\n *\n * @example\n * let path = renderer.path(['M', 10, 10, 'L', 30, 30, 'z'])\n * .attr({ stroke: '#ff00ff' })\n * .add();\n *\n * @function Highcharts.SVGRenderer#path\n *\n * @param {Highcharts.SVGPathArray} [path]\n * An SVG path definition in array form.\n *\n * @return {Highcharts.SVGElement}\n * The generated wrapper element.\n *\n */ /**\n * Draw a path, wraps the SVG `path` element.\n *\n * @function Highcharts.SVGRenderer#path\n *\n * @param {Highcharts.SVGAttributes} [attribs]\n * The initial attributes.\n *\n * @return {Highcharts.SVGElement}\n * The generated wrapper element.\n */\n SVGRenderer.prototype.path = function (path) {\n var attribs = (this.styledMode ? {} : {\n fill: 'none'\n });\n if (isArray(path)) {\n attribs.d = path;\n }\n else if (isObject(path)) { // attributes\n extend(attribs, path);\n }\n return this.createElement('path').attr(attribs);\n };\n /**\n * Draw a circle, wraps the SVG `circle` element.\n *\n * @sample highcharts/members/renderer-circle/\n * Drawing a circle\n *\n * @function Highcharts.SVGRenderer#circle\n *\n * @param {number} [x]\n * The center x position.\n *\n * @param {number} [y]\n * The center y position.\n *\n * @param {number} [r]\n * The radius.\n *\n * @return {Highcharts.SVGElement}\n * The generated wrapper element.\n */ /**\n * Draw a circle, wraps the SVG `circle` element.\n *\n * @function Highcharts.SVGRenderer#circle\n *\n * @param {Highcharts.SVGAttributes} [attribs]\n * The initial attributes.\n *\n * @return {Highcharts.SVGElement}\n * The generated wrapper element.\n */\n SVGRenderer.prototype.circle = function (x, y, r) {\n var attribs = (isObject(x) ?\n x :\n typeof x === 'undefined' ? {} : { x: x, y: y, r: r }), wrapper = this.createElement('circle');\n // Setting x or y translates to cx and cy\n wrapper.xSetter = wrapper.ySetter = function (value, key, element) {\n element.setAttribute('c' + key, value);\n };\n return wrapper.attr(attribs);\n };\n /**\n * Draw and return an arc.\n *\n * @sample highcharts/members/renderer-arc/\n * Drawing an arc\n *\n * @function Highcharts.SVGRenderer#arc\n *\n * @param {number} [x=0]\n * Center X position.\n *\n * @param {number} [y=0]\n * Center Y position.\n *\n * @param {number} [r=0]\n * The outer radius' of the arc.\n *\n * @param {number} [innerR=0]\n * Inner radius like used in donut charts.\n *\n * @param {number} [start=0]\n * The starting angle of the arc in radians, where 0 is to the right and\n * `-Math.PI/2` is up.\n *\n * @param {number} [end=0]\n * The ending angle of the arc in radians, where 0 is to the right and\n * `-Math.PI/2` is up.\n *\n * @return {Highcharts.SVGElement}\n * The generated wrapper element.\n */ /**\n * Draw and return an arc. Overloaded function that takes arguments object.\n *\n * @function Highcharts.SVGRenderer#arc\n *\n * @param {Highcharts.SVGAttributes} attribs\n * Initial SVG attributes.\n *\n * @return {Highcharts.SVGElement}\n * The generated wrapper element.\n */\n SVGRenderer.prototype.arc = function (x, y, r, innerR, start, end) {\n var options;\n if (isObject(x)) {\n options = x;\n y = options.y;\n r = options.r;\n innerR = options.innerR;\n start = options.start;\n end = options.end;\n x = options.x;\n }\n else {\n options = { innerR: innerR, start: start, end: end };\n }\n // Arcs are defined as symbols for the ability to set\n // attributes in attr and animate\n var arc = this.symbol('arc',\n x,\n y,\n r,\n r,\n options);\n arc.r = r; // #959\n return arc;\n };\n /**\n * Draw and return a rectangle.\n *\n * @function Highcharts.SVGRenderer#rect\n *\n * @param {number} [x]\n * Left position.\n *\n * @param {number} [y]\n * Top position.\n *\n * @param {number} [width]\n * Width of the rectangle.\n *\n * @param {number} [height]\n * Height of the rectangle.\n *\n * @param {number} [r]\n * Border corner radius.\n *\n * @param {number} [strokeWidth]\n * A stroke width can be supplied to allow crisp drawing.\n *\n * @return {Highcharts.SVGElement}\n * The generated wrapper element.\n */ /**\n * Draw and return a rectangle.\n *\n * @sample highcharts/members/renderer-rect-on-chart/\n * Draw a rectangle in a chart\n * @sample highcharts/members/renderer-rect/\n * Draw a rectangle independent from a chart\n *\n * @function Highcharts.SVGRenderer#rect\n *\n * @param {Highcharts.SVGAttributes} [attributes]\n * General SVG attributes for the rectangle.\n *\n * @return {Highcharts.SVGElement}\n * The generated wrapper element.\n */\n SVGRenderer.prototype.rect = function (x, y, width, height, r, strokeWidth) {\n r = isObject(x) ? x.r : r;\n var wrapper = this.createElement('rect');\n var attribs = (isObject(x) ?\n x :\n typeof x === 'undefined' ?\n {} :\n {\n x: x,\n y: y,\n width: Math.max(width, 0),\n height: Math.max(height, 0)\n });\n if (!this.styledMode) {\n if (typeof strokeWidth !== 'undefined') {\n attribs['stroke-width'] = strokeWidth;\n attribs = wrapper.crisp(attribs);\n }\n attribs.fill = 'none';\n }\n if (r) {\n attribs.r = r;\n }\n wrapper.rSetter = function (value, _key, element) {\n wrapper.r = value;\n attr(element, {\n rx: value,\n ry: value\n });\n };\n wrapper.rGetter = function () {\n return wrapper.r || 0;\n };\n return wrapper.attr(attribs);\n };\n /**\n * Resize the {@link SVGRenderer#box} and re-align all aligned child\n * elements.\n *\n * @sample highcharts/members/renderer-g/\n * Show and hide grouped objects\n *\n * @function Highcharts.SVGRenderer#setSize\n *\n * @param {number} width\n * The new pixel width.\n *\n * @param {number} height\n * The new pixel height.\n *\n * @param {boolean|Partial
} [animate=true]\n * Whether and how to animate.\n */\n SVGRenderer.prototype.setSize = function (width, height, animate) {\n var renderer = this;\n renderer.width = width;\n renderer.height = height;\n renderer.boxWrapper.animate({\n width: width,\n height: height\n }, {\n step: function () {\n this.attr({\n viewBox: '0 0 ' + this.attr('width') + ' ' +\n this.attr('height')\n });\n },\n duration: pick(animate, true) ? void 0 : 0\n });\n renderer.alignElements();\n };\n /**\n * Create and return an svg group element. Child\n * {@link Highcharts.SVGElement} objects are added to the group by using the\n * group as the first parameter in {@link Highcharts.SVGElement#add|add()}.\n *\n * @function Highcharts.SVGRenderer#g\n *\n * @param {string} [name]\n * The group will be given a class name of `highcharts-{name}`. This\n * can be used for styling and scripting.\n *\n * @return {Highcharts.SVGElement}\n * The generated wrapper element.\n */\n SVGRenderer.prototype.g = function (name) {\n var elem = this.createElement('g');\n return name ?\n elem.attr({ 'class': 'highcharts-' + name }) :\n elem;\n };\n /**\n * Display an image.\n *\n * @sample highcharts/members/renderer-image-on-chart/\n * Add an image in a chart\n * @sample highcharts/members/renderer-image/\n * Add an image independent of a chart\n *\n * @function Highcharts.SVGRenderer#image\n *\n * @param {string} src\n * The image source.\n *\n * @param {number} [x]\n * The X position.\n *\n * @param {number} [y]\n * The Y position.\n *\n * @param {number} [width]\n * The image width. If omitted, it defaults to the image file width.\n *\n * @param {number} [height]\n * The image height. If omitted it defaults to the image file\n * height.\n *\n * @param {Function} [onload]\n * Event handler for image load.\n *\n * @return {Highcharts.SVGElement}\n * The generated wrapper element.\n */\n SVGRenderer.prototype.image = function (src, x, y, width, height, onload) {\n var attribs = { preserveAspectRatio: 'none' }, setSVGImageSource = function (el, src) {\n // Set the href in the xlink namespace\n if (el.setAttributeNS) {\n el.setAttributeNS('http://www.w3.org/1999/xlink', 'href', src);\n }\n else {\n // could be exporting in IE\n // using href throws \"not supported\" in ie7 and under,\n // requries regex shim to fix later\n el.setAttribute('hc-svg-href', src);\n }\n };\n // Optional properties (#11756)\n if (isNumber(x)) {\n attribs.x = x;\n }\n if (isNumber(y)) {\n attribs.y = y;\n }\n if (isNumber(width)) {\n attribs.width = width;\n }\n if (isNumber(height)) {\n attribs.height = height;\n }\n var elemWrapper = this.createElement('image').attr(attribs),\n onDummyLoad = function (e) {\n setSVGImageSource(elemWrapper.element,\n src);\n onload.call(elemWrapper, e);\n };\n // Add load event if supplied\n if (onload) {\n // We have to use a dummy HTML image since IE support for SVG image\n // load events is very buggy. First set a transparent src, wait for\n // dummy to load, and then add the real src to the SVG image.\n setSVGImageSource(elemWrapper.element, 'data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==' /* eslint-disable-line */);\n var dummy = new win.Image();\n addEvent(dummy, 'load', onDummyLoad);\n dummy.src = src;\n if (dummy.complete) {\n onDummyLoad({});\n }\n }\n else {\n setSVGImageSource(elemWrapper.element, src);\n }\n return elemWrapper;\n };\n /**\n * Draw a symbol out of pre-defined shape paths from\n * {@link SVGRenderer#symbols}.\n * It is used in Highcharts for point makers, which cake a `symbol` option,\n * and label and button backgrounds like in the tooltip and stock flags.\n *\n * @function Highcharts.SVGRenderer#symbol\n *\n * @param {string} symbol\n * The symbol name.\n *\n * @param {number} [x]\n * The X coordinate for the top left position.\n *\n * @param {number} [y]\n * The Y coordinate for the top left position.\n *\n * @param {number} [width]\n * The pixel width.\n *\n * @param {number} [height]\n * The pixel height.\n *\n * @param {Highcharts.SymbolOptionsObject} [options]\n * Additional options, depending on the actual symbol drawn.\n *\n * @return {Highcharts.SVGElement}\n * SVG symbol.\n */\n SVGRenderer.prototype.symbol = function (symbol, x, y, width, height, options) {\n var ren = this,\n imageRegex = /^url\\((.*?)\\)$/,\n isImage = imageRegex.test(symbol),\n sym = (!isImage && (this.symbols[symbol] ? symbol : 'circle')), \n // get the symbol definition function\n symbolFn = (sym && this.symbols[sym]);\n var obj,\n path,\n imageSrc,\n centerImage;\n if (symbolFn) {\n // Check if there's a path defined for this symbol\n if (typeof x === 'number') {\n path = symbolFn.call(this.symbols, Math.round(x || 0), Math.round(y || 0), width || 0, height || 0, options);\n }\n obj = this.path(path);\n if (!ren.styledMode) {\n obj.attr('fill', 'none');\n }\n // expando properties for use in animate and attr\n extend(obj, {\n symbolName: (sym || void 0),\n x: x,\n y: y,\n width: width,\n height: height\n });\n if (options) {\n extend(obj, options);\n }\n // Image symbols\n }\n else if (isImage) {\n imageSrc = symbol.match(imageRegex)[1];\n // Create the image synchronously, add attribs async\n var img_1 = obj = this.image(imageSrc);\n // The image width is not always the same as the symbol width. The\n // image may be centered within the symbol, as is the case when\n // image shapes are used as label backgrounds, for example in flags.\n img_1.imgwidth = pick(symbolSizes[imageSrc] && symbolSizes[imageSrc].width, options && options.width);\n img_1.imgheight = pick(symbolSizes[imageSrc] && symbolSizes[imageSrc].height, options && options.height);\n /**\n * Set the size and position\n */\n centerImage = function (obj) { return obj.attr({\n width: obj.width,\n height: obj.height\n }); };\n /**\n * Width and height setters that take both the image's physical size\n * and the label size into consideration, and translates the image\n * to center within the label.\n */\n ['width', 'height'].forEach(function (key) {\n img_1[key + 'Setter'] = function (value, key) {\n this[key] = value;\n var _a = this,\n alignByTranslate = _a.alignByTranslate,\n element = _a.element,\n width = _a.width,\n height = _a.height,\n imgwidth = _a.imgwidth,\n imgheight = _a.imgheight;\n var imgSize = this['img' + key];\n if (defined(imgSize)) {\n var scale = 1;\n // Scale and center the image within its container.\n // The name `backgroundSize` is taken from the CSS spec,\n // but the value `within` is made up. Other possible\n // values in the spec, `cover` and `contain`, can be\n // implemented if needed.\n if (options &&\n options.backgroundSize === 'within' &&\n width &&\n height) {\n scale = Math.min(width / imgwidth, height / imgheight);\n imgSize = Math.round(imgSize * scale);\n // Update both width and height to keep the ratio\n // correct (#17315)\n attr(element, {\n width: Math.round(imgwidth * scale),\n height: Math.round(imgheight * scale)\n });\n }\n else if (element) {\n element.setAttribute(key, imgSize);\n }\n if (!alignByTranslate) {\n this.translate(((width || 0) - (imgSize * scale)) / 2, ((height || 0) - (imgSize * scale)) / 2);\n }\n }\n };\n });\n if (defined(x)) {\n img_1.attr({\n x: x,\n y: y\n });\n }\n img_1.isImg = true;\n if (defined(img_1.imgwidth) && defined(img_1.imgheight)) {\n centerImage(img_1);\n }\n else {\n // Initialize image to be 0 size so export will still function\n // if there's no cached sizes.\n img_1.attr({ width: 0, height: 0 });\n // Create a dummy JavaScript image to get the width and height.\n createElement('img', {\n onload: function () {\n var chart = charts[ren.chartIndex];\n // Special case for SVGs on IE11, the width is not\n // accessible until the image is part of the DOM\n // (#2854).\n if (this.width === 0) {\n css(this, {\n position: 'absolute',\n top: '-999em'\n });\n doc.body.appendChild(this);\n }\n // Center the image\n symbolSizes[imageSrc] = {\n width: this.width,\n height: this.height\n };\n img_1.imgwidth = this.width;\n img_1.imgheight = this.height;\n if (img_1.element) {\n centerImage(img_1);\n }\n // Clean up after #2854 workaround.\n if (this.parentNode) {\n this.parentNode.removeChild(this);\n }\n // Fire the load event when all external images are\n // loaded\n ren.imgCount--;\n if (!ren.imgCount && chart && !chart.hasLoaded) {\n chart.onload();\n }\n },\n src: imageSrc\n });\n this.imgCount++;\n }\n }\n return obj;\n };\n /**\n * Define a clipping rectangle. The clipping rectangle is later applied\n * to {@link SVGElement} objects through the {@link SVGElement#clip}\n * function.\n *\n * @example\n * let circle = renderer.circle(100, 100, 100)\n * .attr({ fill: 'red' })\n * .add();\n * let clipRect = renderer.clipRect(100, 100, 100, 100);\n *\n * // Leave only the lower right quarter visible\n * circle.clip(clipRect);\n *\n * @function Highcharts.SVGRenderer#clipRect\n *\n * @param {number} [x]\n *\n * @param {number} [y]\n *\n * @param {number} [width]\n *\n * @param {number} [height]\n *\n * @return {Highcharts.ClipRectElement}\n * A clipping rectangle.\n */\n SVGRenderer.prototype.clipRect = function (x, y, width, height) {\n var \n // Add a hyphen at the end to avoid confusion in testing indexes\n // -1 and -10, -11 etc (#6550)\n id = uniqueKey() + '-', clipPath = this.createElement('clipPath').attr({\n id: id\n }).add(this.defs), wrapper = this.rect(x, y, width, height, 0).add(clipPath);\n wrapper.id = id;\n wrapper.clipPath = clipPath;\n wrapper.count = 0;\n return wrapper;\n };\n /**\n * Draw text. The text can contain a subset of HTML, like spans and anchors\n * and some basic text styling of these. For more advanced features like\n * border and background, use {@link Highcharts.SVGRenderer#label} instead.\n * To update the text after render, run `text.attr({ text: 'New text' })`.\n *\n * @sample highcharts/members/renderer-text-on-chart/\n * Annotate the chart freely\n * @sample highcharts/members/renderer-on-chart/\n * Annotate with a border and in response to the data\n * @sample highcharts/members/renderer-text/\n * Formatted text\n *\n * @function Highcharts.SVGRenderer#text\n *\n * @param {string} [str]\n * The text of (subset) HTML to draw.\n *\n * @param {number} [x]\n * The x position of the text's lower left corner.\n *\n * @param {number} [y]\n * The y position of the text's lower left corner.\n *\n * @param {boolean} [useHTML=false]\n * Use HTML to render the text.\n *\n * @return {Highcharts.SVGElement}\n * The text object.\n */\n SVGRenderer.prototype.text = function (str, x, y, useHTML) {\n var renderer = this,\n attribs = {};\n if (useHTML && (renderer.allowHTML || !renderer.forExport)) {\n return renderer.html(str, x, y);\n }\n attribs.x = Math.round(x || 0); // X always needed for line-wrap logic\n if (y) {\n attribs.y = Math.round(y);\n }\n if (defined(str)) {\n attribs.text = str;\n }\n var wrapper = renderer.createElement('text').attr(attribs);\n if (!useHTML || (renderer.forExport && !renderer.allowHTML)) {\n wrapper.xSetter = function (value, key, element) {\n var tspans = element.getElementsByTagName('tspan'),\n parentVal = element.getAttribute(key);\n for (var i = 0, tspan = void 0; i < tspans.length; i++) {\n tspan = tspans[i];\n // If the x values are equal, the tspan represents a line\n // break\n if (tspan.getAttribute(key) === parentVal) {\n tspan.setAttribute(key, value);\n }\n }\n element.setAttribute(key, value);\n };\n }\n return wrapper;\n };\n /**\n * Utility to return the baseline offset and total line height from the font\n * size.\n *\n * @function Highcharts.SVGRenderer#fontMetrics\n *\n * @param {number|string} [fontSize]\n * The current font size to inspect. If not given, the font size\n * will be found from the DOM element.\n *\n * @param {Highcharts.SVGElement|Highcharts.SVGDOMElement} [elem]\n * The element to inspect for a current font size.\n *\n * @return {Highcharts.FontMetricsObject}\n * The font metrics.\n */\n SVGRenderer.prototype.fontMetrics = function (fontSize, elem) {\n if ((this.styledMode || !/px/.test(fontSize)) &&\n (win.getComputedStyle) // old IE doesn't support it\n ) {\n fontSize = elem && SVGElement.prototype.getStyle.call(elem, 'font-size');\n }\n else {\n fontSize = fontSize ||\n // When the elem is a DOM element (#5932)\n (elem && elem.style && elem.style.fontSize) ||\n // Fall back on the renderer style default\n (this.style && this.style.fontSize);\n }\n // Handle different units\n if (/px/.test(fontSize)) {\n fontSize = pInt(fontSize);\n }\n else {\n fontSize = 12;\n }\n // Empirical values found by comparing font size and bounding box\n // height. Applies to the default font family.\n // https://jsfiddle.net/highcharts/7xvn7/\n var lineHeight = (fontSize < 24 ?\n fontSize + 3 :\n Math.round(fontSize * 1.2)),\n baseline = Math.round(lineHeight * 0.8);\n return {\n h: lineHeight,\n b: baseline,\n f: fontSize\n };\n };\n /**\n * Correct X and Y positioning of a label for rotation (#1764).\n *\n * @private\n * @function Highcharts.SVGRenderer#rotCorr\n */\n SVGRenderer.prototype.rotCorr = function (baseline, rotation, alterY) {\n var y = baseline;\n if (rotation && alterY) {\n y = Math.max(y * Math.cos(rotation * deg2rad), 4);\n }\n return {\n x: (-baseline / 3) * Math.sin(rotation * deg2rad),\n y: y\n };\n };\n /**\n * Compatibility function to convert the legacy one-dimensional path array\n * into an array of segments.\n *\n * It is used in maps to parse the `path` option, and in SVGRenderer.dSetter\n * to support legacy paths from demos.\n *\n * @private\n * @function Highcharts.SVGRenderer#pathToSegments\n */\n SVGRenderer.prototype.pathToSegments = function (path) {\n var ret = [];\n var segment = [];\n var commandLength = {\n A: 8,\n C: 7,\n H: 2,\n L: 3,\n M: 3,\n Q: 5,\n S: 5,\n T: 3,\n V: 2\n };\n // Short, non-typesafe parsing of the one-dimensional array. It splits\n // the path on any string. This is not type checked against the tuple\n // types, but is shorter, and doesn't require specific checks for any\n // command type in SVG.\n for (var i = 0; i < path.length; i++) {\n // Command skipped, repeat previous or insert L/l for M/m\n if (isString(segment[0]) &&\n isNumber(path[i]) &&\n segment.length === commandLength[(segment[0].toUpperCase())]) {\n path.splice(i, 0, segment[0].replace('M', 'L').replace('m', 'l'));\n }\n // Split on string\n if (typeof path[i] === 'string') {\n if (segment.length) {\n ret.push(segment.slice(0));\n }\n segment.length = 0;\n }\n segment.push(path[i]);\n }\n ret.push(segment.slice(0));\n return ret;\n /*\n // Fully type-safe version where each tuple type is checked. The\n // downside is filesize and a lack of flexibility for unsupported\n // commands\n const ret: SVGPath = [],\n commands = {\n A: 7,\n C: 6,\n H: 1,\n L: 2,\n M: 2,\n Q: 4,\n S: 4,\n T: 2,\n V: 1,\n Z: 0\n };\n\n let i = 0,\n lastI = 0,\n lastCommand;\n\n while (i < path.length) {\n const item = path[i];\n\n let command;\n\n if (typeof item === 'string') {\n command = item;\n i += 1;\n } else {\n command = lastCommand || 'M';\n }\n\n // Upper case\n const commandUC = command.toUpperCase();\n\n if (commandUC in commands) {\n\n // No numeric parameters\n if (command === 'Z' || command === 'z') {\n ret.push([command]);\n\n // One numeric parameter\n } else {\n const val0 = path[i];\n if (typeof val0 === 'number') {\n\n // Horizontal line to\n if (command === 'H' || command === 'h') {\n ret.push([command, val0]);\n i += 1;\n\n // Vertical line to\n } else if (command === 'V' || command === 'v') {\n ret.push([command, val0]);\n i += 1;\n\n // Two numeric parameters\n } else {\n const val1 = path[i + 1];\n if (typeof val1 === 'number') {\n // lineTo\n if (command === 'L' || command === 'l') {\n ret.push([command, val0, val1]);\n i += 2;\n\n // moveTo\n } else if (command === 'M' || command === 'm') {\n ret.push([command, val0, val1]);\n i += 2;\n\n // Smooth quadratic bezier\n } else if (command === 'T' || command === 't') {\n ret.push([command, val0, val1]);\n i += 2;\n\n // Four numeric parameters\n } else {\n const val2 = path[i + 2],\n val3 = path[i + 3];\n if (\n typeof val2 === 'number' &&\n typeof val3 === 'number'\n ) {\n // Quadratic bezier to\n if (\n command === 'Q' ||\n command === 'q'\n ) {\n ret.push([\n command,\n val0,\n val1,\n val2,\n val3\n ]);\n i += 4;\n\n // Smooth cubic bezier to\n } else if (\n command === 'S' ||\n command === 's'\n ) {\n ret.push([\n command,\n val0,\n val1,\n val2,\n val3\n ]);\n i += 4;\n\n // Six numeric parameters\n } else {\n const val4 = path[i + 4],\n val5 = path[i + 5];\n\n if (\n typeof val4 === 'number' &&\n typeof val5 === 'number'\n ) {\n // Curve to\n if (\n command === 'C' ||\n command === 'c'\n ) {\n ret.push([\n command,\n val0,\n val1,\n val2,\n val3,\n val4,\n val5\n ]);\n i += 6;\n\n // Seven numeric parameters\n } else {\n const val6 = path[i + 6];\n\n // Arc to\n if (\n typeof val6 ===\n 'number' &&\n (\n command === 'A' ||\n command === 'a'\n )\n ) {\n ret.push([\n command,\n val0,\n val1,\n val2,\n val3,\n val4,\n val5,\n val6\n ]);\n i += 7;\n\n }\n\n }\n }\n }\n }\n }\n }\n\n }\n }\n }\n }\n\n // An unmarked command following a moveTo is a lineTo\n lastCommand = command === 'M' ? 'L' : command;\n\n if (i === lastI) {\n break;\n }\n lastI = i;\n }\n return ret;\n */\n };\n /**\n * Draw a label, which is an extended text element with support for border\n * and background. Highcharts creates a `g` element with a text and a `path`\n * or `rect` inside, to make it behave somewhat like a HTML div. Border and\n * background are set through `stroke`, `stroke-width` and `fill` attributes\n * using the {@link Highcharts.SVGElement#attr|attr} method. To update the\n * text after render, run `label.attr({ text: 'New text' })`.\n *\n * @sample highcharts/members/renderer-label-on-chart/\n * A label on the chart\n *\n * @function Highcharts.SVGRenderer#label\n *\n * @param {string} str\n * The initial text string or (subset) HTML to render.\n *\n * @param {number} x\n * The x position of the label's left side.\n *\n * @param {number} [y]\n * The y position of the label's top side or baseline, depending on\n * the `baseline` parameter.\n *\n * @param {string} [shape='rect']\n * The shape of the label's border/background, if any. Defaults to\n * `rect`. Other possible values are `callout` or other shapes\n * defined in {@link Highcharts.SVGRenderer#symbols}.\n *\n * @param {number} [anchorX]\n * In case the `shape` has a pointer, like a flag, this is the\n * coordinates it should be pinned to.\n *\n * @param {number} [anchorY]\n * In case the `shape` has a pointer, like a flag, this is the\n * coordinates it should be pinned to.\n *\n * @param {boolean} [useHTML=false]\n * Whether to use HTML to render the label.\n *\n * @param {boolean} [baseline=false]\n * Whether to position the label relative to the text baseline,\n * like {@link Highcharts.SVGRenderer#text|renderer.text}, or to the\n * upper border of the rectangle.\n *\n * @param {string} [className]\n * Class name for the group.\n *\n * @return {Highcharts.SVGElement}\n * The generated label.\n */\n SVGRenderer.prototype.label = function (str, x, y, shape, anchorX, anchorY, useHTML, baseline, className) {\n return new SVGLabel(this, str, x, y, shape, anchorX, anchorY, useHTML, baseline, className);\n };\n /**\n * Re-align all aligned elements.\n *\n * @private\n * @function Highcharts.SVGRenderer#alignElements\n */\n SVGRenderer.prototype.alignElements = function () {\n this.alignedObjects.forEach(function (el) { return el.align(); });\n };\n return SVGRenderer;\n }());\n extend(SVGRenderer.prototype, {\n /**\n * A pointer to the renderer's associated Element class. The VMLRenderer\n * will have a pointer to VMLElement here.\n *\n * @name Highcharts.SVGRenderer#Element\n * @type {Highcharts.SVGElement}\n */\n Element: SVGElement,\n SVG_NS: SVG_NS,\n /**\n * A collection of characters mapped to HTML entities. When `useHTML` on an\n * element is true, these entities will be rendered correctly by HTML. In\n * the SVG pseudo-HTML, they need to be unescaped back to simple characters,\n * so for example `<` will render as `<`.\n *\n * @example\n * // Add support for unescaping quotes\n * Highcharts.SVGRenderer.prototype.escapes['\"'] = '"';\n *\n * @name Highcharts.SVGRenderer#escapes\n * @type {Highcharts.Dictionary}\n */\n escapes: {\n '&': '&',\n '<': '<',\n '>': '>',\n \"'\": ''',\n '\"': '"'\n },\n /**\n * An extendable collection of functions for defining symbol paths.\n *\n * @name Highcharts.SVGRenderer#symbols\n * @type {Highcharts.SymbolDictionary}\n */\n symbols: Symbols,\n /**\n * Dummy function for plugins, called every time the renderer is updated.\n * Prior to Highcharts 5, this was used for the canvg renderer.\n *\n * @deprecated\n * @function Highcharts.SVGRenderer#draw\n */\n draw: noop\n });\n /* *\n *\n * Registry\n *\n * */\n RendererRegistry.registerRendererType('svg', SVGRenderer, true);\n /* *\n *\n * Export Default\n *\n * */\n /* *\n *\n * API Declarations\n *\n * */\n /**\n * A clipping rectangle that can be applied to one or more {@link SVGElement}\n * instances. It is instanciated with the {@link SVGRenderer#clipRect} function\n * and applied with the {@link SVGElement#clip} function.\n *\n * @example\n * let circle = renderer.circle(100, 100, 100)\n * .attr({ fill: 'red' })\n * .add();\n * let clipRect = renderer.clipRect(100, 100, 100, 100);\n *\n * // Leave only the lower right quarter visible\n * circle.clip(clipRect);\n *\n * @typedef {Highcharts.SVGElement} Highcharts.ClipRectElement\n */\n /**\n * The font metrics.\n *\n * @interface Highcharts.FontMetricsObject\n */ /**\n * The baseline relative to the top of the box.\n *\n * @name Highcharts.FontMetricsObject#b\n * @type {number}\n */ /**\n * The font size.\n *\n * @name Highcharts.FontMetricsObject#f\n * @type {number}\n */ /**\n * The line height.\n *\n * @name Highcharts.FontMetricsObject#h\n * @type {number}\n */\n /**\n * An object containing `x` and `y` properties for the position of an element.\n *\n * @interface Highcharts.PositionObject\n */ /**\n * X position of the element.\n * @name Highcharts.PositionObject#x\n * @type {number}\n */ /**\n * Y position of the element.\n * @name Highcharts.PositionObject#y\n * @type {number}\n */\n /**\n * A rectangle.\n *\n * @interface Highcharts.RectangleObject\n */ /**\n * Height of the rectangle.\n * @name Highcharts.RectangleObject#height\n * @type {number}\n */ /**\n * Width of the rectangle.\n * @name Highcharts.RectangleObject#width\n * @type {number}\n */ /**\n * Horizontal position of the rectangle.\n * @name Highcharts.RectangleObject#x\n * @type {number}\n */ /**\n * Vertical position of the rectangle.\n * @name Highcharts.RectangleObject#y\n * @type {number}\n */\n /**\n * The shadow options.\n *\n * @interface Highcharts.ShadowOptionsObject\n */ /**\n * The shadow color.\n * @name Highcharts.ShadowOptionsObject#color\n * @type {Highcharts.ColorString|undefined}\n * @default #000000\n */ /**\n * The horizontal offset from the element.\n *\n * @name Highcharts.ShadowOptionsObject#offsetX\n * @type {number|undefined}\n * @default 1\n */ /**\n * The vertical offset from the element.\n * @name Highcharts.ShadowOptionsObject#offsetY\n * @type {number|undefined}\n * @default 1\n */ /**\n * The shadow opacity.\n *\n * @name Highcharts.ShadowOptionsObject#opacity\n * @type {number|undefined}\n * @default 0.15\n */ /**\n * The shadow width or distance from the element.\n * @name Highcharts.ShadowOptionsObject#width\n * @type {number|undefined}\n * @default 3\n */\n /**\n * @interface Highcharts.SizeObject\n */ /**\n * @name Highcharts.SizeObject#height\n * @type {number}\n */ /**\n * @name Highcharts.SizeObject#width\n * @type {number}\n */\n /**\n * Array of path commands, that will go into the `d` attribute of an SVG\n * element.\n *\n * @typedef {Array<(Array|Array|Array|Array|Array|Array)>} Highcharts.SVGPathArray\n */\n /**\n * Possible path commands in an SVG path array. Valid values are `A`, `C`, `H`,\n * `L`, `M`, `Q`, `S`, `T`, `V`, `Z`.\n *\n * @typedef {string} Highcharts.SVGPathCommand\n * @validvalue [\"a\",\"c\",\"h\",\"l\",\"m\",\"q\",\"s\",\"t\",\"v\",\"z\",\"A\",\"C\",\"H\",\"L\",\"M\",\"Q\",\"S\",\"T\",\"V\",\"Z\"]\n */\n /**\n * An extendable collection of functions for defining symbol paths. Symbols are\n * used internally for point markers, button and label borders and backgrounds,\n * or custom shapes. Extendable by adding to {@link SVGRenderer#symbols}.\n *\n * @interface Highcharts.SymbolDictionary\n */ /**\n * @name Highcharts.SymbolDictionary#[key:string]\n * @type {Function|undefined}\n */ /**\n * @name Highcharts.SymbolDictionary#arc\n * @type {Function|undefined}\n */ /**\n * @name Highcharts.SymbolDictionary#callout\n * @type {Function|undefined}\n */ /**\n * @name Highcharts.SymbolDictionary#circle\n * @type {Function|undefined}\n */ /**\n * @name Highcharts.SymbolDictionary#diamond\n * @type {Function|undefined}\n */ /**\n * @name Highcharts.SymbolDictionary#square\n * @type {Function|undefined}\n */ /**\n * @name Highcharts.SymbolDictionary#triangle\n * @type {Function|undefined}\n */\n /**\n * Can be one of `arc`, `callout`, `circle`, `diamond`, `square`, `triangle`,\n * and `triangle-down`. Symbols are used internally for point markers, button\n * and label borders and backgrounds, or custom shapes. Extendable by adding to\n * {@link SVGRenderer#symbols}.\n *\n * @typedef {\"arc\"|\"callout\"|\"circle\"|\"diamond\"|\"square\"|\"triangle\"|\"triangle-down\"} Highcharts.SymbolKeyValue\n */\n /**\n * Additional options, depending on the actual symbol drawn.\n *\n * @interface Highcharts.SymbolOptionsObject\n */ /**\n * The anchor X position for the `callout` symbol. This is where the chevron\n * points to.\n *\n * @name Highcharts.SymbolOptionsObject#anchorX\n * @type {number|undefined}\n */ /**\n * The anchor Y position for the `callout` symbol. This is where the chevron\n * points to.\n *\n * @name Highcharts.SymbolOptionsObject#anchorY\n * @type {number|undefined}\n */ /**\n * The end angle of an `arc` symbol.\n *\n * @name Highcharts.SymbolOptionsObject#end\n * @type {number|undefined}\n */ /**\n * Whether to draw `arc` symbol open or closed.\n *\n * @name Highcharts.SymbolOptionsObject#open\n * @type {boolean|undefined}\n */ /**\n * The radius of an `arc` symbol, or the border radius for the `callout` symbol.\n *\n * @name Highcharts.SymbolOptionsObject#r\n * @type {number|undefined}\n */ /**\n * The start angle of an `arc` symbol.\n *\n * @name Highcharts.SymbolOptionsObject#start\n * @type {number|undefined}\n */\n (''); // keeps doclets above in transpiled file\n\n return SVGRenderer;\n });\n _registerModule(_modules, 'Core/Renderer/HTML/HTMLElement.js', [_modules['Core/Globals.js'], _modules['Core/Renderer/SVG/SVGElement.js'], _modules['Core/Utilities.js']], function (H, SVGElement, U) {\n /* *\n *\n * (c) 2010-2021 Torstein Honsi\n *\n * License: www.highcharts.com/license\n *\n * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!\n *\n * */\n var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d,\n b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d,\n b) { d.__proto__ = b; }) ||\n function (d,\n b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n })();\n var isFirefox = H.isFirefox,\n isMS = H.isMS,\n isWebKit = H.isWebKit,\n win = H.win;\n var css = U.css,\n defined = U.defined,\n extend = U.extend,\n pick = U.pick,\n pInt = U.pInt;\n /* *\n *\n * Class\n *\n * */\n /* eslint-disable valid-jsdoc */\n var HTMLElement = /** @class */ (function (_super) {\n __extends(HTMLElement, _super);\n function HTMLElement() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /* *\n *\n * Static Functions\n *\n * */\n /**\n * Modifies SVGElement to support HTML elements.\n * @private\n */\n HTMLElement.compose = function (SVGElementClass) {\n if (HTMLElement.composedClasses.indexOf(SVGElementClass) === -1) {\n HTMLElement.composedClasses.push(SVGElementClass);\n var htmlElementProto = HTMLElement.prototype,\n svgElementProto = SVGElementClass.prototype;\n svgElementProto.getSpanCorrection = htmlElementProto\n .getSpanCorrection;\n svgElementProto.htmlCss = htmlElementProto.htmlCss;\n svgElementProto.htmlGetBBox = htmlElementProto.htmlGetBBox;\n svgElementProto.htmlUpdateTransform = htmlElementProto\n .htmlUpdateTransform;\n svgElementProto.setSpanRotation = htmlElementProto.setSpanRotation;\n }\n return SVGElementClass;\n };\n /* *\n *\n * Functions\n *\n * */\n /**\n * Get the correction in X and Y positioning as the element is rotated.\n * @private\n */\n HTMLElement.prototype.getSpanCorrection = function (width, baseline, alignCorrection) {\n this.xCorr = -width * alignCorrection;\n this.yCorr = -baseline;\n };\n /**\n * Apply CSS to HTML elements. This is used in text within SVG rendering and\n * by the VML renderer\n * @private\n */\n HTMLElement.prototype.htmlCss = function (styles) {\n var wrapper = this,\n element = wrapper.element, \n // When setting or unsetting the width style, we need to update\n // transform (#8809)\n isSettingWidth = (element.tagName === 'SPAN' &&\n styles &&\n 'width' in styles),\n textWidth = pick(isSettingWidth && styles.width,\n void 0);\n var doTransform;\n if (isSettingWidth) {\n delete styles.width;\n wrapper.textWidth = textWidth;\n doTransform = true;\n }\n if (styles && styles.textOverflow === 'ellipsis') {\n styles.whiteSpace = 'nowrap';\n styles.overflow = 'hidden';\n }\n wrapper.styles = extend(wrapper.styles, styles);\n css(wrapper.element, styles);\n // Now that all styles are applied, to the transform\n if (doTransform) {\n wrapper.htmlUpdateTransform();\n }\n return wrapper;\n };\n /**\n * VML and useHTML method for calculating the bounding box based on offsets.\n */\n HTMLElement.prototype.htmlGetBBox = function () {\n var wrapper = this,\n element = wrapper.element;\n return {\n x: element.offsetLeft,\n y: element.offsetTop,\n width: element.offsetWidth,\n height: element.offsetHeight\n };\n };\n /**\n * VML override private method to update elements based on internal\n * properties based on SVG transform.\n * @private\n */\n HTMLElement.prototype.htmlUpdateTransform = function () {\n // aligning non added elements is expensive\n if (!this.added) {\n this.alignOnAdd = true;\n return;\n }\n var wrapper = this,\n renderer = wrapper.renderer,\n elem = wrapper.element,\n translateX = wrapper.translateX || 0,\n translateY = wrapper.translateY || 0,\n x = wrapper.x || 0,\n y = wrapper.y || 0,\n align = wrapper.textAlign || 'left',\n alignCorrection = {\n left: 0,\n center: 0.5,\n right: 1\n }[align],\n styles = wrapper.styles,\n whiteSpace = styles && styles.whiteSpace;\n /** @private */\n function getTextPxLength() {\n if (wrapper.textPxLength) {\n return wrapper.textPxLength;\n }\n // Reset multiline/ellipsis in order to read width (#4928,\n // #5417)\n css(elem, {\n width: '',\n whiteSpace: whiteSpace || 'nowrap'\n });\n return elem.offsetWidth;\n }\n // apply translate\n css(elem, {\n marginLeft: translateX,\n marginTop: translateY\n });\n if (!renderer.styledMode && wrapper.shadows) { // used in labels/tooltip\n wrapper.shadows.forEach(function (shadow) {\n css(shadow, {\n marginLeft: translateX + 1,\n marginTop: translateY + 1\n });\n });\n }\n // apply inversion\n if (wrapper.inverted) { // wrapper is a group\n [].forEach.call(elem.childNodes, function (child) {\n renderer.invertChild(child, elem);\n });\n }\n if (elem.tagName === 'SPAN') {\n var rotation = wrapper.rotation, textWidth = wrapper.textWidth && pInt(wrapper.textWidth), currentTextTransform = [\n rotation,\n align,\n elem.innerHTML,\n wrapper.textWidth,\n wrapper.textAlign\n ].join(',');\n var baseline = void 0,\n hasBoxWidthChanged = false;\n // Update textWidth. Use the memoized textPxLength if possible, to\n // avoid the getTextPxLength function using elem.offsetWidth.\n // Calling offsetWidth affects rendering time as it forces layout\n // (#7656).\n if (textWidth !== wrapper.oldTextWidth) { // #983, #1254\n var textPxLength = getTextPxLength();\n if (((textWidth > wrapper.oldTextWidth) ||\n textPxLength > textWidth) && (\n // Only set the width if the text is able to word-wrap,\n // or text-overflow is ellipsis (#9537)\n /[ \\-]/.test(elem.textContent || elem.innerText) ||\n elem.style.textOverflow === 'ellipsis')) {\n css(elem, {\n width: (textPxLength > textWidth) || rotation ?\n textWidth + 'px' :\n 'auto',\n display: 'block',\n whiteSpace: whiteSpace || 'normal' // #3331\n });\n wrapper.oldTextWidth = textWidth;\n hasBoxWidthChanged = true; // #8159\n }\n }\n wrapper.hasBoxWidthChanged = hasBoxWidthChanged; // #8159\n // Do the calculations and DOM access only if properties changed\n if (currentTextTransform !== wrapper.cTT) {\n baseline = renderer.fontMetrics(elem.style.fontSize, elem).b;\n // Renderer specific handling of span rotation, but only if we\n // have something to update.\n if (defined(rotation) &&\n ((rotation !== (wrapper.oldRotation || 0)) ||\n (align !== wrapper.oldAlign))) {\n wrapper.setSpanRotation(rotation, alignCorrection, baseline);\n }\n wrapper.getSpanCorrection(\n // Avoid elem.offsetWidth if we can, it affects rendering\n // time heavily (#7656)\n ((!defined(rotation) && wrapper.textPxLength) || // #7920\n elem.offsetWidth), baseline, alignCorrection, rotation, align);\n }\n // apply position with correction\n css(elem, {\n left: (x + (wrapper.xCorr || 0)) + 'px',\n top: (y + (wrapper.yCorr || 0)) + 'px'\n });\n // record current text transform\n wrapper.cTT = currentTextTransform;\n wrapper.oldRotation = rotation;\n wrapper.oldAlign = align;\n }\n };\n /**\n * Set the rotation of an individual HTML span.\n * @private\n */\n HTMLElement.prototype.setSpanRotation = function (rotation, alignCorrection, baseline) {\n var getTransformKey = function () { return (isMS &&\n !/Edge/.test(win.navigator.userAgent) ?\n '-ms-transform' :\n isWebKit ?\n '-webkit-transform' :\n isFirefox ?\n 'MozTransform' :\n win.opera ?\n '-o-transform' :\n void 0); };\n var rotationStyle = {},\n cssTransformKey = getTransformKey();\n if (cssTransformKey) {\n rotationStyle[cssTransformKey] = rotationStyle.transform =\n 'rotate(' + rotation + 'deg)';\n rotationStyle[cssTransformKey + (isFirefox ? 'Origin' : '-origin')] = rotationStyle.transformOrigin =\n (alignCorrection * 100) + '% ' + baseline + 'px';\n css(this.element, rotationStyle);\n }\n };\n /* *\n *\n * Static Properties\n *\n * */\n HTMLElement.composedClasses = [];\n return HTMLElement;\n }(SVGElement));\n /* *\n *\n * Default Export\n *\n * */\n\n return HTMLElement;\n });\n _registerModule(_modules, 'Core/Renderer/HTML/HTMLRenderer.js', [_modules['Core/Renderer/HTML/AST.js'], _modules['Core/Renderer/SVG/SVGElement.js'], _modules['Core/Renderer/SVG/SVGRenderer.js'], _modules['Core/Utilities.js']], function (AST, SVGElement, SVGRenderer, U) {\n /* *\n *\n * (c) 2010-2021 Torstein Honsi\n *\n * License: www.highcharts.com/license\n *\n * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!\n *\n * */\n var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d,\n b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d,\n b) { d.__proto__ = b; }) ||\n function (d,\n b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n })();\n var attr = U.attr,\n createElement = U.createElement,\n extend = U.extend,\n pick = U.pick;\n /* *\n *\n * Class\n *\n * */\n /* eslint-disable valid-jsdoc */\n // Extend SvgRenderer for useHTML option.\n var HTMLRenderer = /** @class */ (function (_super) {\n __extends(HTMLRenderer, _super);\n function HTMLRenderer() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /* *\n *\n * Static Functions\n *\n * */\n /** @private */\n HTMLRenderer.compose = function (SVGRendererClass) {\n if (HTMLRenderer.composedClasses.indexOf(SVGRendererClass) === -1) {\n HTMLRenderer.composedClasses.push(SVGRendererClass);\n var htmlRendererProto = HTMLRenderer.prototype,\n svgRendererProto = SVGRendererClass.prototype;\n svgRendererProto.html = htmlRendererProto.html;\n }\n return SVGRendererClass;\n };\n /* *\n *\n * Functions\n *\n * */\n /**\n * Create HTML text node. This is used by the VML renderer as well as the\n * SVG renderer through the useHTML option.\n *\n * @private\n * @function Highcharts.SVGRenderer#html\n *\n * @param {string} str\n * The text of (subset) HTML to draw.\n *\n * @param {number} x\n * The x position of the text's lower left corner.\n *\n * @param {number} y\n * The y position of the text's lower left corner.\n *\n * @return {Highcharts.HTMLDOMElement}\n * HTML element.\n */\n HTMLRenderer.prototype.html = function (str, x, y) {\n var wrapper = this.createElement('span'), element = wrapper.element, renderer = wrapper.renderer, isSVG = renderer.isSVG, addSetters = function (gWrapper, style) {\n // These properties are set as attributes on the SVG group, and\n // as identical CSS properties on the div. (#3542)\n ['opacity', 'visibility'].forEach(function (prop) {\n gWrapper[prop + 'Setter'] = function (value, key, elem) {\n var styleObject = gWrapper.div ?\n gWrapper.div.style :\n style;\n SVGElement.prototype[prop + 'Setter']\n .call(this, value, key, elem);\n if (styleObject) {\n styleObject[key] = value;\n }\n };\n });\n gWrapper.addedSetters = true;\n };\n // Text setter\n wrapper.textSetter = function (value) {\n if (value !== this.textStr) {\n delete this.bBox;\n delete this.oldTextWidth;\n AST.setElementHTML(this.element, pick(value, ''));\n this.textStr = value;\n wrapper.doTransform = true;\n }\n };\n // Add setters for the element itself (#4938)\n if (isSVG) { // #4938, only for HTML within SVG\n addSetters(wrapper, wrapper.element.style);\n }\n // Various setters which rely on update transform\n wrapper.xSetter =\n wrapper.ySetter =\n wrapper.alignSetter =\n wrapper.rotationSetter =\n function (value, key) {\n if (key === 'align') {\n // Do not overwrite the SVGElement.align method. Same as VML.\n wrapper.alignValue = wrapper.textAlign = value;\n }\n else {\n wrapper[key] = value;\n }\n wrapper.doTransform = true;\n };\n // Runs at the end of .attr()\n wrapper.afterSetters = function () {\n // Update transform. Do this outside the loop to prevent redundant\n // updating for batch setting of attributes.\n if (this.doTransform) {\n this.htmlUpdateTransform();\n this.doTransform = false;\n }\n };\n // Set the default attributes\n wrapper\n .attr({\n text: str,\n x: Math.round(x),\n y: Math.round(y)\n })\n .css({\n position: 'absolute'\n });\n if (!renderer.styledMode) {\n wrapper.css({\n fontFamily: this.style.fontFamily,\n fontSize: this.style.fontSize\n });\n }\n // Keep the whiteSpace style outside the wrapper.styles collection\n element.style.whiteSpace = 'nowrap';\n // Use the HTML specific .css method\n wrapper.css = wrapper.htmlCss;\n // This is specific for HTML within SVG\n if (isSVG) {\n wrapper.add = function (svgGroupWrapper) {\n var container = renderer.box.parentNode,\n parents = [];\n var htmlGroup,\n parentGroup;\n this.parentGroup = svgGroupWrapper;\n // Create a mock group to hold the HTML elements\n if (svgGroupWrapper) {\n htmlGroup = svgGroupWrapper.div;\n if (!htmlGroup) {\n // Read the parent chain into an array and read from top\n // down\n parentGroup = svgGroupWrapper;\n while (parentGroup) {\n parents.push(parentGroup);\n // Move up to the next parent group\n parentGroup = parentGroup.parentGroup;\n }\n // Ensure dynamically updating position when any parent\n // is translated\n parents.reverse().forEach(function (parentGroup) {\n var cls = attr(parentGroup.element, 'class');\n /**\n * Common translate setter for X and Y on the HTML\n * group. Reverted the fix for #6957 du to\n * positioning problems and offline export (#7254,\n * #7280, #7529)\n * @private\n * @param {*} value\n * @param {string} key\n */\n function translateSetter(value, key) {\n parentGroup[key] = value;\n if (key === 'translateX') {\n htmlGroupStyle.left = value + 'px';\n }\n else {\n htmlGroupStyle.top = value + 'px';\n }\n parentGroup.doTransform = true;\n }\n // Create a HTML div and append it to the parent div\n // to emulate the SVG group structure\n var parentGroupStyles = parentGroup.styles || {};\n htmlGroup =\n parentGroup.div =\n parentGroup.div || createElement('div', cls ? { className: cls } : void 0, {\n position: 'absolute',\n left: (parentGroup.translateX || 0) + 'px',\n top: (parentGroup.translateY || 0) + 'px',\n display: parentGroup.display,\n opacity: parentGroup.opacity,\n cursor: parentGroupStyles.cursor,\n pointerEvents: (\n // #5595\n parentGroupStyles.pointerEvents),\n visibility: parentGroup.visibility\n // the top group is appended to container\n }, htmlGroup || container);\n // Shortcut\n var htmlGroupStyle = htmlGroup.style;\n // Set listeners to update the HTML div's position\n // whenever the SVG group position is changed.\n extend(parentGroup, {\n // (#7287) Pass htmlGroup to use\n // the related group\n classSetter: (function (htmlGroup) {\n return function (value) {\n this.element.setAttribute('class', value);\n htmlGroup.className = value;\n };\n }(htmlGroup)),\n on: function () {\n if (parents[0].div) { // #6418\n wrapper.on.apply({\n element: parents[0].div,\n onEvents: parentGroup.onEvents\n }, arguments);\n }\n return parentGroup;\n },\n translateXSetter: translateSetter,\n translateYSetter: translateSetter\n });\n if (!parentGroup.addedSetters) {\n addSetters(parentGroup);\n }\n });\n }\n }\n else {\n htmlGroup = container;\n }\n htmlGroup.appendChild(element);\n // Shared with VML:\n wrapper.added = true;\n if (wrapper.alignOnAdd) {\n wrapper.htmlUpdateTransform();\n }\n return wrapper;\n };\n }\n return wrapper;\n };\n /* *\n *\n * Static Properties\n *\n * */\n HTMLRenderer.composedClasses = [];\n return HTMLRenderer;\n }(SVGRenderer));\n /* *\n *\n * Default Export\n *\n * */\n\n return HTMLRenderer;\n });\n _registerModule(_modules, 'Core/Axis/AxisDefaults.js', [], function () {\n /* *\n *\n * (c) 2010-2021 Torstein Honsi\n *\n * License: www.highcharts.com/license\n *\n * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!\n *\n * */\n /* *\n *\n * Namespace\n *\n * */\n var AxisDefaults;\n (function (AxisDefaults) {\n /* *\n *\n * Constants\n *\n * */\n /**\n * The X axis or category axis. Normally this is the horizontal axis,\n * though if the chart is inverted this is the vertical axis. In case of\n * multiple axes, the xAxis node is an array of configuration objects.\n *\n * See the [Axis class](/class-reference/Highcharts.Axis) for programmatic\n * access to the axis.\n *\n * @productdesc {highmaps}\n * In Highmaps, the axis is hidden, but it is used behind the scenes to\n * control features like zooming and panning. Zooming is in effect the same\n * as setting the extremes of one of the exes.\n *\n * @type {*|Array<*>}\n * @optionparent xAxis\n */\n AxisDefaults.defaultXAxisOptions = {\n /**\n * When using multiple axis, the ticks of two or more opposite axes\n * will automatically be aligned by adding ticks to the axis or axes\n * with the least ticks, as if `tickAmount` were specified.\n *\n * This can be prevented by setting `alignTicks` to false. If the grid\n * lines look messy, it's a good idea to hide them for the secondary\n * axis by setting `gridLineWidth` to 0.\n *\n * If `startOnTick` or `endOnTick` in an Axis options are set to false,\n * then the `alignTicks ` will be disabled for the Axis.\n *\n * Disabled for logarithmic axes.\n *\n * @product highcharts highstock gantt\n */\n alignTicks: true,\n /**\n * Whether to allow decimals in this axis' ticks. When counting\n * integers, like persons or hits on a web page, decimals should\n * be avoided in the labels. By default, decimals are allowed on small\n * scale axes.\n *\n * @see [minTickInterval](#xAxis.minTickInterval)\n *\n * @sample {highcharts|highstock} highcharts/yaxis/allowdecimals-true/\n * True by default\n * @sample {highcharts|highstock} highcharts/yaxis/allowdecimals-false/\n * False\n *\n * @type {boolean|undefined}\n * @default undefined\n * @since 2.0\n */\n allowDecimals: void 0,\n /**\n * When using an alternate grid color, a band is painted across the\n * plot area between every other grid line.\n *\n * @sample {highcharts} highcharts/yaxis/alternategridcolor/\n * Alternate grid color on the Y axis\n * @sample {highstock} stock/xaxis/alternategridcolor/\n * Alternate grid color on the Y axis\n *\n * @type {Highcharts.ColorType}\n * @apioption xAxis.alternateGridColor\n */\n /**\n * An array defining breaks in the axis, the sections defined will be\n * left out and all the points shifted closer to each other.\n *\n * @productdesc {highcharts}\n * Requires that the broken-axis.js module is loaded.\n *\n * @sample {highcharts} highcharts/axisbreak/break-simple/\n * Simple break\n * @sample {highcharts|highstock} highcharts/axisbreak/break-visualized/\n * Advanced with callback\n * @sample {highstock} stock/demo/intraday-breaks/\n * Break on nights and weekends\n *\n * @type {Array<*>}\n * @since 4.1.0\n * @product highcharts highstock gantt\n * @apioption xAxis.breaks\n */\n /**\n * A number indicating how much space should be left between the start\n * and the end of the break. The break size is given in axis units,\n * so for instance on a `datetime` axis, a break size of 3600000 would\n * indicate the equivalent of an hour.\n *\n * @type {number}\n * @default 0\n * @since 4.1.0\n * @product highcharts highstock gantt\n * @apioption xAxis.breaks.breakSize\n */\n /**\n * The point where the break starts.\n *\n * @type {number}\n * @since 4.1.0\n * @product highcharts highstock gantt\n * @apioption xAxis.breaks.from\n */\n /**\n * Defines an interval after which the break appears again. By default\n * the breaks do not repeat.\n *\n * @type {number}\n * @default 0\n * @since 4.1.0\n * @product highcharts highstock gantt\n * @apioption xAxis.breaks.repeat\n */\n /**\n * The point where the break ends.\n *\n * @type {number}\n * @since 4.1.0\n * @product highcharts highstock gantt\n * @apioption xAxis.breaks.to\n */\n /**\n * If categories are present for the xAxis, names are used instead of\n * numbers for that axis.\n *\n * Since Highcharts 3.0, categories can also\n * be extracted by giving each point a [name](#series.data) and setting\n * axis [type](#xAxis.type) to `category`. However, if you have multiple\n * series, best practice remains defining the `categories` array.\n *\n * Example: `categories: ['Apples', 'Bananas', 'Oranges']`\n *\n * @sample {highcharts} highcharts/demo/line-labels/\n * With\n * @sample {highcharts} highcharts/xaxis/categories/\n * Without\n *\n * @type {Array}\n * @product highcharts gantt\n * @apioption xAxis.categories\n */\n /**\n * The highest allowed value for automatically computed axis extremes.\n *\n * @see [floor](#xAxis.floor)\n *\n * @sample {highcharts|highstock} highcharts/yaxis/floor-ceiling/\n * Floor and ceiling\n *\n * @type {number}\n * @since 4.0\n * @product highcharts highstock gantt\n * @apioption xAxis.ceiling\n */\n /**\n * A class name that opens for styling the axis by CSS, especially in\n * Highcharts styled mode. The class name is applied to group elements\n * for the grid, axis elements and labels.\n *\n * @sample {highcharts|highstock|highmaps} highcharts/css/axis/\n * Multiple axes with separate styling\n *\n * @type {string}\n * @since 5.0.0\n * @apioption xAxis.className\n */\n /**\n * Configure a crosshair that follows either the mouse pointer or the\n * hovered point.\n *\n * In styled mode, the crosshairs are styled in the\n * `.highcharts-crosshair`, `.highcharts-crosshair-thin` or\n * `.highcharts-xaxis-category` classes.\n *\n * @productdesc {highstock}\n * In Highcharts stock, by default, the crosshair is enabled on the\n * X axis and disabled on the Y axis.\n *\n * @sample {highcharts} highcharts/xaxis/crosshair-both/\n * Crosshair on both axes\n * @sample {highstock} stock/xaxis/crosshairs-xy/\n * Crosshair on both axes, with y axis label\n * @sample {highmaps} highcharts/xaxis/crosshair-both/\n * Crosshair on both axes\n *\n * @declare Highcharts.AxisCrosshairOptions\n * @type {boolean|*}\n * @default false\n * @since 4.1\n * @apioption xAxis.crosshair\n */\n /**\n * A class name for the crosshair, especially as a hook for styling.\n *\n * @type {string}\n * @since 5.0.0\n * @apioption xAxis.crosshair.className\n */\n /**\n * The color of the crosshair. Defaults to `#cccccc` for numeric and\n * datetime axes, and `rgba(204,214,235,0.25)` for category axes, where\n * the crosshair by default highlights the whole category.\n *\n * @sample {highcharts|highstock|highmaps} highcharts/xaxis/crosshair-customized/\n * Customized crosshairs\n *\n * @type {Highcharts.ColorType}\n * @default #cccccc\n * @since 4.1\n * @apioption xAxis.crosshair.color\n */\n /**\n * The dash style for the crosshair. See\n * [plotOptions.series.dashStyle](#plotOptions.series.dashStyle)\n * for possible values.\n *\n * @sample {highcharts|highmaps} highcharts/xaxis/crosshair-dotted/\n * Dotted crosshair\n * @sample {highstock} stock/xaxis/crosshair-dashed/\n * Dashed X axis crosshair\n *\n * @type {Highcharts.DashStyleValue}\n * @default Solid\n * @since 4.1\n * @apioption xAxis.crosshair.dashStyle\n */\n /**\n * A label on the axis next to the crosshair.\n *\n * In styled mode, the label is styled with the\n * `.highcharts-crosshair-label` class.\n *\n * @sample {highstock} stock/xaxis/crosshair-label/\n * Crosshair labels\n * @sample {highstock} highcharts/css/crosshair-label/\n * Style mode\n *\n * @declare Highcharts.AxisCrosshairLabelOptions\n * @since 2.1\n * @product highstock\n * @apioption xAxis.crosshair.label\n */\n /**\n * Alignment of the label compared to the axis. Defaults to `\"left\"` for\n * right-side axes, `\"right\"` for left-side axes and `\"center\"` for\n * horizontal axes.\n *\n * @type {Highcharts.AlignValue}\n * @since 2.1\n * @product highstock\n * @apioption xAxis.crosshair.label.align\n */\n /**\n * The background color for the label. Defaults to the related series\n * color, or `#666666` if that is not available.\n *\n * @type {Highcharts.ColorType}\n * @since 2.1\n * @product highstock\n * @apioption xAxis.crosshair.label.backgroundColor\n */\n /**\n * The border color for the crosshair label\n *\n * @type {Highcharts.ColorType}\n * @since 2.1\n * @product highstock\n * @apioption xAxis.crosshair.label.borderColor\n */\n /**\n * The border corner radius of the crosshair label.\n *\n * @type {number}\n * @default 3\n * @since 2.1.10\n * @product highstock\n * @apioption xAxis.crosshair.label.borderRadius\n */\n /**\n * The border width for the crosshair label.\n *\n * @type {number}\n * @default 0\n * @since 2.1\n * @product highstock\n * @apioption xAxis.crosshair.label.borderWidth\n */\n /**\n * Flag to enable crosshair's label.\n *\n * @sample {highstock} stock/xaxis/crosshairs-xy/\n * Enabled label for yAxis' crosshair\n *\n * @type {boolean}\n * @default false\n * @since 2.1\n * @product highstock\n * @apioption xAxis.crosshair.label.enabled\n */\n /**\n * A format string for the crosshair label. Defaults to `{value}` for\n * numeric axes and `{value:%b %d, %Y}` for datetime axes.\n *\n * @type {string}\n * @since 2.1\n * @product highstock\n * @apioption xAxis.crosshair.label.format\n */\n /**\n * Formatter function for the label text.\n *\n * @type {Highcharts.XAxisCrosshairLabelFormatterCallbackFunction}\n * @since 2.1\n * @product highstock\n * @apioption xAxis.crosshair.label.formatter\n */\n /**\n * Padding inside the crosshair label.\n *\n * @type {number}\n * @default 8\n * @since 2.1\n * @product highstock\n * @apioption xAxis.crosshair.label.padding\n */\n /**\n * The shape to use for the label box.\n *\n * @type {string}\n * @default callout\n * @since 2.1\n * @product highstock\n * @apioption xAxis.crosshair.label.shape\n */\n /**\n * Text styles for the crosshair label.\n *\n * @type {Highcharts.CSSObject}\n * @default {\"color\": \"white\", \"fontWeight\": \"normal\", \"fontSize\": \"11px\", \"textAlign\": \"center\"}\n * @since 2.1\n * @product highstock\n * @apioption xAxis.crosshair.label.style\n */\n /**\n * Whether the crosshair should snap to the point or follow the pointer\n * independent of points.\n *\n * @sample {highcharts|highstock} highcharts/xaxis/crosshair-snap-false/\n * True by default\n * @sample {highmaps} maps/demo/latlon-advanced/\n * Snap is false\n *\n * @type {boolean}\n * @default true\n * @since 4.1\n * @apioption xAxis.crosshair.snap\n */\n /**\n * The pixel width of the crosshair. Defaults to 1 for numeric or\n * datetime axes, and for one category width for category axes.\n *\n * @sample {highcharts} highcharts/xaxis/crosshair-customized/\n * Customized crosshairs\n * @sample {highstock} highcharts/xaxis/crosshair-customized/\n * Customized crosshairs\n * @sample {highmaps} highcharts/xaxis/crosshair-customized/\n * Customized crosshairs\n *\n * @type {number}\n * @default 1\n * @since 4.1\n * @apioption xAxis.crosshair.width\n */\n /**\n * The Z index of the crosshair. Higher Z indices allow drawing the\n * crosshair on top of the series or behind the grid lines.\n *\n * @type {number}\n * @default 2\n * @since 4.1\n * @apioption xAxis.crosshair.zIndex\n */\n /**\n * Whether to pan axis. If `chart.panning` is enabled, the option\n * allows to disable panning on an individual axis.\n */\n panningEnabled: true,\n /**\n * The Z index for the axis group.\n */\n zIndex: 2,\n /**\n * Whether to zoom axis. If `chart.zoomType` is set, the option allows\n * to disable zooming on an individual axis.\n *\n * @sample {highcharts} highcharts/xaxis/zoomenabled/\n * Zoom enabled is false\n */\n zoomEnabled: true,\n /**\n * For a datetime axis, the scale will automatically adjust to the\n * appropriate unit. This member gives the default string\n * representations used for each unit. For intermediate values,\n * different units may be used, for example the `day` unit can be used\n * on midnight and `hour` unit be used for intermediate values on the\n * same axis.\n *\n * For an overview of the replacement codes, see\n * [dateFormat](/class-reference/Highcharts.Time#dateFormat).\n *\n * Defaults to:\n * ```js\n * {\n * millisecond: '%H:%M:%S.%L',\n * second: '%H:%M:%S',\n * minute: '%H:%M',\n * hour: '%H:%M',\n * day: '%e. %b',\n * week: '%e. %b',\n * month: '%b \\'%y',\n * year: '%Y'\n * }\n * ```\n *\n * @sample {highcharts} highcharts/xaxis/datetimelabelformats/\n * Different day format on X axis\n * @sample {highstock} stock/xaxis/datetimelabelformats/\n * More information in x axis labels\n *\n * @declare Highcharts.AxisDateTimeLabelFormatsOptions\n * @product highcharts highstock gantt\n */\n dateTimeLabelFormats: {\n /**\n * @declare Highcharts.AxisDateTimeLabelFormatsOptionsObject\n * @type {string|*}\n */\n millisecond: {\n main: '%H:%M:%S.%L',\n range: false\n },\n /**\n * @declare Highcharts.AxisDateTimeLabelFormatsOptionsObject\n * @type {string|*}\n */\n second: {\n main: '%H:%M:%S',\n range: false\n },\n /**\n * @declare Highcharts.AxisDateTimeLabelFormatsOptionsObject\n * @type {string|*}\n */\n minute: {\n main: '%H:%M',\n range: false\n },\n /**\n * @declare Highcharts.AxisDateTimeLabelFormatsOptionsObject\n * @type {string|*}\n */\n hour: {\n main: '%H:%M',\n range: false\n },\n /**\n * @declare Highcharts.AxisDateTimeLabelFormatsOptionsObject\n * @type {string|*}\n */\n day: {\n main: '%e. %b'\n },\n /**\n * @declare Highcharts.AxisDateTimeLabelFormatsOptionsObject\n * @type {string|*}\n */\n week: {\n main: '%e. %b'\n },\n /**\n * @declare Highcharts.AxisDateTimeLabelFormatsOptionsObject\n * @type {string|*}\n */\n month: {\n main: '%b \\'%y'\n },\n /**\n * @declare Highcharts.AxisDateTimeLabelFormatsOptionsObject\n * @type {string|*}\n */\n year: {\n main: '%Y'\n }\n },\n /**\n * Whether to force the axis to end on a tick. Use this option with\n * the `maxPadding` option to control the axis end.\n *\n * @productdesc {highstock}\n * In Highcharts Stock, `endOnTick` is always `false` when the navigator\n * is enabled, to prevent jumpy scrolling.\n *\n * @sample {highcharts} highcharts/yaxis/endontick/\n * True by default\n * @sample {highcharts} highcharts/yaxis/endontick-false/\n * False\n * @sample {highstock} stock/demo/basic-line/\n * True by default\n * @sample {highstock} stock/xaxis/endontick/\n * False\n *\n * @since 1.2.0\n */\n endOnTick: false,\n /**\n * Event handlers for the axis.\n *\n * @type {*}\n * @apioption xAxis.events\n */\n /**\n * An event fired after the breaks have rendered.\n *\n * @see [breaks](#xAxis.breaks)\n *\n * @sample {highcharts} highcharts/axisbreak/break-event/\n * AfterBreak Event\n *\n * @type {Highcharts.AxisEventCallbackFunction}\n * @since 4.1.0\n * @product highcharts gantt\n * @apioption xAxis.events.afterBreaks\n */\n /**\n * As opposed to the `setExtremes` event, this event fires after the\n * final min and max values are computed and corrected for `minRange`.\n *\n * Fires when the minimum and maximum is set for the axis, either by\n * calling the `.setExtremes()` method or by selecting an area in the\n * chart. One parameter, `event`, is passed to the function, containing\n * common event information.\n *\n * The new user set minimum and maximum values can be found by\n * `event.min` and `event.max`. These reflect the axis minimum and\n * maximum in axis values. The actual data extremes are found in\n * `event.dataMin` and `event.dataMax`.\n *\n * @type {Highcharts.AxisSetExtremesEventCallbackFunction}\n * @since 2.3\n * @context Highcharts.Axis\n * @apioption xAxis.events.afterSetExtremes\n */\n /**\n * An event fired when a break from this axis occurs on a point.\n *\n * @see [breaks](#xAxis.breaks)\n *\n * @sample {highcharts} highcharts/axisbreak/break-visualized/\n * Visualization of a Break\n *\n * @type {Highcharts.AxisPointBreakEventCallbackFunction}\n * @since 4.1.0\n * @product highcharts gantt\n * @context Highcharts.Axis\n * @apioption xAxis.events.pointBreak\n */\n /**\n * An event fired when a point falls inside a break from this axis.\n *\n * @type {Highcharts.AxisPointBreakEventCallbackFunction}\n * @product highcharts highstock gantt\n * @context Highcharts.Axis\n * @apioption xAxis.events.pointInBreak\n */\n /**\n * Fires when the minimum and maximum is set for the axis, either by\n * calling the `.setExtremes()` method or by selecting an area in the\n * chart. One parameter, `event`, is passed to the function,\n * containing common event information.\n *\n * The new user set minimum and maximum values can be found by\n * `event.min` and `event.max`. These reflect the axis minimum and\n * maximum in data values. When an axis is zoomed all the way out from\n * the \"Reset zoom\" button, `event.min` and `event.max` are null, and\n * the new extremes are set based on `this.dataMin` and `this.dataMax`.\n *\n * @sample {highstock} stock/xaxis/events-setextremes/\n * Log new extremes on x axis\n *\n * @type {Highcharts.AxisSetExtremesEventCallbackFunction}\n * @since 1.2.0\n * @context Highcharts.Axis\n * @apioption xAxis.events.setExtremes\n */\n /**\n * The lowest allowed value for automatically computed axis extremes.\n *\n * @see [ceiling](#yAxis.ceiling)\n *\n * @sample {highcharts} highcharts/yaxis/floor-ceiling/\n * Floor and ceiling\n * @sample {highstock} stock/demo/lazy-loading/\n * Prevent negative stock price on Y axis\n *\n * @type {number}\n * @since 4.0\n * @product highcharts highstock gantt\n * @apioption xAxis.floor\n */\n /**\n * The dash or dot style of the grid lines. For possible values, see\n * [this demonstration](https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/plotoptions/series-dashstyle-all/).\n *\n * @sample {highcharts} highcharts/yaxis/gridlinedashstyle/\n * Long dashes\n * @sample {highstock} stock/xaxis/gridlinedashstyle/\n * Long dashes\n *\n * @type {Highcharts.DashStyleValue}\n * @since 1.2\n */\n gridLineDashStyle: 'Solid',\n /**\n * The Z index of the grid lines.\n *\n * @sample {highcharts|highstock} highcharts/xaxis/gridzindex/\n * A Z index of 4 renders the grid above the graph\n *\n * @product highcharts highstock gantt\n */\n gridZIndex: 1,\n /**\n * An id for the axis. This can be used after render time to get\n * a pointer to the axis object through `chart.get()`.\n *\n * @sample {highcharts} highcharts/xaxis/id/\n * Get the object\n * @sample {highstock} stock/xaxis/id/\n * Get the object\n *\n * @type {string}\n * @since 1.2.0\n * @apioption xAxis.id\n */\n /**\n * The axis labels show the number or category for each tick.\n *\n * Since v8.0.0: Labels are animated in categorized x-axis with\n * updating data if `tickInterval` and `step` is set to 1.\n *\n * @productdesc {highmaps}\n * X and Y axis labels are by default disabled in Highmaps, but the\n * functionality is inherited from Highcharts and used on `colorAxis`,\n * and can be enabled on X and Y axes too.\n */\n labels: {\n /**\n * What part of the string the given position is anchored to.\n * If `left`, the left side of the string is at the axis position.\n * Can be one of `\"left\"`, `\"center\"` or `\"right\"`. Defaults to\n * an intelligent guess based on which side of the chart the axis\n * is on and the rotation of the label.\n *\n * @see [reserveSpace](#xAxis.labels.reserveSpace)\n *\n * @sample {highcharts} highcharts/xaxis/labels-align-left/\n * Left\n * @sample {highcharts} highcharts/xaxis/labels-align-right/\n * Right\n * @sample {highcharts} highcharts/xaxis/labels-reservespace-true/\n * Left-aligned labels on a vertical category axis\n *\n * @type {Highcharts.AlignValue}\n * @apioption xAxis.labels.align\n */\n /**\n * Whether to allow the axis labels to overlap.\n * When false, overlapping labels are hidden.\n *\n * @sample {highcharts} highcharts/xaxis/labels-allowoverlap-true/\n * X axis labels overlap enabled\n *\n * @type {boolean}\n * @default false\n * @apioption xAxis.labels.allowOverlap\n *\n */\n /**\n * For horizontal axes, the allowed degrees of label rotation\n * to prevent overlapping labels. If there is enough space,\n * labels are not rotated. As the chart gets narrower, it\n * will start rotating the labels -45 degrees, then remove\n * every second label and try again with rotations 0 and -45 etc.\n * Set it to `undefined` to disable rotation, which will\n * cause the labels to word-wrap if possible. Defaults to `[-45]``\n * on bottom and top axes, `undefined` on left and right axes.\n *\n * @sample {highcharts|highstock} highcharts/xaxis/labels-autorotation-default/\n * Default auto rotation of 0 or -45\n * @sample {highcharts|highstock} highcharts/xaxis/labels-autorotation-0-90/\n * Custom graded auto rotation\n *\n * @type {Array}\n * @default undefined\n * @since 4.1.0\n * @product highcharts highstock gantt\n * @apioption xAxis.labels.autoRotation\n */\n autoRotation: void 0,\n /**\n * When each category width is more than this many pixels, we don't\n * apply auto rotation. Instead, we lay out the axis label with word\n * wrap. A lower limit makes sense when the label contains multiple\n * short words that don't extend the available horizontal space for\n * each label.\n *\n * @sample {highcharts} highcharts/xaxis/labels-autorotationlimit/\n * Lower limit\n *\n * @since 4.1.5\n * @product highcharts gantt\n */\n autoRotationLimit: 80,\n /**\n * Polar charts only. The label's pixel distance from the perimeter\n * of the plot area.\n *\n * @type {number}\n * @default undefined\n * @product highcharts gantt\n */\n distance: void 0,\n /**\n * Enable or disable the axis labels.\n *\n * @sample {highcharts} highcharts/xaxis/labels-enabled/\n * X axis labels disabled\n * @sample {highstock} stock/xaxis/labels-enabled/\n * X axis labels disabled\n *\n * @default {highcharts|highstock|gantt} true\n * @default {highmaps} false\n */\n enabled: true,\n /**\n * A format string for the axis label. The context is available as\n * format string variables. For example, you can use `{text}` to\n * insert the default formatted text. The recommended way of adding\n * units for the label is using `text`, for example `{text} km`.\n *\n * To add custom numeric or datetime formatting, use `{value}` with\n * formatting, for example `{value:.1f}` or `{value:%Y-%m-%d}`.\n *\n * See\n * [format string](https://www.highcharts.com/docs/chart-concepts/labels-and-string-formatting)\n * for more examples of formatting.\n *\n * The default value is not specified due to the dynamic\n * nature of the default implementation.\n *\n * @sample {highcharts|highstock} highcharts/yaxis/labels-format/\n * Add units to Y axis label\n * @sample {highcharts} highcharts/xaxis/labels-format-linked/\n * Linked category names\n * @sample {highcharts} highcharts/xaxis/labels-format-custom/\n * Custom number format\n *\n * @type {string}\n * @since 3.0\n * @apioption xAxis.labels.format\n */\n /**\n * Callback JavaScript function to format the label. The value\n * is given by `this.value`. Additional properties for `this` are\n * `axis`, `chart`, `isFirst`, `isLast` and `text` which holds the\n * value of the default formatter.\n *\n * Defaults to a built in function returning a formatted string\n * depending on whether the axis is `category`, `datetime`,\n * `numeric` or other.\n *\n * @sample {highcharts} highcharts/xaxis/labels-formatter-linked/\n * Linked category names\n * @sample {highcharts} highcharts/xaxis/labels-formatter-extended/\n * Modified numeric labels\n * @sample {highstock} stock/xaxis/labels-formatter/\n * Added units on Y axis\n *\n * @type {Highcharts.AxisLabelsFormatterCallbackFunction}\n * @apioption xAxis.labels.formatter\n */\n /**\n * The number of pixels to indent the labels per level in a treegrid\n * axis.\n *\n * @sample gantt/treegrid-axis/demo\n * Indentation 10px by default.\n * @sample gantt/treegrid-axis/indentation-0px\n * Indentation set to 0px.\n *\n * @product gantt\n */\n indentation: 10,\n /**\n * Horizontal axis only. When `staggerLines` is not set,\n * `maxStaggerLines` defines how many lines the axis is allowed to\n * add to automatically avoid overlapping X labels. Set to `1` to\n * disable overlap detection.\n *\n * @deprecated\n * @type {number}\n * @default 5\n * @since 1.3.3\n * @apioption xAxis.labels.maxStaggerLines\n */\n /**\n * How to handle overflowing labels on horizontal axis. If set to\n * `\"allow\"`, it will not be aligned at all. By default it\n * `\"justify\"` labels inside the chart area. If there is room to\n * move it, it will be aligned to the edge, else it will be removed.\n *\n * @since 2.2.5\n * @validvalue [\"allow\", \"justify\"]\n */\n overflow: 'justify',\n /**\n * The pixel padding for axis labels, to ensure white space between\n * them.\n *\n * @product highcharts gantt\n */\n padding: 5,\n /**\n * Whether to reserve space for the labels. By default, space is\n * reserved for the labels in these cases:\n *\n * * On all horizontal axes.\n * * On vertical axes if `label.align` is `right` on a left-side\n * axis or `left` on a right-side axis.\n * * On vertical axes if `label.align` is `center`.\n *\n * This can be turned off when for example the labels are rendered\n * inside the plot area instead of outside.\n *\n * @see [labels.align](#xAxis.labels.align)\n *\n * @sample {highcharts} highcharts/xaxis/labels-reservespace/\n * No reserved space, labels inside plot\n * @sample {highcharts} highcharts/xaxis/labels-reservespace-true/\n * Left-aligned labels on a vertical category axis\n *\n * @type {boolean}\n * @since 4.1.10\n * @product highcharts gantt\n * @apioption xAxis.labels.reserveSpace\n */\n reserveSpace: void 0,\n /**\n * Rotation of the labels in degrees. When `undefined`, the\n * `autoRotation` option takes precedence.\n *\n * @sample {highcharts} highcharts/xaxis/labels-rotation/\n * X axis labels rotated 90°\n *\n * @type {number}\n * @default 0\n * @apioption xAxis.labels.rotation\n */\n rotation: void 0,\n /**\n * Horizontal axes only. The number of lines to spread the labels\n * over to make room or tighter labels. 0 disables staggering.\n *\n * @sample {highcharts} highcharts/xaxis/labels-staggerlines/\n * Show labels over two lines\n * @sample {highstock} stock/xaxis/labels-staggerlines/\n * Show labels over two lines\n *\n * @since 2.1\n */\n staggerLines: 0,\n /**\n * To show only every _n_'th label on the axis, set the step to _n_.\n * Setting the step to 2 shows every other label.\n *\n * By default, when 0, the step is calculated automatically to avoid\n * overlap. To prevent this, set it to 1\\. This usually only\n * happens on a category axis, and is often a sign that you have\n * chosen the wrong axis type.\n *\n * Read more at\n * [Axis docs](https://www.highcharts.com/docs/chart-concepts/axes)\n * => What axis should I use?\n *\n * @sample {highcharts} highcharts/xaxis/labels-step/\n * Showing only every other axis label on a categorized\n * x-axis\n * @sample {highcharts} highcharts/xaxis/labels-step-auto/\n * Auto steps on a category axis\n *\n * @since 2.1\n */\n step: 0,\n /**\n * Whether to [use HTML](https://www.highcharts.com/docs/chart-concepts/labels-and-string-formatting#html)\n * to render the labels.\n */\n useHTML: false,\n /**\n * The x position offset of all labels relative to the tick\n * positions on the axis.\n *\n * @sample {highcharts} highcharts/xaxis/labels-x/\n * Y axis labels placed on grid lines\n */\n x: 0,\n /**\n * The y position offset of all labels relative to the tick\n * positions on the axis. The default makes it adapt to the font\n * size of the bottom axis.\n *\n * @sample {highcharts} highcharts/xaxis/labels-x/\n * Y axis labels placed on grid lines\n *\n * @type {number}\n * @apioption xAxis.labels.y\n */\n /**\n * The Z index for the axis labels.\n */\n zIndex: 7,\n /**\n * CSS styles for the label. Use `whiteSpace: 'nowrap'` to prevent\n * wrapping of category labels. Use `textOverflow: 'none'` to\n * prevent ellipsis (dots).\n *\n * In styled mode, the labels are styled with the\n * `.highcharts-axis-labels` class.\n *\n * @sample {highcharts} highcharts/xaxis/labels-style/\n * Red X axis labels\n *\n * @type {Highcharts.CSSObject}\n */\n style: {\n /** @internal */\n color: \"#666666\" /* Palette.neutralColor60 */,\n /** @internal */\n cursor: 'default',\n /** @internal */\n fontSize: '11px'\n }\n },\n /**\n * The left position as the horizontal axis. If it's a number, it is\n * interpreted as pixel position relative to the chart.\n *\n * Since Highcharts v5.0.13: If it's a percentage string, it is\n * interpreted as percentages of the plot width, offset from plot area\n * left.\n *\n * @type {number|string}\n * @product highcharts highstock\n * @apioption xAxis.left\n */\n /**\n * The top position as the vertical axis. If it's a number, it is\n * interpreted as pixel position relative to the chart.\n *\n * Since Highcharts 2: If it's a percentage string, it is interpreted\n * as percentages of the plot height, offset from plot area top.\n *\n * @type {number|string}\n * @product highcharts highstock\n * @apioption xAxis.top\n */\n /**\n * Index of another axis that this axis is linked to. When an axis is\n * linked to a master axis, it will take the same extremes as\n * the master, but as assigned by min or max or by setExtremes.\n * It can be used to show additional info, or to ease reading the\n * chart by duplicating the scales.\n *\n * @sample {highcharts} highcharts/xaxis/linkedto/\n * Different string formats of the same date\n * @sample {highcharts} highcharts/yaxis/linkedto/\n * Y values on both sides\n *\n * @type {number}\n * @since 2.0.2\n * @product highcharts highstock gantt\n * @apioption xAxis.linkedTo\n */\n /**\n * The maximum value of the axis. If `null`, the max value is\n * automatically calculated.\n *\n * If the [endOnTick](#yAxis.endOnTick) option is true, the `max` value\n * might be rounded up.\n *\n * If a [tickAmount](#yAxis.tickAmount) is set, the axis may be extended\n * beyond the set max in order to reach the given number of ticks. The\n * same may happen in a chart with multiple axes, determined by [chart.\n * alignTicks](#chart), where a `tickAmount` is applied internally.\n *\n * @sample {highcharts} highcharts/yaxis/max-200/\n * Y axis max of 200\n * @sample {highcharts} highcharts/yaxis/max-logarithmic/\n * Y axis max on logarithmic axis\n * @sample {highstock} stock/xaxis/min-max/\n * Fixed min and max on X axis\n *\n * @type {number|null}\n * @apioption xAxis.max\n */\n /**\n * Padding of the max value relative to the length of the axis. A\n * padding of 0.05 will make a 100px axis 5px longer. This is useful\n * when you don't want the highest data value to appear on the edge\n * of the plot area. When the axis' `max` option is set or a max extreme\n * is set using `axis.setExtremes()`, the maxPadding will be ignored.\n *\n * @productdesc {highstock}\n * For an [ordinal](#xAxis.ordinal) axis, `minPadding` and `maxPadding`\n * are ignored. Use [overscroll](#xAxis.overscroll) instead.\n *\n * @sample {highcharts} highcharts/yaxis/maxpadding/\n * Max padding of 0.25 on y axis\n * @sample {highstock} stock/xaxis/minpadding-maxpadding/\n * Greater min- and maxPadding\n * @sample {highmaps} maps/chart/plotbackgroundcolor-gradient/\n * Add some padding\n *\n * @default {highcharts} 0.01\n * @default {highstock|highmaps} 0\n * @since 1.2.0\n */\n maxPadding: 0.01,\n /**\n * Deprecated. Use `minRange` instead.\n *\n * @deprecated\n * @type {number}\n * @product highcharts highstock\n * @apioption xAxis.maxZoom\n */\n /**\n * The minimum value of the axis. If `null` the min value is\n * automatically calculated.\n *\n * If the [startOnTick](#yAxis.startOnTick) option is true (default),\n * the `min` value might be rounded down.\n *\n * The automatically calculated minimum value is also affected by\n * [floor](#yAxis.floor), [softMin](#yAxis.softMin),\n * [minPadding](#yAxis.minPadding), [minRange](#yAxis.minRange)\n * as well as [series.threshold](#plotOptions.series.threshold)\n * and [series.softThreshold](#plotOptions.series.softThreshold).\n *\n * @sample {highcharts} highcharts/yaxis/min-startontick-false/\n * -50 with startOnTick to false\n * @sample {highcharts} highcharts/yaxis/min-startontick-true/\n * -50 with startOnTick true by default\n * @sample {highstock} stock/xaxis/min-max/\n * Set min and max on X axis\n *\n * @type {number|null}\n * @apioption xAxis.min\n */\n /**\n * The dash or dot style of the minor grid lines. For possible values,\n * see [this demonstration](https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/plotoptions/series-dashstyle-all/).\n *\n * @sample {highcharts} highcharts/yaxis/minorgridlinedashstyle/\n * Long dashes on minor grid lines\n * @sample {highstock} stock/xaxis/minorgridlinedashstyle/\n * Long dashes on minor grid lines\n *\n * @type {Highcharts.DashStyleValue}\n * @since 1.2\n */\n minorGridLineDashStyle: 'Solid',\n /**\n * Specific tick interval in axis units for the minor ticks. On a linear\n * axis, if `\"auto\"`, the minor tick interval is calculated as a fifth\n * of the tickInterval. If `null` or `undefined`, minor ticks are not\n * shown.\n *\n * On logarithmic axes, the unit is the power of the value. For example,\n * setting the minorTickInterval to 1 puts one tick on each of 0.1, 1,\n * 10, 100 etc. Setting the minorTickInterval to 0.1 produces 9 ticks\n * between 1 and 10, 10 and 100 etc.\n *\n * If user settings dictate minor ticks to become too dense, they don't\n * make sense, and will be ignored to prevent performance problems.\n *\n * @sample {highcharts} highcharts/yaxis/minortickinterval-null/\n * Null by default\n * @sample {highcharts} highcharts/yaxis/minortickinterval-5/\n * 5 units\n * @sample {highcharts} highcharts/yaxis/minortickinterval-log-auto/\n * \"auto\"\n * @sample {highcharts} highcharts/yaxis/minortickinterval-log/\n * 0.1\n * @sample {highstock} stock/demo/basic-line/\n * Null by default\n * @sample {highstock} stock/xaxis/minortickinterval-auto/\n * \"auto\"\n *\n * @type {number|string|null}\n * @apioption xAxis.minorTickInterval\n */\n /**\n * The pixel length of the minor tick marks.\n *\n * @sample {highcharts} highcharts/yaxis/minorticklength/\n * 10px on Y axis\n * @sample {highstock} stock/xaxis/minorticks/\n * 10px on Y axis\n */\n minorTickLength: 2,\n /**\n * The position of the minor tick marks relative to the axis line.\n * Can be one of `inside` and `outside`.\n *\n * @sample {highcharts} highcharts/yaxis/minortickposition-outside/\n * Outside by default\n * @sample {highcharts} highcharts/yaxis/minortickposition-inside/\n * Inside\n * @sample {highstock} stock/xaxis/minorticks/\n * Inside\n *\n * @validvalue [\"inside\", \"outside\"]\n */\n minorTickPosition: 'outside',\n /**\n * Enable or disable minor ticks. Unless\n * [minorTickInterval](#xAxis.minorTickInterval) is set, the tick\n * interval is calculated as a fifth of the `tickInterval`.\n *\n * On a logarithmic axis, minor ticks are laid out based on a best\n * guess, attempting to enter approximately 5 minor ticks between\n * each major tick.\n *\n * Prior to v6.0.0, ticks were unabled in auto layout by setting\n * `minorTickInterval` to `\"auto\"`.\n *\n * @productdesc {highcharts}\n * On axes using [categories](#xAxis.categories), minor ticks are not\n * supported.\n *\n * @sample {highcharts} highcharts/yaxis/minorticks-true/\n * Enabled on linear Y axis\n *\n * @type {boolean}\n * @default false\n * @since 6.0.0\n * @apioption xAxis.minorTicks\n */\n /**\n * The pixel width of the minor tick mark.\n *\n * @sample {highcharts} highcharts/yaxis/minortickwidth/\n * 3px width\n * @sample {highstock} stock/xaxis/minorticks/\n * 1px width\n *\n * @type {number}\n * @default 0\n * @apioption xAxis.minorTickWidth\n */\n /**\n * Padding of the min value relative to the length of the axis. A\n * padding of 0.05 will make a 100px axis 5px longer. This is useful\n * when you don't want the lowest data value to appear on the edge\n * of the plot area. When the axis' `min` option is set or a min extreme\n * is set using `axis.setExtremes()`, the minPadding will be ignored.\n *\n * @productdesc {highstock}\n * For an [ordinal](#xAxis.ordinal) axis, `minPadding` and `maxPadding`\n * are ignored. Use [overscroll](#xAxis.overscroll) instead.\n *\n * @sample {highcharts} highcharts/yaxis/minpadding/\n * Min padding of 0.2\n * @sample {highstock} stock/xaxis/minpadding-maxpadding/\n * Greater min- and maxPadding\n * @sample {highmaps} maps/chart/plotbackgroundcolor-gradient/\n * Add some padding\n *\n * @default {highcharts} 0.01\n * @default {highstock|highmaps} 0\n * @since 1.2.0\n * @product highcharts highstock gantt\n */\n minPadding: 0.01,\n /**\n * The minimum range to display on this axis. The entire axis will not\n * be allowed to span over a smaller interval than this. For example,\n * for a datetime axis the main unit is milliseconds. If minRange is\n * set to 3600000, you can't zoom in more than to one hour.\n *\n * The default minRange for the x axis is five times the smallest\n * interval between any of the data points.\n *\n * On a logarithmic axis, the unit for the minimum range is the power.\n * So a minRange of 1 means that the axis can be zoomed to 10-100,\n * 100-1000, 1000-10000 etc.\n *\n * **Note**: The `minPadding`, `maxPadding`, `startOnTick` and\n * `endOnTick` settings also affect how the extremes of the axis\n * are computed.\n *\n * @sample {highcharts} highcharts/xaxis/minrange/\n * Minimum range of 5\n * @sample {highstock} stock/xaxis/minrange/\n * Max zoom of 6 months overrides user selections\n *\n * @type {number}\n * @apioption xAxis.minRange\n */\n /**\n * The minimum tick interval allowed in axis values. For example on\n * zooming in on an axis with daily data, this can be used to prevent\n * the axis from showing hours. Defaults to the closest distance between\n * two points on the axis.\n *\n * @type {number}\n * @since 2.3.0\n * @apioption xAxis.minTickInterval\n */\n /**\n * The distance in pixels from the plot area to the axis line.\n * A positive offset moves the axis with it's line, labels and ticks\n * away from the plot area. This is typically used when two or more\n * axes are displayed on the same side of the plot. With multiple\n * axes the offset is dynamically adjusted to avoid collision, this\n * can be overridden by setting offset explicitly.\n *\n * @sample {highcharts} highcharts/yaxis/offset/\n * Y axis offset of 70\n * @sample {highcharts} highcharts/yaxis/offset-centered/\n * Axes positioned in the center of the plot\n * @sample {highstock} stock/xaxis/offset/\n * Y axis offset by 70 px\n *\n * @type {number}\n */\n offset: void 0,\n /**\n * Whether to display the axis on the opposite side of the normal. The\n * normal is on the left side for vertical axes and bottom for\n * horizontal, so the opposite sides will be right and top respectively.\n * This is typically used with dual or multiple axes.\n *\n * @sample {highcharts} highcharts/yaxis/opposite/\n * Secondary Y axis opposite\n * @sample {highstock} stock/xaxis/opposite/\n * Y axis on left side\n *\n * @default {highcharts|highstock|highmaps} false\n * @default {gantt} true\n */\n opposite: false,\n /**\n * In an ordinal axis, the points are equally spaced in the chart\n * regardless of the actual time or x distance between them. This means\n * that missing data periods (e.g. nights or weekends for a stock chart)\n * will not take up space in the chart.\n * Having `ordinal: false` will show any gaps created by the `gapSize`\n * setting proportionate to their duration.\n *\n * In stock charts the X axis is ordinal by default, unless\n * the boost module is used and at least one of the series' data length\n * exceeds the [boostThreshold](#series.line.boostThreshold).\n *\n * For an ordinal axis, `minPadding` and `maxPadding` are ignored. Use\n * [overscroll](#xAxis.overscroll) instead.\n *\n * @sample {highstock} stock/xaxis/ordinal-true/\n * True by default\n * @sample {highstock} stock/xaxis/ordinal-false/\n * False\n *\n * @see [overscroll](#xAxis.overscroll)\n *\n * @type {boolean}\n * @default true\n * @since 1.1\n * @product highstock\n * @apioption xAxis.ordinal\n */\n /**\n * Additional range on the right side of the xAxis. Works similar to\n * `xAxis.maxPadding`, but value is set in milliseconds. Can be set for\n * both main `xAxis` and the navigator's `xAxis`.\n *\n * @sample {highstock} stock/xaxis/overscroll/\n * One minute overscroll with live data\n *\n * @type {number}\n * @default 0\n * @since 6.0.0\n * @product highstock\n * @apioption xAxis.overscroll\n */\n /**\n * Refers to the index in the [panes](#panes) array. Used for circular\n * gauges and polar charts. When the option is not set then first pane\n * will be used.\n *\n * @sample highcharts/demo/gauge-vu-meter\n * Two gauges with different center\n *\n * @type {number}\n * @product highcharts\n * @apioption xAxis.pane\n */\n /**\n * The zoomed range to display when only defining one or none of `min`\n * or `max`. For example, to show the latest month, a range of one month\n * can be set.\n *\n * @sample {highstock} stock/xaxis/range/\n * Setting a zoomed range when the rangeSelector is disabled\n *\n * @type {number}\n * @product highstock\n * @apioption xAxis.range\n */\n /**\n * Whether to reverse the axis so that the highest number is closest\n * to the origin. If the chart is inverted, the x axis is reversed by\n * default.\n *\n * @sample {highcharts} highcharts/yaxis/reversed/\n * Reversed Y axis\n * @sample {highstock} stock/xaxis/reversed/\n * Reversed Y axis\n *\n * @type {boolean}\n * @default undefined\n * @apioption xAxis.reversed\n */\n reversed: void 0,\n /**\n * This option determines how stacks should be ordered within a group.\n * For example reversed xAxis also reverses stacks, so first series\n * comes last in a group. To keep order like for non-reversed xAxis\n * enable this option.\n *\n * @sample {highcharts} highcharts/xaxis/reversedstacks/\n * Reversed stacks comparison\n * @sample {highstock} highcharts/xaxis/reversedstacks/\n * Reversed stacks comparison\n *\n * @since 6.1.1\n * @product highcharts highstock\n */\n reversedStacks: false,\n /**\n * An optional scrollbar to display on the X axis in response to\n * limiting the minimum and maximum of the axis values.\n *\n * In styled mode, all the presentational options for the scrollbar are\n * replaced by the classes `.highcharts-scrollbar-thumb`,\n * `.highcharts-scrollbar-arrow`, `.highcharts-scrollbar-button`,\n * `.highcharts-scrollbar-rifles` and `.highcharts-scrollbar-track`.\n *\n * @sample {highstock} stock/yaxis/heatmap-scrollbars/\n * Heatmap with both scrollbars\n *\n * @extends scrollbar\n * @since 4.2.6\n * @product highstock\n * @apioption xAxis.scrollbar\n */\n /**\n * Whether to show the axis line and title when the axis has no data.\n *\n * @sample {highcharts} highcharts/yaxis/showempty/\n * When clicking the legend to hide series, one axis preserves\n * line and title, the other doesn't\n * @sample {highstock} highcharts/yaxis/showempty/\n * When clicking the legend to hide series, one axis preserves\n * line and title, the other doesn't\n *\n * @since 1.1\n */\n showEmpty: true,\n /**\n * Whether to show the first tick label.\n *\n * @sample {highcharts} highcharts/xaxis/showfirstlabel-false/\n * Set to false on X axis\n * @sample {highstock} stock/xaxis/showfirstlabel/\n * Labels below plot lines on Y axis\n */\n showFirstLabel: true,\n /**\n * Whether to show the last tick label. Defaults to `true` on cartesian\n * charts, and `false` on polar charts.\n *\n * @sample {highcharts} highcharts/xaxis/showlastlabel-true/\n * Set to true on X axis\n * @sample {highstock} stock/xaxis/showfirstlabel/\n * Labels below plot lines on Y axis\n *\n * @type {boolean}\n * @default undefined\n * @product highcharts highstock gantt\n */\n showLastLabel: true,\n /**\n * A soft maximum for the axis. If the series data maximum is less than\n * this, the axis will stay at this maximum, but if the series data\n * maximum is higher, the axis will flex to show all data.\n *\n * @sample highcharts/yaxis/softmin-softmax/\n * Soft min and max\n *\n * @type {number}\n * @since 5.0.1\n * @product highcharts highstock gantt\n * @apioption xAxis.softMax\n */\n /**\n * A soft minimum for the axis. If the series data minimum is greater\n * than this, the axis will stay at this minimum, but if the series\n * data minimum is lower, the axis will flex to show all data.\n *\n * @sample highcharts/yaxis/softmin-softmax/\n * Soft min and max\n *\n * @type {number}\n * @since 5.0.1\n * @product highcharts highstock gantt\n * @apioption xAxis.softMin\n */\n /**\n * For datetime axes, this decides where to put the tick between weeks.\n * 0 = Sunday, 1 = Monday.\n *\n * @sample {highcharts} highcharts/xaxis/startofweek-monday/\n * Monday by default\n * @sample {highcharts} highcharts/xaxis/startofweek-sunday/\n * Sunday\n * @sample {highstock} stock/xaxis/startofweek-1\n * Monday by default\n * @sample {highstock} stock/xaxis/startofweek-0\n * Sunday\n *\n * @product highcharts highstock gantt\n */\n startOfWeek: 1,\n /**\n * Whether to force the axis to start on a tick. Use this option with\n * the `minPadding` option to control the axis start.\n *\n * @productdesc {highstock}\n * In Highcharts Stock, `startOnTick` is always `false` when\n * the navigator is enabled, to prevent jumpy scrolling.\n *\n * @sample {highcharts} highcharts/xaxis/startontick-false/\n * False by default\n * @sample {highcharts} highcharts/xaxis/startontick-true/\n * True\n *\n * @since 1.2.0\n */\n startOnTick: false,\n /**\n * The amount of ticks to draw on the axis. This opens up for aligning\n * the ticks of multiple charts or panes within a chart. This option\n * overrides the `tickPixelInterval` option.\n *\n * This option only has an effect on linear axes. Datetime, logarithmic\n * or category axes are not affected.\n *\n * @sample {highcharts} highcharts/yaxis/tickamount/\n * 8 ticks on Y axis\n * @sample {highstock} highcharts/yaxis/tickamount/\n * 8 ticks on Y axis\n *\n * @type {number}\n * @since 4.1.0\n * @product highcharts highstock gantt\n * @apioption xAxis.tickAmount\n */\n /**\n * The interval of the tick marks in axis units. When `undefined`, the\n * tick interval is computed to approximately follow the\n * [tickPixelInterval](#xAxis.tickPixelInterval) on linear and datetime\n * axes. On categorized axes, a `undefined` tickInterval will default to\n * 1, one category. Note that datetime axes are based on milliseconds,\n * so for example an interval of one day is expressed as\n * `24 * 3600 * 1000`.\n *\n * On logarithmic axes, the tickInterval is based on powers, so a\n * tickInterval of 1 means one tick on each of 0.1, 1, 10, 100 etc. A\n * tickInterval of 2 means a tick of 0.1, 10, 1000 etc. A tickInterval\n * of 0.2 puts a tick on 0.1, 0.2, 0.4, 0.6, 0.8, 1, 2, 4, 6, 8, 10, 20,\n * 40 etc.\n *\n *\n * If the tickInterval is too dense for labels to be drawn, Highcharts\n * may remove ticks.\n *\n * If the chart has multiple axes, the [alignTicks](#chart.alignTicks)\n * option may interfere with the `tickInterval` setting.\n *\n * @see [tickPixelInterval](#xAxis.tickPixelInterval)\n * @see [tickPositions](#xAxis.tickPositions)\n * @see [tickPositioner](#xAxis.tickPositioner)\n *\n * @sample {highcharts} highcharts/xaxis/tickinterval-5/\n * Tick interval of 5 on a linear axis\n * @sample {highstock} stock/xaxis/tickinterval/\n * Tick interval of 0.01 on Y axis\n *\n * @type {number}\n * @apioption xAxis.tickInterval\n */\n /**\n * The pixel length of the main tick marks.\n *\n * @sample {highcharts} highcharts/xaxis/ticklength/\n * 20 px tick length on the X axis\n * @sample {highstock} stock/xaxis/ticks/\n * Formatted ticks on X axis\n */\n tickLength: 10,\n /**\n * If tickInterval is `null` this option sets the approximate pixel\n * interval of the tick marks. Not applicable to categorized axis.\n *\n * The tick interval is also influenced by the [minTickInterval](\n * #xAxis.minTickInterval) option, that, by default prevents ticks from\n * being denser than the data points.\n *\n * @see [tickInterval](#xAxis.tickInterval)\n * @see [tickPositioner](#xAxis.tickPositioner)\n * @see [tickPositions](#xAxis.tickPositions)\n *\n * @sample {highcharts} highcharts/xaxis/tickpixelinterval-50/\n * 50 px on X axis\n * @sample {highstock} stock/xaxis/tickpixelinterval/\n * 200 px on X axis\n */\n tickPixelInterval: 100,\n /**\n * For categorized axes only. If `on` the tick mark is placed in the\n * center of the category, if `between` the tick mark is placed between\n * categories. The default is `between` if the `tickInterval` is 1, else\n * `on`.\n *\n * @sample {highcharts} highcharts/xaxis/tickmarkplacement-between/\n * \"between\" by default\n * @sample {highcharts} highcharts/xaxis/tickmarkplacement-on/\n * \"on\"\n *\n * @product highcharts gantt\n * @validvalue [\"on\", \"between\"]\n */\n tickmarkPlacement: 'between',\n /**\n * The position of the major tick marks relative to the axis line.\n * Can be one of `inside` and `outside`.\n *\n * @sample {highcharts} highcharts/xaxis/tickposition-outside/\n * \"outside\" by default\n * @sample {highcharts} highcharts/xaxis/tickposition-inside/\n * \"inside\"\n * @sample {highstock} stock/xaxis/ticks/\n * Formatted ticks on X axis\n *\n * @validvalue [\"inside\", \"outside\"]\n */\n tickPosition: 'outside',\n /**\n * A callback function returning array defining where the ticks are\n * laid out on the axis. This overrides the default behaviour of\n * [tickPixelInterval](#xAxis.tickPixelInterval) and [tickInterval](\n * #xAxis.tickInterval). The automatic tick positions are accessible\n * through `this.tickPositions` and can be modified by the callback.\n *\n * @see [tickPositions](#xAxis.tickPositions)\n *\n * @sample {highcharts} highcharts/xaxis/tickpositions-tickpositioner/\n * Demo of tickPositions and tickPositioner\n * @sample {highstock} highcharts/xaxis/tickpositions-tickpositioner/\n * Demo of tickPositions and tickPositioner\n *\n * @type {Highcharts.AxisTickPositionerCallbackFunction}\n * @apioption xAxis.tickPositioner\n */\n /**\n * An array defining where the ticks are laid out on the axis. This\n * overrides the default behaviour of [tickPixelInterval](\n * #xAxis.tickPixelInterval) and [tickInterval](#xAxis.tickInterval).\n *\n * @see [tickPositioner](#xAxis.tickPositioner)\n *\n * @sample {highcharts} highcharts/xaxis/tickpositions-tickpositioner/\n * Demo of tickPositions and tickPositioner\n * @sample {highstock} highcharts/xaxis/tickpositions-tickpositioner/\n * Demo of tickPositions and tickPositioner\n *\n * @type {Array}\n * @apioption xAxis.tickPositions\n */\n /**\n * The pixel width of the major tick marks. Defaults to 0 on category\n * axes, otherwise 1.\n *\n * In styled mode, the stroke width is given in the `.highcharts-tick`\n * class, but in order for the element to be generated on category axes,\n * the option must be explicitly set to 1.\n *\n * @sample {highcharts} highcharts/xaxis/tickwidth/\n * 10 px width\n * @sample {highcharts} highcharts/css/axis-grid/\n * Styled mode\n * @sample {highstock} stock/xaxis/ticks/\n * Formatted ticks on X axis\n * @sample {highstock} highcharts/css/axis-grid/\n * Styled mode\n *\n * @type {undefined|number}\n * @default {highstock} 1\n * @default {highmaps} 0\n * @apioption xAxis.tickWidth\n */\n /**\n * The axis title, showing next to the axis line.\n *\n * @productdesc {highmaps}\n * In Highmaps, the axis is hidden by default, but adding an axis title\n * is still possible. X axis and Y axis titles will appear at the bottom\n * and left by default.\n */\n title: {\n /**\n * Alignment of the title relative to the axis values. Possible\n * values are \"low\", \"middle\" or \"high\".\n *\n * @sample {highcharts} highcharts/xaxis/title-align-low/\n * \"low\"\n * @sample {highcharts} highcharts/xaxis/title-align-center/\n * \"middle\" by default\n * @sample {highcharts} highcharts/xaxis/title-align-high/\n * \"high\"\n * @sample {highcharts} highcharts/yaxis/title-offset/\n * Place the Y axis title on top of the axis\n * @sample {highstock} stock/xaxis/title-align/\n * Aligned to \"high\" value\n *\n * @type {Highcharts.AxisTitleAlignValue}\n */\n align: 'middle',\n /**\n * Deprecated. Set the `text` to `undefined` to disable the title.\n *\n * @deprecated\n * @type {boolean}\n * @product highcharts\n * @apioption xAxis.title.enabled\n */\n /**\n * The pixel distance between the axis labels or line and the title.\n * Defaults to 0 for horizontal axes, 10 for vertical\n *\n * @sample {highcharts} highcharts/xaxis/title-margin/\n * Y axis title margin of 60\n *\n * @type {number}\n * @apioption xAxis.title.margin\n */\n /**\n * The distance of the axis title from the axis line. By default,\n * this distance is computed from the offset width of the labels,\n * the labels' distance from the axis and the title's margin.\n * However when the offset option is set, it overrides all this.\n *\n * @sample {highcharts} highcharts/yaxis/title-offset/\n * Place the axis title on top of the axis\n * @sample {highstock} highcharts/yaxis/title-offset/\n * Place the axis title on top of the Y axis\n *\n * @type {number}\n * @since 2.2.0\n * @apioption xAxis.title.offset\n */\n /**\n * Whether to reserve space for the title when laying out the axis.\n *\n * @type {boolean}\n * @default true\n * @since 5.0.11\n * @product highcharts highstock gantt\n * @apioption xAxis.title.reserveSpace\n */\n /**\n * The rotation of the text in degrees. 0 is horizontal, 270 is\n * vertical reading from bottom to top.\n *\n * @sample {highcharts} highcharts/yaxis/title-offset/\n * Horizontal\n */\n rotation: 0,\n /**\n * The actual text of the axis title. It can contain basic HTML tags\n * like `b`, `i` and `span` with style.\n *\n * @sample {highcharts} highcharts/xaxis/title-text/\n * Custom HTML\n * @sample {highstock} stock/xaxis/title-text/\n * Titles for both axes\n *\n * @type {string|null}\n * @apioption xAxis.title.text\n */\n /**\n * Alignment of the text, can be `\"left\"`, `\"right\"` or `\"center\"`.\n * Default alignment depends on the\n * [title.align](xAxis.title.align):\n *\n * Horizontal axes:\n * - for `align` = `\"low\"`, `textAlign` is set to `left`\n * - for `align` = `\"middle\"`, `textAlign` is set to `center`\n * - for `align` = `\"high\"`, `textAlign` is set to `right`\n *\n * Vertical axes:\n * - for `align` = `\"low\"` and `opposite` = `true`, `textAlign` is\n * set to `right`\n * - for `align` = `\"low\"` and `opposite` = `false`, `textAlign` is\n * set to `left`\n * - for `align` = `\"middle\"`, `textAlign` is set to `center`\n * - for `align` = `\"high\"` and `opposite` = `true` `textAlign` is\n * set to `left`\n * - for `align` = `\"high\"` and `opposite` = `false` `textAlign` is\n * set to `right`\n *\n * @type {Highcharts.AlignValue}\n * @apioption xAxis.title.textAlign\n */\n /**\n * Whether to [use HTML](https://www.highcharts.com/docs/chart-concepts/labels-and-string-formatting#html)\n * to render the axis title.\n *\n * @product highcharts highstock gantt\n */\n useHTML: false,\n /**\n * Horizontal pixel offset of the title position.\n *\n * @since 4.1.6\n * @product highcharts highstock gantt\n */\n x: 0,\n /**\n * Vertical pixel offset of the title position.\n *\n * @product highcharts highstock gantt\n */\n y: 0,\n /**\n * CSS styles for the title. If the title text is longer than the\n * axis length, it will wrap to multiple lines by default. This can\n * be customized by setting `textOverflow: 'ellipsis'`, by\n * setting a specific `width` or by setting `whiteSpace: 'nowrap'`.\n *\n * In styled mode, the stroke width is given in the\n * `.highcharts-axis-title` class.\n *\n * @sample {highcharts} highcharts/xaxis/title-style/\n * Red\n * @sample {highcharts} highcharts/css/axis/\n * Styled mode\n *\n * @type {Highcharts.CSSObject}\n */\n style: {\n /** @internal */\n color: \"#666666\" /* Palette.neutralColor60 */\n }\n },\n /**\n * The type of axis. Can be one of `linear`, `logarithmic`, `datetime`\n * or `category`. In a datetime axis, the numbers are given in\n * milliseconds, and tick marks are placed on appropriate values like\n * full hours or days. In a category axis, the\n * [point names](#series.line.data.name) of the chart's series are used\n * for categories, if not a [categories](#xAxis.categories) array is\n * defined.\n *\n * @sample {highcharts} highcharts/xaxis/type-linear/\n * Linear\n * @sample {highcharts} highcharts/yaxis/type-log/\n * Logarithmic\n * @sample {highcharts} highcharts/yaxis/type-log-minorgrid/\n * Logarithmic with minor grid lines\n * @sample {highcharts} highcharts/xaxis/type-log-both/\n * Logarithmic on two axes\n * @sample {highcharts} highcharts/yaxis/type-log-negative/\n * Logarithmic with extension to emulate negative values\n *\n * @type {Highcharts.AxisTypeValue}\n * @product highcharts gantt\n */\n type: 'linear',\n /**\n * If there are multiple axes on the same side of the chart, the pixel\n * margin between the axes. Defaults to 0 on vertical axes, 15 on\n * horizontal axes.\n *\n * @type {number}\n * @since 7.0.3\n * @apioption xAxis.margin\n */\n /**\n * Applies only when the axis `type` is `category`. When `uniqueNames`\n * is true, points are placed on the X axis according to their names.\n * If the same point name is repeated in the same or another series,\n * the point is placed on the same X position as other points of the\n * same name. When `uniqueNames` is false, the points are laid out in\n * increasing X positions regardless of their names, and the X axis\n * category will take the name of the last point in each position.\n *\n * @sample {highcharts} highcharts/xaxis/uniquenames-true/\n * True by default\n * @sample {highcharts} highcharts/xaxis/uniquenames-false/\n * False\n *\n * @since 4.2.7\n * @product highcharts gantt\n */\n uniqueNames: true,\n /**\n * Datetime axis only. An array determining what time intervals the\n * ticks are allowed to fall on. Each array item is an array where the\n * first value is the time unit and the second value another array of\n * allowed multiples.\n *\n * Defaults to:\n * ```js\n * units: [[\n * 'millisecond', // unit name\n * [1, 2, 5, 10, 20, 25, 50, 100, 200, 500] // allowed multiples\n * ], [\n * 'second',\n * [1, 2, 5, 10, 15, 30]\n * ], [\n * 'minute',\n * [1, 2, 5, 10, 15, 30]\n * ], [\n * 'hour',\n * [1, 2, 3, 4, 6, 8, 12]\n * ], [\n * 'day',\n * [1, 2]\n * ], [\n * 'week',\n * [1, 2]\n * ], [\n * 'month',\n * [1, 2, 3, 4, 6]\n * ], [\n * 'year',\n * null\n * ]]\n * ```\n *\n * @type {Array|null)>>}\n * @product highcharts highstock gantt\n * @apioption xAxis.units\n */\n /**\n * Whether axis, including axis title, line, ticks and labels, should\n * be visible.\n *\n * @since 4.1.9\n * @product highcharts highstock gantt\n */\n visible: true,\n /**\n * Color of the minor, secondary grid lines.\n *\n * In styled mode, the stroke width is given in the\n * `.highcharts-minor-grid-line` class.\n *\n * @sample {highcharts} highcharts/yaxis/minorgridlinecolor/\n * Bright grey lines from Y axis\n * @sample {highcharts|highstock} highcharts/css/axis-grid/\n * Styled mode\n * @sample {highstock} stock/xaxis/minorgridlinecolor/\n * Bright grey lines from Y axis\n *\n * @type {Highcharts.ColorType}\n * @default #f2f2f2\n */\n minorGridLineColor: \"#f2f2f2\" /* Palette.neutralColor5 */,\n /**\n * Width of the minor, secondary grid lines.\n *\n * In styled mode, the stroke width is given in the\n * `.highcharts-grid-line` class.\n *\n * @sample {highcharts} highcharts/yaxis/minorgridlinewidth/\n * 2px lines from Y axis\n * @sample {highcharts|highstock} highcharts/css/axis-grid/\n * Styled mode\n * @sample {highstock} stock/xaxis/minorgridlinewidth/\n * 2px lines from Y axis\n */\n minorGridLineWidth: 1,\n /**\n * Color for the minor tick marks.\n *\n * @sample {highcharts} highcharts/yaxis/minortickcolor/\n * Black tick marks on Y axis\n * @sample {highstock} stock/xaxis/minorticks/\n * Black tick marks on Y axis\n *\n * @type {Highcharts.ColorType}\n * @default #999999\n */\n minorTickColor: \"#999999\" /* Palette.neutralColor40 */,\n /**\n * The color of the line marking the axis itself.\n *\n * In styled mode, the line stroke is given in the\n * `.highcharts-axis-line` or `.highcharts-xaxis-line` class.\n *\n * @productdesc {highmaps}\n * In Highmaps, the axis line is hidden by default, because the axis is\n * not visible by default.\n *\n * @sample {highcharts} highcharts/yaxis/linecolor/\n * A red line on Y axis\n * @sample {highcharts|highstock} highcharts/css/axis/\n * Axes in styled mode\n * @sample {highstock} stock/xaxis/linecolor/\n * A red line on X axis\n *\n * @type {Highcharts.ColorType}\n * @default #ccd6eb\n */\n lineColor: \"#ccd6eb\" /* Palette.highlightColor20 */,\n /**\n * The width of the line marking the axis itself.\n *\n * In styled mode, the stroke width is given in the\n * `.highcharts-axis-line` or `.highcharts-xaxis-line` class.\n *\n * @sample {highcharts} highcharts/yaxis/linecolor/\n * A 1px line on Y axis\n * @sample {highcharts|highstock} highcharts/css/axis/\n * Axes in styled mode\n * @sample {highstock} stock/xaxis/linewidth/\n * A 2px line on X axis\n *\n * @default {highcharts|highstock} 1\n * @default {highmaps} 0\n */\n lineWidth: 1,\n /**\n * Color of the grid lines extending the ticks across the plot area.\n *\n * In styled mode, the stroke is given in the `.highcharts-grid-line`\n * class.\n *\n * @productdesc {highmaps}\n * In Highmaps, the grid lines are hidden by default.\n *\n * @sample {highcharts} highcharts/yaxis/gridlinecolor/\n * Green lines\n * @sample {highcharts|highstock} highcharts/css/axis-grid/\n * Styled mode\n * @sample {highstock} stock/xaxis/gridlinecolor/\n * Green lines\n *\n * @type {Highcharts.ColorType}\n * @default #e6e6e6\n */\n gridLineColor: \"#e6e6e6\" /* Palette.neutralColor10 */,\n /**\n * The width of the grid lines extending the ticks across the plot area.\n * Defaults to 1 on the Y axis and 0 on the X axis, except for 3d\n * charts.\n *\n * In styled mode, the stroke width is given in the\n * `.highcharts-grid-line` class.\n *\n * @sample {highcharts} highcharts/yaxis/gridlinewidth/\n * 2px lines\n * @sample {highcharts|highstock} highcharts/css/axis-grid/\n * Styled mode\n * @sample {highstock} stock/xaxis/gridlinewidth/\n * 2px lines\n *\n * @type {number}\n * @apioption xAxis.gridLineWidth\n */\n gridLineWidth: void 0,\n /**\n * The height as the vertical axis. If it's a number, it is\n * interpreted as pixels.\n *\n * Since Highcharts 2: If it's a percentage string, it is interpreted\n * as percentages of the total plot height.\n *\n * @type {number|string}\n * @product highcharts highstock\n * @apioption xAxis.height\n */\n /**\n * The width as the horizontal axis. If it's a number, it is interpreted\n * as pixels.\n *\n * Since Highcharts v5.0.13: If it's a percentage string, it is\n * interpreted as percentages of the total plot width.\n *\n * @type {number|string}\n * @product highcharts highstock\n * @apioption xAxis.width\n */\n /**\n * Color for the main tick marks.\n *\n * In styled mode, the stroke is given in the `.highcharts-tick`\n * class.\n *\n * @sample {highcharts} highcharts/xaxis/tickcolor/\n * Red ticks on X axis\n * @sample {highcharts|highstock} highcharts/css/axis-grid/\n * Styled mode\n * @sample {highstock} stock/xaxis/ticks/\n * Formatted ticks on X axis\n *\n * @type {Highcharts.ColorType}\n * @default #ccd6eb\n */\n tickColor: \"#ccd6eb\" /* Palette.highlightColor20 */\n // tickWidth: 1\n };\n /**\n * The Y axis or value axis. Normally this is the vertical axis,\n * though if the chart is inverted this is the horizontal axis.\n * In case of multiple axes, the yAxis node is an array of\n * configuration objects.\n *\n * See [the Axis object](/class-reference/Highcharts.Axis) for programmatic\n * access to the axis.\n *\n * @type {*|Array<*>}\n * @extends xAxis\n * @excluding currentDateIndicator,ordinal,overscroll\n * @optionparent yAxis\n */\n AxisDefaults.defaultYAxisOptions = {\n /**\n * The type of axis. Can be one of `linear`, `logarithmic`, `datetime`,\n * `category` or `treegrid`. Defaults to `treegrid` for Gantt charts,\n * `linear` for other chart types.\n *\n * In a datetime axis, the numbers are given in milliseconds, and tick\n * marks are placed on appropriate values, like full hours or days. In a\n * category or treegrid axis, the [point names](#series.line.data.name)\n * of the chart's series are used for categories, if a\n * [categories](#xAxis.categories) array is not defined.\n *\n * @sample {highcharts} highcharts/yaxis/type-log-minorgrid/\n * Logarithmic with minor grid lines\n * @sample {highcharts} highcharts/yaxis/type-log-negative/\n * Logarithmic with extension to emulate negative values\n * @sample {gantt} gantt/treegrid-axis/demo\n * Treegrid axis\n *\n * @type {Highcharts.AxisTypeValue}\n * @default {highcharts} linear\n * @default {gantt} treegrid\n * @product highcharts gantt\n * @apioption yAxis.type\n */\n /**\n * The height of the Y axis. If it's a number, it is interpreted as\n * pixels.\n *\n * Since Highcharts 2: If it's a percentage string, it is interpreted as\n * percentages of the total plot height.\n *\n * @see [yAxis.top](#yAxis.top)\n *\n * @sample {highstock} stock/demo/candlestick-and-volume/\n * Percentage height panes\n *\n * @type {number|string}\n * @product highcharts highstock\n * @apioption yAxis.height\n */\n /**\n * Solid gauge only. Unless [stops](#yAxis.stops) are set, the color\n * to represent the maximum value of the Y axis.\n *\n * @sample {highcharts} highcharts/yaxis/mincolor-maxcolor/\n * Min and max colors\n *\n * @type {Highcharts.ColorType}\n * @default #003399\n * @since 4.0\n * @product highcharts\n * @apioption yAxis.maxColor\n */\n /**\n * Solid gauge only. Unless [stops](#yAxis.stops) are set, the color\n * to represent the minimum value of the Y axis.\n *\n * @sample {highcharts} highcharts/yaxis/mincolor-maxcolor/\n * Min and max color\n *\n * @type {Highcharts.ColorType}\n * @default #e6ebf5\n * @since 4.0\n * @product highcharts\n * @apioption yAxis.minColor\n */\n /**\n * Whether to reverse the axis so that the highest number is closest\n * to the origin.\n *\n * @sample {highcharts} highcharts/yaxis/reversed/\n * Reversed Y axis\n * @sample {highstock} stock/xaxis/reversed/\n * Reversed Y axis\n *\n * @type {boolean}\n * @default {highcharts} false\n * @default {highstock} false\n * @default {highmaps} true\n * @default {gantt} true\n * @apioption yAxis.reversed\n */\n /**\n * If `true`, the first series in a stack will be drawn on top in a\n * positive, non-reversed Y axis. If `false`, the first series is in\n * the base of the stack.\n *\n * @sample {highcharts} highcharts/yaxis/reversedstacks-false/\n * Non-reversed stacks\n * @sample {highstock} highcharts/yaxis/reversedstacks-false/\n * Non-reversed stacks\n *\n * @type {boolean}\n * @default true\n * @since 3.0.10\n * @product highcharts highstock\n * @apioption yAxis.reversedStacks\n */\n reversedStacks: true,\n /**\n * Solid gauge series only. Color stops for the solid gauge. Use this\n * in cases where a linear gradient between a `minColor` and `maxColor`\n * is not sufficient. The stops is an array of tuples, where the first\n * item is a float between 0 and 1 assigning the relative position in\n * the gradient, and the second item is the color.\n *\n * For solid gauges, the Y axis also inherits the concept of\n * [data classes](https://api.highcharts.com/highmaps#colorAxis.dataClasses)\n * from the Highmaps color axis.\n *\n * @sample {highcharts} highcharts/demo/gauge-solid/\n * Gauge with stops\n *\n * @see [minColor](#yAxis.minColor)\n * @see [maxColor](#yAxis.maxColor)\n *\n * @type {Array>}\n * @since 4.0\n * @product highcharts\n * @apioption yAxis.stops\n */\n /**\n * The pixel width of the major tick marks.\n *\n * @sample {highcharts} highcharts/xaxis/tickwidth/ 10 px width\n * @sample {highstock} stock/xaxis/ticks/ Formatted ticks on X axis\n *\n * @type {number}\n * @default 0\n * @product highcharts highstock gantt\n * @apioption yAxis.tickWidth\n */\n /**\n * Whether to force the axis to end on a tick. Use this option with\n * the `maxPadding` option to control the axis end.\n *\n * This option is always disabled, when panning type is\n * either `y` or `xy`.\n *\n * @see [type](#chart.panning.type)\n *\n *\n * @sample {highcharts} highcharts/yaxis/endontick/\n * True by default\n * @sample {highcharts} highcharts/yaxis/endontick-false/\n * False\n * @sample {highstock} stock/demo/basic-line/\n * True by default\n * @sample {highstock} stock/xaxis/endontick/\n * False for Y axis\n *\n * @since 1.2.0\n */\n endOnTick: true,\n /**\n * Padding of the max value relative to the length of the axis. A\n * padding of 0.05 will make a 100px axis 5px longer. This is useful\n * when you don't want the highest data value to appear on the edge\n * of the plot area. When the axis' `max` option is set or a max extreme\n * is set using `axis.setExtremes()`, the maxPadding will be ignored.\n *\n * Also the `softThreshold` option takes precedence over `maxPadding`,\n * so if the data is tangent to the threshold, `maxPadding` may not\n * apply unless `softThreshold` is set to false.\n *\n * @sample {highcharts} highcharts/yaxis/maxpadding-02/\n * Max padding of 0.2\n * @sample {highstock} stock/xaxis/minpadding-maxpadding/\n * Greater min- and maxPadding\n *\n * @since 1.2.0\n * @product highcharts highstock gantt\n */\n maxPadding: 0.05,\n /**\n * Padding of the min value relative to the length of the axis. A\n * padding of 0.05 will make a 100px axis 5px longer. This is useful\n * when you don't want the lowest data value to appear on the edge\n * of the plot area. When the axis' `min` option is set or a max extreme\n * is set using `axis.setExtremes()`, the maxPadding will be ignored.\n *\n * Also the `softThreshold` option takes precedence over `minPadding`,\n * so if the data is tangent to the threshold, `minPadding` may not\n * apply unless `softThreshold` is set to false.\n *\n * @sample {highcharts} highcharts/yaxis/minpadding/\n * Min padding of 0.2\n * @sample {highstock} stock/xaxis/minpadding-maxpadding/\n * Greater min- and maxPadding\n *\n * @since 1.2.0\n * @product highcharts highstock gantt\n */\n minPadding: 0.05,\n /**\n * @productdesc {highstock}\n * In Highcharts Stock 1.x, the Y axis was placed\n * on the left side by default.\n *\n * @sample {highcharts} highcharts/yaxis/opposite/\n * Secondary Y axis opposite\n * @sample {highstock} stock/xaxis/opposite/\n * Y axis on left side\n *\n * @type {boolean}\n * @default {highstock} true\n * @default {highcharts} false\n * @product highstock highcharts gantt\n * @apioption yAxis.opposite\n */\n /**\n * @see [tickInterval](#xAxis.tickInterval)\n * @see [tickPositioner](#xAxis.tickPositioner)\n * @see [tickPositions](#xAxis.tickPositions)\n */\n tickPixelInterval: 72,\n /**\n * Whether to show the last tick label.\n *\n * @productdesc {highcharts|gantt}\n * Defaults to `true` on cartesian charts, and `false` on polar charts.\n *\n * @productdesc {highstock}\n * Defaults to `true` for categorized yAxis and `false` for other types\n * of yAxis.\n *\n * @default undefined\n */\n showLastLabel: true,\n /**\n * @extends xAxis.labels\n */\n labels: {\n /**\n * Angular gauges and solid gauges only.\n * The label's pixel distance from the perimeter of the plot area.\n *\n * Since v7.1.2: If it's a percentage string, it is interpreted the\n * same as [series.radius](#plotOptions.gauge.radius), so label can be\n * aligned under the gauge's shape.\n *\n * @sample {highcharts} highcharts/yaxis/labels-distance/\n * Labels centered under the arc\n *\n * @type {number|string}\n * @default -25\n * @product highcharts\n * @apioption yAxis.labels.distance\n */\n /**\n * The y position offset of all labels relative to the tick\n * positions on the axis. For polar and radial axis consider the use\n * of the [distance](#yAxis.labels.distance) option.\n *\n * @sample {highcharts} highcharts/xaxis/labels-x/\n * Y axis labels placed on grid lines\n *\n * @type {number}\n * @default {highcharts} 3\n * @default {highstock} -2\n * @default {highmaps} 3\n * @apioption yAxis.labels.y\n */\n /**\n * What part of the string the given position is anchored to. Can\n * be one of `\"left\"`, `\"center\"` or `\"right\"`. The exact position\n * also depends on the `labels.x` setting.\n *\n * Angular gauges and solid gauges defaults to `\"center\"`.\n * Solid gauges with two labels have additional option `\"auto\"`\n * for automatic horizontal and vertical alignment.\n *\n * @see [yAxis.labels.distance](#yAxis.labels.distance)\n *\n * @sample {highcharts} highcharts/yaxis/labels-align-left/\n * Left\n * @sample {highcharts} highcharts/series-solidgauge/labels-auto-aligned/\n * Solid gauge labels auto aligned\n *\n * @type {Highcharts.AlignValue}\n * @default {highstock} right\n * @apioption yAxis.labels.align\n */\n /**\n * The x position offset of all labels relative to the tick\n * positions on the axis. Defaults to -15 for left axis, 15 for\n * right axis.\n *\n * @sample {highcharts} highcharts/xaxis/labels-x/\n * Y axis labels placed on grid lines\n */\n x: -8\n },\n /**\n * @productdesc {highmaps}\n * In Highmaps, the axis line is hidden by default, because the axis is\n * not visible by default.\n *\n * @type {Highcharts.ColorType}\n * @apioption yAxis.lineColor\n */\n /**\n * @sample {highcharts} highcharts/yaxis/max-200/\n * Y axis max of 200\n * @sample {highcharts} highcharts/yaxis/max-logarithmic/\n * Y axis max on logarithmic axis\n * @sample {highstock} stock/yaxis/min-max/\n * Fixed min and max on Y axis\n *\n * @apioption yAxis.max\n */\n /**\n * @sample {highcharts} highcharts/yaxis/min-startontick-false/\n * -50 with startOnTick to false\n * @sample {highcharts} highcharts/yaxis/min-startontick-true/\n * -50 with startOnTick true by default\n * @sample {highstock} stock/yaxis/min-max/\n * Fixed min and max on Y axis\n *\n * @apioption yAxis.min\n */\n /**\n * An optional scrollbar to display on the Y axis in response to\n * limiting the minimum an maximum of the axis values.\n *\n * In styled mode, all the presentational options for the scrollbar\n * are replaced by the classes `.highcharts-scrollbar-thumb`,\n * `.highcharts-scrollbar-arrow`, `.highcharts-scrollbar-button`,\n * `.highcharts-scrollbar-rifles` and `.highcharts-scrollbar-track`.\n *\n * @sample {highstock} stock/yaxis/scrollbar/\n * Scrollbar on the Y axis\n *\n * @extends scrollbar\n * @since 4.2.6\n * @product highstock\n * @excluding height\n * @apioption yAxis.scrollbar\n */\n /**\n * Enable the scrollbar on the Y axis.\n *\n * @sample {highstock} stock/yaxis/scrollbar/\n * Enabled on Y axis\n *\n * @type {boolean}\n * @default false\n * @since 4.2.6\n * @product highstock\n * @apioption yAxis.scrollbar.enabled\n */\n /**\n * Pixel margin between the scrollbar and the axis elements.\n *\n * @type {number}\n * @default 10\n * @since 4.2.6\n * @product highstock\n * @apioption yAxis.scrollbar.margin\n */\n /* eslint-disable highcharts/doclet-apioption-last */\n /**\n * Defines the position of the scrollbar. By default, it is positioned\n * on the opposite of the main axis (right side of the chart).\n * However, in the case of RTL languages could be set to `false`\n * which positions the scrollbar on the left.\n *\n * Works only for vertical axes.\n * This means yAxis in a non-inverted chart and xAxis in the inverted.\n *\n * @sample stock/yaxis/scrollbar-opposite/\n * A scrollbar not on the opposite side\n *\n * @type {boolean}\n * @default true\n * @since 9.3.0\n *\n * @apioption yAxis.scrollbar.opposite\n * @apioption xAxis.scrollbar.opposite\n *\n */\n /* eslint-enable highcharts/doclet-apioption-last */\n /**\n * Whether to show the scrollbar when it is fully zoomed out at max\n * range. Setting it to `false` on the Y axis makes the scrollbar stay\n * hidden until the user zooms in, like common in browsers.\n *\n * @type {boolean}\n * @default true\n * @since 4.2.6\n * @product highstock\n * @apioption yAxis.scrollbar.showFull\n */\n /**\n * The width of a vertical scrollbar or height of a horizontal\n * scrollbar. Defaults to 20 on touch devices.\n *\n * @type {number}\n * @default 14\n * @since 4.2.6\n * @product highstock\n * @apioption yAxis.scrollbar.size\n */\n /**\n * Z index of the scrollbar elements.\n *\n * @type {number}\n * @default 3\n * @since 4.2.6\n * @product highstock\n * @apioption yAxis.scrollbar.zIndex\n */\n /**\n * A soft maximum for the axis. If the series data maximum is less\n * than this, the axis will stay at this maximum, but if the series\n * data maximum is higher, the axis will flex to show all data.\n *\n * **Note**: The [series.softThreshold](\n * #plotOptions.series.softThreshold) option takes precedence over this\n * option.\n *\n * @sample highcharts/yaxis/softmin-softmax/\n * Soft min and max\n *\n * @type {number}\n * @since 5.0.1\n * @product highcharts highstock gantt\n * @apioption yAxis.softMax\n */\n /**\n * A soft minimum for the axis. If the series data minimum is greater\n * than this, the axis will stay at this minimum, but if the series\n * data minimum is lower, the axis will flex to show all data.\n *\n * **Note**: The [series.softThreshold](\n * #plotOptions.series.softThreshold) option takes precedence over this\n * option.\n *\n * @sample highcharts/yaxis/softmin-softmax/\n * Soft min and max\n *\n * @type {number}\n * @since 5.0.1\n * @product highcharts highstock gantt\n * @apioption yAxis.softMin\n */\n /**\n * Defines the horizontal alignment of the stack total label. Can be one\n * of `\"left\"`, `\"center\"` or `\"right\"`. The default value is calculated\n * at runtime and depends on orientation and whether the stack is\n * positive or negative.\n *\n * @sample {highcharts} highcharts/yaxis/stacklabels-align-left/\n * Aligned to the left\n * @sample {highcharts} highcharts/yaxis/stacklabels-align-center/\n * Aligned in center\n * @sample {highcharts} highcharts/yaxis/stacklabels-align-right/\n * Aligned to the right\n *\n * @type {Highcharts.AlignValue}\n * @since 2.1.5\n * @product highcharts\n * @apioption yAxis.stackLabels.align\n */\n /**\n * A format string for the data label. Available variables are the same\n * as for `formatter`.\n *\n * @type {string}\n * @default {total}\n * @since 3.0.2\n * @product highcharts highstock\n * @apioption yAxis.stackLabels.format\n */\n /**\n * Rotation of the labels in degrees.\n *\n * @sample {highcharts} highcharts/yaxis/stacklabels-rotation/\n * Labels rotated 45°\n *\n * @type {number}\n * @default 0\n * @since 2.1.5\n * @product highcharts\n * @apioption yAxis.stackLabels.rotation\n */\n /**\n * The text alignment for the label. While `align` determines where the\n * texts anchor point is placed with regards to the stack, `textAlign`\n * determines how the text is aligned against its anchor point. Possible\n * values are `\"left\"`, `\"center\"` and `\"right\"`. The default value is\n * calculated at runtime and depends on orientation and whether the\n * stack is positive or negative.\n *\n * @sample {highcharts} highcharts/yaxis/stacklabels-textalign-left/\n * Label in center position but text-aligned left\n *\n * @type {Highcharts.AlignValue}\n * @since 2.1.5\n * @product highcharts\n * @apioption yAxis.stackLabels.textAlign\n */\n /**\n * Whether to [use HTML](https://www.highcharts.com/docs/chart-concepts/labels-and-string-formatting#html)\n * to render the labels.\n *\n * @type {boolean}\n * @default false\n * @since 3.0\n * @product highcharts highstock\n * @apioption yAxis.stackLabels.useHTML\n */\n /**\n * Defines the vertical alignment of the stack total label. Can be one\n * of `\"top\"`, `\"middle\"` or `\"bottom\"`. The default value is calculated\n * at runtime and depends on orientation and whether the stack is\n * positive or negative.\n *\n * @sample {highcharts} highcharts/yaxis/stacklabels-verticalalign-top/\n * Vertically aligned top\n * @sample {highcharts} highcharts/yaxis/stacklabels-verticalalign-middle/\n * Vertically aligned middle\n * @sample {highcharts} highcharts/yaxis/stacklabels-verticalalign-bottom/\n * Vertically aligned bottom\n *\n * @type {Highcharts.VerticalAlignValue}\n * @since 2.1.5\n * @product highcharts\n * @apioption yAxis.stackLabels.verticalAlign\n */\n /**\n * The x position offset of the label relative to the left of the\n * stacked bar. The default value is calculated at runtime and depends\n * on orientation and whether the stack is positive or negative.\n *\n * @sample {highcharts} highcharts/yaxis/stacklabels-x/\n * Stack total labels with x offset\n *\n * @type {number}\n * @since 2.1.5\n * @product highcharts\n * @apioption yAxis.stackLabels.x\n */\n /**\n * The y position offset of the label relative to the tick position\n * on the axis. The default value is calculated at runtime and depends\n * on orientation and whether the stack is positive or negative.\n *\n * @sample {highcharts} highcharts/yaxis/stacklabels-y/\n * Stack total labels with y offset\n *\n * @type {number}\n * @since 2.1.5\n * @product highcharts\n * @apioption yAxis.stackLabels.y\n */\n /**\n * Whether to force the axis to start on a tick. Use this option with\n * the `maxPadding` option to control the axis start.\n *\n * This option is always disabled, when panning type is\n * either `y` or `xy`.\n *\n * @see [type](#chart.panning.type)\n *\n * @sample {highcharts} highcharts/xaxis/startontick-false/\n * False by default\n * @sample {highcharts} highcharts/xaxis/startontick-true/\n * True\n * @sample {highstock} stock/xaxis/endontick/\n * False for Y axis\n *\n * @since 1.2.0\n * @product highcharts highstock gantt\n */\n startOnTick: true,\n title: {\n /**\n * The pixel distance between the axis labels and the title.\n * Positive values are outside the axis line, negative are inside.\n *\n * @sample {highcharts} highcharts/xaxis/title-margin/\n * Y axis title margin of 60\n *\n * @type {number}\n * @default 40\n * @apioption yAxis.title.margin\n */\n /**\n * The rotation of the text in degrees. 0 is horizontal, 270 is\n * vertical reading from bottom to top.\n *\n * @sample {highcharts} highcharts/yaxis/title-offset/\n * Horizontal\n */\n rotation: 270,\n /**\n * The actual text of the axis title. Horizontal texts can contain\n * HTML, but rotated texts are painted using vector techniques and\n * must be clean text. The Y axis title is disabled by setting the\n * `text` option to `undefined`.\n *\n * @sample {highcharts} highcharts/xaxis/title-text/\n * Custom HTML\n *\n * @type {string|null}\n * @default {highcharts} Values\n * @default {highstock} undefined\n * @product highcharts highstock gantt\n */\n text: 'Values'\n },\n /**\n * The top position of the Y axis. If it's a number, it is interpreted\n * as pixel position relative to the chart.\n *\n * Since Highcharts 2: If it's a percentage string, it is interpreted as\n * percentages of the plot height, offset from plot area top.\n *\n * @see [yAxis.height](#yAxis.height)\n *\n * @sample {highstock} stock/demo/candlestick-and-volume/\n * Percentage height panes\n *\n * @type {number|string}\n * @product highcharts highstock\n * @apioption yAxis.top\n */\n /**\n * The stack labels show the total value for each bar in a stacked\n * column or bar chart. The label will be placed on top of positive\n * columns and below negative columns. In case of an inverted column\n * chart or a bar chart the label is placed to the right of positive\n * bars and to the left of negative bars.\n *\n * @product highcharts\n */\n stackLabels: {\n /**\n * Enable or disable the initial animation when a series is\n * displayed for the `stackLabels`. The animation can also be set as\n * a configuration object. Please note that this option only\n * applies to the initial animation.\n * For other animations, see [chart.animation](#chart.animation)\n * and the animation parameter under the API methods.\n * The following properties are supported:\n *\n * - `defer`: The animation delay time in milliseconds.\n *\n * @sample {highcharts} highcharts/plotoptions/animation-defer/\n * Animation defer settings\n * @type {boolean|Partial}\n * @since 8.2.0\n * @apioption yAxis.stackLabels.animation\n */\n animation: {},\n /**\n * The animation delay time in milliseconds.\n * Set to `0` renders stackLabel immediately.\n * As `undefined` inherits defer time from the [series.animation.defer](#plotOptions.series.animation.defer).\n *\n * @type {number}\n * @since 8.2.0\n * @apioption yAxis.stackLabels.animation.defer\n */\n /**\n * Allow the stack labels to overlap.\n *\n * @sample {highcharts} highcharts/yaxis/stacklabels-allowoverlap-false/\n * Default false\n *\n * @since 5.0.13\n * @product highcharts\n */\n allowOverlap: false,\n /**\n * The background color or gradient for the stack label.\n *\n * @sample {highcharts} highcharts/yaxis/stacklabels-box/\n * Stack labels box options\n * @type {Highcharts.ColorType}\n * @since 8.1.0\n * @apioption yAxis.stackLabels.backgroundColor\n */\n /**\n * The border color for the stack label. Defaults to `undefined`.\n *\n * @sample {highcharts} highcharts/yaxis/stacklabels-box/\n * Stack labels box options\n * @type {Highcharts.ColorType}\n * @since 8.1.0\n * @apioption yAxis.stackLabels.borderColor\n */\n /**\n * The border radius in pixels for the stack label.\n *\n * @sample {highcharts} highcharts/yaxis/stacklabels-box/\n * Stack labels box options\n * @type {number}\n * @default 0\n * @since 8.1.0\n * @apioption yAxis.stackLabels.borderRadius\n */\n /**\n * The border width in pixels for the stack label.\n *\n * @sample {highcharts} highcharts/yaxis/stacklabels-box/\n * Stack labels box options\n * @type {number}\n * @default 0\n * @since 8.1.0\n * @apioption yAxis.stackLabels.borderWidth\n */\n /**\n * Enable or disable the stack total labels.\n *\n * @sample {highcharts} highcharts/yaxis/stacklabels-enabled/\n * Enabled stack total labels\n * @sample {highcharts} highcharts/yaxis/stacklabels-enabled-waterfall/\n * Enabled stack labels in waterfall chart\n *\n * @since 2.1.5\n * @product highcharts\n */\n enabled: false,\n /**\n * Whether to hide stack labels that are outside the plot area.\n * By default, the stack label is moved\n * inside the plot area according to the\n * [overflow](/highcharts/#yAxis/stackLabels/overflow)\n * option.\n *\n * @type {boolean}\n * @since 7.1.3\n */\n crop: true,\n /**\n * How to handle stack total labels that flow outside the plot area.\n * The default is set to `\"justify\"`,\n * which aligns them inside the plot area.\n * For columns and bars, this means it will be moved inside the bar.\n * To display stack labels outside the plot area,\n * set `crop` to `false` and `overflow` to `\"allow\"`.\n *\n * @sample highcharts/yaxis/stacklabels-overflow/\n * Stack labels flows outside the plot area.\n *\n * @type {Highcharts.DataLabelsOverflowValue}\n * @since 7.1.3\n */\n overflow: 'justify',\n /* eslint-disable valid-jsdoc */\n /**\n * Callback JavaScript function to format the label. The value is\n * given by `this.total`.\n *\n * @sample {highcharts} highcharts/yaxis/stacklabels-formatter/\n * Added units to stack total value\n *\n * @type {Highcharts.FormatterCallbackFunction}\n * @since 2.1.5\n * @product highcharts\n */\n formatter: function () {\n var numberFormatter = this.axis.chart.numberFormatter;\n /* eslint-enable valid-jsdoc */\n return numberFormatter(this.total || 0, -1);\n },\n /**\n * CSS styles for the label.\n *\n * In styled mode, the styles are set in the\n * `.highcharts-stack-label` class.\n *\n * @sample {highcharts} highcharts/yaxis/stacklabels-style/\n * Red stack total labels\n *\n * @type {Highcharts.CSSObject}\n * @since 2.1.5\n * @product highcharts\n */\n style: {\n /** @internal */\n color: \"#000000\" /* Palette.neutralColor100 */,\n /** @internal */\n fontSize: '11px',\n /** @internal */\n fontWeight: 'bold',\n /** @internal */\n textOutline: '1px contrast'\n }\n },\n gridLineWidth: 1,\n lineWidth: 0\n // tickWidth: 0\n };\n /**\n * The Z axis or depth axis for 3D plots.\n *\n * See the [Axis class](/class-reference/Highcharts.Axis) for programmatic\n * access to the axis.\n *\n * @sample {highcharts} highcharts/3d/scatter-zaxis-categories/\n * Z-Axis with Categories\n * @sample {highcharts} highcharts/3d/scatter-zaxis-grid/\n * Z-Axis with styling\n *\n * @type {*|Array<*>}\n * @extends xAxis\n * @since 5.0.0\n * @product highcharts\n * @excluding breaks, crosshair, height, left, lineColor, lineWidth,\n * nameToX, showEmpty, top, width\n * @apioption zAxis\n */\n // This variable extends the defaultOptions for left axes.\n AxisDefaults.defaultLeftAxisOptions = {\n labels: {\n x: -15\n },\n title: {\n rotation: 270\n }\n };\n // This variable extends the defaultOptions for right axes.\n AxisDefaults.defaultRightAxisOptions = {\n labels: {\n x: 15\n },\n title: {\n rotation: 90\n }\n };\n // This variable extends the defaultOptions for bottom axes.\n AxisDefaults.defaultBottomAxisOptions = {\n labels: {\n autoRotation: [-45],\n x: 0\n // overflow: undefined,\n // staggerLines: null\n },\n margin: 15,\n title: {\n rotation: 0\n }\n };\n // This variable extends the defaultOptions for top axes.\n AxisDefaults.defaultTopAxisOptions = {\n labels: {\n autoRotation: [-45],\n x: 0\n // overflow: undefined\n // staggerLines: null\n },\n margin: 15,\n title: {\n rotation: 0\n }\n };\n })(AxisDefaults || (AxisDefaults = {}));\n /* *\n *\n * Default Export\n *\n * */\n\n return AxisDefaults;\n });\n _registerModule(_modules, 'Core/Foundation.js', [_modules['Core/Utilities.js']], function (U) {\n /* *\n *\n * (c) 2010-2021 Torstein Honsi\n *\n * License: www.highcharts.com/license\n *\n * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!\n *\n * */\n var addEvent = U.addEvent,\n isFunction = U.isFunction,\n objectEach = U.objectEach,\n removeEvent = U.removeEvent;\n /* *\n *\n * Class Namespace\n *\n * */\n var Foundation;\n (function (Foundation) {\n /* *\n *\n * Functions\n *\n * */\n /* eslint-disable valid-jsdoc */\n /**\n * Register event options. If an event handler is set on the options, it\n * should be subject to Chart.update, Axis.update and Series.update. This is\n * contrary to general handlers that are set directly using addEvent either\n * on the class or on the instance. #6538, #6943, #10861.\n * @private\n */\n function registerEventOptions(component, options) {\n // A lookup over those events that are added by _options_ (not\n // programmatically). These are updated through .update()\n component.eventOptions = component.eventOptions || {};\n // Register event listeners\n objectEach(options.events, function (event, eventType) {\n // If event does not exist, or is changed by the .update()\n // function\n if (component.eventOptions[eventType] !== event) {\n // Remove existing if set by option\n if (component.eventOptions[eventType]) {\n removeEvent(component, eventType, component.eventOptions[eventType]);\n delete component.eventOptions[eventType];\n }\n if (isFunction(event)) {\n component.eventOptions[eventType] = event;\n addEvent(component, eventType, event);\n }\n }\n });\n }\n Foundation.registerEventOptions = registerEventOptions;\n })(Foundation || (Foundation = {}));\n /* *\n *\n * Default Export\n *\n * */\n\n return Foundation;\n });\n _registerModule(_modules, 'Core/Axis/Tick.js', [_modules['Core/FormatUtilities.js'], _modules['Core/Globals.js'], _modules['Core/Utilities.js']], function (F, H, U) {\n /* *\n *\n * (c) 2010-2021 Torstein Honsi\n *\n * License: www.highcharts.com/license\n *\n * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!\n *\n * */\n var deg2rad = H.deg2rad;\n var clamp = U.clamp,\n correctFloat = U.correctFloat,\n defined = U.defined,\n destroyObjectProperties = U.destroyObjectProperties,\n extend = U.extend,\n fireEvent = U.fireEvent,\n isNumber = U.isNumber,\n merge = U.merge,\n objectEach = U.objectEach,\n pick = U.pick;\n /* *\n *\n * Class\n *\n * */\n /* eslint-disable no-invalid-this, valid-jsdoc */\n /**\n * The Tick class.\n *\n * @class\n * @name Highcharts.Tick\n *\n * @param {Highcharts.Axis} axis\n * The axis of the tick.\n *\n * @param {number} pos\n * The position of the tick on the axis in terms of axis values.\n *\n * @param {string} [type]\n * The type of tick, either 'minor' or an empty string\n *\n * @param {boolean} [noLabel=false]\n * Whether to disable the label or not. Defaults to false.\n *\n * @param {Object} [parameters]\n * Optional parameters for the tick.\n */\n var Tick = /** @class */ (function () {\n /* *\n *\n * Constructors\n *\n * */\n function Tick(axis, pos, type, noLabel, parameters) {\n this.isNew = true;\n this.isNewLabel = true;\n /**\n * The related axis of the tick.\n * @name Highcharts.Tick#axis\n * @type {Highcharts.Axis}\n */\n this.axis = axis;\n /**\n * The logical position of the tick on the axis in terms of axis values.\n * @name Highcharts.Tick#pos\n * @type {number}\n */\n this.pos = pos;\n /**\n * The tick type, which can be `\"minor\"`, or an empty string.\n * @name Highcharts.Tick#type\n * @type {string}\n */\n this.type = type || '';\n this.parameters = parameters || {};\n /**\n * The mark offset of the tick on the axis. Usually `undefined`, numeric\n * for grid axes.\n * @name Highcharts.Tick#tickmarkOffset\n * @type {number|undefined}\n */\n this.tickmarkOffset = this.parameters.tickmarkOffset;\n this.options = this.parameters.options;\n fireEvent(this, 'init');\n if (!type && !noLabel) {\n this.addLabel();\n }\n }\n /* *\n *\n * Functions\n *\n * */\n /**\n * Write the tick label.\n *\n * @private\n * @function Highcharts.Tick#addLabel\n */\n Tick.prototype.addLabel = function () {\n var tick = this,\n axis = tick.axis,\n options = axis.options,\n chart = axis.chart,\n categories = axis.categories,\n log = axis.logarithmic,\n names = axis.names,\n pos = tick.pos,\n labelOptions = pick(tick.options && tick.options.labels,\n options.labels),\n tickPositions = axis.tickPositions,\n isFirst = pos === tickPositions[0],\n isLast = pos === tickPositions[tickPositions.length - 1],\n animateLabels = (!labelOptions.step || labelOptions.step === 1) &&\n axis.tickInterval === 1,\n tickPositionInfo = tickPositions.info;\n var label = tick.label,\n dateTimeLabelFormat,\n dateTimeLabelFormats,\n i;\n // The context value\n var value = this.parameters.category || (categories ?\n pick(categories[pos],\n names[pos],\n pos) :\n pos);\n if (log && isNumber(value)) {\n value = correctFloat(log.lin2log(value));\n }\n // Set the datetime label format. If a higher rank is set for this\n // position, use that. If not, use the general format.\n if (axis.dateTime) {\n if (tickPositionInfo) {\n dateTimeLabelFormats = chart.time.resolveDTLFormat(options.dateTimeLabelFormats[(!options.grid &&\n tickPositionInfo.higherRanks[pos]) ||\n tickPositionInfo.unitName]);\n dateTimeLabelFormat = dateTimeLabelFormats.main;\n }\n else if (isNumber(value)) { // #1441\n dateTimeLabelFormat = axis.dateTime.getXDateFormat(value, options.dateTimeLabelFormats ||\n {});\n }\n }\n // set properties for access in render method\n /**\n * True if the tick is the first one on the axis.\n * @name Highcharts.Tick#isFirst\n * @readonly\n * @type {boolean|undefined}\n */\n tick.isFirst = isFirst;\n /**\n * True if the tick is the last one on the axis.\n * @name Highcharts.Tick#isLast\n * @readonly\n * @type {boolean|undefined}\n */\n tick.isLast = isLast;\n // Get the string\n var ctx = {\n axis: axis,\n chart: chart,\n dateTimeLabelFormat: dateTimeLabelFormat,\n isFirst: isFirst,\n isLast: isLast,\n pos: pos,\n tick: tick,\n tickPositionInfo: tickPositionInfo,\n value: value\n };\n // Fire an event that allows modifying the context for use in\n // `labels.format` and `labels.formatter`.\n fireEvent(this, 'labelFormat', ctx);\n // Label formatting. When `labels.format` is given, we first run the\n // defaultFormatter and append the result to the context as `text`.\n // Handy for adding prefix or suffix while keeping default number\n // formatting.\n var labelFormatter = function (ctx) {\n if (labelOptions.formatter) {\n return labelOptions.formatter.call(ctx,\n ctx);\n }\n if (labelOptions.format) {\n ctx.text = axis.defaultLabelFormatter.call(ctx, ctx);\n return F.format(labelOptions.format, ctx, chart);\n }\n return axis.defaultLabelFormatter.call(ctx, ctx);\n };\n var str = labelFormatter.call(ctx,\n ctx);\n // Set up conditional formatting based on the format list if existing.\n var list = dateTimeLabelFormats && dateTimeLabelFormats.list;\n if (list) {\n tick.shortenLabel = function () {\n for (i = 0; i < list.length; i++) {\n extend(ctx, { dateTimeLabelFormat: list[i] });\n label.attr({\n text: labelFormatter.call(ctx, ctx)\n });\n if (label.getBBox().width <\n axis.getSlotWidth(tick) - 2 *\n labelOptions.padding) {\n return;\n }\n }\n label.attr({\n text: ''\n });\n };\n }\n else {\n // #15692\n tick.shortenLabel = void 0;\n }\n // Call only after first render\n if (animateLabels && axis._addedPlotLB) {\n tick.moveLabel(str, labelOptions);\n }\n // First call\n if (!defined(label) && !tick.movedLabel) {\n /**\n * The rendered text label of the tick.\n * @name Highcharts.Tick#label\n * @type {Highcharts.SVGElement|undefined}\n */\n tick.label = label = tick.createLabel({ x: 0, y: 0 }, str, labelOptions);\n // Base value to detect change for new calls to getBBox\n tick.rotation = 0;\n // update\n }\n else if (label && label.textStr !== str && !animateLabels) {\n // When resetting text, also reset the width if dynamically set\n // (#8809)\n if (label.textWidth &&\n !labelOptions.style.width &&\n !label.styles.width) {\n label.css({ width: null });\n }\n label.attr({ text: str });\n label.textPxLength = label.getBBox().width;\n }\n };\n /**\n * Render and return the label of the tick.\n *\n * @private\n * @function Highcharts.Tick#createLabel\n */\n Tick.prototype.createLabel = function (xy, str, labelOptions) {\n var axis = this.axis,\n chart = axis.chart,\n label = defined(str) && labelOptions.enabled ?\n chart.renderer\n .text(str,\n xy.x,\n xy.y,\n labelOptions.useHTML)\n .add(axis.labelGroup) :\n null;\n // Un-rotated length\n if (label) {\n // Without position absolute, IE export sometimes is wrong\n if (!chart.styledMode) {\n label.css(merge(labelOptions.style));\n }\n label.textPxLength = label.getBBox().width;\n }\n return label;\n };\n /**\n * Destructor for the tick prototype\n *\n * @private\n * @function Highcharts.Tick#destroy\n */\n Tick.prototype.destroy = function () {\n destroyObjectProperties(this, this.axis);\n };\n /**\n * Gets the x and y positions for ticks in terms of pixels.\n *\n * @private\n * @function Highcharts.Tick#getPosition\n *\n * @param {boolean} horiz\n * Whether the tick is on an horizontal axis or not.\n *\n * @param {number} tickPos\n * Position of the tick.\n *\n * @param {number} tickmarkOffset\n * Tickmark offset for all ticks.\n *\n * @param {boolean} [old]\n * Whether the axis has changed or not.\n *\n * @return {Highcharts.PositionObject}\n * The tick position.\n *\n * @emits Highcharts.Tick#event:afterGetPosition\n */\n Tick.prototype.getPosition = function (horiz, tickPos, tickmarkOffset, old) {\n var axis = this.axis,\n chart = axis.chart,\n cHeight = (old && chart.oldChartHeight) || chart.chartHeight,\n pos = {\n x: horiz ?\n correctFloat(axis.translate(tickPos + tickmarkOffset,\n void 0,\n void 0,\n old) +\n axis.transB) :\n (axis.left +\n axis.offset +\n (axis.opposite ?\n (((old && chart.oldChartWidth) ||\n chart.chartWidth) -\n axis.right -\n axis.left) :\n 0)),\n y: horiz ?\n (cHeight -\n axis.bottom +\n axis.offset -\n (axis.opposite ? axis.height : 0)) :\n correctFloat(cHeight -\n axis.translate(tickPos + tickmarkOffset,\n void 0,\n void 0,\n old) -\n axis.transB)\n };\n // Chrome workaround for #10516\n pos.y = clamp(pos.y, -1e5, 1e5);\n fireEvent(this, 'afterGetPosition', { pos: pos });\n return pos;\n };\n /**\n * Get the x, y position of the tick label\n * @private\n */\n Tick.prototype.getLabelPosition = function (x, y, label, horiz, labelOptions, tickmarkOffset, index, step) {\n var axis = this.axis,\n transA = axis.transA,\n reversed = ( // #7911\n axis.isLinked && axis.linkedParent ?\n axis.linkedParent.reversed :\n axis.reversed),\n staggerLines = axis.staggerLines,\n rotCorr = axis.tickRotCorr || { x: 0,\n y: 0 }, \n // Adjust for label alignment if we use reserveSpace: true (#5286)\n labelOffsetCorrection = (!horiz && !axis.reserveSpaceDefault ?\n -axis.labelOffset * (axis.labelAlign === 'center' ? 0.5 : 1) :\n 0),\n pos = {};\n var yOffset,\n line;\n if (axis.side === 0) {\n yOffset = label.rotation ? -8 : -label.getBBox().height;\n }\n else if (axis.side === 2) {\n yOffset = rotCorr.y + 8;\n }\n else {\n // #3140, #3140\n yOffset = Math.cos(label.rotation * deg2rad) *\n (rotCorr.y - label.getBBox(false, 0).height / 2);\n }\n if (defined(labelOptions.y)) {\n yOffset = axis.side === 0 && axis.horiz ?\n labelOptions.y + yOffset :\n labelOptions.y;\n }\n x = x +\n labelOptions.x +\n labelOffsetCorrection +\n rotCorr.x -\n (tickmarkOffset && horiz ?\n tickmarkOffset * transA * (reversed ? -1 : 1) :\n 0);\n y = y + yOffset - (tickmarkOffset && !horiz ?\n tickmarkOffset * transA * (reversed ? 1 : -1) : 0);\n // Correct for staggered labels\n if (staggerLines) {\n line = (index / (step || 1) % staggerLines);\n if (axis.opposite) {\n line = staggerLines - line - 1;\n }\n y += line * (axis.labelOffset / staggerLines);\n }\n pos.x = x;\n pos.y = Math.round(y);\n fireEvent(this, 'afterGetLabelPosition', { pos: pos, tickmarkOffset: tickmarkOffset, index: index });\n return pos;\n };\n /**\n * Get the offset height or width of the label\n *\n * @private\n * @function Highcharts.Tick#getLabelSize\n */\n Tick.prototype.getLabelSize = function () {\n return this.label ?\n this.label.getBBox()[this.axis.horiz ? 'height' : 'width'] :\n 0;\n };\n /**\n * Extendible method to return the path of the marker\n * @private\n */\n Tick.prototype.getMarkPath = function (x, y, tickLength, tickWidth, horiz, renderer) {\n return renderer.crispLine([[\n 'M',\n x,\n y\n ], [\n 'L',\n x + (horiz ? 0 : -tickLength),\n y + (horiz ? tickLength : 0)\n ]], tickWidth);\n };\n /**\n * Handle the label overflow by adjusting the labels to the left and right\n * edge, or hide them if they collide into the neighbour label.\n *\n * @private\n * @function Highcharts.Tick#handleOverflow\n */\n Tick.prototype.handleOverflow = function (xy) {\n var tick = this,\n axis = this.axis,\n labelOptions = axis.options.labels,\n pxPos = xy.x,\n chartWidth = axis.chart.chartWidth,\n spacing = axis.chart.spacing,\n leftBound = pick(axis.labelLeft,\n Math.min(axis.pos,\n spacing[3])),\n rightBound = pick(axis.labelRight,\n Math.max(!axis.isRadial ? axis.pos + axis.len : 0,\n chartWidth - spacing[1])),\n label = this.label,\n rotation = this.rotation,\n factor = {\n left: 0,\n center: 0.5,\n right: 1\n }[axis.labelAlign || label.attr('align')],\n labelWidth = label.getBBox().width,\n slotWidth = axis.getSlotWidth(tick),\n xCorrection = factor,\n css = {};\n var modifiedSlotWidth = slotWidth,\n goRight = 1,\n leftPos,\n rightPos,\n textWidth;\n // Check if the label overshoots the chart spacing box. If it does, move\n // it. If it now overshoots the slotWidth, add ellipsis.\n if (!rotation && labelOptions.overflow === 'justify') {\n leftPos = pxPos - factor * labelWidth;\n rightPos = pxPos + (1 - factor) * labelWidth;\n if (leftPos < leftBound) {\n modifiedSlotWidth =\n xy.x + modifiedSlotWidth * (1 - factor) - leftBound;\n }\n else if (rightPos > rightBound) {\n modifiedSlotWidth =\n rightBound - xy.x + modifiedSlotWidth * factor;\n goRight = -1;\n }\n modifiedSlotWidth = Math.min(slotWidth, modifiedSlotWidth); // #4177\n if (modifiedSlotWidth < slotWidth && axis.labelAlign === 'center') {\n xy.x += (goRight *\n (slotWidth -\n modifiedSlotWidth -\n xCorrection * (slotWidth - Math.min(labelWidth, modifiedSlotWidth))));\n }\n // If the label width exceeds the available space, set a text width\n // to be picked up below. Also, if a width has been set before, we\n // need to set a new one because the reported labelWidth will be\n // limited by the box (#3938).\n if (labelWidth > modifiedSlotWidth ||\n (axis.autoRotation && (label.styles || {}).width)) {\n textWidth = modifiedSlotWidth;\n }\n // Add ellipsis to prevent rotated labels to be clipped against the edge\n // of the chart\n }\n else if (rotation < 0 &&\n pxPos - factor * labelWidth < leftBound) {\n textWidth = Math.round(pxPos / Math.cos(rotation * deg2rad) - leftBound);\n }\n else if (rotation > 0 &&\n pxPos + factor * labelWidth > rightBound) {\n textWidth = Math.round((chartWidth - pxPos) /\n Math.cos(rotation * deg2rad));\n }\n if (textWidth) {\n if (tick.shortenLabel) {\n tick.shortenLabel();\n }\n else {\n css.width = Math.floor(textWidth) + 'px';\n if (!(labelOptions.style || {}).textOverflow) {\n css.textOverflow = 'ellipsis';\n }\n label.css(css);\n }\n }\n };\n /**\n * Try to replace the label if the same one already exists.\n *\n * @private\n * @function Highcharts.Tick#moveLabel\n */\n Tick.prototype.moveLabel = function (str, labelOptions) {\n var tick = this,\n label = tick.label,\n axis = tick.axis,\n reversed = axis.reversed;\n var moved = false,\n labelPos,\n xPos,\n yPos;\n if (label && label.textStr === str) {\n tick.movedLabel = label;\n moved = true;\n delete tick.label;\n }\n else { // Find a label with the same string\n objectEach(axis.ticks, function (currentTick) {\n if (!moved &&\n !currentTick.isNew &&\n currentTick !== tick &&\n currentTick.label &&\n currentTick.label.textStr === str) {\n tick.movedLabel = currentTick.label;\n moved = true;\n currentTick.labelPos = tick.movedLabel.xy;\n delete currentTick.label;\n }\n });\n }\n // Create new label if the actual one is moved\n if (!moved && (tick.labelPos || label)) {\n labelPos = tick.labelPos || label.xy;\n xPos = axis.horiz ?\n (reversed ? 0 : axis.width + axis.left) : labelPos.x;\n yPos = axis.horiz ?\n labelPos.y : (reversed ? (axis.width + axis.left) : 0);\n tick.movedLabel = tick.createLabel({ x: xPos, y: yPos }, str, labelOptions);\n if (tick.movedLabel) {\n tick.movedLabel.attr({ opacity: 0 });\n }\n }\n };\n /**\n * Put everything in place\n *\n * @private\n * @param {number} index\n *\n * @param {boolean} [old]\n * Use old coordinates to prepare an animation into new position\n *\n * @param {number} [opacity]\n */\n Tick.prototype.render = function (index, old, opacity) {\n var tick = this,\n axis = tick.axis,\n horiz = axis.horiz,\n pos = tick.pos,\n tickmarkOffset = pick(tick.tickmarkOffset,\n axis.tickmarkOffset),\n xy = tick.getPosition(horiz,\n pos,\n tickmarkOffset,\n old),\n x = xy.x,\n y = xy.y,\n reverseCrisp = ((horiz && x === axis.pos + axis.len) ||\n (!horiz && y === axis.pos)) ? -1 : 1; // #1480, #1687\n var labelOpacity = pick(opacity,\n tick.label && tick.label.newOpacity, // #15528\n 1);\n opacity = pick(opacity, 1);\n this.isActive = true;\n // Create the grid line\n this.renderGridLine(old, opacity, reverseCrisp);\n // create the tick mark\n this.renderMark(xy, opacity, reverseCrisp);\n // the label is created on init - now move it into place\n this.renderLabel(xy, old, labelOpacity, index);\n tick.isNew = false;\n fireEvent(this, 'afterRender');\n };\n /**\n * Renders the gridLine.\n *\n * @private\n * @function Highcharts.Tick#renderGridLine\n * @param {boolean} old Whether or not the tick is old\n * @param {number} opacity The opacity of the grid line\n * @param {number} reverseCrisp Modifier for avoiding overlapping 1 or -1\n */\n Tick.prototype.renderGridLine = function (old, opacity, reverseCrisp) {\n var tick = this,\n axis = tick.axis,\n options = axis.options,\n attribs = {},\n pos = tick.pos,\n type = tick.type,\n tickmarkOffset = pick(tick.tickmarkOffset,\n axis.tickmarkOffset),\n renderer = axis.chart.renderer;\n var gridLine = tick.gridLine,\n gridLinePath,\n gridLineWidth = options.gridLineWidth,\n gridLineColor = options.gridLineColor,\n dashStyle = options.gridLineDashStyle;\n if (tick.type === 'minor') {\n gridLineWidth = options.minorGridLineWidth;\n gridLineColor = options.minorGridLineColor;\n dashStyle = options.minorGridLineDashStyle;\n }\n if (!gridLine) {\n if (!axis.chart.styledMode) {\n attribs.stroke = gridLineColor;\n attribs['stroke-width'] = gridLineWidth || 0;\n attribs.dashstyle = dashStyle;\n }\n if (!type) {\n attribs.zIndex = 1;\n }\n if (old) {\n opacity = 0;\n }\n /**\n * The rendered grid line of the tick.\n * @name Highcharts.Tick#gridLine\n * @type {Highcharts.SVGElement|undefined}\n */\n tick.gridLine = gridLine = renderer.path()\n .attr(attribs)\n .addClass('highcharts-' + (type ? type + '-' : '') + 'grid-line')\n .add(axis.gridGroup);\n }\n if (gridLine) {\n gridLinePath = axis.getPlotLinePath({\n value: pos + tickmarkOffset,\n lineWidth: gridLine.strokeWidth() * reverseCrisp,\n force: 'pass',\n old: old,\n acrossPanes: false // #18025\n });\n // If the parameter 'old' is set, the current call will be followed\n // by another call, therefore do not do any animations this time\n if (gridLinePath) {\n gridLine[old || tick.isNew ? 'attr' : 'animate']({\n d: gridLinePath,\n opacity: opacity\n });\n }\n }\n };\n /**\n * Renders the tick mark.\n *\n * @private\n * @function Highcharts.Tick#renderMark\n * @param {Highcharts.PositionObject} xy The position vector of the mark\n * @param {number} opacity The opacity of the mark\n * @param {number} reverseCrisp Modifier for avoiding overlapping 1 or -1\n */\n Tick.prototype.renderMark = function (xy, opacity, reverseCrisp) {\n var tick = this, axis = tick.axis, options = axis.options, renderer = axis.chart.renderer, type = tick.type, tickSize = axis.tickSize(type ? type + 'Tick' : 'tick'), x = xy.x, y = xy.y, tickWidth = pick(options[type !== 'minor' ? 'tickWidth' : 'minorTickWidth'], !type && axis.isXAxis ? 1 : 0), // X axis defaults to 1\n tickColor = options[type !== 'minor' ? 'tickColor' : 'minorTickColor'];\n var mark = tick.mark;\n var isNewMark = !mark;\n if (tickSize) {\n // negate the length\n if (axis.opposite) {\n tickSize[0] = -tickSize[0];\n }\n // First time, create it\n if (!mark) {\n /**\n * The rendered mark of the tick.\n * @name Highcharts.Tick#mark\n * @type {Highcharts.SVGElement|undefined}\n */\n tick.mark = mark = renderer.path()\n .addClass('highcharts-' + (type ? type + '-' : '') + 'tick')\n .add(axis.axisGroup);\n if (!axis.chart.styledMode) {\n mark.attr({\n stroke: tickColor,\n 'stroke-width': tickWidth\n });\n }\n }\n mark[isNewMark ? 'attr' : 'animate']({\n d: tick.getMarkPath(x, y, tickSize[0], mark.strokeWidth() * reverseCrisp, axis.horiz, renderer),\n opacity: opacity\n });\n }\n };\n /**\n * Renders the tick label.\n * Note: The label should already be created in init(), so it should only\n * have to be moved into place.\n *\n * @private\n * @function Highcharts.Tick#renderLabel\n * @param {Highcharts.PositionObject} xy The position vector of the label\n * @param {boolean} old Whether or not the tick is old\n * @param {number} opacity The opacity of the label\n * @param {number} index The index of the tick\n */\n Tick.prototype.renderLabel = function (xy, old, opacity, index) {\n var tick = this,\n axis = tick.axis,\n horiz = axis.horiz,\n options = axis.options,\n label = tick.label,\n labelOptions = options.labels,\n step = labelOptions.step,\n tickmarkOffset = pick(tick.tickmarkOffset,\n axis.tickmarkOffset),\n x = xy.x,\n y = xy.y;\n var show = true;\n if (label && isNumber(x)) {\n label.xy = xy = tick.getLabelPosition(x, y, label, horiz, labelOptions, tickmarkOffset, index, step);\n // Apply show first and show last. If the tick is both first and\n // last, it is a single centered tick, in which case we show the\n // label anyway (#2100).\n if ((tick.isFirst &&\n !tick.isLast &&\n !options.showFirstLabel) ||\n (tick.isLast &&\n !tick.isFirst &&\n !options.showLastLabel)) {\n show = false;\n // Handle label overflow and show or hide accordingly\n }\n else if (horiz &&\n !labelOptions.step &&\n !labelOptions.rotation &&\n !old &&\n opacity !== 0) {\n tick.handleOverflow(xy);\n }\n // apply step\n if (step && index % step) {\n // show those indices dividable by step\n show = false;\n }\n // Set the new position, and show or hide\n if (show && isNumber(xy.y)) {\n xy.opacity = opacity;\n label[tick.isNewLabel ? 'attr' : 'animate'](xy).show(true);\n tick.isNewLabel = false;\n }\n else {\n label.hide(); // #1338, #15863\n tick.isNewLabel = true;\n }\n }\n };\n /**\n * Replace labels with the moved ones to perform animation. Additionally\n * destroy unused labels.\n *\n * @private\n * @function Highcharts.Tick#replaceMovedLabel\n */\n Tick.prototype.replaceMovedLabel = function () {\n var tick = this,\n label = tick.label,\n axis = tick.axis,\n reversed = axis.reversed;\n var x,\n y;\n // Animate and destroy\n if (label && !tick.isNew) {\n x = axis.horiz ? (reversed ? axis.left : axis.width + axis.left) : label.xy.x;\n y = axis.horiz ?\n label.xy.y :\n (reversed ? axis.width + axis.top : axis.top);\n label.animate({ x: x, y: y, opacity: 0 }, void 0, label.destroy);\n delete tick.label;\n }\n axis.isDirty = true;\n tick.label = tick.movedLabel;\n delete tick.movedLabel;\n };\n return Tick;\n }());\n /* *\n *\n * Default Export\n *\n * */\n /* *\n *\n * API Declarations\n *\n * */\n /**\n * Optional parameters for the tick.\n * @private\n * @interface Highcharts.TickParametersObject\n */ /**\n * Set category for the tick.\n * @name Highcharts.TickParametersObject#category\n * @type {string|undefined}\n */ /**\n * @name Highcharts.TickParametersObject#options\n * @type {Highcharts.Dictionary|undefined}\n */ /**\n * Set tickmarkOffset for the tick.\n * @name Highcharts.TickParametersObject#tickmarkOffset\n * @type {number|undefined}\n */\n /**\n * Additonal time tick information.\n *\n * @interface Highcharts.TimeTicksInfoObject\n * @extends Highcharts.TimeNormalizedObject\n */ /**\n * @name Highcharts.TimeTicksInfoObject#higherRanks\n * @type {Array}\n */ /**\n * @name Highcharts.TimeTicksInfoObject#totalRange\n * @type {number}\n */\n (''); // keeps doclets above in JS file\n\n return Tick;\n });\n _registerModule(_modules, 'Core/Axis/Axis.js', [_modules['Core/Animation/AnimationUtilities.js'], _modules['Core/Axis/AxisDefaults.js'], _modules['Core/Color/Color.js'], _modules['Core/Defaults.js'], _modules['Core/Foundation.js'], _modules['Core/Globals.js'], _modules['Core/Axis/Tick.js'], _modules['Core/Utilities.js']], function (A, AxisDefaults, Color, D, F, H, Tick, U) {\n /* *\n *\n * (c) 2010-2021 Torstein Honsi\n *\n * License: www.highcharts.com/license\n *\n * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!\n *\n * */\n var animObject = A.animObject;\n var defaultOptions = D.defaultOptions;\n var registerEventOptions = F.registerEventOptions;\n var deg2rad = H.deg2rad;\n var arrayMax = U.arrayMax,\n arrayMin = U.arrayMin,\n clamp = U.clamp,\n correctFloat = U.correctFloat,\n defined = U.defined,\n destroyObjectProperties = U.destroyObjectProperties,\n erase = U.erase,\n error = U.error,\n extend = U.extend,\n fireEvent = U.fireEvent,\n isArray = U.isArray,\n isNumber = U.isNumber,\n isString = U.isString,\n merge = U.merge,\n normalizeTickInterval = U.normalizeTickInterval,\n objectEach = U.objectEach,\n pick = U.pick,\n relativeLength = U.relativeLength,\n removeEvent = U.removeEvent,\n splat = U.splat,\n syncTimeout = U.syncTimeout;\n var getNormalizedTickInterval = function (axis,\n tickInterval) { return normalizeTickInterval(tickInterval,\n void 0,\n void 0,\n pick(axis.options.allowDecimals, \n // If the tick interval is greather than 0.5, avoid decimals, as\n // linear axes are often used to render discrete values (#3363). If\n // a tick amount is set, allow decimals by default, as it increases\n // the chances for a good fit.\n tickInterval < 0.5 || axis.tickAmount !== void 0), !!axis.tickAmount); };\n /* *\n *\n * Class\n *\n * */\n /**\n * Create a new axis object. Called internally when instanciating a new chart or\n * adding axes by {@link Highcharts.Chart#addAxis}.\n *\n * A chart can have from 0 axes (pie chart) to multiples. In a normal, single\n * series cartesian chart, there is one X axis and one Y axis.\n *\n * The X axis or axes are referenced by {@link Highcharts.Chart.xAxis}, which is\n * an array of Axis objects. If there is only one axis, it can be referenced\n * through `chart.xAxis[0]`, and multiple axes have increasing indices. The same\n * pattern goes for Y axes.\n *\n * If you need to get the axes from a series object, use the `series.xAxis` and\n * `series.yAxis` properties. These are not arrays, as one series can only be\n * associated to one X and one Y axis.\n *\n * A third way to reference the axis programmatically is by `id`. Add an `id` in\n * the axis configuration options, and get the axis by\n * {@link Highcharts.Chart#get}.\n *\n * Configuration options for the axes are given in options.xAxis and\n * options.yAxis.\n *\n * @class\n * @name Highcharts.Axis\n *\n * @param {Highcharts.Chart} chart\n * The Chart instance to apply the axis on.\n *\n * @param {Highcharts.AxisOptions} userOptions\n * Axis options.\n */\n var Axis = /** @class */ (function () {\n /* *\n *\n * Constructors\n *\n * */\n function Axis(chart, userOptions) {\n this.alternateBands = void 0;\n this.bottom = void 0;\n this.chart = void 0;\n this.closestPointRange = void 0;\n this.coll = void 0;\n this.eventOptions = void 0;\n this.hasNames = void 0;\n this.hasVisibleSeries = void 0;\n this.height = void 0;\n this.isLinked = void 0;\n this.labelEdge = void 0; // @todo\n this.labelFormatter = void 0;\n this.left = void 0;\n this.len = void 0;\n this.max = void 0;\n this.maxLabelLength = void 0;\n this.min = void 0;\n this.minorTickInterval = void 0;\n this.minorTicks = void 0;\n this.minPixelPadding = void 0;\n this.names = void 0;\n this.offset = void 0;\n this.options = void 0;\n this.overlap = void 0;\n this.paddedTicks = void 0;\n this.plotLinesAndBands = void 0;\n this.plotLinesAndBandsGroups = void 0;\n this.pointRange = void 0;\n this.pointRangePadding = void 0;\n this.pos = void 0;\n this.positiveValuesOnly = void 0;\n this.right = void 0;\n this.series = void 0;\n this.side = void 0;\n this.tickAmount = void 0;\n this.tickInterval = void 0;\n this.tickmarkOffset = void 0;\n this.tickPositions = void 0;\n this.tickRotCorr = void 0;\n this.ticks = void 0;\n this.top = void 0;\n this.transA = void 0;\n this.transB = void 0;\n this.translationSlope = void 0;\n this.userOptions = void 0;\n this.visible = void 0;\n this.width = void 0;\n this.zoomEnabled = void 0;\n this.init(chart, userOptions);\n }\n /* *\n *\n * Functions\n *\n * */\n /**\n * Overrideable function to initialize the axis.\n *\n * @see {@link Axis}\n *\n * @function Highcharts.Axis#init\n *\n * @param {Highcharts.Chart} chart\n * The Chart instance to apply the axis on.\n *\n * @param {AxisOptions} userOptions\n * Axis options.\n *\n * @emits Highcharts.Axis#event:afterInit\n * @emits Highcharts.Axis#event:init\n */\n Axis.prototype.init = function (chart, userOptions) {\n var isXAxis = userOptions.isX,\n axis = this;\n /**\n * The Chart that the axis belongs to.\n *\n * @name Highcharts.Axis#chart\n * @type {Highcharts.Chart}\n */\n axis.chart = chart;\n /**\n * Whether the axis is horizontal.\n *\n * @name Highcharts.Axis#horiz\n * @type {boolean|undefined}\n */\n axis.horiz = chart.inverted && !axis.isZAxis ? !isXAxis : isXAxis;\n /**\n * Whether the axis is the x-axis.\n *\n * @name Highcharts.Axis#isXAxis\n * @type {boolean|undefined}\n */\n axis.isXAxis = isXAxis;\n /**\n * The collection where the axis belongs, for example `xAxis`, `yAxis`\n * or `colorAxis`. Corresponds to properties on Chart, for example\n * {@link Chart.xAxis}.\n *\n * @name Highcharts.Axis#coll\n * @type {string}\n */\n axis.coll = axis.coll || (isXAxis ? 'xAxis' : 'yAxis');\n fireEvent(this, 'init', { userOptions: userOptions });\n // Needed in setOptions\n axis.opposite = pick(userOptions.opposite, axis.opposite);\n /**\n * The side on which the axis is rendered. 0 is top, 1 is right, 2\n * is bottom and 3 is left.\n *\n * @name Highcharts.Axis#side\n * @type {number}\n */\n axis.side = pick(userOptions.side, axis.side, (axis.horiz ?\n (axis.opposite ? 0 : 2) : // top : bottom\n (axis.opposite ? 1 : 3)) // right : left\n );\n /**\n * Current options for the axis after merge of defaults and user's\n * options.\n *\n * @name Highcharts.Axis#options\n * @type {Highcharts.AxisOptions}\n */\n axis.setOptions(userOptions);\n var options = this.options,\n labelsOptions = options.labels,\n type = options.type;\n /**\n * User's options for this axis without defaults.\n *\n * @name Highcharts.Axis#userOptions\n * @type {Highcharts.AxisOptions}\n */\n axis.userOptions = userOptions;\n axis.minPixelPadding = 0;\n /**\n * Whether the axis is reversed. Based on the `axis.reversed`,\n * option, but inverted charts have reversed xAxis by default.\n *\n * @name Highcharts.Axis#reversed\n * @type {boolean}\n */\n axis.reversed = pick(options.reversed, axis.reversed);\n axis.visible = options.visible;\n axis.zoomEnabled = options.zoomEnabled;\n // Initial categories\n axis.hasNames =\n type === 'category' || options.categories === true;\n /**\n * If categories are present for the axis, names are used instead of\n * numbers for that axis.\n *\n * Since Highcharts 3.0, categories can also be extracted by giving each\n * point a name and setting axis type to `category`. However, if you\n * have multiple series, best practice remains defining the `categories`\n * array.\n *\n * @see [xAxis.categories](/highcharts/xAxis.categories)\n *\n * @name Highcharts.Axis#categories\n * @type {Array}\n * @readonly\n */\n axis.categories = options.categories || (axis.hasNames ? [] : void 0);\n if (!axis.names) { // Preserve on update (#3830)\n axis.names = [];\n axis.names.keys = {};\n }\n // Placeholder for plotlines and plotbands groups\n axis.plotLinesAndBandsGroups = {};\n // Shorthand types\n axis.positiveValuesOnly = !!axis.logarithmic;\n // Flag, if axis is linked to another axis\n axis.isLinked = defined(options.linkedTo);\n /**\n * List of major ticks mapped by postition on axis.\n *\n * @see {@link Highcharts.Tick}\n *\n * @name Highcharts.Axis#ticks\n * @type {Highcharts.Dictionary}\n */\n axis.ticks = {};\n axis.labelEdge = [];\n /**\n * List of minor ticks mapped by position on the axis.\n *\n * @see {@link Highcharts.Tick}\n *\n * @name Highcharts.Axis#minorTicks\n * @type {Highcharts.Dictionary}\n */\n axis.minorTicks = {};\n // List of plotLines/Bands\n axis.plotLinesAndBands = [];\n // Alternate bands\n axis.alternateBands = {};\n // Axis metrics\n axis.len = 0;\n axis.minRange = axis.userMinRange = options.minRange || options.maxZoom;\n axis.range = options.range;\n axis.offset = options.offset || 0;\n /**\n * The maximum value of the axis. In a logarithmic axis, this is the\n * logarithm of the real value, and the real value can be obtained from\n * {@link Axis#getExtremes}.\n *\n * @name Highcharts.Axis#max\n * @type {number|null}\n */\n axis.max = null;\n /**\n * The minimum value of the axis. In a logarithmic axis, this is the\n * logarithm of the real value, and the real value can be obtained from\n * {@link Axis#getExtremes}.\n *\n * @name Highcharts.Axis#min\n * @type {number|null}\n */\n axis.min = null;\n /**\n * The processed crosshair options.\n *\n * @name Highcharts.Axis#crosshair\n * @type {boolean|Highcharts.AxisCrosshairOptions}\n */\n var crosshair = pick(options.crosshair,\n splat(chart.options.tooltip.crosshairs)[isXAxis ? 0 : 1]);\n axis.crosshair = crosshair === true ? {} : crosshair;\n // Register. Don't add it again on Axis.update().\n if (chart.axes.indexOf(axis) === -1) { //\n if (isXAxis) { // #2713\n chart.axes.splice(chart.xAxis.length, 0, axis);\n }\n else {\n chart.axes.push(axis);\n }\n chart[axis.coll].push(axis);\n }\n /**\n * All series associated to the axis.\n *\n * @name Highcharts.Axis#series\n * @type {Array}\n */\n axis.series = axis.series || []; // populated by Series\n // Reversed axis\n if (chart.inverted &&\n !axis.isZAxis &&\n isXAxis &&\n typeof axis.reversed === 'undefined') {\n axis.reversed = true;\n }\n axis.labelRotation = isNumber(labelsOptions.rotation) ?\n labelsOptions.rotation :\n void 0;\n // Register event listeners\n registerEventOptions(axis, options);\n fireEvent(this, 'afterInit');\n };\n /**\n * Merge and set options.\n *\n * @private\n * @function Highcharts.Axis#setOptions\n *\n * @param {Highcharts.AxisOptions} userOptions\n * Axis options.\n *\n * @emits Highcharts.Axis#event:afterSetOptions\n */\n Axis.prototype.setOptions = function (userOptions) {\n this.options = merge(AxisDefaults.defaultXAxisOptions, (this.coll === 'yAxis') && AxisDefaults.defaultYAxisOptions, [\n AxisDefaults.defaultTopAxisOptions,\n AxisDefaults.defaultRightAxisOptions,\n AxisDefaults.defaultBottomAxisOptions,\n AxisDefaults.defaultLeftAxisOptions\n ][this.side], merge(\n // if set in setOptions (#1053):\n defaultOptions[this.coll], userOptions));\n fireEvent(this, 'afterSetOptions', { userOptions: userOptions });\n };\n /**\n * The default label formatter. The context is a special config object for\n * the label. In apps, use the\n * [labels.formatter](https://api.highcharts.com/highcharts/xAxis.labels.formatter)\n * instead, except when a modification is needed.\n *\n * @function Highcharts.Axis#defaultLabelFormatter\n *\n * @param {Highcharts.AxisLabelsFormatterContextObject} this\n * Formatter context of axis label.\n *\n * @param {Highcharts.AxisLabelsFormatterContextObject} [ctx]\n * Formatter context of axis label.\n *\n * @return {string}\n * The formatted label content.\n */\n Axis.prototype.defaultLabelFormatter = function (ctx) {\n var axis = this.axis,\n chart = this.chart,\n numberFormatter = chart.numberFormatter,\n value = isNumber(this.value) ? this.value : NaN,\n time = axis.chart.time,\n categories = axis.categories,\n dateTimeLabelFormat = this.dateTimeLabelFormat,\n lang = defaultOptions.lang,\n numericSymbols = lang.numericSymbols,\n numSymMagnitude = lang.numericSymbolMagnitude || 1000, \n // make sure the same symbol is added for all labels on a linear\n // axis\n numericSymbolDetector = axis.logarithmic ?\n Math.abs(value) :\n axis.tickInterval;\n var i = numericSymbols && numericSymbols.length,\n multi,\n ret;\n if (categories) {\n ret = \"\".concat(this.value);\n }\n else if (dateTimeLabelFormat) { // datetime axis\n ret = time.dateFormat(dateTimeLabelFormat, value);\n }\n else if (i && numericSymbolDetector >= 1000) {\n // Decide whether we should add a numeric symbol like k (thousands)\n // or M (millions). If we are to enable this in tooltip or other\n // places as well, we can move this logic to the numberFormatter and\n // enable it by a parameter.\n while (i-- && typeof ret === 'undefined') {\n multi = Math.pow(numSymMagnitude, i + 1);\n if (\n // Only accept a numeric symbol when the distance is more\n // than a full unit. So for example if the symbol is k, we\n // don't accept numbers like 0.5k.\n numericSymbolDetector >= multi &&\n // Accept one decimal before the symbol. Accepts 0.5k but\n // not 0.25k. How does this work with the previous?\n (value * 10) % multi === 0 &&\n numericSymbols[i] !== null &&\n value !== 0) { // #5480\n ret = numberFormatter(value / multi, -1) + numericSymbols[i];\n }\n }\n }\n if (typeof ret === 'undefined') {\n if (Math.abs(value) >= 10000) { // add thousands separators\n ret = numberFormatter(value, -1);\n }\n else { // small numbers\n ret = numberFormatter(value, -1, void 0, ''); // #2466\n }\n }\n return ret;\n };\n /**\n * Get the minimum and maximum for the series of each axis. The function\n * analyzes the axis series and updates `this.dataMin` and `this.dataMax`.\n *\n * @private\n * @function Highcharts.Axis#getSeriesExtremes\n *\n * @emits Highcharts.Axis#event:afterGetSeriesExtremes\n * @emits Highcharts.Axis#event:getSeriesExtremes\n */\n Axis.prototype.getSeriesExtremes = function () {\n var axis = this,\n chart = axis.chart;\n var xExtremes;\n fireEvent(this, 'getSeriesExtremes', null, function () {\n axis.hasVisibleSeries = false;\n // Reset properties in case we're redrawing (#3353)\n axis.dataMin = axis.dataMax = axis.threshold = null;\n axis.softThreshold = !axis.isXAxis;\n // Loop through this axis' series\n axis.series.forEach(function (series) {\n if (series.visible ||\n !chart.options.chart.ignoreHiddenSeries) {\n var seriesOptions = series.options;\n var xData = void 0,\n threshold = seriesOptions.threshold,\n seriesDataMin = void 0,\n seriesDataMax = void 0;\n axis.hasVisibleSeries = true;\n // Validate threshold in logarithmic axes\n if (axis.positiveValuesOnly && threshold <= 0) {\n threshold = null;\n }\n // Get dataMin and dataMax for X axes\n if (axis.isXAxis) {\n xData = series.xData;\n if (xData.length) {\n xData = axis.logarithmic ?\n xData.filter(axis.validatePositiveValue) :\n xData;\n xExtremes = series.getXExtremes(xData);\n // If xData contains values which is not numbers,\n // then filter them out. To prevent performance hit,\n // we only do this after we have already found\n // seriesDataMin because in most cases all data is\n // valid. #5234.\n seriesDataMin = xExtremes.min;\n seriesDataMax = xExtremes.max;\n if (!isNumber(seriesDataMin) &&\n // #5010:\n !(seriesDataMin instanceof Date)) {\n xData = xData.filter(isNumber);\n xExtremes = series.getXExtremes(xData);\n // Do it again with valid data\n seriesDataMin = xExtremes.min;\n seriesDataMax = xExtremes.max;\n }\n if (xData.length) {\n axis.dataMin = Math.min(pick(axis.dataMin, seriesDataMin), seriesDataMin);\n axis.dataMax = Math.max(pick(axis.dataMax, seriesDataMax), seriesDataMax);\n }\n }\n // Get dataMin and dataMax for Y axes, as well as handle\n // stacking and processed data\n }\n else {\n // Get this particular series extremes\n var dataExtremes = series.applyExtremes();\n // Get the dataMin and dataMax so far. If percentage is\n // used, the min and max are always 0 and 100. If\n // seriesDataMin and seriesDataMax is null, then series\n // doesn't have active y data, we continue with nulls\n if (isNumber(dataExtremes.dataMin)) {\n seriesDataMin = dataExtremes.dataMin;\n axis.dataMin = Math.min(pick(axis.dataMin, seriesDataMin), seriesDataMin);\n }\n if (isNumber(dataExtremes.dataMax)) {\n seriesDataMax = dataExtremes.dataMax;\n axis.dataMax = Math.max(pick(axis.dataMax, seriesDataMax), seriesDataMax);\n }\n // Adjust to threshold\n if (defined(threshold)) {\n axis.threshold = threshold;\n }\n // If any series has a hard threshold, it takes\n // precedence\n if (!seriesOptions.softThreshold ||\n axis.positiveValuesOnly) {\n axis.softThreshold = false;\n }\n }\n }\n });\n });\n fireEvent(this, 'afterGetSeriesExtremes');\n };\n /**\n * Translate from axis value to pixel position on the chart, or back. Use\n * the `toPixels` and `toValue` functions in applications.\n *\n * @private\n * @function Highcharts.Axis#translate\n */\n Axis.prototype.translate = function (val, backwards, cvsCoord, old, handleLog, pointPlacement) {\n var axis = (this.linkedParent || this), // #1417\n localMin = (old && axis.old ? axis.old.min : axis.min);\n if (!isNumber(localMin)) {\n return NaN;\n }\n var minPixelPadding = axis.minPixelPadding,\n doPostTranslate = (axis.isOrdinal ||\n axis.brokenAxis && axis.brokenAxis.hasBreaks ||\n (axis.logarithmic && handleLog)) && axis.lin2val;\n var sign = 1,\n cvsOffset = 0,\n localA = old && axis.old ? axis.old.transA : axis.transA,\n returnValue = 0;\n if (!localA) {\n localA = axis.transA;\n }\n // In vertical axes, the canvas coordinates start from 0 at the top like\n // in SVG.\n if (cvsCoord) {\n sign *= -1; // canvas coordinates inverts the value\n cvsOffset = axis.len;\n }\n // Handle reversed axis\n if (axis.reversed) {\n sign *= -1;\n cvsOffset -= sign * (axis.sector || axis.len);\n }\n // From pixels to value\n if (backwards) { // reverse translation\n val = val * sign + cvsOffset;\n val -= minPixelPadding;\n // from chart pixel to value:\n returnValue = val / localA + localMin;\n if (doPostTranslate) { // log, ordinal and broken axis\n returnValue = axis.lin2val(returnValue);\n }\n // From value to pixels\n }\n else {\n if (doPostTranslate) { // log, ordinal and broken axis\n val = axis.val2lin(val);\n }\n var value = sign * (val - localMin) * localA;\n returnValue = (!axis.isRadial ? correctFloat(value) : value) +\n cvsOffset +\n (sign * minPixelPadding) +\n (isNumber(pointPlacement) ? localA * pointPlacement : 0);\n }\n return returnValue;\n };\n /**\n * Translate a value in terms of axis units into pixels within the chart.\n *\n * @function Highcharts.Axis#toPixels\n *\n * @param {number} value\n * A value in terms of axis units.\n *\n * @param {boolean} paneCoordinates\n * Whether to return the pixel coordinate relative to the chart or just the\n * axis/pane itself.\n *\n * @return {number}\n * Pixel position of the value on the chart or axis.\n */\n Axis.prototype.toPixels = function (value, paneCoordinates) {\n return this.translate(value, false, !this.horiz, void 0, true) +\n (paneCoordinates ? 0 : this.pos);\n };\n /**\n * Translate a pixel position along the axis to a value in terms of axis\n * units.\n *\n * @function Highcharts.Axis#toValue\n *\n * @param {number} pixel\n * The pixel value coordinate.\n *\n * @param {boolean} [paneCoordinates=false]\n * Whether the input pixel is relative to the chart or just the axis/pane\n * itself.\n *\n * @return {number}\n * The axis value.\n */\n Axis.prototype.toValue = function (pixel, paneCoordinates) {\n return this.translate(pixel - (paneCoordinates ? 0 : this.pos), true, !this.horiz, void 0, true);\n };\n /**\n * Create the path for a plot line that goes from the given value on\n * this axis, across the plot to the opposite side. Also used internally for\n * grid lines and crosshairs.\n *\n * @function Highcharts.Axis#getPlotLinePath\n *\n * @param {Highcharts.AxisPlotLinePathOptionsObject} options\n * Options for the path.\n *\n * @return {Highcharts.SVGPathArray|null}\n * The SVG path definition for the plot line.\n */\n Axis.prototype.getPlotLinePath = function (options) {\n var axis = this,\n chart = axis.chart,\n axisLeft = axis.left,\n axisTop = axis.top,\n old = options.old,\n value = options.value,\n lineWidth = options.lineWidth,\n cHeight = (old && chart.oldChartHeight) || chart.chartHeight,\n cWidth = (old && chart.oldChartWidth) || chart.chartWidth,\n transB = axis.transB;\n var translatedValue = options.translatedValue,\n force = options.force,\n x1,\n y1,\n x2,\n y2,\n skip;\n // eslint-disable-next-line valid-jsdoc\n /**\n * Check if x is between a and b. If not, either move to a/b\n * or skip, depending on the force parameter.\n * @private\n */\n function between(x, a, b) {\n if (force !== 'pass' && (x < a || x > b)) {\n if (force) {\n x = clamp(x, a, b);\n }\n else {\n skip = true;\n }\n }\n return x;\n }\n var evt = {\n value: value,\n lineWidth: lineWidth,\n old: old,\n force: force,\n acrossPanes: options.acrossPanes,\n translatedValue: translatedValue\n };\n fireEvent(this, 'getPlotLinePath', evt, function (e) {\n translatedValue = pick(translatedValue, axis.translate(value, void 0, void 0, old));\n // Keep the translated value within sane bounds, and avoid Infinity\n // to fail the isNumber test (#7709).\n translatedValue = clamp(translatedValue, -1e5, 1e5);\n x1 = x2 = Math.round(translatedValue + transB);\n y1 = y2 = Math.round(cHeight - translatedValue - transB);\n if (!isNumber(translatedValue)) { // no min or max\n skip = true;\n force = false; // #7175, don't force it when path is invalid\n }\n else if (axis.horiz) {\n y1 = axisTop;\n y2 = cHeight - axis.bottom;\n x1 = x2 = between(x1, axisLeft, axisLeft + axis.width);\n }\n else {\n x1 = axisLeft;\n x2 = cWidth - axis.right;\n y1 = y2 = between(y1, axisTop, axisTop + axis.height);\n }\n e.path = skip && !force ?\n null :\n chart.renderer.crispLine([['M', x1, y1], ['L', x2, y2]], lineWidth || 1);\n });\n return evt.path;\n };\n /**\n * Internal function to get the tick positions of a linear axis to round\n * values like whole tens or every five.\n *\n * @function Highcharts.Axis#getLinearTickPositions\n *\n * @param {number} tickInterval\n * The normalized tick interval.\n *\n * @param {number} min\n * Axis minimum.\n *\n * @param {number} max\n * Axis maximum.\n *\n * @return {Array}\n * An array of axis values where ticks should be placed.\n */\n Axis.prototype.getLinearTickPositions = function (tickInterval, min, max) {\n var roundedMin = correctFloat(Math.floor(min / tickInterval) * tickInterval),\n roundedMax = correctFloat(Math.ceil(max / tickInterval) * tickInterval),\n tickPositions = [];\n var pos,\n lastPos,\n precision;\n // When the precision is higher than what we filter out in\n // correctFloat, skip it (#6183).\n if (correctFloat(roundedMin + tickInterval) === roundedMin) {\n precision = 20;\n }\n // For single points, add a tick regardless of the relative position\n // (#2662, #6274)\n if (this.single) {\n return [min];\n }\n // Populate the intermediate values\n pos = roundedMin;\n while (pos <= roundedMax) {\n // Place the tick on the rounded value\n tickPositions.push(pos);\n // Always add the raw tickInterval, not the corrected one.\n pos = correctFloat(pos + tickInterval, precision);\n // If the interval is not big enough in the current min - max range\n // to actually increase the loop variable, we need to break out to\n // prevent endless loop. Issue #619\n if (pos === lastPos) {\n break;\n }\n // Record the last value\n lastPos = pos;\n }\n return tickPositions;\n };\n /**\n * Resolve the new minorTicks/minorTickInterval options into the legacy\n * loosely typed minorTickInterval option.\n *\n * @function Highcharts.Axis#getMinorTickInterval\n *\n * @return {number|\"auto\"|null}\n * Legacy option\n */\n Axis.prototype.getMinorTickInterval = function () {\n var options = this.options;\n if (options.minorTicks === true) {\n return pick(options.minorTickInterval, 'auto');\n }\n if (options.minorTicks === false) {\n return null;\n }\n return options.minorTickInterval;\n };\n /**\n * Internal function to return the minor tick positions. For logarithmic\n * axes, the same logic as for major ticks is reused.\n *\n * @function Highcharts.Axis#getMinorTickPositions\n *\n * @return {Array}\n * An array of axis values where ticks should be placed.\n */\n Axis.prototype.getMinorTickPositions = function () {\n var axis = this,\n options = axis.options,\n tickPositions = axis.tickPositions,\n minorTickInterval = axis.minorTickInterval,\n pointRangePadding = axis.pointRangePadding || 0,\n min = axis.min - pointRangePadding, // #1498\n max = axis.max + pointRangePadding, // #1498\n range = max - min;\n var minorTickPositions = [],\n pos;\n // If minor ticks get too dense, they are hard to read, and may cause\n // long running script. So we don't draw them.\n if (range && range / minorTickInterval < axis.len / 3) { // #3875\n var logarithmic_1 = axis.logarithmic;\n if (logarithmic_1) {\n // For each interval in the major ticks, compute the minor ticks\n // separately.\n this.paddedTicks.forEach(function (_pos, i, paddedTicks) {\n if (i) {\n minorTickPositions.push.apply(minorTickPositions, logarithmic_1.getLogTickPositions(minorTickInterval, paddedTicks[i - 1], paddedTicks[i], true));\n }\n });\n }\n else if (axis.dateTime &&\n this.getMinorTickInterval() === 'auto') { // #1314\n minorTickPositions = minorTickPositions.concat(axis.getTimeTicks(axis.dateTime.normalizeTimeTickInterval(minorTickInterval), min, max, options.startOfWeek));\n }\n else {\n for (pos = min + (tickPositions[0] - min) % minorTickInterval; pos <= max; pos += minorTickInterval) {\n // Very, very, tight grid lines (#5771)\n if (pos === minorTickPositions[0]) {\n break;\n }\n minorTickPositions.push(pos);\n }\n }\n }\n if (minorTickPositions.length !== 0) {\n axis.trimTicks(minorTickPositions); // #3652 #3743 #1498 #6330\n }\n return minorTickPositions;\n };\n /**\n * Adjust the min and max for the minimum range. Keep in mind that the\n * series data is not yet processed, so we don't have information on data\n * cropping and grouping, or updated `axis.pointRange` or\n * `series.pointRange`. The data can't be processed until we have finally\n * established min and max.\n *\n * @private\n * @function Highcharts.Axis#adjustForMinRange\n */\n Axis.prototype.adjustForMinRange = function () {\n var axis = this,\n options = axis.options,\n log = axis.logarithmic;\n var min = axis.min,\n max = axis.max,\n zoomOffset,\n spaceAvailable,\n closestDataRange = 0,\n i,\n distance,\n xData,\n loopLength,\n minArgs,\n maxArgs,\n minRange;\n // Set the automatic minimum range based on the closest point distance\n if (axis.isXAxis &&\n typeof axis.minRange === 'undefined' &&\n !log) {\n if (defined(options.min) ||\n defined(options.max) ||\n defined(options.floor) ||\n defined(options.ceiling)) {\n axis.minRange = null; // don't do this again\n }\n else {\n // Find the closest distance between raw data points, as opposed\n // to closestPointRange that applies to processed points\n // (cropped and grouped)\n axis.series.forEach(function (series) {\n xData = series.xData;\n loopLength = series.xIncrement ? 1 : xData.length - 1;\n if (xData.length > 1) {\n for (i = loopLength; i > 0; i--) {\n distance = xData[i] - xData[i - 1];\n if (!closestDataRange ||\n distance < closestDataRange) {\n closestDataRange = distance;\n }\n }\n }\n });\n axis.minRange = Math.min(closestDataRange * 5, axis.dataMax - axis.dataMin);\n }\n }\n // if minRange is exceeded, adjust\n if (max - min < axis.minRange) {\n spaceAvailable =\n axis.dataMax - axis.dataMin >=\n axis.minRange;\n minRange = axis.minRange;\n zoomOffset = (minRange - max + min) / 2;\n // if min and max options have been set, don't go beyond it\n minArgs = [\n min - zoomOffset,\n pick(options.min, min - zoomOffset)\n ];\n // If space is available, stay within the data range\n if (spaceAvailable) {\n minArgs[2] = axis.logarithmic ?\n axis.logarithmic.log2lin(axis.dataMin) :\n axis.dataMin;\n }\n min = arrayMax(minArgs);\n maxArgs = [\n min + minRange,\n pick(options.max, min + minRange)\n ];\n // If space is availabe, stay within the data range\n if (spaceAvailable) {\n maxArgs[2] = log ?\n log.log2lin(axis.dataMax) :\n axis.dataMax;\n }\n max = arrayMin(maxArgs);\n // now if the max is adjusted, adjust the min back\n if (max - min < minRange) {\n minArgs[0] = max - minRange;\n minArgs[1] = pick(options.min, max - minRange);\n min = arrayMax(minArgs);\n }\n }\n // Record modified extremes\n axis.min = min;\n axis.max = max;\n };\n /**\n * Find the closestPointRange across all series.\n *\n * @private\n * @function Highcharts.Axis#getClosest\n */\n Axis.prototype.getClosest = function () {\n var ret;\n if (this.categories) {\n ret = 1;\n }\n else {\n this.series.forEach(function (series) {\n var seriesClosest = series.closestPointRange,\n visible = series.visible ||\n !series.chart.options.chart.ignoreHiddenSeries;\n if (!series.noSharedTooltip &&\n defined(seriesClosest) &&\n visible) {\n ret = defined(ret) ?\n Math.min(ret, seriesClosest) :\n seriesClosest;\n }\n });\n }\n return ret;\n };\n /**\n * When a point name is given and no x, search for the name in the existing\n * categories, or if categories aren't provided, search names or create a\n * new category (#2522).\n *\n * @private\n * @function Highcharts.Axis#nameToX\n *\n * @param {Highcharts.Point} point\n * The point to inspect.\n *\n * @return {number}\n * The X value that the point is given.\n */\n Axis.prototype.nameToX = function (point) {\n var explicitCategories = isArray(this.options.categories),\n names = explicitCategories ? this.categories : this.names;\n var nameX = point.options.x,\n x;\n point.series.requireSorting = false;\n if (!defined(nameX)) {\n nameX = this.options.uniqueNames && names ?\n (explicitCategories ?\n names.indexOf(point.name) :\n pick(names.keys[point.name], -1)) :\n point.series.autoIncrement();\n }\n if (nameX === -1) { // Not found in currenct categories\n if (!explicitCategories && names) {\n x = names.length;\n }\n }\n else {\n x = nameX;\n }\n // Write the last point's name to the names array\n if (typeof x !== 'undefined') {\n this.names[x] = point.name;\n // Backwards mapping is much faster than array searching (#7725)\n this.names.keys[point.name] = x;\n }\n else if (point.x) {\n x = point.x; // #17438\n }\n return x;\n };\n /**\n * When changes have been done to series data, update the axis.names.\n *\n * @private\n * @function Highcharts.Axis#updateNames\n */\n Axis.prototype.updateNames = function () {\n var axis = this,\n names = this.names,\n i = names.length;\n if (i > 0) {\n Object.keys(names.keys).forEach(function (key) {\n delete (names.keys)[key];\n });\n names.length = 0;\n this.minRange = this.userMinRange; // Reset\n (this.series || []).forEach(function (series) {\n // Reset incrementer (#5928)\n series.xIncrement = null;\n // When adding a series, points are not yet generated\n if (!series.points || series.isDirtyData) {\n // When we're updating the series with data that is longer\n // than it was, and cropThreshold is passed, we need to make\n // sure that the axis.max is increased _before_ running the\n // premature processData. Otherwise this early iteration of\n // processData will crop the points to axis.max, and the\n // names array will be too short (#5857).\n axis.max = Math.max(axis.max, series.xData.length - 1);\n series.processData();\n series.generatePoints();\n }\n series.data.forEach(function (point, i) {\n var x;\n if (point &&\n point.options &&\n typeof point.name !== 'undefined' // #9562\n ) {\n x = axis.nameToX(point);\n if (typeof x !== 'undefined' && x !== point.x) {\n point.x = x;\n series.xData[i] = x;\n }\n }\n });\n });\n }\n };\n /**\n * Update translation information.\n *\n * @private\n * @function Highcharts.Axis#setAxisTranslation\n *\n * @emits Highcharts.Axis#event:afterSetAxisTranslation\n */\n Axis.prototype.setAxisTranslation = function () {\n var axis = this,\n range = axis.max - axis.min,\n linkedParent = axis.linkedParent,\n hasCategories = !!axis.categories,\n isXAxis = axis.isXAxis;\n var pointRange = axis.axisPointRange || 0,\n closestPointRange,\n minPointOffset = 0,\n pointRangePadding = 0,\n ordinalCorrection,\n transA = axis.transA;\n // Adjust translation for padding. Y axis with categories need to go\n // through the same (#1784).\n if (isXAxis || hasCategories || pointRange) {\n // Get the closest points\n closestPointRange = axis.getClosest();\n if (linkedParent) {\n minPointOffset = linkedParent.minPointOffset;\n pointRangePadding = linkedParent.pointRangePadding;\n }\n else {\n axis.series.forEach(function (series) {\n var seriesPointRange = hasCategories ?\n 1 :\n (isXAxis ?\n pick(series.options.pointRange,\n closestPointRange, 0) :\n (axis.axisPointRange || 0)), // #2806\n pointPlacement = series.options.pointPlacement;\n pointRange = Math.max(pointRange, seriesPointRange);\n if (!axis.single || hasCategories) {\n // TODO: series should internally set x- and y-\n // pointPlacement to simplify this logic.\n var isPointPlacementAxis = series.is('xrange') ?\n !isXAxis :\n isXAxis;\n // minPointOffset is the value padding to the left of\n // the axis in order to make room for points with a\n // pointRange, typically columns. When the\n // pointPlacement option is 'between' or 'on', this\n // padding does not apply.\n minPointOffset = Math.max(minPointOffset, isPointPlacementAxis && isString(pointPlacement) ?\n 0 :\n seriesPointRange / 2);\n // Determine the total padding needed to the length of\n // the axis to make room for the pointRange. If the\n // series' pointPlacement is 'on', no padding is added.\n pointRangePadding = Math.max(pointRangePadding, isPointPlacementAxis && pointPlacement === 'on' ?\n 0 :\n seriesPointRange);\n }\n });\n }\n // Record minPointOffset and pointRangePadding\n ordinalCorrection = (axis.ordinal && axis.ordinal.slope && closestPointRange) ?\n axis.ordinal.slope / closestPointRange :\n 1; // #988, #1853\n axis.minPointOffset = minPointOffset =\n minPointOffset * ordinalCorrection;\n axis.pointRangePadding =\n pointRangePadding = pointRangePadding * ordinalCorrection;\n // pointRange means the width reserved for each point, like in a\n // column chart\n axis.pointRange = Math.min(pointRange, axis.single && hasCategories ? 1 : range);\n // closestPointRange means the closest distance between points. In\n // columns it is mostly equal to pointRange, but in lines pointRange\n // is 0 while closestPointRange is some other value\n if (isXAxis) {\n axis.closestPointRange = closestPointRange;\n }\n }\n // Secondary values\n axis.translationSlope = axis.transA = transA =\n axis.staticScale ||\n axis.len / ((range + pointRangePadding) || 1);\n // Translation addend\n axis.transB = axis.horiz ? axis.left : axis.bottom;\n axis.minPixelPadding = transA * minPointOffset;\n fireEvent(this, 'afterSetAxisTranslation');\n };\n /**\n * @private\n * @function Highcharts.Axis#minFromRange\n */\n Axis.prototype.minFromRange = function () {\n var axis = this;\n return axis.max - axis.range;\n };\n /**\n * Set the tick positions to round values and optionally extend the extremes\n * to the nearest tick.\n *\n * @private\n * @function Highcharts.Axis#setTickInterval\n *\n * @param {boolean} secondPass\n * TO-DO: parameter description\n *\n * @emits Highcharts.Axis#event:foundExtremes\n */\n Axis.prototype.setTickInterval = function (secondPass) {\n var axis = this,\n chart = axis.chart,\n log = axis.logarithmic,\n options = axis.options,\n isXAxis = axis.isXAxis,\n isLinked = axis.isLinked,\n tickPixelIntervalOption = options.tickPixelInterval,\n categories = axis.categories,\n softThreshold = axis.softThreshold;\n var maxPadding = options.maxPadding,\n minPadding = options.minPadding,\n length,\n linkedParentExtremes, \n // Only non-negative tickInterval is valid, #12961\n tickIntervalOption = isNumber(options.tickInterval) && options.tickInterval >= 0 ?\n options.tickInterval : void 0,\n threshold = isNumber(axis.threshold) ? axis.threshold : null,\n thresholdMin,\n thresholdMax,\n hardMin,\n hardMax;\n if (!axis.dateTime && !categories && !isLinked) {\n this.getTickAmount();\n }\n // Min or max set either by zooming/setExtremes or initial options\n hardMin = pick(axis.userMin, options.min);\n hardMax = pick(axis.userMax, options.max);\n // Linked axis gets the extremes from the parent axis\n if (isLinked) {\n axis.linkedParent = chart[axis.coll][options.linkedTo];\n linkedParentExtremes = axis.linkedParent.getExtremes();\n axis.min = pick(linkedParentExtremes.min, linkedParentExtremes.dataMin);\n axis.max = pick(linkedParentExtremes.max, linkedParentExtremes.dataMax);\n if (options.type !== axis.linkedParent.options.type) {\n // Can't link axes of different type\n error(11, 1, chart);\n }\n // Initial min and max from the extreme data values\n }\n else {\n // Adjust to hard threshold\n if (softThreshold && defined(threshold)) {\n if (axis.dataMin >= threshold) {\n thresholdMin = threshold;\n minPadding = 0;\n }\n else if (axis.dataMax <= threshold) {\n thresholdMax = threshold;\n maxPadding = 0;\n }\n }\n axis.min = pick(hardMin, thresholdMin, axis.dataMin);\n axis.max = pick(hardMax, thresholdMax, axis.dataMax);\n }\n if (log) {\n if (axis.positiveValuesOnly &&\n !secondPass &&\n Math.min(axis.min, pick(axis.dataMin, axis.min)) <= 0) { // #978\n // Can't plot negative values on log axis\n error(10, 1, chart);\n }\n // The correctFloat cures #934, float errors on full tens. But it\n // was too aggressive for #4360 because of conversion back to lin,\n // therefore use precision 15.\n axis.min = correctFloat(log.log2lin(axis.min), 16);\n axis.max = correctFloat(log.log2lin(axis.max), 16);\n }\n // handle zoomed range\n if (axis.range && defined(axis.max)) {\n // #618, #6773:\n axis.userMin = axis.min = hardMin =\n Math.max(axis.dataMin, axis.minFromRange());\n axis.userMax = hardMax = axis.max;\n axis.range = null; // don't use it when running setExtremes\n }\n // Hook for Highcharts Stock Scroller.\n // Consider combining with beforePadding.\n fireEvent(axis, 'foundExtremes');\n // Hook for adjusting this.min and this.max. Used by bubble series.\n if (axis.beforePadding) {\n axis.beforePadding();\n }\n // adjust min and max for the minimum range\n axis.adjustForMinRange();\n // Pad the values to get clear of the chart's edges. To avoid\n // tickInterval taking the padding into account, we do this after\n // computing tick interval (#1337).\n if (!categories &&\n !axis.axisPointRange &&\n !(axis.stacking && axis.stacking.usePercentage) &&\n !isLinked &&\n defined(axis.min) &&\n defined(axis.max)) {\n length = axis.max - axis.min;\n if (length) {\n if (!defined(hardMin) && minPadding) {\n axis.min -= length * minPadding;\n }\n if (!defined(hardMax) && maxPadding) {\n axis.max += length * maxPadding;\n }\n }\n }\n // Handle options for floor, ceiling, softMin and softMax (#6359)\n if (!isNumber(axis.userMin)) {\n if (isNumber(options.softMin) && options.softMin < axis.min) {\n axis.min = hardMin = options.softMin; // #6894\n }\n if (isNumber(options.floor)) {\n axis.min = Math.max(axis.min, options.floor);\n }\n }\n if (!isNumber(axis.userMax)) {\n if (isNumber(options.softMax) && options.softMax > axis.max) {\n axis.max = hardMax = options.softMax; // #6894\n }\n if (isNumber(options.ceiling)) {\n axis.max = Math.min(axis.max, options.ceiling);\n }\n }\n // When the threshold is soft, adjust the extreme value only if the data\n // extreme and the padded extreme land on either side of the threshold.\n // For example, a series of [0, 1, 2, 3] would make the yAxis add a tick\n // for -1 because of the default minPadding and startOnTick options.\n // This is prevented by the softThreshold option.\n if (softThreshold && defined(axis.dataMin)) {\n threshold = threshold || 0;\n if (!defined(hardMin) &&\n axis.min < threshold &&\n axis.dataMin >= threshold) {\n axis.min = axis.options.minRange ?\n Math.min(threshold, axis.max -\n axis.minRange) :\n threshold;\n }\n else if (!defined(hardMax) &&\n axis.max > threshold &&\n axis.dataMax <= threshold) {\n axis.max = axis.options.minRange ?\n Math.max(threshold, axis.min +\n axis.minRange) :\n threshold;\n }\n }\n // If min is bigger than highest, or if max less than lowest value, the\n // chart should not render points. (#14417)\n if (isNumber(axis.min) &&\n isNumber(axis.max) &&\n !this.chart.polar &&\n (axis.min > axis.max)) {\n if (defined(axis.options.min)) {\n axis.max = axis.min;\n }\n else if (defined(axis.options.max)) {\n axis.min = axis.max;\n }\n }\n // get tickInterval\n if (axis.min === axis.max ||\n typeof axis.min === 'undefined' ||\n typeof axis.max === 'undefined') {\n axis.tickInterval = 1;\n }\n else if (isLinked &&\n axis.linkedParent &&\n !tickIntervalOption &&\n tickPixelIntervalOption ===\n axis.linkedParent.options.tickPixelInterval) {\n axis.tickInterval = tickIntervalOption =\n axis.linkedParent.tickInterval;\n }\n else {\n axis.tickInterval = pick(tickIntervalOption, this.tickAmount ?\n ((axis.max - axis.min) /\n Math.max(this.tickAmount - 1, 1)) :\n void 0, \n // For categoried axis, 1 is default, for linear axis use\n // tickPix\n categories ?\n 1 :\n // don't let it be more than the data range\n (axis.max - axis.min) *\n tickPixelIntervalOption /\n Math.max(axis.len, tickPixelIntervalOption));\n }\n // Now we're finished detecting min and max, crop and group series data.\n // This is in turn needed in order to find tick positions in ordinal\n // axes.\n if (isXAxis && !secondPass) {\n var hasExtremesChanged_1 = axis.min !==\n (axis.old && axis.old.min) ||\n axis.max !== (axis.old && axis.old.max);\n // First process all series assigned to that axis.\n axis.series.forEach(function (series) {\n // Allows filtering out points outside the plot area.\n series.forceCrop = (series.forceCropping &&\n series.forceCropping());\n series.processData(hasExtremesChanged_1);\n });\n // Then apply grouping if needed. The hasExtremesChanged helps to\n // decide if the data grouping should be skipped in the further\n // calculations #16319.\n fireEvent(this, 'postProcessData', { hasExtremesChanged: hasExtremesChanged_1 });\n }\n // set the translation factor used in translate function\n axis.setAxisTranslation();\n // hook for ordinal axes and radial axes\n fireEvent(this, 'initialAxisTranslation');\n // In column-like charts, don't cramp in more ticks than there are\n // points (#1943, #4184)\n if (axis.pointRange && !tickIntervalOption) {\n axis.tickInterval = Math.max(axis.pointRange, axis.tickInterval);\n }\n // Before normalizing the tick interval, handle minimum tick interval.\n // This applies only if tickInterval is not defined.\n var minTickInterval = pick(options.minTickInterval, \n // In datetime axes, don't go below the data interval, except when\n // there are scatter-like series involved (#13369).\n axis.dateTime &&\n !axis.series.some(function (s) { return s.noSharedTooltip; }) ?\n axis.closestPointRange : 0);\n if (!tickIntervalOption && axis.tickInterval < minTickInterval) {\n axis.tickInterval = minTickInterval;\n }\n // For linear axes, normalize the interval\n if (!axis.dateTime && !axis.logarithmic && !tickIntervalOption) {\n axis.tickInterval = getNormalizedTickInterval(axis, axis.tickInterval);\n }\n // Prevent ticks from getting so close that we can't draw the labels\n if (!this.tickAmount) {\n axis.tickInterval = axis.unsquish();\n }\n this.setTickPositions();\n };\n /**\n * Now we have computed the normalized tickInterval, get the tick positions.\n *\n * @private\n * @function Highcharts.Axis#setTickPositions\n *\n * @emits Highcharts.Axis#event:afterSetTickPositions\n */\n Axis.prototype.setTickPositions = function () {\n var axis = this,\n options = this.options,\n tickPositionsOption = options.tickPositions,\n tickPositioner = options.tickPositioner,\n minorTickIntervalOption = this.getMinorTickInterval(),\n hasVerticalPanning = this.hasVerticalPanning(),\n isColorAxis = this.coll === 'colorAxis',\n startOnTick = ((isColorAxis || !hasVerticalPanning) && options.startOnTick),\n endOnTick = ((isColorAxis || !hasVerticalPanning) && options.endOnTick);\n var tickPositions = [],\n tickPositionerResult;\n // Set the tickmarkOffset\n this.tickmarkOffset = (this.categories &&\n options.tickmarkPlacement === 'between' &&\n this.tickInterval === 1) ? 0.5 : 0; // #3202\n // get minorTickInterval\n this.minorTickInterval =\n minorTickIntervalOption === 'auto' &&\n this.tickInterval ?\n this.tickInterval / 5 :\n minorTickIntervalOption;\n // When there is only one point, or all points have the same value on\n // this axis, then min and max are equal and tickPositions.length is 0\n // or 1. In this case, add some padding in order to center the point,\n // but leave it with one tick. #1337.\n this.single =\n this.min === this.max &&\n defined(this.min) &&\n !this.tickAmount &&\n (\n // Data is on integer (#6563)\n parseInt(this.min, 10) === this.min ||\n // Between integers and decimals are not allowed (#6274)\n options.allowDecimals !== false);\n /**\n * Contains the current positions that are laid out on the axis. The\n * positions are numbers in terms of axis values. In a category axis\n * they are integers, in a datetime axis they are also integers, but\n * designating milliseconds.\n *\n * This property is read only - for modifying the tick positions, use\n * the `tickPositioner` callback or [axis.tickPositions(\n * https://api.highcharts.com/highcharts/xAxis.tickPositions) option\n * instead.\n *\n * @name Highcharts.Axis#tickPositions\n * @type {Highcharts.AxisTickPositionsArray|undefined}\n */\n if (tickPositionsOption) {\n // Find the tick positions. Work on a copy (#1565)\n tickPositions = tickPositionsOption.slice();\n }\n else if (isNumber(this.min) && isNumber(this.max)) {\n // Too many ticks (#6405). Create a friendly warning and provide two\n // ticks so at least we can show the data series.\n if ((!axis.ordinal || !axis.ordinal.positions) &&\n ((this.max - this.min) /\n this.tickInterval >\n Math.max(2 * this.len, 200))) {\n tickPositions = [this.min, this.max];\n error(19, false, this.chart);\n }\n else if (axis.dateTime) {\n tickPositions = axis.getTimeTicks(axis.dateTime.normalizeTimeTickInterval(this.tickInterval, options.units), this.min, this.max, options.startOfWeek, axis.ordinal && axis.ordinal.positions, this.closestPointRange, true);\n }\n else if (axis.logarithmic) {\n tickPositions = axis.logarithmic.getLogTickPositions(this.tickInterval, this.min, this.max);\n }\n else {\n var startingTickInterval = this.tickInterval;\n var adjustedTickInterval = startingTickInterval;\n while (adjustedTickInterval <= startingTickInterval * 2) {\n tickPositions = this.getLinearTickPositions(this.tickInterval, this.min, this.max);\n // If there are more tick positions than the set tickAmount,\n // increase the tickInterval and continue until it fits.\n // (#17100)\n if (this.tickAmount &&\n tickPositions.length > this.tickAmount) {\n this.tickInterval = getNormalizedTickInterval(this, adjustedTickInterval *= 1.1);\n }\n else {\n break;\n }\n }\n }\n // Too dense ticks, keep only the first and last (#4477)\n if (tickPositions.length > this.len) {\n tickPositions = [\n tickPositions[0],\n tickPositions[tickPositions.length - 1]\n ];\n // Reduce doubled value (#7339)\n if (tickPositions[0] === tickPositions[1]) {\n tickPositions.length = 1;\n }\n }\n // Run the tick positioner callback, that allows modifying auto tick\n // positions.\n if (tickPositioner) {\n // Make it available to the positioner\n this.tickPositions = tickPositions;\n tickPositionerResult = tickPositioner.apply(axis, [this.min, this.max]);\n if (tickPositionerResult) {\n tickPositions = tickPositionerResult;\n }\n }\n }\n this.tickPositions = tickPositions;\n // Reset min/max or remove extremes based on start/end on tick\n this.paddedTicks = tickPositions.slice(0); // Used for logarithmic minor\n this.trimTicks(tickPositions, startOnTick, endOnTick);\n if (!this.isLinked && isNumber(this.min) && isNumber(this.max)) {\n // Substract half a unit (#2619, #2846, #2515, #3390), but not in\n // case of multiple ticks (#6897)\n if (this.single &&\n tickPositions.length < 2 &&\n !this.categories &&\n !this.series.some(function (s) {\n return (s.is('heatmap') && s.options.pointPlacement === 'between');\n })) {\n this.min -= 0.5;\n this.max += 0.5;\n }\n if (!tickPositionsOption && !tickPositionerResult) {\n this.adjustTickAmount();\n }\n }\n fireEvent(this, 'afterSetTickPositions');\n };\n /**\n * Handle startOnTick and endOnTick by either adapting to padding min/max or\n * rounded min/max. Also handle single data points.\n *\n * @private\n * @function Highcharts.Axis#trimTicks\n *\n * @param {Array} tickPositions\n * TO-DO: parameter description\n *\n * @param {boolean} [startOnTick]\n * TO-DO: parameter description\n *\n * @param {boolean} [endOnTick]\n * TO-DO: parameter description\n */\n Axis.prototype.trimTicks = function (tickPositions, startOnTick, endOnTick) {\n var roundedMin = tickPositions[0],\n roundedMax = tickPositions[tickPositions.length - 1],\n minPointOffset = (!this.isOrdinal && this.minPointOffset) || 0; // (#12716)\n fireEvent(this, 'trimTicks');\n if (!this.isLinked) {\n if (startOnTick && roundedMin !== -Infinity) { // #6502\n this.min = roundedMin;\n }\n else {\n while (this.min - minPointOffset > tickPositions[0]) {\n tickPositions.shift();\n }\n }\n if (endOnTick) {\n this.max = roundedMax;\n }\n else {\n while (this.max + minPointOffset <\n tickPositions[tickPositions.length - 1]) {\n tickPositions.pop();\n }\n }\n // If no tick are left, set one tick in the middle (#3195)\n if (tickPositions.length === 0 &&\n defined(roundedMin) &&\n !this.options.tickPositions) {\n tickPositions.push((roundedMax + roundedMin) / 2);\n }\n }\n };\n /**\n * Check if there are multiple axes in the same pane.\n *\n * @private\n * @function Highcharts.Axis#alignToOthers\n *\n * @return {boolean|undefined}\n * True if there are other axes.\n */\n Axis.prototype.alignToOthers = function () {\n var axis = this,\n alignedAxes = [this],\n options = axis.options,\n alignThresholds = (this.coll === 'yAxis' &&\n this.chart.options.chart.alignThresholds),\n thresholdAlignments = [];\n var hasOther;\n axis.thresholdAlignment = void 0;\n if ((\n // Only if alignTicks or alignThresholds is true\n (this.chart.options.chart.alignTicks !== false &&\n options.alignTicks) || (alignThresholds)) &&\n // Disabled when startOnTick or endOnTick are false (#7604)\n options.startOnTick !== false &&\n options.endOnTick !== false &&\n // Don't try to align ticks on a log axis, they are not evenly\n // spaced (#6021)\n !axis.logarithmic) {\n // Get a key identifying which pane the axis belongs to\n var getKey_1 = function (axis) {\n var horiz = axis.horiz,\n options = axis.options;\n return [\n horiz ? options.left : options.top,\n options.width,\n options.height,\n options.pane\n ].join(',');\n };\n var thisKey_1 = getKey_1(this);\n this.chart[this.coll].forEach(function (otherAxis) {\n var series = otherAxis.series;\n if (\n // #4442\n series.length &&\n series.some(function (s) { return s.visible; }) &&\n otherAxis !== axis &&\n getKey_1(otherAxis) === thisKey_1) {\n hasOther = true; // #4201\n alignedAxes.push(otherAxis);\n }\n });\n }\n if (hasOther && alignThresholds) {\n // Handle alignThresholds. The `thresholdAlignments` array keeps\n // records of where each axis in the group wants its threshold, from\n // 0 which is on `axis.min`, to 1 which is on `axis.max`.\n alignedAxes.forEach(function (otherAxis) {\n var threshAlign = otherAxis.getThresholdAlignment(axis);\n if (isNumber(threshAlign)) {\n thresholdAlignments.push(threshAlign);\n }\n });\n // For each of the axes in the group, record the average\n // `thresholdAlignment`.\n var thresholdAlignment_1 = thresholdAlignments.length > 1 ?\n thresholdAlignments.reduce(function (sum,\n n) { return (sum += n); }, 0) / thresholdAlignments.length :\n void 0;\n alignedAxes.forEach(function (axis) {\n axis.thresholdAlignment = thresholdAlignment_1;\n });\n }\n return hasOther;\n };\n /**\n * Where the axis wants its threshold, from 0 which is on `axis.min`, to 1 which\n * is on `axis.max`.\n *\n * @private\n * @function Highcharts.Axis#getThresholdAlignment\n */\n Axis.prototype.getThresholdAlignment = function (callerAxis) {\n if (!isNumber(this.dataMin) ||\n (this !== callerAxis &&\n this.series.some(function (s) { return (s.isDirty || s.isDirtyData); }))) {\n this.getSeriesExtremes();\n }\n if (isNumber(this.threshold)) {\n var thresholdAlignment = clamp(((this.threshold - (this.dataMin || 0)) /\n ((this.dataMax || 0) - (this.dataMin || 0))), 0, 1);\n if (this.options.reversed) {\n thresholdAlignment = 1 - thresholdAlignment;\n }\n return thresholdAlignment;\n }\n };\n /**\n * Find the max ticks of either the x and y axis collection, and record it\n * in `this.tickAmount`.\n *\n * @private\n * @function Highcharts.Axis#getTickAmount\n */\n Axis.prototype.getTickAmount = function () {\n var axis = this,\n options = this.options,\n tickPixelInterval = options.tickPixelInterval;\n var tickAmount = options.tickAmount;\n if (!defined(options.tickInterval) &&\n !tickAmount &&\n this.len < tickPixelInterval &&\n !this.isRadial &&\n !axis.logarithmic &&\n options.startOnTick &&\n options.endOnTick) {\n tickAmount = 2;\n }\n if (!tickAmount && this.alignToOthers()) {\n // Add 1 because 4 tick intervals require 5 ticks (including first\n // and last)\n tickAmount = Math.ceil(this.len / tickPixelInterval) + 1;\n }\n // For tick amounts of 2 and 3, compute five ticks and remove the\n // intermediate ones. This prevents the axis from adding ticks that are\n // too far away from the data extremes.\n if (tickAmount < 4) {\n this.finalTickAmt = tickAmount;\n tickAmount = 5;\n }\n this.tickAmount = tickAmount;\n };\n /**\n * When using multiple axes, adjust the number of ticks to match the highest\n * number of ticks in that group.\n *\n * @private\n * @function Highcharts.Axis#adjustTickAmount\n */\n Axis.prototype.adjustTickAmount = function () {\n var axis = this,\n finalTickAmt = axis.finalTickAmt,\n max = axis.max,\n min = axis.min,\n options = axis.options,\n tickPositions = axis.tickPositions,\n tickAmount = axis.tickAmount,\n thresholdAlignment = axis.thresholdAlignment,\n currentTickAmount = tickPositions && tickPositions.length,\n threshold = pick(axis.threshold,\n axis.softThreshold ? 0 : null);\n var len,\n i,\n tickInterval = axis.tickInterval,\n thresholdTickIndex;\n var \n // Extend the tickPositions by appending a position\n append = function () { return tickPositions.push(correctFloat(tickPositions[tickPositions.length - 1] +\n tickInterval)); }, \n // Extend the tickPositions by prepending a position\n prepend = function () { return tickPositions.unshift(correctFloat(tickPositions[0] - tickInterval)); };\n // If `thresholdAlignment` is a number, it means the `alignThresholds`\n // option is true. The `thresholdAlignment` is a scalar value between 0\n // and 1 for where the threshold should be relative to `axis.min` and\n // `axis.max`. Now that we know the tick amount, convert this to the\n // tick index. Unless `thresholdAlignment` is exactly 0 or 1, avoid the\n // first or last tick because that would lead to series being clipped.\n if (isNumber(thresholdAlignment)) {\n thresholdTickIndex = thresholdAlignment < 0.5 ?\n Math.ceil(thresholdAlignment * (tickAmount - 1)) :\n Math.floor(thresholdAlignment * (tickAmount - 1));\n if (options.reversed) {\n thresholdTickIndex = tickAmount - 1 - thresholdTickIndex;\n }\n }\n if (axis.hasData() && isNumber(min) && isNumber(max)) { // #14769\n // Adjust extremes and translation to the modified tick positions\n var adjustExtremes = function () {\n axis.transA *= (currentTickAmount - 1) / (tickAmount - 1);\n // Do not crop when ticks are not extremes (#9841)\n axis.min = options.startOnTick ?\n tickPositions[0] :\n Math.min(min, tickPositions[0]);\n axis.max = options.endOnTick ?\n tickPositions[tickPositions.length - 1] :\n Math.max(max, tickPositions[tickPositions.length - 1]);\n };\n // When the axis is subject to the alignThresholds option. Use\n // axis.threshold because the local threshold includes the\n // `softThreshold`.\n if (isNumber(thresholdTickIndex) && isNumber(axis.threshold)) {\n // Throw away the previously computed tickPositions and start\n // from scratch with only the threshold itself, then add ticks\n // below the threshold first, then fill up above the threshold.\n // If we are not able to fill up to axis.max, double the\n // tickInterval and run again.\n while (tickPositions[thresholdTickIndex] !== threshold ||\n tickPositions.length !== tickAmount ||\n tickPositions[0] > min ||\n tickPositions[tickPositions.length - 1] < max) {\n tickPositions.length = 0;\n tickPositions.push(axis.threshold);\n while (tickPositions.length < tickAmount) {\n if (\n // Start by prepending positions until the threshold\n // is at the required index...\n tickPositions[thresholdTickIndex] === void 0 ||\n tickPositions[thresholdTickIndex] > axis.threshold) {\n prepend();\n }\n else {\n // ... then append positions until we have the\n // required length\n append();\n }\n }\n // Safety vent\n if (tickInterval > axis.tickInterval * 8) {\n break;\n }\n tickInterval *= 2;\n }\n adjustExtremes();\n }\n else if (currentTickAmount < tickAmount) {\n while (tickPositions.length < tickAmount) {\n // Extend evenly for both sides unless we're on the\n // threshold (#3965)\n if (tickPositions.length % 2 || min === threshold) {\n append();\n }\n else {\n prepend();\n }\n }\n adjustExtremes();\n }\n // The finalTickAmt property is set in getTickAmount\n if (defined(finalTickAmt)) {\n i = len = tickPositions.length;\n while (i--) {\n if (\n // Remove every other tick\n (finalTickAmt === 3 && i % 2 === 1) ||\n // Remove all but first and last\n (finalTickAmt <= 2 && i > 0 && i < len - 1)) {\n tickPositions.splice(i, 1);\n }\n }\n axis.finalTickAmt = void 0;\n }\n }\n };\n /**\n * Set the scale based on data min and max, user set min and max or options.\n *\n * @private\n * @function Highcharts.Axis#setScale\n *\n * @emits Highcharts.Axis#event:afterSetScale\n */\n Axis.prototype.setScale = function () {\n var axis = this;\n var isDirtyData = false,\n isXAxisDirty = false;\n axis.series.forEach(function (series) {\n isDirtyData = isDirtyData || series.isDirtyData || series.isDirty;\n // When x axis is dirty, we need new data extremes for y as\n // well:\n isXAxisDirty = (isXAxisDirty ||\n (series.xAxis && series.xAxis.isDirty) ||\n false);\n });\n // set the new axisLength\n axis.setAxisSize();\n var isDirtyAxisLength = axis.len !== (axis.old && axis.old.len);\n // do we really need to go through all this?\n if (isDirtyAxisLength ||\n isDirtyData ||\n isXAxisDirty ||\n axis.isLinked ||\n axis.forceRedraw ||\n axis.userMin !== (axis.old && axis.old.userMin) ||\n axis.userMax !== (axis.old && axis.old.userMax) ||\n axis.alignToOthers()) {\n if (axis.stacking) {\n axis.stacking.resetStacks();\n axis.stacking.buildStacks();\n }\n axis.forceRedraw = false;\n // get data extremes if needed\n axis.getSeriesExtremes();\n // get fixed positions based on tickInterval\n axis.setTickInterval();\n // Mark as dirty if it is not already set to dirty and extremes have\n // changed. #595.\n if (!axis.isDirty) {\n axis.isDirty =\n isDirtyAxisLength ||\n axis.min !== (axis.old && axis.old.min) ||\n axis.max !== (axis.old && axis.old.max);\n }\n }\n else if (axis.stacking) {\n axis.stacking.cleanStacks();\n }\n // Recalculate panning state object, when the data\n // has changed. It is required when vertical panning is enabled.\n if (isDirtyData && axis.panningState) {\n axis.panningState.isDirty = true;\n }\n fireEvent(this, 'afterSetScale');\n };\n /**\n * Set the minimum and maximum of the axes after render time. If the\n * `startOnTick` and `endOnTick` options are true, the minimum and maximum\n * values are rounded off to the nearest tick. To prevent this, these\n * options can be set to false before calling setExtremes. Also, setExtremes\n * will not allow a range lower than the `minRange` option, which by default\n * is the range of five points.\n *\n * @sample highcharts/members/axis-setextremes/\n * Set extremes from a button\n * @sample highcharts/members/axis-setextremes-datetime/\n * Set extremes on a datetime axis\n * @sample highcharts/members/axis-setextremes-off-ticks/\n * Set extremes off ticks\n * @sample stock/members/axis-setextremes/\n * Set extremes in Highcharts Stock\n *\n * @function Highcharts.Axis#setExtremes\n *\n * @param {number} [newMin]\n * The new minimum value.\n *\n * @param {number} [newMax]\n * The new maximum value.\n *\n * @param {boolean} [redraw=true]\n * Whether to redraw the chart or wait for an explicit call to\n * {@link Highcharts.Chart#redraw}\n *\n * @param {boolean|Partial} [animation=true]\n * Enable or modify animations.\n *\n * @param {*} [eventArguments]\n * Arguments to be accessed in event handler.\n *\n * @emits Highcharts.Axis#event:setExtremes\n */\n Axis.prototype.setExtremes = function (newMin, newMax, redraw, animation, eventArguments) {\n var axis = this,\n chart = axis.chart;\n redraw = pick(redraw, true); // defaults to true\n axis.series.forEach(function (serie) {\n delete serie.kdTree;\n });\n // Extend the arguments with min and max\n eventArguments = extend(eventArguments, {\n min: newMin,\n max: newMax\n });\n // Fire the event\n fireEvent(axis, 'setExtremes', eventArguments, function () {\n axis.userMin = newMin;\n axis.userMax = newMax;\n axis.eventArgs = eventArguments;\n if (redraw) {\n chart.redraw(animation);\n }\n });\n };\n /**\n * Overridable method for zooming chart. Pulled out in a separate method to\n * allow overriding in stock charts.\n *\n * @private\n * @function Highcharts.Axis#zoom\n */\n Axis.prototype.zoom = function (newMin, newMax) {\n var axis = this,\n dataMin = this.dataMin,\n dataMax = this.dataMax,\n options = this.options,\n min = Math.min(dataMin,\n pick(options.min,\n dataMin)),\n max = Math.max(dataMax,\n pick(options.max,\n dataMax)),\n evt = {\n newMin: newMin,\n newMax: newMax\n };\n fireEvent(this, 'zoom', evt, function (e) {\n // Use e.newMin and e.newMax - event handlers may have altered them\n var newMin = e.newMin,\n newMax = e.newMax;\n if (newMin !== axis.min || newMax !== axis.max) { // #5790\n // Prevent pinch zooming out of range. Check for defined is for\n // #1946. #1734.\n if (!axis.allowZoomOutside) {\n // #6014, sometimes newMax will be smaller than min (or\n // newMin will be larger than max).\n if (defined(dataMin)) {\n if (newMin < min) {\n newMin = min;\n }\n if (newMin > max) {\n newMin = max;\n }\n }\n if (defined(dataMax)) {\n if (newMax < min) {\n newMax = min;\n }\n if (newMax > max) {\n newMax = max;\n }\n }\n }\n // In full view, displaying the reset zoom button is not\n // required\n axis.displayBtn = (typeof newMin !== 'undefined' ||\n typeof newMax !== 'undefined');\n // Do it\n axis.setExtremes(newMin, newMax, false, void 0, { trigger: 'zoom' });\n }\n e.zoomed = true;\n });\n return evt.zoomed;\n };\n /**\n * Update the axis metrics.\n *\n * @private\n * @function Highcharts.Axis#setAxisSize\n */\n Axis.prototype.setAxisSize = function () {\n var chart = this.chart,\n options = this.options, \n // [top, right, bottom, left]\n offsets = options.offsets || [0, 0, 0, 0],\n horiz = this.horiz, \n // Check for percentage based input values. Rounding fixes problems\n // with column overflow and plot line filtering (#4898, #4899)\n width = this.width = Math.round(relativeLength(pick(options.width,\n chart.plotWidth - offsets[3] + offsets[1]),\n chart.plotWidth)),\n height = this.height = Math.round(relativeLength(pick(options.height,\n chart.plotHeight - offsets[0] + offsets[2]),\n chart.plotHeight)),\n top = this.top = Math.round(relativeLength(pick(options.top,\n chart.plotTop + offsets[0]),\n chart.plotHeight,\n chart.plotTop)),\n left = this.left = Math.round(relativeLength(pick(options.left,\n chart.plotLeft + offsets[3]),\n chart.plotWidth,\n chart.plotLeft));\n // Expose basic values to use in Series object and navigator\n this.bottom = chart.chartHeight - height - top;\n this.right = chart.chartWidth - width - left;\n // Direction agnostic properties\n this.len = Math.max(horiz ? width : height, 0); // Math.max fixes #905\n this.pos = horiz ? left : top; // distance from SVG origin\n };\n /**\n * Get the current extremes for the axis.\n *\n * @sample highcharts/members/axis-getextremes/\n * Report extremes by click on a button\n *\n * @function Highcharts.Axis#getExtremes\n *\n * @return {Highcharts.ExtremesObject}\n * An object containing extremes information.\n */\n Axis.prototype.getExtremes = function () {\n var axis = this,\n log = axis.logarithmic;\n return {\n min: log ?\n correctFloat(log.lin2log(axis.min)) :\n axis.min,\n max: log ?\n correctFloat(log.lin2log(axis.max)) :\n axis.max,\n dataMin: axis.dataMin,\n dataMax: axis.dataMax,\n userMin: axis.userMin,\n userMax: axis.userMax\n };\n };\n /**\n * Get the zero plane either based on zero or on the min or max value.\n * Used in bar and area plots.\n *\n * @function Highcharts.Axis#getThreshold\n *\n * @param {number} threshold\n * The threshold in axis values.\n *\n * @return {number}\n * The translated threshold position in terms of pixels, and corrected to\n * stay within the axis bounds.\n */\n Axis.prototype.getThreshold = function (threshold) {\n var axis = this,\n log = axis.logarithmic,\n realMin = log ? log.lin2log(axis.min) : axis.min,\n realMax = log ? log.lin2log(axis.max) : axis.max;\n if (threshold === null || threshold === -Infinity) {\n threshold = realMin;\n }\n else if (threshold === Infinity) {\n threshold = realMax;\n }\n else if (realMin > threshold) {\n threshold = realMin;\n }\n else if (realMax < threshold) {\n threshold = realMax;\n }\n return axis.translate(threshold, 0, 1, 0, 1);\n };\n /**\n * Compute auto alignment for the axis label based on which side the axis is\n * on and the given rotation for the label.\n *\n * @private\n * @function Highcharts.Axis#autoLabelAlign\n *\n * @param {number} rotation\n * The rotation in degrees as set by either the `rotation` or `autoRotation`\n * options.\n *\n * @return {Highcharts.AlignValue}\n * Can be `\"center\"`, `\"left\"` or `\"right\"`.\n */\n Axis.prototype.autoLabelAlign = function (rotation) {\n var angle = (pick(rotation, 0) - (this.side * 90) + 720) % 360,\n evt = { align: 'center' };\n fireEvent(this, 'autoLabelAlign', evt, function (e) {\n if (angle > 15 && angle < 165) {\n e.align = 'right';\n }\n else if (angle > 195 && angle < 345) {\n e.align = 'left';\n }\n });\n return evt.align;\n };\n /**\n * Get the tick length and width for the axis based on axis options.\n *\n * @private\n * @function Highcharts.Axis#tickSize\n *\n * @param {string} [prefix]\n * 'tick' or 'minorTick'\n *\n * @return {Array|undefined}\n * An array of tickLength and tickWidth\n */\n Axis.prototype.tickSize = function (prefix) {\n var options = this.options,\n tickWidth = pick(options[prefix === 'tick' ? 'tickWidth' : 'minorTickWidth'], \n // Default to 1 on linear and datetime X axes\n prefix === 'tick' && this.isXAxis && !this.categories ? 1 : 0);\n var tickLength = options[prefix === 'tick' ? 'tickLength' : 'minorTickLength'],\n tickSize;\n if (tickWidth && tickLength) {\n // Negate the length\n if (options[prefix + 'Position'] === 'inside') {\n tickLength = -tickLength;\n }\n tickSize = [tickLength, tickWidth];\n }\n var e = { tickSize: tickSize };\n fireEvent(this, 'afterTickSize', e);\n return e.tickSize;\n };\n /**\n * Return the size of the labels.\n *\n * @private\n * @function Highcharts.Axis#labelMetrics\n */\n Axis.prototype.labelMetrics = function () {\n var index = this.tickPositions && this.tickPositions[0] || 0;\n return this.chart.renderer.fontMetrics(this.options.labels.style.fontSize, this.ticks[index] && this.ticks[index].label);\n };\n /**\n * Prevent the ticks from getting so close we can't draw the labels. On a\n * horizontal axis, this is handled by rotating the labels, removing ticks\n * and adding ellipsis. On a vertical axis remove ticks and add ellipsis.\n *\n * @private\n * @function Highcharts.Axis#unsquish\n */\n Axis.prototype.unsquish = function () {\n var labelOptions = this.options.labels,\n horiz = this.horiz,\n tickInterval = this.tickInterval,\n slotSize = this.len / (((this.categories ? 1 : 0) +\n this.max -\n this.min) /\n tickInterval),\n rotationOption = labelOptions.rotation,\n labelMetrics = this.labelMetrics(),\n range = Math.max(this.max - this.min, 0), \n // Return the multiple of tickInterval that is needed to avoid\n // collision\n getStep = function (spaceNeeded) {\n var step = spaceNeeded / (slotSize || 1);\n step = step > 1 ? Math.ceil(step) : 1;\n // Guard for very small or negative angles (#9835)\n if (step * tickInterval > range &&\n spaceNeeded !== Infinity &&\n slotSize !== Infinity &&\n range) {\n step = Math.ceil(range / tickInterval);\n }\n return correctFloat(step * tickInterval);\n };\n var newTickInterval = tickInterval,\n rotation,\n bestScore = Number.MAX_VALUE,\n autoRotation;\n if (horiz) {\n if (!labelOptions.staggerLines) {\n if (isNumber(rotationOption)) {\n autoRotation = [rotationOption];\n }\n else if (slotSize < labelOptions.autoRotationLimit) {\n autoRotation = labelOptions.autoRotation;\n }\n }\n if (autoRotation) {\n var step = void 0,\n score = void 0;\n // Loop over the given autoRotation options, and determine which\n // gives the best score. The best score is that with the lowest\n // number of steps and a rotation closest to horizontal.\n for (var _i = 0, autoRotation_1 = autoRotation; _i < autoRotation_1.length; _i++) {\n var rot = autoRotation_1[_i];\n if (rot === rotationOption ||\n (rot && rot >= -90 && rot <= 90)) { // #3891\n step = getStep(Math.abs(labelMetrics.h / Math.sin(deg2rad * rot)));\n score = step + Math.abs(rot / 360);\n if (score < bestScore) {\n bestScore = score;\n rotation = rot;\n newTickInterval = step;\n }\n }\n }\n }\n }\n else { // #4411\n newTickInterval = getStep(labelMetrics.h);\n }\n this.autoRotation = autoRotation;\n this.labelRotation = pick(rotation, isNumber(rotationOption) ? rotationOption : 0);\n return labelOptions.step ? tickInterval : newTickInterval;\n };\n /**\n * Get the general slot width for labels/categories on this axis. This may\n * change between the pre-render (from Axis.getOffset) and the final tick\n * rendering and placement.\n *\n * @private\n * @function Highcharts.Axis#getSlotWidth\n *\n * @param {Highcharts.Tick} [tick] Optionally, calculate the slot width\n * basing on tick label. It is used in highcharts-3d module, where the slots\n * has different widths depending on perspective angles.\n *\n * @return {number}\n * The pixel width allocated to each axis label.\n */\n Axis.prototype.getSlotWidth = function (tick) {\n // #5086, #1580, #1931\n var chart = this.chart,\n horiz = this.horiz,\n labelOptions = this.options.labels,\n slotCount = Math.max(this.tickPositions.length - (this.categories ? 0 : 1), 1),\n marginLeft = chart.margin[3];\n // Used by grid axis\n if (tick && isNumber(tick.slotWidth)) { // #13221, can be 0\n return tick.slotWidth;\n }\n if (horiz && labelOptions.step < 2) {\n if (labelOptions.rotation) { // #4415\n return 0;\n }\n return ((this.staggerLines || 1) * this.len) / slotCount;\n }\n if (!horiz) {\n // #7028\n var cssWidth = labelOptions.style.width;\n if (cssWidth !== void 0) {\n return parseInt(String(cssWidth), 10);\n }\n if (marginLeft) {\n return marginLeft - chart.spacing[3];\n }\n }\n // Last resort, a fraction of the available size\n return chart.chartWidth * 0.33;\n };\n /**\n * Render the axis labels and determine whether ellipsis or rotation need to\n * be applied.\n *\n * @private\n * @function Highcharts.Axis#renderUnsquish\n */\n Axis.prototype.renderUnsquish = function () {\n var chart = this.chart,\n renderer = chart.renderer,\n tickPositions = this.tickPositions,\n ticks = this.ticks,\n labelOptions = this.options.labels,\n labelStyleOptions = labelOptions.style,\n horiz = this.horiz,\n slotWidth = this.getSlotWidth(),\n innerWidth = Math.max(1,\n Math.round(slotWidth - 2 * labelOptions.padding)),\n attr = {},\n labelMetrics = this.labelMetrics(),\n textOverflowOption = labelStyleOptions.textOverflow;\n var commonWidth,\n commonTextOverflow,\n maxLabelLength = 0,\n label,\n i,\n pos;\n // Set rotation option unless it is \"auto\", like in gauges\n if (!isString(labelOptions.rotation)) {\n // #4443\n attr.rotation = labelOptions.rotation || 0;\n }\n // Get the longest label length\n tickPositions.forEach(function (tickPosition) {\n var tick = ticks[tickPosition];\n // Replace label - sorting animation\n if (tick.movedLabel) {\n tick.replaceMovedLabel();\n }\n if (tick &&\n tick.label &&\n tick.label.textPxLength > maxLabelLength) {\n maxLabelLength = tick.label.textPxLength;\n }\n });\n this.maxLabelLength = maxLabelLength;\n // Handle auto rotation on horizontal axis\n if (this.autoRotation) {\n // Apply rotation only if the label is too wide for the slot, and\n // the label is wider than its height.\n if (maxLabelLength > innerWidth &&\n maxLabelLength > labelMetrics.h) {\n attr.rotation = this.labelRotation;\n }\n else {\n this.labelRotation = 0;\n }\n // Handle word-wrap or ellipsis on vertical axis\n }\n else if (slotWidth) {\n // For word-wrap or ellipsis\n commonWidth = innerWidth;\n if (!textOverflowOption) {\n commonTextOverflow = 'clip';\n // On vertical axis, only allow word wrap if there is room\n // for more lines.\n i = tickPositions.length;\n while (!horiz && i--) {\n pos = tickPositions[i];\n label = ticks[pos].label;\n if (label) {\n // Reset ellipsis in order to get the correct\n // bounding box (#4070)\n if (label.styles &&\n label.styles.textOverflow === 'ellipsis') {\n label.css({ textOverflow: 'clip' });\n // Set the correct width in order to read\n // the bounding box height (#4678, #5034)\n }\n else if (label.textPxLength > slotWidth) {\n label.css({ width: slotWidth + 'px' });\n }\n if (label.getBBox().height > (this.len / tickPositions.length -\n (labelMetrics.h - labelMetrics.f))) {\n label.specificTextOverflow = 'ellipsis';\n }\n }\n }\n }\n }\n // Add ellipsis if the label length is significantly longer than ideal\n if (attr.rotation) {\n commonWidth = (maxLabelLength > chart.chartHeight * 0.5 ?\n chart.chartHeight * 0.33 :\n maxLabelLength);\n if (!textOverflowOption) {\n commonTextOverflow = 'ellipsis';\n }\n }\n // Set the explicit or automatic label alignment\n this.labelAlign = labelOptions.align ||\n this.autoLabelAlign(this.labelRotation);\n if (this.labelAlign) {\n attr.align = this.labelAlign;\n }\n // Apply general and specific CSS\n tickPositions.forEach(function (pos) {\n var tick = ticks[pos],\n label = tick && tick.label,\n widthOption = labelStyleOptions.width,\n css = {};\n if (label) {\n // This needs to go before the CSS in old IE (#4502)\n label.attr(attr);\n if (tick.shortenLabel) {\n tick.shortenLabel();\n }\n else if (commonWidth &&\n !widthOption &&\n // Setting width in this case messes with the bounding box\n // (#7975)\n labelStyleOptions.whiteSpace !== 'nowrap' &&\n (\n // Speed optimizing, #7656\n commonWidth < label.textPxLength ||\n // Resetting CSS, #4928\n label.element.tagName === 'SPAN')) {\n css.width = commonWidth + 'px';\n if (!textOverflowOption) {\n css.textOverflow = (label.specificTextOverflow ||\n commonTextOverflow);\n }\n label.css(css);\n // Reset previously shortened label (#8210)\n }\n else if (label.styles &&\n label.styles.width &&\n !css.width &&\n !widthOption) {\n label.css({ width: null });\n }\n delete label.specificTextOverflow;\n tick.rotation = attr.rotation;\n }\n }, this);\n // Note: Why is this not part of getLabelPosition?\n this.tickRotCorr = renderer.rotCorr(labelMetrics.b, this.labelRotation || 0, this.side !== 0);\n };\n /**\n * Return true if the axis has associated data.\n *\n * @function Highcharts.Axis#hasData\n *\n * @return {boolean}\n * True if the axis has associated visible series and those series have\n * either valid data points or explicit `min` and `max` settings.\n */\n Axis.prototype.hasData = function () {\n return this.series.some(function (s) {\n return s.hasData();\n }) ||\n (this.options.showEmpty &&\n defined(this.min) &&\n defined(this.max));\n };\n /**\n * Adds the title defined in axis.options.title.\n *\n * @function Highcharts.Axis#addTitle\n *\n * @param {boolean} [display]\n * Whether or not to display the title.\n */\n Axis.prototype.addTitle = function (display) {\n var axis = this,\n renderer = axis.chart.renderer,\n horiz = axis.horiz,\n opposite = axis.opposite,\n options = axis.options,\n axisTitleOptions = options.title,\n styledMode = axis.chart.styledMode;\n var textAlign;\n if (!axis.axisTitle) {\n textAlign = axisTitleOptions.textAlign;\n if (!textAlign) {\n textAlign = (horiz ? {\n low: 'left',\n middle: 'center',\n high: 'right'\n } : {\n low: opposite ? 'right' : 'left',\n middle: 'center',\n high: opposite ? 'left' : 'right'\n })[axisTitleOptions.align];\n }\n axis.axisTitle = renderer\n .text(axisTitleOptions.text || '', 0, 0, axisTitleOptions.useHTML)\n .attr({\n zIndex: 7,\n rotation: axisTitleOptions.rotation,\n align: textAlign\n })\n .addClass('highcharts-axis-title');\n // #7814, don't mutate style option\n if (!styledMode) {\n axis.axisTitle.css(merge(axisTitleOptions.style));\n }\n axis.axisTitle.add(axis.axisGroup);\n axis.axisTitle.isNew = true;\n }\n // Max width defaults to the length of the axis\n if (!styledMode &&\n !axisTitleOptions.style.width &&\n !axis.isRadial) {\n axis.axisTitle.css({\n width: axis.len + 'px'\n });\n }\n // hide or show the title depending on whether showEmpty is set\n axis.axisTitle[display ? 'show' : 'hide'](display);\n };\n /**\n * Generates a tick for initial positioning.\n *\n * @private\n * @function Highcharts.Axis#generateTick\n *\n * @param {number} pos\n * The tick position in axis values.\n *\n * @param {number} [i]\n * The index of the tick in {@link Axis.tickPositions}.\n */\n Axis.prototype.generateTick = function (pos) {\n var axis = this,\n ticks = axis.ticks;\n if (!ticks[pos]) {\n ticks[pos] = new Tick(axis, pos);\n }\n else {\n ticks[pos].addLabel(); // update labels depending on tick interval\n }\n };\n /**\n * Render the tick labels to a preliminary position to get their sizes\n *\n * @private\n * @function Highcharts.Axis#getOffset\n *\n * @emits Highcharts.Axis#event:afterGetOffset\n */\n Axis.prototype.getOffset = function () {\n var _this = this;\n var axis = this,\n chart = axis.chart,\n horiz = axis.horiz,\n options = axis.options,\n side = axis.side,\n ticks = axis.ticks,\n tickPositions = axis.tickPositions,\n coll = axis.coll,\n axisParent = axis.axisParent // Used in color axis\n ,\n renderer = chart.renderer,\n invertedSide = (chart.inverted && !axis.isZAxis ?\n [1, 0, 3, 2][side] :\n side),\n hasData = axis.hasData(),\n axisTitleOptions = options.title,\n labelOptions = options.labels,\n axisOffset = chart.axisOffset,\n clipOffset = chart.clipOffset,\n directionFactor = [-1, 1, 1, -1][side],\n className = options.className;\n var showAxis,\n titleOffset = 0,\n titleOffsetOption,\n titleMargin = 0,\n labelOffset = 0, // reset\n labelOffsetPadded,\n lineHeightCorrection;\n // For reuse in Axis.render\n axis.showAxis = showAxis = hasData || options.showEmpty;\n // Set/reset staggerLines\n axis.staggerLines = (axis.horiz && labelOptions.staggerLines) || void 0;\n // Create the axisGroup and gridGroup elements on first iteration\n if (!axis.axisGroup) {\n var createGroup = function (name, suffix, zIndex) { return renderer.g(name)\n .attr({ zIndex: zIndex })\n .addClass(\"highcharts-\".concat(coll.toLowerCase()).concat(suffix, \" \") +\n (_this.isRadial ? \"highcharts-radial-axis\".concat(suffix, \" \") : '') +\n (className || ''))\n .add(axisParent); };\n axis.gridGroup = createGroup('grid', '-grid', options.gridZIndex);\n axis.axisGroup = createGroup('axis', '', options.zIndex);\n axis.labelGroup = createGroup('axis-labels', '-labels', labelOptions.zIndex);\n }\n if (hasData || axis.isLinked) {\n // Generate ticks\n tickPositions.forEach(function (pos) {\n // i is not used here, but may be used in overrides\n axis.generateTick(pos);\n });\n axis.renderUnsquish();\n // Left side must be align: right and right side must\n // have align: left for labels\n axis.reserveSpaceDefault = (side === 0 ||\n side === 2 ||\n { 1: 'left', 3: 'right' }[side] === axis.labelAlign);\n if (pick(labelOptions.reserveSpace, axis.labelAlign === 'center' ? true : null, axis.reserveSpaceDefault)) {\n tickPositions.forEach(function (pos) {\n // get the highest offset\n labelOffset = Math.max(ticks[pos].getLabelSize(), labelOffset);\n });\n }\n if (axis.staggerLines) {\n labelOffset *= axis.staggerLines;\n }\n axis.labelOffset = labelOffset * (axis.opposite ? -1 : 1);\n }\n else { // doesn't have data\n objectEach(ticks, function (tick, n) {\n tick.destroy();\n delete ticks[n];\n });\n }\n if (axisTitleOptions &&\n axisTitleOptions.text &&\n axisTitleOptions.enabled !== false) {\n axis.addTitle(showAxis);\n if (showAxis && axisTitleOptions.reserveSpace !== false) {\n axis.titleOffset = titleOffset =\n axis.axisTitle.getBBox()[horiz ? 'height' : 'width'];\n titleOffsetOption = axisTitleOptions.offset;\n titleMargin = defined(titleOffsetOption) ?\n 0 :\n pick(axisTitleOptions.margin, horiz ? 5 : 10);\n }\n }\n // Render the axis line\n axis.renderLine();\n // handle automatic or user set offset\n axis.offset = directionFactor * pick(options.offset, axisOffset[side] ? axisOffset[side] + (options.margin || 0) : 0);\n axis.tickRotCorr = axis.tickRotCorr || { x: 0, y: 0 }; // polar\n if (side === 0) {\n lineHeightCorrection = -axis.labelMetrics().h;\n }\n else if (side === 2) {\n lineHeightCorrection = axis.tickRotCorr.y;\n }\n else {\n lineHeightCorrection = 0;\n }\n // Find the padded label offset\n labelOffsetPadded = Math.abs(labelOffset) + titleMargin;\n if (labelOffset) {\n labelOffsetPadded -= lineHeightCorrection;\n labelOffsetPadded += directionFactor * (horiz ?\n pick(labelOptions.y, axis.tickRotCorr.y + directionFactor * 8) :\n labelOptions.x);\n }\n axis.axisTitleMargin = pick(titleOffsetOption, labelOffsetPadded);\n if (axis.getMaxLabelDimensions) {\n axis.maxLabelDimensions = axis.getMaxLabelDimensions(ticks, tickPositions);\n }\n // Due to GridAxis.tickSize, tickSize should be calculated after ticks\n // has rendered.\n if (coll !== 'colorAxis') {\n var tickSize = this.tickSize('tick');\n axisOffset[side] = Math.max(axisOffset[side], (axis.axisTitleMargin || 0) + titleOffset +\n directionFactor * axis.offset, labelOffsetPadded, // #3027\n tickPositions && tickPositions.length && tickSize ?\n tickSize[0] + directionFactor * axis.offset :\n 0 // #4866\n );\n // Decide the clipping needed to keep the graph inside\n // the plot area and axis lines\n var clip = !axis.axisLine || options.offset ?\n 0 :\n // #4308, #4371:\n Math.floor(axis.axisLine.strokeWidth() / 2) * 2;\n clipOffset[invertedSide] =\n Math.max(clipOffset[invertedSide], clip);\n }\n fireEvent(this, 'afterGetOffset');\n };\n /**\n * Internal function to get the path for the axis line. Extended for polar\n * charts.\n *\n * @function Highcharts.Axis#getLinePath\n *\n * @param {number} lineWidth\n * The line width in pixels.\n *\n * @return {Highcharts.SVGPathArray}\n * The SVG path definition in array form.\n */\n Axis.prototype.getLinePath = function (lineWidth) {\n var chart = this.chart,\n opposite = this.opposite,\n offset = this.offset,\n horiz = this.horiz,\n lineLeft = this.left + (opposite ? this.width : 0) + offset,\n lineTop = chart.chartHeight - this.bottom -\n (opposite ? this.height : 0) + offset;\n if (opposite) {\n lineWidth *= -1; // crispify the other way - #1480, #1687\n }\n return chart.renderer\n .crispLine([\n [\n 'M',\n horiz ?\n this.left :\n lineLeft,\n horiz ?\n lineTop :\n this.top\n ],\n [\n 'L',\n horiz ?\n chart.chartWidth - this.right :\n lineLeft,\n horiz ?\n lineTop :\n chart.chartHeight - this.bottom\n ]\n ], lineWidth);\n };\n /**\n * Render the axis line. Called internally when rendering and redrawing the\n * axis.\n *\n * @function Highcharts.Axis#renderLine\n */\n Axis.prototype.renderLine = function () {\n if (!this.axisLine) {\n this.axisLine = this.chart.renderer.path()\n .addClass('highcharts-axis-line')\n .add(this.axisGroup);\n if (!this.chart.styledMode) {\n this.axisLine.attr({\n stroke: this.options.lineColor,\n 'stroke-width': this.options.lineWidth,\n zIndex: 7\n });\n }\n }\n };\n /**\n * Position the axis title.\n *\n * @private\n * @function Highcharts.Axis#getTitlePosition\n *\n * @return {Highcharts.PositionObject}\n * X and Y positions for the title.\n */\n Axis.prototype.getTitlePosition = function () {\n // compute anchor points for each of the title align options\n var horiz = this.horiz,\n axisLeft = this.left,\n axisTop = this.top,\n axisLength = this.len,\n axisTitleOptions = this.options.title,\n margin = horiz ? axisLeft : axisTop,\n opposite = this.opposite,\n offset = this.offset,\n xOption = axisTitleOptions.x,\n yOption = axisTitleOptions.y,\n axisTitle = this.axisTitle,\n fontMetrics = this.chart.renderer.fontMetrics(axisTitleOptions.style.fontSize,\n axisTitle), \n // The part of a multiline text that is below the baseline of the\n // first line. Subtract 1 to preserve pixel-perfectness from the\n // old behaviour (v5.0.12), where only one line was allowed.\n textHeightOvershoot = axisTitle ? Math.max(axisTitle.getBBox(false, 0).height - fontMetrics.h - 1, 0) : 0, \n // the position in the length direction of the axis\n alongAxis = ({\n low: margin + (horiz ? 0 : axisLength),\n middle: margin + axisLength / 2,\n high: margin + (horiz ? axisLength : 0)\n })[axisTitleOptions.align], \n // the position in the perpendicular direction of the axis\n offAxis = (horiz ? axisTop + this.height : axisLeft) +\n (horiz ? 1 : -1) * // horizontal axis reverses the margin\n (opposite ? -1 : 1) * // so does opposite axes\n (this.axisTitleMargin || 0) +\n [\n -textHeightOvershoot,\n textHeightOvershoot,\n fontMetrics.f,\n -textHeightOvershoot // left\n ][this.side],\n titlePosition = {\n x: horiz ?\n alongAxis + xOption :\n offAxis + (opposite ? this.width : 0) + offset + xOption,\n y: horiz ?\n offAxis + yOption - (opposite ? this.height : 0) + offset :\n alongAxis + yOption\n };\n fireEvent(this, 'afterGetTitlePosition', { titlePosition: titlePosition });\n return titlePosition;\n };\n /**\n * Render a minor tick into the given position. If a minor tick already\n * exists in this position, move it.\n *\n * @function Highcharts.Axis#renderMinorTick\n *\n * @param {number} pos\n * The position in axis values.\n *\n * @param {boolean} slideIn\n * Whether the tick should animate in from last computed position\n */\n Axis.prototype.renderMinorTick = function (pos, slideIn) {\n var axis = this;\n var minorTicks = axis.minorTicks;\n if (!minorTicks[pos]) {\n minorTicks[pos] = new Tick(axis, pos, 'minor');\n }\n // Render new ticks in old position\n if (slideIn && minorTicks[pos].isNew) {\n minorTicks[pos].render(null, true);\n }\n minorTicks[pos].render(null, false, 1);\n };\n /**\n * Render a major tick into the given position. If a tick already exists\n * in this position, move it.\n *\n * @function Highcharts.Axis#renderTick\n *\n * @param {number} pos\n * The position in axis values.\n *\n * @param {number} i\n * The tick index.\n *\n * @param {boolean} slideIn\n * Whether the tick should animate in from last computed position\n */\n Axis.prototype.renderTick = function (pos, i, slideIn) {\n var axis = this,\n isLinked = axis.isLinked,\n ticks = axis.ticks;\n // Linked axes need an extra check to find out if\n if (!isLinked ||\n (pos >= axis.min && pos <= axis.max) ||\n (axis.grid && axis.grid.isColumn)) {\n if (!ticks[pos]) {\n ticks[pos] = new Tick(axis, pos);\n }\n // NOTE this seems like overkill. Could be handled in tick.render by\n // setting old position in attr, then set new position in animate.\n // render new ticks in old position\n if (slideIn && ticks[pos].isNew) {\n // Start with negative opacity so that it is visible from\n // halfway into the animation\n ticks[pos].render(i, true, -1);\n }\n ticks[pos].render(i);\n }\n };\n /**\n * Render the axis.\n *\n * @private\n * @function Highcharts.Axis#render\n *\n * @emits Highcharts.Axis#event:afterRender\n */\n Axis.prototype.render = function () {\n var axis = this,\n chart = axis.chart,\n log = axis.logarithmic,\n renderer = chart.renderer,\n options = axis.options,\n isLinked = axis.isLinked,\n tickPositions = axis.tickPositions,\n axisTitle = axis.axisTitle,\n ticks = axis.ticks,\n minorTicks = axis.minorTicks,\n alternateBands = axis.alternateBands,\n stackLabelOptions = options.stackLabels,\n alternateGridColor = options.alternateGridColor,\n tickmarkOffset = axis.tickmarkOffset,\n axisLine = axis.axisLine,\n showAxis = axis.showAxis,\n animation = animObject(renderer.globalAnimation);\n var from,\n to;\n // Reset\n axis.labelEdge.length = 0;\n axis.overlap = false;\n // Mark all elements inActive before we go over and mark the active ones\n [ticks, minorTicks, alternateBands].forEach(function (coll) {\n objectEach(coll, function (tick) {\n tick.isActive = false;\n });\n });\n // If the series has data draw the ticks. Else only the line and title\n if (axis.hasData() || isLinked) {\n var slideInTicks_1 = axis.chart.hasRendered &&\n axis.old && isNumber(axis.old.min);\n // minor ticks\n if (axis.minorTickInterval && !axis.categories) {\n axis.getMinorTickPositions().forEach(function (pos) {\n axis.renderMinorTick(pos, slideInTicks_1);\n });\n }\n // Major ticks. Pull out the first item and render it last so that\n // we can get the position of the neighbour label. #808.\n if (tickPositions.length) { // #1300\n tickPositions.forEach(function (pos, i) {\n axis.renderTick(pos, i, slideInTicks_1);\n });\n // In a categorized axis, the tick marks are displayed\n // between labels. So we need to add a tick mark and\n // grid line at the left edge of the X axis.\n if (tickmarkOffset && (axis.min === 0 || axis.single)) {\n if (!ticks[-1]) {\n ticks[-1] = new Tick(axis, -1, null, true);\n }\n ticks[-1].render(-1);\n }\n }\n // alternate grid color\n if (alternateGridColor) {\n tickPositions.forEach(function (pos, i) {\n to = typeof tickPositions[i + 1] !== 'undefined' ?\n tickPositions[i + 1] + tickmarkOffset :\n axis.max - tickmarkOffset;\n if (i % 2 === 0 &&\n pos < axis.max &&\n to <= axis.max + (chart.polar ?\n -tickmarkOffset :\n tickmarkOffset)) { // #2248, #4660\n if (!alternateBands[pos]) {\n // Should be imported from PlotLineOrBand.js, but\n // the dependency cycle with axis is a problem\n alternateBands[pos] = new H.PlotLineOrBand(axis);\n }\n from = pos + tickmarkOffset; // #949\n alternateBands[pos].options = {\n from: log ? log.lin2log(from) : from,\n to: log ? log.lin2log(to) : to,\n color: alternateGridColor,\n className: 'highcharts-alternate-grid'\n };\n alternateBands[pos].render();\n alternateBands[pos].isActive = true;\n }\n });\n }\n // custom plot lines and bands\n if (!axis._addedPlotLB) { // only first time\n axis._addedPlotLB = true;\n (options.plotLines || [])\n .concat(options.plotBands || [])\n .forEach(function (plotLineOptions) {\n axis\n .addPlotBandOrLine(plotLineOptions);\n });\n }\n } // end if hasData\n // Remove inactive ticks\n [ticks, minorTicks, alternateBands].forEach(function (coll) {\n var forDestruction = [],\n delay = animation.duration,\n destroyInactiveItems = function () {\n var i = forDestruction.length;\n while (i--) {\n // When resizing rapidly, the same items\n // may be destroyed in different timeouts,\n // or the may be reactivated\n if (coll[forDestruction[i]] &&\n !coll[forDestruction[i]].isActive) {\n coll[forDestruction[i]].destroy();\n delete coll[forDestruction[i]];\n }\n }\n };\n objectEach(coll, function (tick, pos) {\n if (!tick.isActive) {\n // Render to zero opacity\n tick.render(pos, false, 0);\n tick.isActive = false;\n forDestruction.push(pos);\n }\n });\n // When the objects are finished fading out, destroy them\n syncTimeout(destroyInactiveItems, coll === alternateBands ||\n !chart.hasRendered ||\n !delay ?\n 0 :\n delay);\n });\n // Set the axis line path\n if (axisLine) {\n axisLine[axisLine.isPlaced ? 'animate' : 'attr']({\n d: this.getLinePath(axisLine.strokeWidth())\n });\n axisLine.isPlaced = true;\n // Show or hide the line depending on options.showEmpty\n axisLine[showAxis ? 'show' : 'hide'](showAxis);\n }\n if (axisTitle && showAxis) {\n var titleXy = axis.getTitlePosition();\n axisTitle[axisTitle.isNew ? 'attr' : 'animate'](titleXy);\n axisTitle.isNew = false;\n }\n // Stacked totals:\n if (stackLabelOptions && stackLabelOptions.enabled && axis.stacking) {\n axis.stacking.renderStackTotals();\n }\n // End stacked totals\n // Record old scaling for updating/animation\n axis.old = {\n len: axis.len,\n max: axis.max,\n min: axis.min,\n transA: axis.transA,\n userMax: axis.userMax,\n userMin: axis.userMin\n };\n axis.isDirty = false;\n fireEvent(this, 'afterRender');\n };\n /**\n * Redraw the axis to reflect changes in the data or axis extremes. Called\n * internally from Highcharts.Chart#redraw.\n *\n * @private\n * @function Highcharts.Axis#redraw\n */\n Axis.prototype.redraw = function () {\n if (this.visible) {\n // render the axis\n this.render();\n // move plot lines and bands\n this.plotLinesAndBands.forEach(function (plotLine) {\n plotLine.render();\n });\n }\n // mark associated series as dirty and ready for redraw\n this.series.forEach(function (series) {\n series.isDirty = true;\n });\n };\n /**\n * Returns an array of axis properties, that should be untouched during\n * reinitialization.\n *\n * @private\n * @function Highcharts.Axis#getKeepProps\n */\n Axis.prototype.getKeepProps = function () {\n return (this.keepProps || Axis.keepProps);\n };\n /**\n * Destroys an Axis instance. See {@link Axis#remove} for the API endpoint\n * to fully remove the axis.\n *\n * @private\n * @function Highcharts.Axis#destroy\n *\n * @param {boolean} [keepEvents]\n * Whether to preserve events, used internally in Axis.update.\n */\n Axis.prototype.destroy = function (keepEvents) {\n var axis = this,\n plotLinesAndBands = axis.plotLinesAndBands,\n eventOptions = this.eventOptions;\n fireEvent(this, 'destroy', { keepEvents: keepEvents });\n // Remove the events\n if (!keepEvents) {\n removeEvent(axis);\n }\n // Destroy collections\n [axis.ticks, axis.minorTicks, axis.alternateBands].forEach(function (coll) {\n destroyObjectProperties(coll);\n });\n if (plotLinesAndBands) {\n var i = plotLinesAndBands.length;\n while (i--) { // #1975\n plotLinesAndBands[i].destroy();\n }\n }\n // Destroy elements\n ['axisLine', 'axisTitle', 'axisGroup',\n 'gridGroup', 'labelGroup', 'cross', 'scrollbar'].forEach(function (prop) {\n if (axis[prop]) {\n axis[prop] = axis[prop].destroy();\n }\n });\n // Destroy each generated group for plotlines and plotbands\n for (var plotGroup in axis.plotLinesAndBandsGroups) { // eslint-disable-line guard-for-in\n axis.plotLinesAndBandsGroups[plotGroup] =\n axis.plotLinesAndBandsGroups[plotGroup].destroy();\n }\n // Delete all properties and fall back to the prototype.\n objectEach(axis, function (val, key) {\n if (axis.getKeepProps().indexOf(key) === -1) {\n delete axis[key];\n }\n });\n this.eventOptions = eventOptions;\n };\n /**\n * Internal function to draw a crosshair.\n *\n * @function Highcharts.Axis#drawCrosshair\n *\n * @param {Highcharts.PointerEventObject} [e]\n * The event arguments from the modified pointer event, extended with\n * `chartX` and `chartY`\n *\n * @param {Highcharts.Point} [point]\n * The Point object if the crosshair snaps to points.\n *\n * @emits Highcharts.Axis#event:afterDrawCrosshair\n * @emits Highcharts.Axis#event:drawCrosshair\n */\n Axis.prototype.drawCrosshair = function (e, point) {\n var options = this.crosshair,\n snap = pick(options && options.snap,\n true),\n chart = this.chart;\n var path,\n pos,\n categorized,\n graphic = this.cross,\n crossOptions;\n fireEvent(this, 'drawCrosshair', { e: e, point: point });\n // Use last available event when updating non-snapped crosshairs without\n // mouse interaction (#5287)\n if (!e) {\n e = this.cross && this.cross.e;\n }\n if (\n // Disabled in options\n !options ||\n // Snap\n ((defined(point) || !snap) === false)) {\n this.hideCrosshair();\n }\n else {\n // Get the path\n if (!snap) {\n pos = e &&\n (this.horiz ?\n e.chartX - this.pos :\n this.len - e.chartY + this.pos);\n }\n else if (defined(point)) {\n // #3834\n pos = pick(this.coll !== 'colorAxis' ?\n point.crosshairPos : // 3D axis extension\n null, this.isXAxis ?\n point.plotX :\n this.len - point.plotY);\n }\n if (defined(pos)) {\n crossOptions = {\n // value, only used on radial\n value: point && (this.isXAxis ?\n point.x :\n pick(point.stackY, point.y)),\n translatedValue: pos\n };\n if (chart.polar) {\n // Additional information required for crosshairs in\n // polar chart\n extend(crossOptions, {\n isCrosshair: true,\n chartX: e && e.chartX,\n chartY: e && e.chartY,\n point: point\n });\n }\n path = this.getPlotLinePath(crossOptions) ||\n null; // #3189\n }\n if (!defined(path)) {\n this.hideCrosshair();\n return;\n }\n categorized = this.categories && !this.isRadial;\n // Draw the cross\n if (!graphic) {\n this.cross = graphic = chart.renderer\n .path()\n .addClass('highcharts-crosshair highcharts-crosshair-' +\n (categorized ? 'category ' : 'thin ') +\n (options.className || ''))\n .attr({\n zIndex: pick(options.zIndex, 2)\n })\n .add();\n // Presentational attributes\n if (!chart.styledMode) {\n graphic.attr({\n stroke: options.color ||\n (categorized ?\n Color\n .parse(\"#ccd6eb\" /* Palette.highlightColor20 */)\n .setOpacity(0.25)\n .get() :\n \"#cccccc\" /* Palette.neutralColor20 */),\n 'stroke-width': pick(options.width, 1)\n }).css({\n 'pointer-events': 'none'\n });\n if (options.dashStyle) {\n graphic.attr({\n dashstyle: options.dashStyle\n });\n }\n }\n }\n graphic.show().attr({\n d: path\n });\n if (categorized && !options.width) {\n graphic.attr({\n 'stroke-width': this.transA\n });\n }\n this.cross.e = e;\n }\n fireEvent(this, 'afterDrawCrosshair', { e: e, point: point });\n };\n /**\n * Hide the crosshair if visible.\n *\n * @function Highcharts.Axis#hideCrosshair\n */\n Axis.prototype.hideCrosshair = function () {\n if (this.cross) {\n this.cross.hide();\n }\n fireEvent(this, 'afterHideCrosshair');\n };\n /**\n * Check whether the chart has vertical panning ('y' or 'xy' type).\n *\n * @private\n * @function Highcharts.Axis#hasVerticalPanning\n */\n Axis.prototype.hasVerticalPanning = function () {\n var panningOptions = this.chart.options.chart.panning;\n return Boolean(panningOptions &&\n panningOptions.enabled && // #14624\n /y/.test(panningOptions.type));\n };\n /**\n * Check whether the given value is a positive valid axis value.\n *\n * @private\n * @function Highcharts.Axis#validatePositiveValue\n *\n * @param {unknown} value\n * The axis value\n */\n Axis.prototype.validatePositiveValue = function (value) {\n return isNumber(value) && value > 0;\n };\n /**\n * Update an axis object with a new set of options. The options are merged\n * with the existing options, so only new or altered options need to be\n * specified.\n *\n * @sample highcharts/members/axis-update/\n * Axis update demo\n *\n * @function Highcharts.Axis#update\n *\n * @param {Highcharts.AxisOptions} options\n * The new options that will be merged in with existing options on the axis.\n *\n * @param {boolean} [redraw=true]\n * Whether to redraw the chart after the axis is altered. If doing more\n * operations on the chart, it is a good idea to set redraw to false and\n * call {@link Chart#redraw} after.\n */\n Axis.prototype.update = function (options, redraw) {\n var chart = this.chart;\n options = merge(this.userOptions, options);\n this.destroy(true);\n this.init(chart, options);\n chart.isDirtyBox = true;\n if (pick(redraw, true)) {\n chart.redraw();\n }\n };\n /**\n * Remove the axis from the chart.\n *\n * @sample highcharts/members/chart-addaxis/\n * Add and remove axes\n *\n * @function Highcharts.Axis#remove\n *\n * @param {boolean} [redraw=true]\n * Whether to redraw the chart following the remove.\n */\n Axis.prototype.remove = function (redraw) {\n var chart = this.chart,\n key = this.coll, // xAxis or yAxis\n axisSeries = this.series;\n var i = axisSeries.length;\n // Remove associated series (#2687)\n while (i--) {\n if (axisSeries[i]) {\n axisSeries[i].remove(false);\n }\n }\n // Remove the axis\n erase(chart.axes, this);\n erase(chart[key], this);\n chart[key].forEach(function (axis, i) {\n // Re-index, #1706, #8075\n axis.options.index = axis.userOptions.index = i;\n });\n this.destroy();\n chart.isDirtyBox = true;\n if (pick(redraw, true)) {\n chart.redraw();\n }\n };\n /**\n * Update the axis title by options after render time.\n *\n * @sample highcharts/members/axis-settitle/\n * Set a new Y axis title\n *\n * @function Highcharts.Axis#setTitle\n *\n * @param {Highcharts.AxisTitleOptions} titleOptions\n * The additional title options.\n *\n * @param {boolean} [redraw=true]\n * Whether to redraw the chart after setting the title.\n */\n Axis.prototype.setTitle = function (titleOptions, redraw) {\n this.update({ title: titleOptions }, redraw);\n };\n /**\n * Set new axis categories and optionally redraw.\n *\n * @sample highcharts/members/axis-setcategories/\n * Set categories by click on a button\n *\n * @function Highcharts.Axis#setCategories\n *\n * @param {Array} categories\n * The new categories.\n *\n * @param {boolean} [redraw=true]\n * Whether to redraw the chart.\n */\n Axis.prototype.setCategories = function (categories, redraw) {\n this.update({ categories: categories }, redraw);\n };\n /* *\n *\n * Static Properties\n *\n * */\n Axis.defaultOptions = AxisDefaults.defaultXAxisOptions;\n // Properties to survive after destroy, needed for Axis.update (#4317,\n // #5773, #5881).\n Axis.keepProps = [\n 'extKey',\n 'hcEvents',\n 'names',\n 'series',\n 'userMax',\n 'userMin'\n ];\n return Axis;\n }());\n /* *\n *\n * Default Export\n *\n * */\n /* *\n *\n * API Declarations\n *\n * */\n /**\n * Options for the path on the Axis to be calculated.\n * @interface Highcharts.AxisPlotLinePathOptionsObject\n */ /**\n * Axis value.\n * @name Highcharts.AxisPlotLinePathOptionsObject#value\n * @type {number|undefined}\n */ /**\n * Line width used for calculation crisp line coordinates. Defaults to 1.\n * @name Highcharts.AxisPlotLinePathOptionsObject#lineWidth\n * @type {number|undefined}\n */ /**\n * If `false`, the function will return null when it falls outside the axis\n * bounds. If `true`, the function will return a path aligned to the plot area\n * sides if it falls outside. If `pass`, it will return a path outside.\n * @name Highcharts.AxisPlotLinePathOptionsObject#force\n * @type {string|boolean|undefined}\n */ /**\n * Used in Highcharts Stock. When `true`, plot paths\n * (crosshair, plotLines, gridLines)\n * will be rendered on all axes when defined on the first axis.\n * @name Highcharts.AxisPlotLinePathOptionsObject#acrossPanes\n * @type {boolean|undefined}\n */ /**\n * Use old coordinates (for resizing and rescaling).\n * If not set, defaults to `false`.\n * @name Highcharts.AxisPlotLinePathOptionsObject#old\n * @type {boolean|undefined}\n */ /**\n * If given, return the plot line path of a pixel position on the axis.\n * @name Highcharts.AxisPlotLinePathOptionsObject#translatedValue\n * @type {number|undefined}\n */ /**\n * Used in Polar axes. Reverse the positions for concatenation of polygonal\n * plot bands\n * @name Highcharts.AxisPlotLinePathOptionsObject#reverse\n * @type {boolean|undefined}\n */\n /**\n * Options for crosshairs on axes.\n *\n * @product highstock\n *\n * @typedef {Highcharts.XAxisCrosshairOptions|Highcharts.YAxisCrosshairOptions} Highcharts.AxisCrosshairOptions\n */\n /**\n * @typedef {\"navigator\"|\"pan\"|\"rangeSelectorButton\"|\"rangeSelectorInput\"|\"scrollbar\"|\"traverseUpButton\"|\"zoom\"} Highcharts.AxisExtremesTriggerValue\n */\n /**\n * @callback Highcharts.AxisEventCallbackFunction\n *\n * @param {Highcharts.Axis} this\n */\n /**\n * @callback Highcharts.AxisLabelsFormatterCallbackFunction\n *\n * @param {Highcharts.AxisLabelsFormatterContextObject} this\n *\n * @param {Highcharts.AxisLabelsFormatterContextObject} ctx\n *\n * @return {string}\n */\n /**\n * @interface Highcharts.AxisLabelsFormatterContextObject\n */ /**\n * The axis item of the label\n * @name Highcharts.AxisLabelsFormatterContextObject#axis\n * @type {Highcharts.Axis}\n */ /**\n * The chart instance.\n * @name Highcharts.AxisLabelsFormatterContextObject#chart\n * @type {Highcharts.Chart}\n */ /**\n * Default formatting of date/time labels.\n * @name Highcharts.AxisLabelsFormatterContextObject#dateTimeLabelFormat\n * @type {string|undefined}\n */ /**\n * Whether the label belongs to the first tick on the axis.\n * @name Highcharts.AxisLabelsFormatterContextObject#isFirst\n * @type {boolean}\n */ /**\n * Whether the label belongs to the last tick on the axis.\n * @name Highcharts.AxisLabelsFormatterContextObject#isLast\n * @type {boolean}\n */ /**\n * The position on the axis in terms of axis values. For category axes, a\n * zero-based index. For datetime axes, the JavaScript time in milliseconds\n * since 1970.\n * @name Highcharts.AxisLabelsFormatterContextObject#pos\n * @type {number}\n */ /**\n * The preformatted text as the result of the default formatting. For example\n * dates will be formatted as strings, and numbers with language-specific comma\n * separators, thousands separators and numeric symbols like `k` or `M`.\n * @name Highcharts.AxisLabelsFormatterContextObject#text\n * @type {string|undefined}\n */ /**\n * The Tick instance.\n * @name Highcharts.AxisLabelsFormatterContextObject#tick\n * @type {Highcharts.Tick}\n */ /**\n * This can be either a numeric value or a category string.\n * @name Highcharts.AxisLabelsFormatterContextObject#value\n * @type {number|string}\n */\n /**\n * Options for axes.\n *\n * @typedef {Highcharts.XAxisOptions|Highcharts.YAxisOptions|Highcharts.ZAxisOptions} Highcharts.AxisOptions\n */\n /**\n * @callback Highcharts.AxisPointBreakEventCallbackFunction\n *\n * @param {Highcharts.Axis} this\n *\n * @param {Highcharts.AxisPointBreakEventObject} evt\n */\n /**\n * @interface Highcharts.AxisPointBreakEventObject\n */ /**\n * @name Highcharts.AxisPointBreakEventObject#brk\n * @type {Highcharts.Dictionary}\n */ /**\n * @name Highcharts.AxisPointBreakEventObject#point\n * @type {Highcharts.Point}\n */ /**\n * @name Highcharts.AxisPointBreakEventObject#preventDefault\n * @type {Function}\n */ /**\n * @name Highcharts.AxisPointBreakEventObject#target\n * @type {Highcharts.SVGElement}\n */ /**\n * @name Highcharts.AxisPointBreakEventObject#type\n * @type {\"pointBreak\"|\"pointInBreak\"}\n */\n /**\n * @callback Highcharts.AxisSetExtremesEventCallbackFunction\n *\n * @param {Highcharts.Axis} this\n *\n * @param {Highcharts.AxisSetExtremesEventObject} evt\n */\n /**\n * @interface Highcharts.AxisSetExtremesEventObject\n * @extends Highcharts.ExtremesObject\n */ /**\n * @name Highcharts.AxisSetExtremesEventObject#preventDefault\n * @type {Function}\n */ /**\n * @name Highcharts.AxisSetExtremesEventObject#target\n * @type {Highcharts.SVGElement}\n */ /**\n * @name Highcharts.AxisSetExtremesEventObject#trigger\n * @type {Highcharts.AxisExtremesTriggerValue|string}\n */ /**\n * @name Highcharts.AxisSetExtremesEventObject#type\n * @type {\"setExtremes\"}\n */\n /**\n * @callback Highcharts.AxisTickPositionerCallbackFunction\n *\n * @param {Highcharts.Axis} this\n *\n * @return {Highcharts.AxisTickPositionsArray}\n */\n /**\n * @interface Highcharts.AxisTickPositionsArray\n * @augments Array\n */\n /**\n * @typedef {\"high\"|\"low\"|\"middle\"} Highcharts.AxisTitleAlignValue\n */\n /**\n * @typedef {Highcharts.XAxisTitleOptions|Highcharts.YAxisTitleOptions|Highcharts.ZAxisTitleOptions} Highcharts.AxisTitleOptions\n */\n /**\n * @typedef {\"linear\"|\"logarithmic\"|\"datetime\"|\"category\"|\"treegrid\"} Highcharts.AxisTypeValue\n */\n /**\n * The returned object literal from the {@link Highcharts.Axis#getExtremes}\n * function.\n *\n * @interface Highcharts.ExtremesObject\n */ /**\n * The maximum value of the axis' associated series.\n * @name Highcharts.ExtremesObject#dataMax\n * @type {number}\n */ /**\n * The minimum value of the axis' associated series.\n * @name Highcharts.ExtremesObject#dataMin\n * @type {number}\n */ /**\n * The maximum axis value, either automatic or set manually. If the `max` option\n * is not set, `maxPadding` is 0 and `endOnTick` is false, this value will be\n * the same as `dataMax`.\n * @name Highcharts.ExtremesObject#max\n * @type {number}\n */ /**\n * The minimum axis value, either automatic or set manually. If the `min` option\n * is not set, `minPadding` is 0 and `startOnTick` is false, this value will be\n * the same as `dataMin`.\n * @name Highcharts.ExtremesObject#min\n * @type {number}\n */ /**\n * The user defined maximum, either from the `max` option or from a zoom or\n * `setExtremes` action.\n * @name Highcharts.ExtremesObject#userMax\n * @type {number}\n */ /**\n * The user defined minimum, either from the `min` option or from a zoom or\n * `setExtremes` action.\n * @name Highcharts.ExtremesObject#userMin\n * @type {number}\n */\n /**\n * Formatter function for the text of a crosshair label.\n *\n * @callback Highcharts.XAxisCrosshairLabelFormatterCallbackFunction\n *\n * @param {Highcharts.Axis} this\n * Axis context\n *\n * @param {number} value\n * Y value of the data point\n *\n * @return {string}\n */\n ''; // keeps doclets above in JS file\n\n return Axis;\n });\n _registerModule(_modules, 'Core/Axis/DateTimeAxis.js', [_modules['Core/Utilities.js']], function (U) {\n /* *\n *\n * (c) 2010-2021 Torstein Honsi\n *\n * License: www.highcharts.com/license\n *\n * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!\n *\n * */\n var addEvent = U.addEvent,\n getMagnitude = U.getMagnitude,\n normalizeTickInterval = U.normalizeTickInterval,\n timeUnits = U.timeUnits;\n /* *\n *\n * Composition\n *\n * */\n /* eslint-disable valid-jsdoc */\n var DateTimeAxis;\n (function (DateTimeAxis) {\n /* *\n *\n * Declarations\n *\n * */\n /* *\n *\n * Constants\n *\n * */\n var composedClasses = [];\n /* *\n *\n * Functions\n *\n * */\n /**\n * Extends axis class with date and time support.\n * @private\n */\n function compose(AxisClass) {\n if (composedClasses.indexOf(AxisClass) === -1) {\n composedClasses.push(AxisClass);\n AxisClass.keepProps.push('dateTime');\n var axisProto = AxisClass.prototype;\n axisProto.getTimeTicks = getTimeTicks;\n addEvent(AxisClass, 'init', onInit);\n }\n return AxisClass;\n }\n DateTimeAxis.compose = compose;\n /**\n * Set the tick positions to a time unit that makes sense, for example\n * on the first of each month or on every Monday. Return an array with\n * the time positions. Used in datetime axes as well as for grouping\n * data on a datetime axis.\n *\n * @private\n * @function Highcharts.Axis#getTimeTicks\n * @param {Highcharts.TimeNormalizeObject} normalizedInterval\n * The interval in axis values (ms) and thecount.\n * @param {number} min\n * The minimum in axis values.\n * @param {number} max\n * The maximum in axis values.\n */\n function getTimeTicks() {\n return this.chart.time.getTimeTicks.apply(this.chart.time, arguments);\n }\n /**\n * @private\n */\n function onInit(e) {\n var axis = this;\n var options = e.userOptions;\n if (options.type !== 'datetime') {\n axis.dateTime = void 0;\n return;\n }\n if (!axis.dateTime) {\n axis.dateTime = new Additions(axis);\n }\n }\n /* *\n *\n * Classes\n *\n * */\n var Additions = /** @class */ (function () {\n /* *\n *\n * Constructors\n *\n * */\n function Additions(axis) {\n this.axis = axis;\n }\n /* *\n *\n * Functions\n *\n * */\n /**\n * Get a normalized tick interval for dates. Returns a configuration\n * object with unit range (interval), count and name. Used to prepare\n * data for `getTimeTicks`. Previously this logic was part of\n * getTimeTicks, but as `getTimeTicks` now runs of segments in stock\n * charts, the normalizing logic was extracted in order to prevent it\n * for running over again for each segment having the same interval.\n * #662, #697.\n * @private\n */\n Additions.prototype.normalizeTimeTickInterval = function (tickInterval, unitsOption) {\n var units = (unitsOption || [[\n // unit name\n 'millisecond',\n // allowed multiples\n [1, 2, 5, 10, 20, 25, 50, 100, 200, 500]\n ],\n [\n 'second',\n [1, 2, 5, 10, 15, 30]\n ],\n [\n 'minute',\n [1, 2, 5, 10, 15, 30]\n ],\n [\n 'hour',\n [1, 2, 3, 4, 6, 8, 12]\n ],\n [\n 'day',\n [1, 2]\n ],\n [\n 'week',\n [1, 2]\n ],\n [\n 'month',\n [1, 2, 3, 4, 6]\n ],\n [\n 'year',\n null\n ]]);\n var unit = units[units.length - 1], // default unit is years\n interval = timeUnits[unit[0]],\n multiples = unit[1],\n i;\n // loop through the units to find the one that best fits the\n // tickInterval\n for (i = 0; i < units.length; i++) {\n unit = units[i];\n interval = timeUnits[unit[0]];\n multiples = unit[1];\n if (units[i + 1]) {\n // lessThan is in the middle between the highest multiple\n // and the next unit.\n var lessThan = (interval *\n multiples[multiples.length - 1] +\n timeUnits[units[i + 1][0]]) / 2;\n // break and keep the current unit\n if (tickInterval <= lessThan) {\n break;\n }\n }\n }\n // prevent 2.5 years intervals, though 25, 250 etc. are allowed\n if (interval === timeUnits.year && tickInterval < 5 * interval) {\n multiples = [1, 2, 5];\n }\n // get the count\n var count = normalizeTickInterval(tickInterval / interval,\n multiples,\n unit[0] === 'year' ? // #1913, #2360\n Math.max(getMagnitude(tickInterval / interval), 1) :\n 1);\n return {\n unitRange: interval,\n count: count,\n unitName: unit[0]\n };\n };\n /**\n * Get the best date format for a specific X value based on the closest\n * point range on the axis.\n *\n * @private\n */\n Additions.prototype.getXDateFormat = function (x, dateTimeLabelFormats) {\n var axis = this.axis,\n time = axis.chart.time;\n return axis.closestPointRange ?\n time.getDateFormat(axis.closestPointRange, x, axis.options.startOfWeek, dateTimeLabelFormats) ||\n // #2546, 2581\n time.resolveDTLFormat(dateTimeLabelFormats.year).main :\n time.resolveDTLFormat(dateTimeLabelFormats.day).main;\n };\n return Additions;\n }());\n DateTimeAxis.Additions = Additions;\n })(DateTimeAxis || (DateTimeAxis = {}));\n /* *\n *\n * Default Export\n *\n * */\n\n return DateTimeAxis;\n });\n _registerModule(_modules, 'Core/Axis/LogarithmicAxis.js', [_modules['Core/Utilities.js']], function (U) {\n /* *\n *\n * (c) 2010-2021 Torstein Honsi\n *\n * License: www.highcharts.com/license\n *\n * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!\n *\n * */\n var addEvent = U.addEvent,\n getMagnitude = U.getMagnitude,\n normalizeTickInterval = U.normalizeTickInterval,\n pick = U.pick;\n /* *\n *\n * Class\n *\n * */\n /**\n * @private\n */\n var LogarithmicAxis;\n (function (LogarithmicAxis) {\n /* *\n *\n * Declarations\n *\n * */\n /* *\n *\n * Constants\n *\n * */\n var composedClasses = [];\n /* *\n *\n * Functions\n *\n * */\n /* eslint-disable valid-jsdoc */\n /**\n * Provides logarithmic support for axes.\n * @private\n */\n function compose(AxisClass) {\n if (composedClasses.indexOf(AxisClass) === -1) {\n composedClasses.push(AxisClass);\n AxisClass.keepProps.push('logarithmic');\n addEvent(AxisClass, 'init', onInit);\n addEvent(AxisClass, 'afterInit', onAfterInit);\n }\n return AxisClass;\n }\n LogarithmicAxis.compose = compose;\n /**\n * @private\n */\n function onInit(e) {\n var axis = this;\n var options = e.userOptions;\n var logarithmic = axis.logarithmic;\n if (options.type !== 'logarithmic') {\n axis.logarithmic = void 0;\n }\n else {\n if (!logarithmic) {\n logarithmic = axis.logarithmic = new Additions(axis);\n }\n }\n }\n /**\n * @private\n */\n function onAfterInit() {\n var axis = this;\n var log = axis.logarithmic;\n // extend logarithmic axis\n if (log) {\n axis.lin2val = function (num) {\n return log.lin2log(num);\n };\n axis.val2lin = function (num) {\n return log.log2lin(num);\n };\n }\n }\n /* *\n *\n * Class\n *\n * */\n /**\n * Provides logarithmic support for axes.\n * @private\n * @class\n */\n var Additions = /** @class */ (function () {\n /* *\n *\n * Constructors\n *\n * */\n function Additions(axis) {\n this.axis = axis;\n }\n /* *\n *\n * Functions\n *\n * */\n /**\n * Set the tick positions of a logarithmic axis.\n */\n Additions.prototype.getLogTickPositions = function (interval, min, max, minor) {\n var log = this;\n var axis = log.axis;\n var axisLength = axis.len;\n var options = axis.options;\n // Since we use this method for both major and minor ticks,\n // use a local variable and return the result\n var positions = [];\n // Reset\n if (!minor) {\n log.minorAutoInterval = void 0;\n }\n // First case: All ticks fall on whole logarithms: 1, 10, 100 etc.\n if (interval >= 0.5) {\n interval = Math.round(interval);\n positions = axis.getLinearTickPositions(interval, min, max);\n // Second case: We need intermediary ticks. For example\n // 1, 2, 4, 6, 8, 10, 20, 40 etc.\n }\n else if (interval >= 0.08) {\n var roundedMin = Math.floor(min);\n var intermediate = void 0,\n i = void 0,\n j = void 0,\n len = void 0,\n pos = void 0,\n lastPos = void 0,\n break2 = void 0;\n if (interval > 0.3) {\n intermediate = [1, 2, 4];\n // 0.2 equals five minor ticks per 1, 10, 100 etc\n }\n else if (interval > 0.15) {\n intermediate = [1, 2, 4, 6, 8];\n }\n else { // 0.1 equals ten minor ticks per 1, 10, 100 etc\n intermediate = [1, 2, 3, 4, 5, 6, 7, 8, 9];\n }\n for (i = roundedMin; i < max + 1 && !break2; i++) {\n len = intermediate.length;\n for (j = 0; j < len && !break2; j++) {\n pos = log.log2lin(log.lin2log(i) * intermediate[j]);\n // #1670, lastPos is #3113\n if (pos > min &&\n (!minor || lastPos <= max) &&\n typeof lastPos !== 'undefined') {\n positions.push(lastPos);\n }\n if (lastPos > max) {\n break2 = true;\n }\n lastPos = pos;\n }\n }\n // Third case: We are so deep in between whole logarithmic values,\n // that we might as well handle the tick positions like a linear\n // axis. For example 1.01, 1.02, 1.03, 1.04.\n }\n else {\n var realMin = log.lin2log(min),\n realMax = log.lin2log(max),\n tickIntervalOption = minor ?\n axis.getMinorTickInterval() :\n options.tickInterval,\n filteredTickIntervalOption = tickIntervalOption === 'auto' ?\n null :\n tickIntervalOption,\n tickPixelIntervalOption = options.tickPixelInterval / (minor ? 5 : 1),\n totalPixelLength = minor ?\n axisLength / axis.tickPositions.length :\n axisLength;\n interval = pick(filteredTickIntervalOption, log.minorAutoInterval, (realMax - realMin) *\n tickPixelIntervalOption / (totalPixelLength || 1));\n interval = normalizeTickInterval(interval);\n positions = axis.getLinearTickPositions(interval, realMin, realMax).map(log.log2lin);\n if (!minor) {\n log.minorAutoInterval = interval / 5;\n }\n }\n // Set the axis-level tickInterval variable\n if (!minor) {\n axis.tickInterval = interval;\n }\n return positions;\n };\n Additions.prototype.lin2log = function (num) {\n return Math.pow(10, num);\n };\n Additions.prototype.log2lin = function (num) {\n return Math.log(num) / Math.LN10;\n };\n return Additions;\n }());\n LogarithmicAxis.Additions = Additions;\n })(LogarithmicAxis || (LogarithmicAxis = {}));\n /* *\n *\n * Default Export\n *\n * */\n\n return LogarithmicAxis;\n });\n _registerModule(_modules, 'Core/Axis/PlotLineOrBand/PlotLineOrBandAxis.js', [_modules['Core/Utilities.js']], function (U) {\n /* *\n *\n * (c) 2010-2021 Torstein Honsi\n *\n * License: www.highcharts.com/license\n *\n * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!\n *\n * */\n var erase = U.erase,\n extend = U.extend,\n isNumber = U.isNumber;\n /* *\n *\n * Composition\n *\n * */\n var PlotLineOrBandAxis;\n (function (PlotLineOrBandAxis) {\n /* *\n *\n * Declarations\n *\n * */\n /* *\n *\n * Constants\n *\n * */\n var composedClasses = [];\n /* *\n *\n * Variables\n *\n * */\n var PlotLineOrBandClass;\n /* *\n *\n * Functions\n *\n * */\n /* eslint-disable valid-jsdoc */\n /**\n * @private\n */\n function compose(PlotLineOrBandType, AxisClass) {\n if (!PlotLineOrBandClass) {\n PlotLineOrBandClass = PlotLineOrBandType;\n }\n if (composedClasses.indexOf(AxisClass) === -1) {\n composedClasses.push(AxisClass);\n extend(AxisClass.prototype, Additions.prototype);\n }\n return AxisClass;\n }\n PlotLineOrBandAxis.compose = compose;\n /* *\n *\n * Classes\n *\n * */\n /**\n * Object with members for extending the Axis prototype.\n * @private\n */\n var Additions = /** @class */ (function () {\n function Additions() {\n }\n /* *\n *\n * Functions\n *\n * */\n /* eslint-disable no-invalid-this, valid-jsdoc */\n /**\n * Internal function to create the SVG path definition for a plot band.\n *\n * @function Highcharts.Axis#getPlotBandPath\n *\n * @param {number} from\n * The axis value to start from.\n *\n * @param {number} to\n * The axis value to end on.\n *\n * @param {Highcharts.AxisPlotBandsOptions|Highcharts.AxisPlotLinesOptions} options\n * The plotBand or plotLine configuration object.\n *\n * @return {Highcharts.SVGPathArray}\n * The SVG path definition in array form.\n */\n Additions.prototype.getPlotBandPath = function (from, to, options) {\n if (options === void 0) { options = this.options; }\n var toPath = this.getPlotLinePath({\n value: to,\n force: true,\n acrossPanes: options.acrossPanes\n }), result = [], horiz = this.horiz, outside = !isNumber(this.min) ||\n !isNumber(this.max) ||\n (from < this.min && to < this.min) ||\n (from > this.max && to > this.max);\n var path = this.getPlotLinePath({\n value: from,\n force: true,\n acrossPanes: options.acrossPanes\n }),\n i, \n // #4964 check if chart is inverted or plotband is on yAxis\n plus = 1,\n isFlat;\n if (path && toPath) {\n // Flat paths don't need labels (#3836)\n if (outside) {\n isFlat = path.toString() === toPath.toString();\n plus = 0;\n }\n // Go over each subpath - for panes in Highcharts Stock\n for (i = 0; i < path.length; i += 2) {\n var pathStart = path[i],\n pathEnd = path[i + 1],\n toPathStart = toPath[i],\n toPathEnd = toPath[i + 1];\n // Type checking all affected path segments. Consider\n // something smarter.\n if ((pathStart[0] === 'M' || pathStart[0] === 'L') &&\n (pathEnd[0] === 'M' || pathEnd[0] === 'L') &&\n (toPathStart[0] === 'M' || toPathStart[0] === 'L') &&\n (toPathEnd[0] === 'M' || toPathEnd[0] === 'L')) {\n // Add 1 pixel when coordinates are the same\n if (horiz && toPathStart[1] === pathStart[1]) {\n toPathStart[1] += plus;\n toPathEnd[1] += plus;\n }\n else if (!horiz && toPathStart[2] === pathStart[2]) {\n toPathStart[2] += plus;\n toPathEnd[2] += plus;\n }\n result.push(['M', pathStart[1], pathStart[2]], ['L', pathEnd[1], pathEnd[2]], ['L', toPathEnd[1], toPathEnd[2]], ['L', toPathStart[1], toPathStart[2]], ['Z']);\n }\n result.isFlat = isFlat;\n }\n }\n else { // outside the axis area\n path = null;\n }\n return result;\n };\n /**\n * Add a plot band after render time.\n *\n * @sample highcharts/members/axis-addplotband/\n * Toggle the plot band from a button\n *\n * @function Highcharts.Axis#addPlotBand\n *\n * @param {Highcharts.AxisPlotBandsOptions} options\n * A configuration object for the plot band, as defined in\n * [xAxis.plotBands](https://api.highcharts.com/highcharts/xAxis.plotBands).\n *\n * @return {Highcharts.PlotLineOrBand|undefined}\n * The added plot band.\n */\n Additions.prototype.addPlotBand = function (options) {\n return this.addPlotBandOrLine(options, 'plotBands');\n };\n /**\n * Add a plot line after render time.\n *\n * @sample highcharts/members/axis-addplotline/\n * Toggle the plot line from a button\n *\n * @function Highcharts.Axis#addPlotLine\n *\n * @param {Highcharts.AxisPlotLinesOptions} options\n * A configuration object for the plot line, as defined in\n * [xAxis.plotLines](https://api.highcharts.com/highcharts/xAxis.plotLines).\n *\n * @return {Highcharts.PlotLineOrBand|undefined}\n * The added plot line.\n */\n Additions.prototype.addPlotLine = function (options) {\n return this.addPlotBandOrLine(options, 'plotLines');\n };\n /**\n * Add a plot band or plot line after render time. Called from\n * addPlotBand and addPlotLine internally.\n *\n * @private\n * @function Highcharts.Axis#addPlotBandOrLine\n * @param {Highcharts.AxisPlotBandsOptions|Highcharts.AxisPlotLinesOptions} options\n * The plotBand or plotLine configuration object.\n */\n Additions.prototype.addPlotBandOrLine = function (options, coll) {\n var _this = this;\n var userOptions = this.userOptions;\n var obj = new PlotLineOrBandClass(this,\n options);\n if (this.visible) {\n obj = obj.render();\n }\n if (obj) { // #2189\n if (!this._addedPlotLB) {\n this._addedPlotLB = true;\n (userOptions.plotLines || [])\n .concat(userOptions.plotBands || [])\n .forEach(function (plotLineOptions) {\n _this.addPlotBandOrLine(plotLineOptions);\n });\n }\n // Add it to the user options for exporting and Axis.update\n if (coll) {\n // Workaround Microsoft/TypeScript issue #32693\n var updatedOptions = (userOptions[coll] || []);\n updatedOptions.push(options);\n userOptions[coll] = updatedOptions;\n }\n this.plotLinesAndBands.push(obj);\n }\n return obj;\n };\n /**\n * Remove a plot band or plot line from the chart by id. Called\n * internally from `removePlotBand` and `removePlotLine`.\n * @private\n * @function Highcharts.Axis#removePlotBandOrLine\n */\n Additions.prototype.removePlotBandOrLine = function (id) {\n var plotLinesAndBands = this.plotLinesAndBands,\n options = this.options,\n userOptions = this.userOptions;\n if (plotLinesAndBands) { // #15639\n var i_1 = plotLinesAndBands.length;\n while (i_1--) {\n if (plotLinesAndBands[i_1].id === id) {\n plotLinesAndBands[i_1].destroy();\n }\n }\n ([\n options.plotLines || [],\n userOptions.plotLines || [],\n options.plotBands || [],\n userOptions.plotBands || []\n ]).forEach(function (arr) {\n i_1 = arr.length;\n while (i_1--) {\n if ((arr[i_1] || {}).id === id) {\n erase(arr, arr[i_1]);\n }\n }\n });\n }\n };\n /**\n * Remove a plot band by its id.\n *\n * @sample highcharts/members/axis-removeplotband/\n * Remove plot band by id\n * @sample highcharts/members/axis-addplotband/\n * Toggle the plot band from a button\n *\n * @function Highcharts.Axis#removePlotBand\n *\n * @param {string} id\n * The plot band's `id` as given in the original configuration\n * object or in the `addPlotBand` option.\n */\n Additions.prototype.removePlotBand = function (id) {\n this.removePlotBandOrLine(id);\n };\n /**\n * Remove a plot line by its id.\n *\n * @sample highcharts/xaxis/plotlines-id/\n * Remove plot line by id\n * @sample highcharts/members/axis-addplotline/\n * Toggle the plot line from a button\n *\n * @function Highcharts.Axis#removePlotLine\n *\n * @param {string} id\n * The plot line's `id` as given in the original configuration\n * object or in the `addPlotLine` option.\n */\n Additions.prototype.removePlotLine = function (id) {\n this.removePlotBandOrLine(id);\n };\n return Additions;\n }());\n })(PlotLineOrBandAxis || (PlotLineOrBandAxis = {}));\n /* *\n *\n * Default Export\n *\n * */\n\n return PlotLineOrBandAxis;\n });\n _registerModule(_modules, 'Core/Axis/PlotLineOrBand/PlotLineOrBand.js', [_modules['Core/Axis/PlotLineOrBand/PlotLineOrBandAxis.js'], _modules['Core/Utilities.js']], function (PlotLineOrBandAxis, U) {\n /* *\n *\n * (c) 2010-2021 Torstein Honsi\n *\n * License: www.highcharts.com/license\n *\n * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!\n *\n * */\n var arrayMax = U.arrayMax,\n arrayMin = U.arrayMin,\n defined = U.defined,\n destroyObjectProperties = U.destroyObjectProperties,\n erase = U.erase,\n fireEvent = U.fireEvent,\n merge = U.merge,\n objectEach = U.objectEach,\n pick = U.pick;\n /* *\n *\n * Class\n *\n * */\n /**\n * The object wrapper for plot lines and plot bands\n *\n * @class\n * @name Highcharts.PlotLineOrBand\n *\n * @param {Highcharts.Axis} axis\n * Related axis.\n *\n * @param {Highcharts.AxisPlotLinesOptions|Highcharts.AxisPlotBandsOptions} [options]\n * Options to use.\n */\n var PlotLineOrBand = /** @class */ (function () {\n /* *\n *\n * Constructor\n *\n * */\n function PlotLineOrBand(axis, options) {\n this.axis = axis;\n if (options) {\n this.options = options;\n this.id = options.id;\n }\n }\n /* *\n *\n * Static Functions\n *\n * */\n PlotLineOrBand.compose = function (AxisClass) {\n return PlotLineOrBandAxis.compose(PlotLineOrBand, AxisClass);\n };\n /* *\n *\n * Functions\n *\n * */\n /* eslint-disable no-invalid-this, valid-jsdoc */\n /**\n * Render the plot line or plot band. If it is already existing,\n * move it.\n * @private\n * @function Highcharts.PlotLineOrBand#render\n */\n PlotLineOrBand.prototype.render = function () {\n fireEvent(this, 'render');\n var plotLine = this,\n axis = plotLine.axis,\n horiz = axis.horiz,\n log = axis.logarithmic,\n options = plotLine.options,\n color = options.color,\n zIndex = pick(options.zIndex, 0),\n events = options.events,\n groupAttribs = {},\n renderer = axis.chart.renderer;\n var optionsLabel = options.label,\n label = plotLine.label,\n to = options.to,\n from = options.from,\n value = options.value,\n svgElem = plotLine.svgElem,\n path = [],\n group;\n var isBand = defined(from) && defined(to),\n isLine = defined(value),\n isNew = !svgElem,\n attribs = {\n 'class': 'highcharts-plot-' + (isBand ? 'band ' : 'line ') +\n (options.className || '')\n };\n var groupName = isBand ? 'bands' : 'lines';\n // logarithmic conversion\n if (log) {\n from = log.log2lin(from);\n to = log.log2lin(to);\n value = log.log2lin(value);\n }\n // Set the presentational attributes\n if (!axis.chart.styledMode) {\n if (isLine) {\n attribs.stroke = color || \"#999999\" /* Palette.neutralColor40 */;\n attribs['stroke-width'] = pick(options.width, 1);\n if (options.dashStyle) {\n attribs.dashstyle =\n options.dashStyle;\n }\n }\n else if (isBand) { // plot band\n attribs.fill = color || \"#e6ebf5\" /* Palette.highlightColor10 */;\n if (options.borderWidth) {\n attribs.stroke = options.borderColor;\n attribs['stroke-width'] = options.borderWidth;\n }\n }\n }\n // Grouping and zIndex\n groupAttribs.zIndex = zIndex;\n groupName += '-' + zIndex;\n group = axis.plotLinesAndBandsGroups[groupName];\n if (!group) {\n axis.plotLinesAndBandsGroups[groupName] = group =\n renderer.g('plot-' + groupName)\n .attr(groupAttribs).add();\n }\n // Create the path\n if (isNew) {\n /**\n * SVG element of the plot line or band.\n *\n * @name Highcharts.PlotLineOrBand#svgElem\n * @type {Highcharts.SVGElement}\n */\n plotLine.svgElem = svgElem = renderer\n .path()\n .attr(attribs)\n .add(group);\n }\n // Set the path or return\n if (isLine) {\n path = axis.getPlotLinePath({\n value: value,\n lineWidth: svgElem.strokeWidth(),\n acrossPanes: options.acrossPanes\n });\n }\n else if (isBand) { // plot band\n path = axis.getPlotBandPath(from, to, options);\n }\n else {\n return;\n }\n // common for lines and bands\n // Add events only if they were not added before.\n if (!plotLine.eventsAdded && events) {\n objectEach(events, function (event, eventType) {\n svgElem.on(eventType, function (e) {\n events[eventType].apply(plotLine, [e]);\n });\n });\n plotLine.eventsAdded = true;\n }\n if ((isNew || !svgElem.d) && path && path.length) {\n svgElem.attr({ d: path });\n }\n else if (svgElem) {\n if (path) {\n svgElem.show();\n svgElem.animate({ d: path });\n }\n else if (svgElem.d) {\n svgElem.hide();\n if (label) {\n plotLine.label = label = label.destroy();\n }\n }\n }\n // the plot band/line label\n if (optionsLabel &&\n (defined(optionsLabel.text) || defined(optionsLabel.formatter)) &&\n path &&\n path.length &&\n axis.width > 0 &&\n axis.height > 0 &&\n !path.isFlat) {\n // apply defaults\n optionsLabel = merge({\n align: horiz && isBand && 'center',\n x: horiz ? !isBand && 4 : 10,\n verticalAlign: !horiz && isBand && 'middle',\n y: horiz ? isBand ? 16 : 10 : isBand ? 6 : -4,\n rotation: horiz && !isBand && 90\n }, optionsLabel);\n this.renderLabel(optionsLabel, path, isBand, zIndex);\n }\n else if (label) { // move out of sight\n label.hide();\n }\n // chainable\n return plotLine;\n };\n /**\n * Render and align label for plot line or band.\n * @private\n * @function Highcharts.PlotLineOrBand#renderLabel\n */\n PlotLineOrBand.prototype.renderLabel = function (optionsLabel, path, isBand, zIndex) {\n var plotLine = this,\n axis = plotLine.axis,\n renderer = axis.chart.renderer;\n var label = plotLine.label;\n // add the SVG element\n if (!label) {\n /**\n * SVG element of the label.\n *\n * @name Highcharts.PlotLineOrBand#label\n * @type {Highcharts.SVGElement}\n */\n plotLine.label = label = renderer\n .text(this.getLabelText(optionsLabel), 0, 0, optionsLabel.useHTML)\n .attr({\n align: optionsLabel.textAlign || optionsLabel.align,\n rotation: optionsLabel.rotation,\n 'class': 'highcharts-plot-' + (isBand ? 'band' : 'line') +\n '-label ' + (optionsLabel.className || ''),\n zIndex: zIndex\n })\n .add();\n if (!axis.chart.styledMode) {\n label.css(merge({\n textOverflow: 'ellipsis'\n }, optionsLabel.style));\n }\n }\n // get the bounding box and align the label\n // #3000 changed to better handle choice between plotband or plotline\n var xBounds = path.xBounds ||\n [path[0][1],\n path[1][1], (isBand ? path[2][1] : path[0][1])];\n var yBounds = path.yBounds ||\n [path[0][2],\n path[1][2], (isBand ? path[2][2] : path[0][2])];\n var x = arrayMin(xBounds);\n var y = arrayMin(yBounds);\n label.align(optionsLabel, false, {\n x: x,\n y: y,\n width: arrayMax(xBounds) - x,\n height: arrayMax(yBounds) - y\n });\n if (!label.alignValue || label.alignValue === 'left') {\n var width = optionsLabel.clip ?\n axis.width : axis.chart.chartWidth;\n label.css({\n width: (label.rotation === 90 ?\n axis.height - (label.alignAttr.y - axis.top) :\n width - (label.alignAttr.x - axis.left)) + 'px'\n });\n }\n label.show(true);\n };\n /**\n * Get label's text content.\n * @private\n * @function Highcharts.PlotLineOrBand#getLabelText\n */\n PlotLineOrBand.prototype.getLabelText = function (optionsLabel) {\n return defined(optionsLabel.formatter) ?\n optionsLabel.formatter\n .call(this) :\n optionsLabel.text;\n };\n /**\n * Remove the plot line or band.\n *\n * @function Highcharts.PlotLineOrBand#destroy\n */\n PlotLineOrBand.prototype.destroy = function () {\n // remove it from the lookup\n erase(this.axis.plotLinesAndBands, this);\n delete this.axis;\n destroyObjectProperties(this);\n };\n return PlotLineOrBand;\n }());\n /* *\n *\n * Default Export\n *\n * */\n /* *\n *\n * API Options\n *\n * */\n /**\n * Options for plot bands on axes.\n *\n * @typedef {Highcharts.XAxisPlotBandsOptions|Highcharts.YAxisPlotBandsOptions|Highcharts.ZAxisPlotBandsOptions} Highcharts.AxisPlotBandsOptions\n */\n /**\n * Options for plot band labels on axes.\n *\n * @typedef {Highcharts.XAxisPlotBandsLabelOptions|Highcharts.YAxisPlotBandsLabelOptions|Highcharts.ZAxisPlotBandsLabelOptions} Highcharts.AxisPlotBandsLabelOptions\n */\n /**\n * Options for plot lines on axes.\n *\n * @typedef {Highcharts.XAxisPlotLinesOptions|Highcharts.YAxisPlotLinesOptions|Highcharts.ZAxisPlotLinesOptions} Highcharts.AxisPlotLinesOptions\n */\n /**\n * Options for plot line labels on axes.\n *\n * @typedef {Highcharts.XAxisPlotLinesLabelOptions|Highcharts.YAxisPlotLinesLabelOptions|Highcharts.ZAxisPlotLinesLabelOptions} Highcharts.AxisPlotLinesLabelOptions\n */\n ('');\n /* *\n *\n * API Options\n *\n * */\n /**\n * An array of colored bands stretching across the plot area marking an\n * interval on the axis.\n *\n * In styled mode, the plot bands are styled by the `.highcharts-plot-band`\n * class in addition to the `className` option.\n *\n * @productdesc {highcharts}\n * In a gauge, a plot band on the Y axis (value axis) will stretch along the\n * perimeter of the gauge.\n *\n * @type {Array<*>}\n * @product highcharts highstock gantt\n * @apioption xAxis.plotBands\n */\n /**\n * Flag to decide if plotBand should be rendered across all panes.\n *\n * @since 7.1.2\n * @product highstock\n * @type {boolean}\n * @default true\n * @apioption xAxis.plotBands.acrossPanes\n */\n /**\n * Border color for the plot band. Also requires `borderWidth` to be set.\n *\n * @type {Highcharts.ColorString}\n * @apioption xAxis.plotBands.borderColor\n */\n /**\n * Border width for the plot band. Also requires `borderColor` to be set.\n *\n * @type {number}\n * @default 0\n * @apioption xAxis.plotBands.borderWidth\n */\n /**\n * A custom class name, in addition to the default `highcharts-plot-band`,\n * to apply to each individual band.\n *\n * @type {string}\n * @since 5.0.0\n * @apioption xAxis.plotBands.className\n */\n /**\n * The color of the plot band.\n *\n * @sample {highcharts} highcharts/xaxis/plotbands-color/\n * Color band\n * @sample {highstock} stock/xaxis/plotbands/\n * Plot band on Y axis\n *\n * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}\n * @default #e6ebf5\n * @apioption xAxis.plotBands.color\n */\n /**\n * An object defining mouse events for the plot band. Supported properties\n * are `click`, `mouseover`, `mouseout`, `mousemove`.\n *\n * @sample {highcharts} highcharts/xaxis/plotbands-events/\n * Mouse events demonstrated\n *\n * @since 1.2\n * @apioption xAxis.plotBands.events\n */\n /**\n * Click event on a plot band.\n *\n * @type {Highcharts.EventCallbackFunction}\n * @apioption xAxis.plotBands.events.click\n */\n /**\n * Mouse move event on a plot band.\n *\n * @type {Highcharts.EventCallbackFunction}\n * @apioption xAxis.plotBands.events.mousemove\n */\n /**\n * Mouse out event on the corner of a plot band.\n *\n * @type {Highcharts.EventCallbackFunction}\n * @apioption xAxis.plotBands.events.mouseout\n */\n /**\n * Mouse over event on a plot band.\n *\n * @type {Highcharts.EventCallbackFunction}\n * @apioption xAxis.plotBands.events.mouseover\n */\n /**\n * The start position of the plot band in axis units.\n *\n * @sample {highcharts} highcharts/xaxis/plotbands-color/\n * Datetime axis\n * @sample {highcharts} highcharts/xaxis/plotbands-from/\n * Categorized axis\n * @sample {highstock} stock/xaxis/plotbands/\n * Plot band on Y axis\n *\n * @type {number}\n * @apioption xAxis.plotBands.from\n */\n /**\n * An id used for identifying the plot band in Axis.removePlotBand.\n *\n * @sample {highcharts} highcharts/xaxis/plotbands-id/\n * Remove plot band by id\n * @sample {highstock} highcharts/xaxis/plotbands-id/\n * Remove plot band by id\n *\n * @type {string}\n * @apioption xAxis.plotBands.id\n */\n /**\n * The end position of the plot band in axis units.\n *\n * @sample {highcharts} highcharts/xaxis/plotbands-color/\n * Datetime axis\n * @sample {highcharts} highcharts/xaxis/plotbands-from/\n * Categorized axis\n * @sample {highstock} stock/xaxis/plotbands/\n * Plot band on Y axis\n *\n * @type {number}\n * @apioption xAxis.plotBands.to\n */\n /**\n * The z index of the plot band within the chart, relative to other\n * elements. Using the same z index as another element may give\n * unpredictable results, as the last rendered element will be on top.\n * Values from 0 to 20 make sense.\n *\n * @sample {highcharts} highcharts/xaxis/plotbands-color/\n * Behind plot lines by default\n * @sample {highcharts} highcharts/xaxis/plotbands-zindex/\n * Above plot lines\n * @sample {highcharts} highcharts/xaxis/plotbands-zindex-above-series/\n * Above plot lines and series\n *\n * @type {number}\n * @since 1.2\n * @apioption xAxis.plotBands.zIndex\n */\n /**\n * Text labels for the plot bands\n *\n * @product highcharts highstock gantt\n * @apioption xAxis.plotBands.label\n */\n /**\n * Horizontal alignment of the label. Can be one of \"left\", \"center\" or\n * \"right\".\n *\n * @sample {highcharts} highcharts/xaxis/plotbands-label-align/\n * Aligned to the right\n * @sample {highstock} stock/xaxis/plotbands-label/\n * Plot band with labels\n *\n * @type {Highcharts.AlignValue}\n * @default center\n * @since 2.1\n * @apioption xAxis.plotBands.label.align\n */\n /**\n * Rotation of the text label in degrees .\n *\n * @sample {highcharts} highcharts/xaxis/plotbands-label-rotation/\n * Vertical text\n *\n * @type {number}\n * @default 0\n * @since 2.1\n * @apioption xAxis.plotBands.label.rotation\n */\n /**\n * CSS styles for the text label.\n *\n * In styled mode, the labels are styled by the\n * `.highcharts-plot-band-label` class.\n *\n * @sample {highcharts} highcharts/xaxis/plotbands-label-style/\n * Blue and bold label\n *\n * @type {Highcharts.CSSObject}\n * @since 2.1\n * @apioption xAxis.plotBands.label.style\n */\n /**\n * The string text itself. A subset of HTML is supported.\n *\n * @type {string}\n * @since 2.1\n * @apioption xAxis.plotBands.label.text\n */\n /**\n * The text alignment for the label. While `align` determines where the\n * texts anchor point is placed within the plot band, `textAlign` determines\n * how the text is aligned against its anchor point. Possible values are\n * \"left\", \"center\" and \"right\". Defaults to the same as the `align` option.\n *\n * @sample {highcharts} highcharts/xaxis/plotbands-label-rotation/\n * Vertical text in center position but text-aligned left\n *\n * @type {Highcharts.AlignValue}\n * @since 2.1\n * @apioption xAxis.plotBands.label.textAlign\n */\n /**\n * Whether to [use HTML](https://www.highcharts.com/docs/chart-concepts/labels-and-string-formatting#html)\n * to render the labels.\n *\n * @type {boolean}\n * @default false\n * @since 3.0.3\n * @apioption xAxis.plotBands.label.useHTML\n */\n /**\n * Vertical alignment of the label relative to the plot band. Can be one of\n * \"top\", \"middle\" or \"bottom\".\n *\n * @sample {highcharts} highcharts/xaxis/plotbands-label-verticalalign/\n * Vertically centered label\n * @sample {highstock} stock/xaxis/plotbands-label/\n * Plot band with labels\n *\n * @type {Highcharts.VerticalAlignValue}\n * @default top\n * @since 2.1\n * @apioption xAxis.plotBands.label.verticalAlign\n */\n /**\n * Horizontal position relative the alignment. Default varies by\n * orientation.\n *\n * @sample {highcharts} highcharts/xaxis/plotbands-label-align/\n * Aligned 10px from the right edge\n * @sample {highstock} stock/xaxis/plotbands-label/\n * Plot band with labels\n *\n * @type {number}\n * @since 2.1\n * @apioption xAxis.plotBands.label.x\n */\n /**\n * Vertical position of the text baseline relative to the alignment. Default\n * varies by orientation.\n *\n * @sample {highcharts} highcharts/xaxis/plotbands-label-y/\n * Label on x axis\n * @sample {highstock} stock/xaxis/plotbands-label/\n * Plot band with labels\n *\n * @type {number}\n * @since 2.1\n * @apioption xAxis.plotBands.label.y\n */\n /**\n * An array of lines stretching across the plot area, marking a specific\n * value on one of the axes.\n *\n * In styled mode, the plot lines are styled by the\n * `.highcharts-plot-line` class in addition to the `className` option.\n *\n * @type {Array<*>}\n * @product highcharts highstock gantt\n * @sample {highcharts} highcharts/xaxis/plotlines-color/\n * Basic plot line\n * @sample {highcharts} highcharts/series-solidgauge/labels-auto-aligned/\n * Solid gauge plot line\n * @apioption xAxis.plotLines\n */\n /**\n * Flag to decide if plotLine should be rendered across all panes.\n *\n * @sample {highstock} stock/xaxis/plotlines-acrosspanes/\n * Plot lines on different panes\n *\n * @since 7.1.2\n * @product highstock\n * @type {boolean}\n * @default true\n * @apioption xAxis.plotLines.acrossPanes\n */\n /**\n * A custom class name, in addition to the default `highcharts-plot-line`,\n * to apply to each individual line.\n *\n * @type {string}\n * @since 5.0.0\n * @apioption xAxis.plotLines.className\n */\n /**\n * The color of the line.\n *\n * @sample {highcharts} highcharts/xaxis/plotlines-color/\n * A red line from X axis\n * @sample {highstock} stock/xaxis/plotlines/\n * Plot line on Y axis\n *\n * @type {Highcharts.ColorString}\n * @default #999999\n * @apioption xAxis.plotLines.color\n */\n /**\n * The dashing or dot style for the plot line. For possible values see\n * [this overview](https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/plotoptions/series-dashstyle-all/).\n *\n * @sample {highcharts} highcharts/xaxis/plotlines-dashstyle/\n * Dash and dot pattern\n * @sample {highstock} stock/xaxis/plotlines/\n * Plot line on Y axis\n *\n * @type {Highcharts.DashStyleValue}\n * @default Solid\n * @since 1.2\n * @apioption xAxis.plotLines.dashStyle\n */\n /**\n * An object defining mouse events for the plot line. Supported\n * properties are `click`, `mouseover`, `mouseout`, `mousemove`.\n *\n * @sample {highcharts} highcharts/xaxis/plotlines-events/\n * Mouse events demonstrated\n *\n * @since 1.2\n * @apioption xAxis.plotLines.events\n */\n /**\n * Click event on a plot band.\n *\n * @type {Highcharts.EventCallbackFunction}\n * @apioption xAxis.plotLines.events.click\n */\n /**\n * Mouse move event on a plot band.\n *\n * @type {Highcharts.EventCallbackFunction}\n * @apioption xAxis.plotLines.events.mousemove\n */\n /**\n * Mouse out event on the corner of a plot band.\n *\n * @type {Highcharts.EventCallbackFunction}\n * @apioption xAxis.plotLines.events.mouseout\n */\n /**\n * Mouse over event on a plot band.\n *\n * @type {Highcharts.EventCallbackFunction}\n * @apioption xAxis.plotLines.events.mouseover\n */\n /**\n * An id used for identifying the plot line in Axis.removePlotLine.\n *\n * @sample {highcharts} highcharts/xaxis/plotlines-id/\n * Remove plot line by id\n *\n * @type {string}\n * @apioption xAxis.plotLines.id\n */\n /**\n * The position of the line in axis units.\n *\n * @sample {highcharts} highcharts/xaxis/plotlines-color/\n * Between two categories on X axis\n * @sample {highstock} stock/xaxis/plotlines/\n * Plot line on Y axis\n *\n * @type {number}\n * @apioption xAxis.plotLines.value\n */\n /**\n * The width or thickness of the plot line.\n *\n * @sample {highcharts} highcharts/xaxis/plotlines-color/\n * 2px wide line from X axis\n * @sample {highstock} stock/xaxis/plotlines/\n * Plot line on Y axis\n *\n * @type {number}\n * @default 2\n * @apioption xAxis.plotLines.width\n */\n /**\n * The z index of the plot line within the chart.\n *\n * @sample {highcharts} highcharts/xaxis/plotlines-zindex-behind/\n * Behind plot lines by default\n * @sample {highcharts} highcharts/xaxis/plotlines-zindex-above/\n * Above plot lines\n * @sample {highcharts} highcharts/xaxis/plotlines-zindex-above-all/\n * Above plot lines and series\n *\n * @type {number}\n * @since 1.2\n * @apioption xAxis.plotLines.zIndex\n */\n /**\n * Text labels for the plot bands\n *\n * @apioption xAxis.plotLines.label\n */\n /**\n * Horizontal alignment of the label. Can be one of \"left\", \"center\" or\n * \"right\".\n *\n * @sample {highcharts} highcharts/xaxis/plotlines-label-align-right/\n * Aligned to the right\n * @sample {highstock} stock/xaxis/plotlines/\n * Plot line on Y axis\n *\n * @type {Highcharts.AlignValue}\n * @default left\n * @since 2.1\n * @apioption xAxis.plotLines.label.align\n */\n /**\n * Whether to hide labels that are outside the plot area.\n *\n * @type {boolean}\n * @default false\n * @since 10.3.3\n * @apioption xAxis.plotLines.labels.clip\n */\n /**\n * Callback JavaScript function to format the label. Useful properties like\n * the value of plot line or the range of plot band (`from` & `to`\n * properties) can be found in `this.options` object.\n *\n * @sample {highcharts} highcharts/xaxis/plotlines-plotbands-label-formatter\n * Label formatters for plot line and plot band.\n * @type {Highcharts.FormatterCallbackFunction}\n * @apioption xAxis.plotLines.label.formatter\n */\n /**\n * Rotation of the text label in degrees. Defaults to 0 for horizontal plot\n * lines and 90 for vertical lines.\n *\n * @sample {highcharts} highcharts/xaxis/plotlines-label-verticalalign-middle/\n * Slanted text\n *\n * @type {number}\n * @since 2.1\n * @apioption xAxis.plotLines.label.rotation\n */\n /**\n * CSS styles for the text label.\n *\n * In styled mode, the labels are styled by the\n * `.highcharts-plot-line-label` class.\n *\n * @sample {highcharts} highcharts/xaxis/plotlines-label-style/\n * Blue and bold label\n *\n * @type {Highcharts.CSSObject}\n * @since 2.1\n * @apioption xAxis.plotLines.label.style\n */\n /**\n * The text itself. A subset of HTML is supported.\n *\n * @type {string}\n * @since 2.1\n * @apioption xAxis.plotLines.label.text\n */\n /**\n * The text alignment for the label. While `align` determines where the\n * texts anchor point is placed within the plot band, `textAlign` determines\n * how the text is aligned against its anchor point. Possible values are\n * \"left\", \"center\" and \"right\". Defaults to the same as the `align` option.\n *\n * @sample {highcharts} highcharts/xaxis/plotlines-label-textalign/\n * Text label in bottom position\n *\n * @type {Highcharts.AlignValue}\n * @since 2.1\n * @apioption xAxis.plotLines.label.textAlign\n */\n /**\n * Whether to [use HTML](https://www.highcharts.com/docs/chart-concepts/labels-and-string-formatting#html)\n * to render the labels.\n *\n * @type {boolean}\n * @default false\n * @since 3.0.3\n * @apioption xAxis.plotLines.label.useHTML\n */\n /**\n * Vertical alignment of the label relative to the plot line. Can be\n * one of \"top\", \"middle\" or \"bottom\".\n *\n * @sample {highcharts} highcharts/xaxis/plotlines-label-verticalalign-middle/\n * Vertically centered label\n *\n * @type {Highcharts.VerticalAlignValue}\n * @default {highcharts} top\n * @default {highstock} top\n * @since 2.1\n * @apioption xAxis.plotLines.label.verticalAlign\n */\n /**\n * Horizontal position relative the alignment. Default varies by\n * orientation.\n *\n * @sample {highcharts} highcharts/xaxis/plotlines-label-align-right/\n * Aligned 10px from the right edge\n * @sample {highstock} stock/xaxis/plotlines/\n * Plot line on Y axis\n *\n * @type {number}\n * @since 2.1\n * @apioption xAxis.plotLines.label.x\n */\n /**\n * Vertical position of the text baseline relative to the alignment. Default\n * varies by orientation.\n *\n * @sample {highcharts} highcharts/xaxis/plotlines-label-y/\n * Label below the plot line\n * @sample {highstock} stock/xaxis/plotlines/\n * Plot line on Y axis\n *\n * @type {number}\n * @since 2.1\n * @apioption xAxis.plotLines.label.y\n */\n /**\n * @type {Array<*>}\n * @extends xAxis.plotBands\n * @apioption yAxis.plotBands\n */\n /**\n * In a gauge chart, this option determines the inner radius of the\n * plot band that stretches along the perimeter. It can be given as\n * a percentage string, like `\"100%\"`, or as a pixel number, like `100`.\n * By default, the inner radius is controlled by the [thickness](\n * #yAxis.plotBands.thickness) option.\n *\n * @sample {highcharts} highcharts/xaxis/plotbands-gauge\n * Gauge plot band\n *\n * @type {number|string}\n * @since 2.3\n * @product highcharts\n * @apioption yAxis.plotBands.innerRadius\n */\n /**\n * In a gauge chart, this option determines the outer radius of the\n * plot band that stretches along the perimeter. It can be given as\n * a percentage string, like `\"100%\"`, or as a pixel number, like `100`.\n *\n * @sample {highcharts} highcharts/xaxis/plotbands-gauge\n * Gauge plot band\n *\n * @type {number|string}\n * @default 100%\n * @since 2.3\n * @product highcharts\n * @apioption yAxis.plotBands.outerRadius\n */\n /**\n * In a gauge chart, this option sets the width of the plot band\n * stretching along the perimeter. It can be given as a percentage\n * string, like `\"10%\"`, or as a pixel number, like `10`. The default\n * value 10 is the same as the default [tickLength](#yAxis.tickLength),\n * thus making the plot band act as a background for the tick markers.\n *\n * @sample {highcharts} highcharts/xaxis/plotbands-gauge\n * Gauge plot band\n *\n * @type {number|string}\n * @default 10\n * @since 2.3\n * @product highcharts\n * @apioption yAxis.plotBands.thickness\n */\n /**\n * @type {Array<*>}\n * @extends xAxis.plotLines\n * @apioption yAxis.plotLines\n */\n (''); // keeps doclets above in JS file\n\n return PlotLineOrBand;\n });\n _registerModule(_modules, 'Core/Tooltip.js', [_modules['Core/FormatUtilities.js'], _modules['Core/Globals.js'], _modules['Core/Renderer/RendererUtilities.js'], _modules['Core/Renderer/RendererRegistry.js'], _modules['Core/Utilities.js']], function (F, H, R, RendererRegistry, U) {\n /* *\n *\n * (c) 2010-2021 Torstein Honsi\n *\n * License: www.highcharts.com/license\n *\n * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!\n *\n * */\n var format = F.format;\n var doc = H.doc;\n var distribute = R.distribute;\n var addEvent = U.addEvent,\n clamp = U.clamp,\n css = U.css,\n defined = U.defined,\n discardElement = U.discardElement,\n extend = U.extend,\n fireEvent = U.fireEvent,\n isArray = U.isArray,\n isNumber = U.isNumber,\n isString = U.isString,\n merge = U.merge,\n pick = U.pick,\n splat = U.splat,\n syncTimeout = U.syncTimeout;\n /* *\n *\n * Class\n *\n * */\n /* eslint-disable no-invalid-this, valid-jsdoc */\n /**\n * Tooltip of a chart.\n *\n * @class\n * @name Highcharts.Tooltip\n *\n * @param {Highcharts.Chart} chart\n * The chart instance.\n *\n * @param {Highcharts.TooltipOptions} options\n * Tooltip options.\n */\n var Tooltip = /** @class */ (function () {\n /* *\n *\n * Constructors\n *\n * */\n function Tooltip(chart, options) {\n /* *\n *\n * Properties\n *\n * */\n this.allowShared = true;\n this.container = void 0;\n this.crosshairs = [];\n this.distance = 0;\n this.isHidden = true;\n this.isSticky = false;\n this.now = {};\n this.options = {};\n this.outside = false;\n this.chart = chart;\n this.init(chart, options);\n }\n /* *\n *\n * Functions\n *\n * */\n /**\n * In styled mode, apply the default filter for the tooltip drop-shadow. It\n * needs to have an id specific to the chart, otherwise there will be issues\n * when one tooltip adopts the filter of a different chart, specifically one\n * where the container is hidden.\n *\n * @private\n * @function Highcharts.Tooltip#applyFilter\n */\n Tooltip.prototype.applyFilter = function () {\n var chart = this.chart;\n chart.renderer.definition({\n tagName: 'filter',\n attributes: {\n id: 'drop-shadow-' + chart.index,\n opacity: 0.5\n },\n children: [{\n tagName: 'feGaussianBlur',\n attributes: {\n 'in': 'SourceAlpha',\n stdDeviation: 1\n }\n }, {\n tagName: 'feOffset',\n attributes: {\n dx: 1,\n dy: 1\n }\n }, {\n tagName: 'feComponentTransfer',\n children: [{\n tagName: 'feFuncA',\n attributes: {\n type: 'linear',\n slope: 0.3\n }\n }]\n }, {\n tagName: 'feMerge',\n children: [{\n tagName: 'feMergeNode'\n }, {\n tagName: 'feMergeNode',\n attributes: {\n 'in': 'SourceGraphic'\n }\n }]\n }]\n });\n };\n /**\n * Build the body (lines) of the tooltip by iterating over the items and\n * returning one entry for each item, abstracting this functionality allows\n * to easily overwrite and extend it.\n *\n * @private\n * @function Highcharts.Tooltip#bodyFormatter\n */\n Tooltip.prototype.bodyFormatter = function (items) {\n return items.map(function (item) {\n var tooltipOptions = item.series.tooltipOptions;\n return (tooltipOptions[(item.point.formatPrefix || 'point') + 'Formatter'] ||\n item.point.tooltipFormatter).call(item.point, tooltipOptions[(item.point.formatPrefix || 'point') + 'Format'] || '');\n });\n };\n /**\n * Destroy the single tooltips in a split tooltip.\n * If the tooltip is active then it is not destroyed, unless forced to.\n *\n * @private\n * @function Highcharts.Tooltip#cleanSplit\n *\n * @param {boolean} [force]\n * Force destroy all tooltips.\n */\n Tooltip.prototype.cleanSplit = function (force) {\n this.chart.series.forEach(function (series) {\n var tt = series && series.tt;\n if (tt) {\n if (!tt.isActive || force) {\n series.tt = tt.destroy();\n }\n else {\n tt.isActive = false;\n }\n }\n });\n };\n /**\n * In case no user defined formatter is given, this will be used. Note that\n * the context here is an object holding point, series, x, y etc.\n *\n * @function Highcharts.Tooltip#defaultFormatter\n *\n * @param {Highcharts.Tooltip} tooltip\n *\n * @return {string|Array}\n * Returns a string (single tooltip and shared)\n * or an array of strings (split tooltip)\n */\n Tooltip.prototype.defaultFormatter = function (tooltip) {\n var items = this.points || splat(this);\n var s;\n // Build the header\n s = [tooltip.tooltipFooterHeaderFormatter(items[0])];\n // build the values\n s = s.concat(tooltip.bodyFormatter(items));\n // footer\n s.push(tooltip.tooltipFooterHeaderFormatter(items[0], true));\n return s;\n };\n /**\n * Removes and destroys the tooltip and its elements.\n *\n * @function Highcharts.Tooltip#destroy\n */\n Tooltip.prototype.destroy = function () {\n // Destroy and clear local variables\n if (this.label) {\n this.label = this.label.destroy();\n }\n if (this.split && this.tt) {\n this.cleanSplit(true);\n this.tt = this.tt.destroy();\n }\n if (this.renderer) {\n this.renderer = this.renderer.destroy();\n discardElement(this.container);\n }\n U.clearTimeout(this.hideTimer);\n U.clearTimeout(this.tooltipTimeout);\n };\n /**\n * Extendable method to get the anchor position of the tooltip\n * from a point or set of points\n *\n * @private\n * @function Highcharts.Tooltip#getAnchor\n */\n Tooltip.prototype.getAnchor = function (points, mouseEvent) {\n var chart = this.chart,\n pointer = chart.pointer,\n inverted = chart.inverted,\n plotTop = chart.plotTop,\n plotLeft = chart.plotLeft;\n var ret;\n points = splat(points);\n // If reversedStacks are false the tooltip position should be taken from\n // the last point (#17948)\n if (points[0].series &&\n points[0].series.yAxis &&\n !points[0].series.yAxis.options.reversedStacks) {\n points = points.slice().reverse();\n }\n // When tooltip follows mouse, relate the position to the mouse\n if (this.followPointer && mouseEvent) {\n if (typeof mouseEvent.chartX === 'undefined') {\n mouseEvent = pointer.normalize(mouseEvent);\n }\n ret = [\n mouseEvent.chartX - plotLeft,\n mouseEvent.chartY - plotTop\n ];\n // Some series types use a specificly calculated tooltip position for\n // each point\n }\n else if (points[0].tooltipPos) {\n ret = points[0].tooltipPos;\n // Calculate the average position and adjust for axis positions\n }\n else {\n var chartX_1 = 0,\n chartY_1 = 0;\n points.forEach(function (point) {\n var pos = point.pos(true);\n if (pos) {\n chartX_1 += pos[0];\n chartY_1 += pos[1];\n }\n });\n chartX_1 /= points.length;\n chartY_1 /= points.length;\n // When shared, place the tooltip next to the mouse (#424)\n if (this.shared && points.length > 1 && mouseEvent) {\n if (inverted) {\n chartX_1 = mouseEvent.chartX;\n }\n else {\n chartY_1 = mouseEvent.chartY;\n }\n }\n // Use the average position for multiple points\n ret = [chartX_1 - plotLeft, chartY_1 - plotTop];\n }\n return ret.map(Math.round);\n };\n /**\n * Get the CSS class names for the tooltip's label. Styles the label\n * by `colorIndex` or user-defined CSS.\n *\n * @function Highcharts.Tooltip#getClassName\n *\n * @return {string}\n * The class names.\n */\n Tooltip.prototype.getClassName = function (point, isSplit, isHeader) {\n var options = this.options,\n series = point.series,\n seriesOptions = series.options;\n return [\n options.className,\n 'highcharts-label',\n isHeader && 'highcharts-tooltip-header',\n isSplit ? 'highcharts-tooltip-box' : 'highcharts-tooltip',\n !isHeader && 'highcharts-color-' + pick(point.colorIndex, series.colorIndex),\n (seriesOptions && seriesOptions.className)\n ].filter(isString).join(' ');\n };\n /**\n * Creates the Tooltip label element if it does not exist, then returns it.\n *\n * @function Highcharts.Tooltip#getLabel\n *\n * @return {Highcharts.SVGElement}\n * Tooltip label\n */\n Tooltip.prototype.getLabel = function () {\n var tooltip = this,\n styledMode = this.chart.styledMode,\n options = this.options,\n doSplit = this.split && this.allowShared,\n pointerEvents = (options.style.pointerEvents ||\n (this.shouldStickOnContact() ? 'auto' : 'none'));\n var container,\n renderer = this.chart.renderer;\n // If changing from a split tooltip to a non-split tooltip, we must\n // destroy it in order to get the SVG right. #13868.\n if (tooltip.label) {\n var wasSplit = !tooltip.label.hasClass('highcharts-label');\n if ((doSplit && !wasSplit) || (!doSplit && wasSplit)) {\n tooltip.destroy();\n }\n }\n if (!this.label) {\n if (this.outside) {\n var chartStyle = this.chart.options.chart.style,\n Renderer = RendererRegistry.getRendererType();\n /**\n * Reference to the tooltip's container, when\n * [Highcharts.Tooltip#outside] is set to true, otherwise\n * it's undefined.\n *\n * @name Highcharts.Tooltip#container\n * @type {Highcharts.HTMLDOMElement|undefined}\n */\n this.container = container = H.doc.createElement('div');\n container.className = 'highcharts-tooltip-container';\n css(container, {\n position: 'absolute',\n top: '1px',\n pointerEvents: pointerEvents,\n zIndex: Math.max(this.options.style.zIndex || 0, (chartStyle && chartStyle.zIndex || 0) + 3)\n });\n H.doc.body.appendChild(container);\n /**\n * Reference to the tooltip's renderer, when\n * [Highcharts.Tooltip#outside] is set to true, otherwise\n * it's undefined.\n *\n * @name Highcharts.Tooltip#renderer\n * @type {Highcharts.SVGRenderer|undefined}\n */\n this.renderer = renderer = new Renderer(container, 0, 0, chartStyle, void 0, void 0, renderer.styledMode);\n }\n // Create the label\n if (doSplit) {\n this.label = renderer.g('tooltip');\n }\n else {\n this.label = renderer\n .label('', 0, 0, options.shape, void 0, void 0, options.useHTML, void 0, 'tooltip')\n .attr({\n padding: options.padding,\n r: options.borderRadius\n });\n if (!styledMode) {\n this.label\n .attr({\n fill: options.backgroundColor,\n 'stroke-width': options.borderWidth\n })\n // #2301, #2657\n .css(options.style)\n .css({ pointerEvents: pointerEvents })\n .shadow(options.shadow);\n }\n }\n if (styledMode && options.shadow) {\n // Apply the drop-shadow filter\n this.applyFilter();\n this.label.attr({\n filter: 'url(#drop-shadow-' + this.chart.index + ')'\n });\n }\n // Split tooltip use updateTooltipContainer to position the tooltip\n // container.\n if (tooltip.outside && !tooltip.split) {\n var label_1 = this.label;\n var xSetter_1 = label_1.xSetter,\n ySetter_1 = label_1.ySetter;\n label_1.xSetter = function (value) {\n xSetter_1.call(label_1, tooltip.distance);\n container.style.left = value + 'px';\n };\n label_1.ySetter = function (value) {\n ySetter_1.call(label_1, tooltip.distance);\n container.style.top = value + 'px';\n };\n }\n this.label\n .attr({ zIndex: 8 })\n .add();\n }\n return this.label;\n };\n /**\n * Place the tooltip in a chart without spilling over and not covering the\n * point itself.\n *\n * @function Highcharts.Tooltip#getPosition\n *\n * @param {number} boxWidth\n * Width of the tooltip box.\n *\n * @param {number} boxHeight\n * Height of the tooltip box.\n *\n * @param {Highcharts.Point} point\n * Tooltip related point.\n *\n * @return {Highcharts.PositionObject}\n * Recommended position of the tooltip.\n */\n Tooltip.prototype.getPosition = function (boxWidth, boxHeight, point) {\n var chart = this.chart,\n distance = this.distance,\n ret = {}, \n // Don't use h if chart isn't inverted (#7242) ???\n h = (chart.inverted && point.h) || 0, // #4117 ???\n outside = this.outside,\n outerWidth = outside ?\n // substract distance to prevent scrollbars\n doc.documentElement.clientWidth - 2 * distance :\n chart.chartWidth,\n outerHeight = outside ?\n Math.max(doc.body.scrollHeight,\n doc.documentElement.scrollHeight,\n doc.body.offsetHeight,\n doc.documentElement.offsetHeight,\n doc.documentElement.clientHeight) :\n chart.chartHeight,\n chartPosition = chart.pointer.getChartPosition(),\n scaleX = function (val) { return ( // eslint-disable-line no-confusing-arrow\n val * chartPosition.scaleX); },\n scaleY = function (val) { return ( // eslint-disable-line no-confusing-arrow\n val * chartPosition.scaleY); }, \n // Build parameter arrays for firstDimension()/secondDimension()\n buildDimensionArray = function (dim) {\n var isX = dim === 'x';\n return [\n dim,\n isX ? outerWidth : outerHeight,\n isX ? boxWidth : boxHeight\n ].concat(outside ? [\n // If we are using tooltip.outside, we need to scale the\n // position to match scaling of the container in case there\n // is a transform/zoom on the container. #11329\n isX ? scaleX(boxWidth) : scaleY(boxHeight),\n isX ? chartPosition.left - distance +\n scaleX(point.plotX + chart.plotLeft) :\n chartPosition.top - distance +\n scaleY(point.plotY + chart.plotTop),\n 0,\n isX ? outerWidth : outerHeight\n ] : [\n // Not outside, no scaling is needed\n isX ? boxWidth : boxHeight,\n isX ? point.plotX + chart.plotLeft :\n point.plotY + chart.plotTop,\n isX ? chart.plotLeft : chart.plotTop,\n isX ? chart.plotLeft + chart.plotWidth :\n chart.plotTop + chart.plotHeight\n ]);\n };\n var first = buildDimensionArray('y'), second = buildDimensionArray('x'), swapped;\n // Handle negative points or reversed axis (#13780)\n var flipped = !!point.negative;\n if (!chart.polar &&\n chart.hoverSeries &&\n chart.hoverSeries.yAxis &&\n chart.hoverSeries.yAxis.reversed) {\n flipped = !flipped;\n }\n // The far side is right or bottom\n var preferFarSide = !this.followPointer &&\n pick(point.ttBelow, !chart.inverted === flipped), // #4984\n /*\n * Handle the preferred dimension. When the preferred dimension is\n * tooltip on top or bottom of the point,\n it will look for space\n * there.\n *\n * @private\n */\n firstDimension = function (dim,\n outerSize,\n innerSize,\n scaledInnerSize, // #11329\n point,\n min,\n max) {\n var scaledDist = outside ?\n (dim === 'y' ? scaleY(distance) : scaleX(distance)) :\n distance,\n scaleDiff = (innerSize - scaledInnerSize) / 2,\n roomLeft = scaledInnerSize < point - distance,\n roomRight = point + distance + scaledInnerSize < outerSize,\n alignedLeft = point - scaledDist - innerSize + scaleDiff,\n alignedRight = point + scaledDist - scaleDiff;\n if (preferFarSide && roomRight) {\n ret[dim] = alignedRight;\n }\n else if (!preferFarSide && roomLeft) {\n ret[dim] = alignedLeft;\n }\n else if (roomLeft) {\n ret[dim] = Math.min(max - scaledInnerSize, alignedLeft - h < 0 ? alignedLeft : alignedLeft - h);\n }\n else if (roomRight) {\n ret[dim] = Math.max(min, alignedRight + h + innerSize > outerSize ?\n alignedRight :\n alignedRight + h);\n }\n else {\n return false;\n }\n }, \n /*\n * Handle the secondary dimension. If the preferred dimension is\n * tooltip on top or bottom of the point, the second dimension is to\n * align the tooltip above the point, trying to align center but\n * allowing left or right align within the chart box.\n *\n * @private\n */\n secondDimension = function (dim, outerSize, innerSize, scaledInnerSize, // #11329\n point) {\n var retVal;\n // Too close to the edge, return false and swap dimensions\n if (point < distance || point > outerSize - distance) {\n retVal = false;\n // Align left/top\n }\n else if (point < innerSize / 2) {\n ret[dim] = 1;\n // Align right/bottom\n }\n else if (point > outerSize - scaledInnerSize / 2) {\n ret[dim] = outerSize - scaledInnerSize - 2;\n // Align center\n }\n else {\n ret[dim] = point - innerSize / 2;\n }\n return retVal;\n }, \n /*\n * Swap the dimensions\n */\n swap = function (count) {\n var temp = first;\n first = second;\n second = temp;\n swapped = count;\n }, run = function () {\n if (firstDimension.apply(0, first) !== false) {\n if (secondDimension.apply(0, second) === false &&\n !swapped) {\n swap(true);\n run();\n }\n }\n else if (!swapped) {\n swap(true);\n run();\n }\n else {\n ret.x = ret.y = 0;\n }\n };\n // Under these conditions, prefer the tooltip on the side of the point\n if (chart.inverted || this.len > 1) {\n swap();\n }\n run();\n return ret;\n };\n /**\n * Hides the tooltip with a fade out animation.\n *\n * @function Highcharts.Tooltip#hide\n *\n * @param {number} [delay]\n * The fade out in milliseconds. If no value is provided the value\n * of the tooltip.hideDelay option is used. A value of 0 disables\n * the fade out animation.\n */\n Tooltip.prototype.hide = function (delay) {\n var tooltip = this;\n // disallow duplicate timers (#1728, #1766)\n U.clearTimeout(this.hideTimer);\n delay = pick(delay, this.options.hideDelay);\n if (!this.isHidden) {\n this.hideTimer = syncTimeout(function () {\n // If there is a delay, do fadeOut with the default duration. If\n // the hideDelay is 0, we assume no animation is wanted, so we\n // pass 0 duration. #12994.\n tooltip.getLabel().fadeOut(delay ? void 0 : delay);\n tooltip.isHidden = true;\n }, delay);\n }\n };\n /**\n * @private\n * @function Highcharts.Tooltip#init\n *\n * @param {Highcharts.Chart} chart\n * The chart instance.\n *\n * @param {Highcharts.TooltipOptions} options\n * Tooltip options.\n */\n Tooltip.prototype.init = function (chart, options) {\n /**\n * Chart of the tooltip.\n *\n * @readonly\n * @name Highcharts.Tooltip#chart\n * @type {Highcharts.Chart}\n */\n this.chart = chart;\n /**\n * Used tooltip options.\n *\n * @readonly\n * @name Highcharts.Tooltip#options\n * @type {Highcharts.TooltipOptions}\n */\n this.options = options;\n /**\n * List of crosshairs.\n *\n * @private\n * @readonly\n * @name Highcharts.Tooltip#crosshairs\n * @type {Array}\n */\n this.crosshairs = [];\n /**\n * Current values of x and y when animating.\n *\n * @private\n * @readonly\n * @name Highcharts.Tooltip#now\n * @type {Highcharts.PositionObject}\n */\n this.now = { x: 0, y: 0 };\n /**\n * Tooltips are initially hidden.\n *\n * @private\n * @readonly\n * @name Highcharts.Tooltip#isHidden\n * @type {boolean}\n */\n this.isHidden = true;\n /**\n * True, if the tooltip is split into one label per series, with the\n * header close to the axis.\n *\n * @readonly\n * @name Highcharts.Tooltip#split\n * @type {boolean|undefined}\n */\n this.split = options.split && !chart.inverted && !chart.polar;\n /**\n * When the tooltip is shared, the entire plot area will capture mouse\n * movement or touch events.\n *\n * @readonly\n * @name Highcharts.Tooltip#shared\n * @type {boolean|undefined}\n */\n this.shared = options.shared || this.split;\n /**\n * Whether to allow the tooltip to render outside the chart's SVG\n * element box. By default (false), the tooltip is rendered within the\n * chart's SVG element, which results in the tooltip being aligned\n * inside the chart area.\n *\n * @readonly\n * @name Highcharts.Tooltip#outside\n * @type {boolean}\n *\n * @todo\n * Split tooltip does not support outside in the first iteration. Should\n * not be too complicated to implement.\n */\n this.outside = pick(options.outside, Boolean(chart.scrollablePixelsX || chart.scrollablePixelsY));\n };\n Tooltip.prototype.shouldStickOnContact = function (pointerEvent) {\n return !!(!this.followPointer &&\n this.options.stickOnContact &&\n (!pointerEvent || this.chart.pointer.inClass(pointerEvent.target, 'highcharts-tooltip')));\n };\n /**\n * Moves the tooltip with a soft animation to a new position.\n *\n * @private\n * @function Highcharts.Tooltip#move\n *\n * @param {number} x\n *\n * @param {number} y\n *\n * @param {number} anchorX\n *\n * @param {number} anchorY\n */\n Tooltip.prototype.move = function (x, y, anchorX, anchorY) {\n var tooltip = this,\n now = tooltip.now,\n animate = tooltip.options.animation !== false &&\n !tooltip.isHidden &&\n // When we get close to the target position, abort animation and\n // land on the right place (#3056)\n (Math.abs(x - now.x) > 1 || Math.abs(y - now.y) > 1),\n skipAnchor = tooltip.followPointer || tooltip.len > 1;\n // Get intermediate values for animation\n extend(now, {\n x: animate ? (2 * now.x + x) / 3 : x,\n y: animate ? (now.y + y) / 2 : y,\n anchorX: skipAnchor ?\n void 0 :\n animate ? (2 * now.anchorX + anchorX) / 3 : anchorX,\n anchorY: skipAnchor ?\n void 0 :\n animate ? (now.anchorY + anchorY) / 2 : anchorY\n });\n // Move to the intermediate value\n tooltip.getLabel().attr(now);\n tooltip.drawTracker();\n // Run on next tick of the mouse tracker\n if (animate) {\n // Never allow two timeouts\n U.clearTimeout(this.tooltipTimeout);\n // Set the fixed interval ticking for the smooth tooltip\n this.tooltipTimeout = setTimeout(function () {\n // The interval function may still be running during destroy,\n // so check that the chart is really there before calling.\n if (tooltip) {\n tooltip.move(x, y, anchorX, anchorY);\n }\n }, 32);\n }\n };\n /**\n * Refresh the tooltip's text and position.\n *\n * @function Highcharts.Tooltip#refresh\n *\n * @param {Highcharts.Point|Array} pointOrPoints\n * Either a point or an array of points.\n *\n * @param {Highcharts.PointerEventObject} [mouseEvent]\n * Mouse event, that is responsible for the refresh and should be\n * used for the tooltip update.\n */\n Tooltip.prototype.refresh = function (pointOrPoints, mouseEvent) {\n var tooltip = this,\n chart = this.chart,\n options = tooltip.options,\n pointer = chart.pointer,\n points = splat(pointOrPoints),\n point = points[0],\n pointConfig = [],\n formatter = options.formatter || tooltip.defaultFormatter,\n shared = tooltip.shared,\n styledMode = chart.styledMode;\n var textConfig = {};\n if (!options.enabled || !point.series) { // #16820\n return;\n }\n U.clearTimeout(this.hideTimer);\n // A switch saying if this specific tooltip configuration allows shared\n // or split modes\n tooltip.allowShared = !(!isArray(pointOrPoints) &&\n pointOrPoints.series &&\n pointOrPoints.series.noSharedTooltip);\n // get the reference point coordinates (pie charts use tooltipPos)\n tooltip.followPointer = (!tooltip.split && point.series.tooltipOptions.followPointer);\n var anchor = tooltip.getAnchor(pointOrPoints,\n mouseEvent),\n x = anchor[0],\n y = anchor[1];\n // shared tooltip, array is sent over\n if (shared && tooltip.allowShared) {\n pointer.applyInactiveState(points);\n // Now set hover state for the choosen ones:\n points.forEach(function (item) {\n item.setState('hover');\n pointConfig.push(item.getLabelConfig());\n });\n textConfig = {\n x: point.category,\n y: point.y\n };\n textConfig.points = pointConfig;\n // single point tooltip\n }\n else {\n textConfig = point.getLabelConfig();\n }\n this.len = pointConfig.length; // #6128\n var text = formatter.call(textConfig,\n tooltip);\n // register the current series\n var currentSeries = point.series;\n this.distance = pick(currentSeries.tooltipOptions.distance, 16);\n // update the inner HTML\n if (text === false) {\n this.hide();\n }\n else {\n // update text\n if (tooltip.split && tooltip.allowShared) { // #13868\n this.renderSplit(text, points);\n }\n else {\n var checkX_1 = x;\n var checkY_1 = y;\n if (mouseEvent && pointer.isDirectTouch) {\n checkX_1 = mouseEvent.chartX - chart.plotLeft;\n checkY_1 = mouseEvent.chartY - chart.plotTop;\n }\n // #11493, #13095\n if (chart.polar ||\n currentSeries.options.clip === false ||\n points.some(function (p) {\n return pointer.isDirectTouch || // ##17929\n p.series.shouldShowTooltip(checkX_1, checkY_1);\n })) {\n var label = tooltip.getLabel();\n // Prevent the tooltip from flowing over the chart box\n // (#6659)\n if (!options.style.width || styledMode) {\n label.css({\n width: chart.spacingBox.width + 'px'\n });\n }\n label.attr({\n text: text && text.join ?\n text.join('') :\n text\n });\n // Set the stroke color of the box to reflect the point\n label.addClass(tooltip.getClassName(point), true);\n if (!styledMode) {\n label.attr({\n stroke: (options.borderColor ||\n point.color ||\n currentSeries.color ||\n \"#666666\" /* Palette.neutralColor60 */)\n });\n }\n tooltip.updatePosition({\n plotX: x,\n plotY: y,\n negative: point.negative,\n ttBelow: point.ttBelow,\n h: anchor[2] || 0\n });\n }\n else {\n tooltip.hide();\n return;\n }\n }\n // show it\n if (tooltip.isHidden && tooltip.label) {\n tooltip.label.attr({\n opacity: 1\n }).show();\n }\n tooltip.isHidden = false;\n }\n fireEvent(this, 'refresh');\n };\n /**\n * Render the split tooltip. Loops over each point's text and adds\n * a label next to the point, then uses the distribute function to\n * find best non-overlapping positions.\n *\n * @private\n * @function Highcharts.Tooltip#renderSplit\n *\n * @param {string|Array<(boolean|string)>} labels\n *\n * @param {Array} points\n */\n Tooltip.prototype.renderSplit = function (labels, points) {\n var tooltip = this;\n var chart = tooltip.chart,\n _a = tooltip.chart,\n chartWidth = _a.chartWidth,\n chartHeight = _a.chartHeight,\n plotHeight = _a.plotHeight,\n plotLeft = _a.plotLeft,\n plotTop = _a.plotTop,\n pointer = _a.pointer,\n _b = _a.scrollablePixelsY,\n scrollablePixelsY = _b === void 0 ? 0 : _b,\n scrollablePixelsX = _a.scrollablePixelsX,\n _c = _a.scrollingContainer,\n _d = _c === void 0 ? { scrollLeft: 0,\n scrollTop: 0 } : _c,\n scrollLeft = _d.scrollLeft,\n scrollTop = _d.scrollTop,\n styledMode = _a.styledMode,\n distance = tooltip.distance,\n options = tooltip.options,\n positioner = tooltip.options.positioner;\n // The area which the tooltip should be limited to. Limit to scrollable\n // plot area if enabled, otherwise limit to the chart container. If\n // outside is true it should be the whole viewport\n var bounds = (tooltip.outside &&\n typeof scrollablePixelsX !== 'number') ?\n doc.documentElement.getBoundingClientRect() : {\n left: scrollLeft,\n right: scrollLeft + chartWidth,\n top: scrollTop,\n bottom: scrollTop + chartHeight\n };\n var tooltipLabel = tooltip.getLabel();\n var ren = this.renderer || chart.renderer;\n var headerTop = Boolean(chart.xAxis[0] && chart.xAxis[0].opposite);\n var _e = pointer.getChartPosition(),\n chartLeft = _e.left,\n chartTop = _e.top;\n var distributionBoxTop = plotTop + scrollTop;\n var headerHeight = 0;\n var adjustedPlotHeight = plotHeight - scrollablePixelsY;\n /**\n * Calculates the anchor position for the partial tooltip\n *\n * @private\n * @param {Highcharts.Point} point The point related to the tooltip\n * @return {Object} Returns an object with anchorX and anchorY\n */\n function getAnchor(point) {\n var isHeader = point.isHeader,\n _a = point.plotX,\n plotX = _a === void 0 ? 0 : _a,\n _b = point.plotY,\n plotY = _b === void 0 ? 0 : _b,\n series = point.series;\n var anchorX;\n var anchorY;\n if (isHeader) {\n // Set anchorX to plotX\n anchorX = plotLeft + plotX;\n // Set anchorY to center of visible plot area.\n anchorY = plotTop + plotHeight / 2;\n }\n else {\n var xAxis = series.xAxis,\n yAxis = series.yAxis;\n // Set anchorX to plotX. Limit to within xAxis.\n anchorX = xAxis.pos + clamp(plotX, -distance, xAxis.len + distance);\n // Set anchorY, limit to the scrollable plot area\n if (series.shouldShowTooltip(0, yAxis.pos - plotTop + plotY, {\n ignoreX: true\n })) {\n anchorY = yAxis.pos + plotY;\n }\n }\n // Limit values to plot area\n anchorX = clamp(anchorX, bounds.left - distance, bounds.right + distance);\n return { anchorX: anchorX, anchorY: anchorY };\n }\n /**\n * Calculates the position of the partial tooltip\n *\n * @private\n * @param {number} anchorX\n * The partial tooltip anchor x position\n *\n * @param {number} anchorY\n * The partial tooltip anchor y position\n *\n * @param {boolean|undefined} isHeader\n * Whether the partial tooltip is a header\n *\n * @param {number} boxWidth\n * Width of the partial tooltip\n *\n * @return {Highcharts.PositionObject}\n * Returns the partial tooltip x and y position\n */\n function defaultPositioner(anchorX, anchorY, isHeader, boxWidth, alignedLeft) {\n if (alignedLeft === void 0) { alignedLeft = true; }\n var y;\n var x;\n if (isHeader) {\n y = headerTop ? 0 : adjustedPlotHeight;\n x = clamp(anchorX - (boxWidth / 2), bounds.left, bounds.right - boxWidth - (tooltip.outside ? chartLeft : 0));\n }\n else {\n y = anchorY - distributionBoxTop;\n x = alignedLeft ?\n anchorX - boxWidth - distance :\n anchorX + distance;\n x = clamp(x, alignedLeft ? x : bounds.left, bounds.right);\n }\n // NOTE: y is relative to distributionBoxTop\n return { x: x, y: y };\n }\n /**\n * Updates the attributes and styling of the partial tooltip. Creates a\n * new partial tooltip if it does not exists.\n *\n * @private\n * @param {Highcharts.SVGElement|undefined} partialTooltip\n * The partial tooltip to update\n * @param {Highcharts.Point} point\n * The point related to the partial tooltip\n * @param {boolean|string} str The text for the partial tooltip\n * @return {Highcharts.SVGElement} Returns the updated partial tooltip\n */\n function updatePartialTooltip(partialTooltip, point, str) {\n var tt = partialTooltip;\n var isHeader = point.isHeader,\n series = point.series;\n if (!tt) {\n var attribs = {\n padding: options.padding,\n r: options.borderRadius\n };\n if (!styledMode) {\n attribs.fill = options.backgroundColor;\n attribs['stroke-width'] = options.borderWidth;\n }\n tt = ren\n .label('', 0, 0, (options[isHeader ? 'headerShape' : 'shape']), void 0, void 0, options.useHTML)\n .addClass(tooltip.getClassName(point, true, isHeader))\n .attr(attribs)\n .add(tooltipLabel);\n }\n tt.isActive = true;\n tt.attr({\n text: str\n });\n if (!styledMode) {\n tt.css(options.style)\n .shadow(options.shadow)\n .attr({\n stroke: (options.borderColor ||\n point.color ||\n series.color ||\n \"#333333\" /* Palette.neutralColor80 */)\n });\n }\n return tt;\n }\n // Graceful degradation for legacy formatters\n if (isString(labels)) {\n labels = [false, labels];\n }\n // Create the individual labels for header and points, ignore footer\n var boxes = labels.slice(0,\n points.length + 1).reduce(function (boxes,\n str,\n i) {\n if (str !== false && str !== '') {\n var point = (points[i - 1] ||\n {\n // Item 0 is the header. Instead of this, we could also\n // use the crosshair label\n isHeader: true,\n plotX: points[0].plotX,\n plotY: plotHeight,\n series: {}\n });\n var isHeader = point.isHeader;\n // Store the tooltip label referance on the series\n var owner = isHeader ? tooltip : point.series;\n var tt = owner.tt = updatePartialTooltip(owner.tt,\n point,\n str.toString());\n // Get X position now, so we can move all to the other side in\n // case of overflow\n var bBox = tt.getBBox();\n var boxWidth = bBox.width + tt.strokeWidth();\n if (isHeader) {\n headerHeight = bBox.height;\n adjustedPlotHeight += headerHeight;\n if (headerTop) {\n distributionBoxTop -= headerHeight;\n }\n }\n var _a = getAnchor(point),\n anchorX = _a.anchorX,\n anchorY = _a.anchorY;\n if (typeof anchorY === 'number') {\n var size = bBox.height + 1;\n var boxPosition = (positioner ?\n positioner.call(tooltip,\n boxWidth,\n size,\n point) :\n defaultPositioner(anchorX,\n anchorY,\n isHeader,\n boxWidth));\n boxes.push({\n // 0-align to the top, 1-align to the bottom\n align: positioner ? 0 : void 0,\n anchorX: anchorX,\n anchorY: anchorY,\n boxWidth: boxWidth,\n point: point,\n rank: pick(boxPosition.rank, isHeader ? 1 : 0),\n size: size,\n target: boxPosition.y,\n tt: tt,\n x: boxPosition.x\n });\n }\n else {\n // Hide tooltips which anchorY is outside the visible plot\n // area\n tt.isActive = false;\n }\n }\n return boxes;\n }, []);\n // Realign the tooltips towards the right if there is not enough space\n // to the left and there is space to to the right\n if (!positioner && boxes.some(function (box) {\n // Always realign if the beginning of a label is outside bounds\n var outside = tooltip.outside;\n var boxStart = (outside ? chartLeft : 0) + box.anchorX;\n if (boxStart < bounds.left &&\n boxStart + box.boxWidth < bounds.right) {\n return true;\n }\n // Otherwise, check if there is more space available to the right\n return boxStart < (chartLeft - bounds.left) + box.boxWidth &&\n bounds.right - boxStart > boxStart;\n })) {\n boxes = boxes.map(function (box) {\n var _a = defaultPositioner(box.anchorX,\n box.anchorY,\n box.point.isHeader,\n box.boxWidth,\n false),\n x = _a.x,\n y = _a.y;\n return extend(box, {\n target: y,\n x: x\n });\n });\n }\n // Clean previous run (for missing points)\n tooltip.cleanSplit();\n // Distribute and put in place\n distribute(boxes, adjustedPlotHeight);\n var boxExtremes = {\n left: chartLeft,\n right: chartLeft\n };\n // Get the extremes from series tooltips\n boxes.forEach(function (box) {\n var x = box.x,\n boxWidth = box.boxWidth,\n isHeader = box.isHeader;\n if (!isHeader) {\n if (tooltip.outside && chartLeft + x < boxExtremes.left) {\n boxExtremes.left = chartLeft + x;\n }\n if (!isHeader &&\n tooltip.outside &&\n boxExtremes.left + boxWidth > boxExtremes.right) {\n boxExtremes.right = chartLeft + x;\n }\n }\n });\n boxes.forEach(function (box) {\n var x = box.x,\n anchorX = box.anchorX,\n anchorY = box.anchorY,\n pos = box.pos,\n isHeader = box.point.isHeader;\n var attributes = {\n visibility: typeof pos === 'undefined' ? 'hidden' : 'inherit',\n x: x,\n /* NOTE: y should equal pos to be consistent with !split\n * tooltip,\n but is currently relative to plotTop. Is left as is\n * to avoid breaking change. Remove distributionBoxTop to make\n * it consistent.\n */\n y: (pos || 0) + distributionBoxTop,\n anchorX: anchorX,\n anchorY: anchorY\n };\n // Handle left-aligned tooltips overflowing the chart area\n if (tooltip.outside && x < anchorX) {\n var offset = chartLeft - boxExtremes.left;\n // Skip this if there is no overflow\n if (offset > 0) {\n if (!isHeader) {\n attributes.x = x + offset;\n attributes.anchorX = anchorX + offset;\n }\n if (isHeader) {\n attributes.x = (boxExtremes.right - boxExtremes.left) / 2;\n attributes.anchorX = anchorX + offset;\n }\n }\n }\n // Put the label in place\n box.tt.attr(attributes);\n });\n /* If we have a seperate tooltip container, then update the necessary\n * container properties.\n * Test that tooltip has its own container and renderer before executing\n * the operation.\n */\n var container = tooltip.container,\n outside = tooltip.outside,\n renderer = tooltip.renderer;\n if (outside && container && renderer) {\n // Set container size to fit the bounds\n var _f = tooltipLabel.getBBox(),\n width = _f.width,\n height = _f.height,\n x = _f.x,\n y = _f.y;\n renderer.setSize(width + x, height + y, false);\n // Position the tooltip container to the chart container\n container.style.left = boxExtremes.left + 'px';\n container.style.top = chartTop + 'px';\n }\n };\n /**\n * If the `stickOnContact` option is active, this will add a tracker shape.\n *\n * @private\n * @function Highcharts.Tooltip#drawTracker\n */\n Tooltip.prototype.drawTracker = function () {\n var tooltip = this;\n if (!this.shouldStickOnContact()) {\n if (tooltip.tracker) {\n tooltip.tracker.destroy();\n }\n return;\n }\n var chart = tooltip.chart;\n var label = tooltip.label;\n var points = tooltip.shared ? chart.hoverPoints : chart.hoverPoint;\n if (!label || !points) {\n return;\n }\n var box = {\n x: 0,\n y: 0,\n width: 0,\n height: 0\n };\n // Combine anchor and tooltip\n var anchorPos = this.getAnchor(points);\n var labelBBox = label.getBBox();\n anchorPos[0] += chart.plotLeft - label.translateX;\n anchorPos[1] += chart.plotTop - label.translateY;\n // When the mouse pointer is between the anchor point and the label,\n // the label should stick.\n box.x = Math.min(0, anchorPos[0]);\n box.y = Math.min(0, anchorPos[1]);\n box.width = (anchorPos[0] < 0 ?\n Math.max(Math.abs(anchorPos[0]), (labelBBox.width - anchorPos[0])) :\n Math.max(Math.abs(anchorPos[0]), labelBBox.width));\n box.height = (anchorPos[1] < 0 ?\n Math.max(Math.abs(anchorPos[1]), (labelBBox.height - Math.abs(anchorPos[1]))) :\n Math.max(Math.abs(anchorPos[1]), labelBBox.height));\n if (tooltip.tracker) {\n tooltip.tracker.attr(box);\n }\n else {\n tooltip.tracker = label.renderer\n .rect(box)\n .addClass('highcharts-tracker')\n .add(label);\n if (!chart.styledMode) {\n tooltip.tracker.attr({\n fill: 'rgba(0,0,0,0)'\n });\n }\n }\n };\n /**\n * @private\n */\n Tooltip.prototype.styledModeFormat = function (formatString) {\n return formatString\n .replace('style=\"font-size: 10px\"', 'class=\"highcharts-header\"')\n .replace(/style=\"color:{(point|series)\\.color}\"/g, 'class=\"highcharts-color-{$1.colorIndex} ' +\n '{series.options.className} ' +\n '{point.options.className}\"');\n };\n /**\n * Format the footer/header of the tooltip\n * #3397: abstraction to enable formatting of footer and header\n *\n * @private\n * @function Highcharts.Tooltip#tooltipFooterHeaderFormatter\n */\n Tooltip.prototype.tooltipFooterHeaderFormatter = function (labelConfig, isFooter) {\n var series = labelConfig.series,\n tooltipOptions = series.tooltipOptions,\n xAxis = series.xAxis,\n dateTime = xAxis && xAxis.dateTime,\n e = {\n isFooter: isFooter,\n labelConfig: labelConfig\n };\n var xDateFormat = tooltipOptions.xDateFormat,\n formatString = tooltipOptions[isFooter ? 'footerFormat' : 'headerFormat'];\n fireEvent(this, 'headerFormatter', e, function (e) {\n // Guess the best date format based on the closest point distance\n // (#568, #3418)\n if (dateTime && !xDateFormat && isNumber(labelConfig.key)) {\n xDateFormat = dateTime.getXDateFormat(labelConfig.key, tooltipOptions.dateTimeLabelFormats);\n }\n // Insert the footer date format if any\n if (dateTime && xDateFormat) {\n ((labelConfig.point && labelConfig.point.tooltipDateKeys) ||\n ['key']).forEach(function (key) {\n formatString = formatString.replace('{point.' + key + '}', '{point.' + key + ':' + xDateFormat + '}');\n });\n }\n // Replace default header style with class name\n if (series.chart.styledMode) {\n formatString = this.styledModeFormat(formatString);\n }\n e.text = format(formatString, {\n point: labelConfig,\n series: series\n }, this.chart);\n });\n return e.text;\n };\n /**\n * Updates the tooltip with the provided tooltip options.\n *\n * @function Highcharts.Tooltip#update\n *\n * @param {Highcharts.TooltipOptions} options\n * The tooltip options to update.\n */\n Tooltip.prototype.update = function (options) {\n this.destroy();\n // Update user options (#6218)\n merge(true, this.chart.options.tooltip.userOptions, options);\n this.init(this.chart, merge(true, this.options, options));\n };\n /**\n * Find the new position and perform the move\n *\n * @private\n * @function Highcharts.Tooltip#updatePosition\n *\n * @param {Highcharts.Point} point\n */\n Tooltip.prototype.updatePosition = function (point) {\n var _a = this,\n chart = _a.chart,\n distance = _a.distance,\n options = _a.options,\n pointer = chart.pointer,\n label = this.getLabel(), \n // Needed for outside: true (#11688)\n _b = pointer.getChartPosition(),\n left = _b.left,\n top = _b.top,\n scaleX = _b.scaleX,\n scaleY = _b.scaleY,\n pos = (options.positioner || this.getPosition).call(this,\n label.width,\n label.height,\n point);\n var anchorX = (point.plotX || 0) + chart.plotLeft,\n anchorY = (point.plotY || 0) + chart.plotTop,\n pad;\n // Set the renderer size dynamically to prevent document size to change\n if (this.outside) {\n // Corrects positions, occurs with tooltip positioner (#16944)\n if (options.positioner) {\n pos.x += left - distance;\n pos.y += top - distance;\n }\n pad = options.borderWidth + 2 * distance;\n this.renderer.setSize(label.width + pad, label.height + pad, false);\n // Anchor and tooltip container need scaling if chart container has\n // scale transform/css zoom. #11329.\n if (scaleX !== 1 || scaleY !== 1) {\n css(this.container, {\n transform: \"scale(\".concat(scaleX, \", \").concat(scaleY, \")\")\n });\n anchorX *= scaleX;\n anchorY *= scaleY;\n }\n anchorX += left - pos.x;\n anchorY += top - pos.y;\n }\n // do the move\n this.move(Math.round(pos.x), Math.round(pos.y || 0), // can be undefined (#3977)\n anchorX, anchorY);\n };\n return Tooltip;\n }());\n /* *\n *\n * Default export\n *\n * */\n /* *\n *\n * API Declarations\n *\n * */\n /**\n * Callback function to format the text of the tooltip from scratch.\n *\n * In case of single or shared tooltips, a string should be be returned. In case\n * of splitted tooltips, it should return an array where the first item is the\n * header, and subsequent items are mapped to the points. Return `false` to\n * disable tooltip for a specific point on series.\n *\n * @callback Highcharts.TooltipFormatterCallbackFunction\n *\n * @param {Highcharts.TooltipFormatterContextObject} this\n * Context to format\n *\n * @param {Highcharts.Tooltip} tooltip\n * The tooltip instance\n *\n * @return {false|string|Array<(string|null|undefined)>|null|undefined}\n * Formatted text or false\n */\n /**\n * Configuration for the tooltip formatters.\n *\n * @interface Highcharts.TooltipFormatterContextObject\n * @extends Highcharts.PointLabelObject\n */ /**\n * Array of points in shared tooltips.\n * @name Highcharts.TooltipFormatterContextObject#points\n * @type {Array|undefined}\n */\n /**\n * A callback function to place the tooltip in a specific position.\n *\n * @callback Highcharts.TooltipPositionerCallbackFunction\n *\n * @param {Highcharts.Tooltip} this\n * Tooltip context of the callback.\n *\n * @param {number} labelWidth\n * Width of the tooltip.\n *\n * @param {number} labelHeight\n * Height of the tooltip.\n *\n * @param {Highcharts.TooltipPositionerPointObject} point\n * Point information for positioning a tooltip.\n *\n * @return {Highcharts.PositionObject}\n * New position for the tooltip.\n */\n /**\n * Point information for positioning a tooltip.\n *\n * @interface Highcharts.TooltipPositionerPointObject\n * @extends Highcharts.Point\n */ /**\n * If `tooltip.split` option is enabled and positioner is called for each of the\n * boxes separately, this property indicates the call on the xAxis header, which\n * is not a point itself.\n * @name Highcharts.TooltipPositionerPointObject#isHeader\n * @type {boolean}\n */ /**\n * The reference point relative to the plot area. Add chart.plotLeft to get the\n * full coordinates.\n * @name Highcharts.TooltipPositionerPointObject#plotX\n * @type {number}\n */ /**\n * The reference point relative to the plot area. Add chart.plotTop to get the\n * full coordinates.\n * @name Highcharts.TooltipPositionerPointObject#plotY\n * @type {number}\n */\n /**\n * @typedef {\"callout\"|\"circle\"|\"square\"} Highcharts.TooltipShapeValue\n */\n ''; // keeps doclets above in JS file\n\n return Tooltip;\n });\n _registerModule(_modules, 'Core/Series/Point.js', [_modules['Core/Renderer/HTML/AST.js'], _modules['Core/Animation/AnimationUtilities.js'], _modules['Core/Defaults.js'], _modules['Core/FormatUtilities.js'], _modules['Core/Utilities.js']], function (AST, A, D, F, U) {\n /* *\n *\n * (c) 2010-2021 Torstein Honsi\n *\n * License: www.highcharts.com/license\n *\n * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!\n *\n * */\n var animObject = A.animObject;\n var defaultOptions = D.defaultOptions;\n var format = F.format;\n var addEvent = U.addEvent,\n defined = U.defined,\n erase = U.erase,\n extend = U.extend,\n fireEvent = U.fireEvent,\n getNestedProperty = U.getNestedProperty,\n isArray = U.isArray,\n isFunction = U.isFunction,\n isNumber = U.isNumber,\n isObject = U.isObject,\n merge = U.merge,\n objectEach = U.objectEach,\n pick = U.pick,\n syncTimeout = U.syncTimeout,\n removeEvent = U.removeEvent,\n uniqueKey = U.uniqueKey;\n /* eslint-disable no-invalid-this, valid-jsdoc */\n /* *\n *\n * Class\n *\n * */\n /**\n * The Point object. The point objects are generated from the `series.data`\n * configuration objects or raw numbers. They can be accessed from the\n * `Series.points` array. Other ways to instantiate points are through {@link\n * Highcharts.Series#addPoint} or {@link Highcharts.Series#setData}.\n *\n * @class\n * @name Highcharts.Point\n */\n var Point = /** @class */ (function () {\n function Point() {\n /* *\n *\n * Properties\n *\n * */\n /**\n * For categorized axes this property holds the category name for the\n * point. For other axes it holds the X value.\n *\n * @name Highcharts.Point#category\n * @type {number|string}\n */\n this.category = void 0;\n this.formatPrefix = 'point';\n this.id = void 0;\n this.isNull = false;\n /**\n * The name of the point. The name can be given as the first position of the\n * point configuration array, or as a `name` property in the configuration:\n *\n * @example\n * // Array config\n * data: [\n * ['John', 1],\n * ['Jane', 2]\n * ]\n *\n * // Object config\n * data: [{\n * name: 'John',\n * y: 1\n * }, {\n * name: 'Jane',\n * y: 2\n * }]\n *\n * @name Highcharts.Point#name\n * @type {string}\n */\n this.name = void 0;\n /**\n * The point's options as applied in the initial configuration, or\n * extended through `Point.update`.\n *\n * In TypeScript you have to extend `PointOptionsObject` via an\n * additional interface to allow custom data options:\n *\n * ```\n * declare interface PointOptionsObject {\n * customProperty: string;\n * }\n * ```\n *\n * @name Highcharts.Point#options\n * @type {Highcharts.PointOptionsObject}\n */\n this.options = void 0;\n /**\n * The percentage for points in a stacked series or pies.\n *\n * @name Highcharts.Point#percentage\n * @type {number|undefined}\n */\n this.percentage = void 0;\n this.selected = false;\n /**\n * The series object associated with the point.\n *\n * @name Highcharts.Point#series\n * @type {Highcharts.Series}\n */\n this.series = void 0;\n /**\n * The attributes of the rendered SVG shape like in `column` or `pie`\n * series.\n *\n * @readonly\n * @name Highcharts.Point#shapeArgs\n * @type {Readonly|undefined}\n */\n this.shapeArgs = void 0;\n /**\n * The total of values in either a stack for stacked series, or a pie in a\n * pie series.\n *\n * @name Highcharts.Point#total\n * @type {number|undefined}\n */\n this.total = void 0;\n /**\n * For certain series types, like pie charts, where individual points can\n * be shown or hidden.\n *\n * @name Highcharts.Point#visible\n * @type {boolean}\n * @default true\n */\n this.visible = true;\n this.x = void 0;\n }\n /* *\n *\n * Functions\n *\n * */\n /**\n * Animate SVG elements associated with the point.\n *\n * @private\n * @function Highcharts.Point#animateBeforeDestroy\n */\n Point.prototype.animateBeforeDestroy = function () {\n var point = this,\n animateParams = { x: point.startXPos,\n opacity: 0 },\n graphicalProps = point.getGraphicalProps();\n graphicalProps.singular.forEach(function (prop) {\n var isDataLabel = prop === 'dataLabel';\n point[prop] = point[prop].animate(isDataLabel ? {\n x: point[prop].startXPos,\n y: point[prop].startYPos,\n opacity: 0\n } : animateParams);\n });\n graphicalProps.plural.forEach(function (plural) {\n point[plural].forEach(function (item) {\n if (item.element) {\n item.animate(extend({ x: point.startXPos }, (item.startYPos ? {\n x: item.startXPos,\n y: item.startYPos\n } : {})));\n }\n });\n });\n };\n /**\n * Apply the options containing the x and y data and possible some extra\n * properties. Called on point init or from point.update.\n *\n * @private\n * @function Highcharts.Point#applyOptions\n *\n * @param {Highcharts.PointOptionsType} options\n * The point options as defined in series.data.\n *\n * @param {number} [x]\n * Optionally, the x value.\n *\n * @return {Highcharts.Point}\n * The Point instance.\n */\n Point.prototype.applyOptions = function (options, x) {\n var point = this,\n series = point.series,\n pointValKey = series.options.pointValKey || series.pointValKey;\n options = Point.prototype.optionsToObject.call(this, options);\n // copy options directly to point\n extend(point, options);\n point.options = point.options ?\n extend(point.options, options) :\n options;\n // Since options are copied into the Point instance, some accidental\n // options must be shielded (#5681)\n if (options.group) {\n delete point.group;\n }\n if (options.dataLabels) {\n delete point.dataLabels;\n }\n /**\n * The y value of the point.\n * @name Highcharts.Point#y\n * @type {number|undefined}\n */\n // For higher dimension series types. For instance, for ranges, point.y\n // is mapped to point.low.\n if (pointValKey) {\n point.y = Point.prototype.getNestedProperty.call(point, pointValKey);\n }\n point.isNull = this.isValid && !this.isValid();\n point.formatPrefix = point.isNull ? 'null' : 'point'; // #9233, #10874\n // The point is initially selected by options (#5777)\n if (point.selected) {\n point.state = 'select';\n }\n /**\n * The x value of the point.\n * @name Highcharts.Point#x\n * @type {number}\n */\n // If no x is set by now, get auto incremented value. All points must\n // have an x value, however the y value can be null to create a gap in\n // the series\n if ('name' in point &&\n typeof x === 'undefined' &&\n series.xAxis &&\n series.xAxis.hasNames) {\n point.x = series.xAxis.nameToX(point);\n }\n if (typeof point.x === 'undefined' && series) {\n if (typeof x === 'undefined') {\n point.x = series.autoIncrement();\n }\n else {\n point.x = x;\n }\n }\n else if (isNumber(options.x) && series.options.relativeXValue) {\n point.x = series.autoIncrement(options.x);\n }\n return point;\n };\n /**\n * Destroy a point to clear memory. Its reference still stays in\n * `series.data`.\n *\n * @private\n * @function Highcharts.Point#destroy\n */\n Point.prototype.destroy = function () {\n var point = this,\n series = point.series,\n chart = series.chart,\n dataSorting = series.options.dataSorting,\n hoverPoints = chart.hoverPoints,\n globalAnimation = point.series.chart.renderer.globalAnimation,\n animation = animObject(globalAnimation);\n var prop;\n /**\n * Allow to call after animation.\n * @private\n */\n function destroyPoint() {\n // Remove all events and elements\n if (point.graphic ||\n point.graphics ||\n point.dataLabel ||\n point.dataLabels) {\n removeEvent(point);\n point.destroyElements();\n }\n for (prop in point) { // eslint-disable-line guard-for-in\n point[prop] = null;\n }\n }\n if (point.legendItem) {\n // pies have legend items\n chart.legend.destroyItem(point);\n }\n if (hoverPoints) {\n point.setState();\n erase(hoverPoints, point);\n if (!hoverPoints.length) {\n chart.hoverPoints = null;\n }\n }\n if (point === chart.hoverPoint) {\n point.onMouseOut();\n }\n // Remove properties after animation\n if (!dataSorting || !dataSorting.enabled) {\n destroyPoint();\n }\n else {\n this.animateBeforeDestroy();\n syncTimeout(destroyPoint, animation.duration);\n }\n chart.pointCount--;\n };\n /**\n * Destroy SVG elements associated with the point.\n *\n * @private\n * @function Highcharts.Point#destroyElements\n * @param {Highcharts.Dictionary} [kinds]\n */\n Point.prototype.destroyElements = function (kinds) {\n var point = this,\n props = point.getGraphicalProps(kinds);\n props.singular.forEach(function (prop) {\n point[prop] = point[prop].destroy();\n });\n props.plural.forEach(function (plural) {\n point[plural].forEach(function (item) {\n if (item && item.element) {\n item.destroy();\n }\n });\n delete point[plural];\n });\n };\n /**\n * Fire an event on the Point object.\n *\n * @private\n * @function Highcharts.Point#firePointEvent\n *\n * @param {string} eventType\n * Type of the event.\n *\n * @param {Highcharts.Dictionary|Event} [eventArgs]\n * Additional event arguments.\n *\n * @param {Highcharts.EventCallbackFunction|Function} [defaultFunction]\n * Default event handler.\n *\n * @emits Highcharts.Point#event:*\n */\n Point.prototype.firePointEvent = function (eventType, eventArgs, defaultFunction) {\n var point = this,\n series = this.series,\n seriesOptions = series.options;\n // load event handlers on demand to save time on mouseover/out\n if (seriesOptions.point.events[eventType] ||\n (point.options &&\n point.options.events &&\n point.options.events[eventType])) {\n point.importEvents();\n }\n // add default handler if in selection mode\n if (eventType === 'click' && seriesOptions.allowPointSelect) {\n defaultFunction = function (event) {\n // Control key is for Windows, meta (= Cmd key) for Mac, Shift\n // for Opera.\n if (point.select) { // #2911\n point.select(null, event.ctrlKey || event.metaKey || event.shiftKey);\n }\n };\n }\n fireEvent(point, eventType, eventArgs, defaultFunction);\n };\n /**\n * Get the CSS class names for individual points. Used internally where the\n * returned value is set on every point.\n *\n * @function Highcharts.Point#getClassName\n *\n * @return {string}\n * The class names.\n */\n Point.prototype.getClassName = function () {\n var point = this;\n return 'highcharts-point' +\n (point.selected ? ' highcharts-point-select' : '') +\n (point.negative ? ' highcharts-negative' : '') +\n (point.isNull ? ' highcharts-null-point' : '') +\n (typeof point.colorIndex !== 'undefined' ?\n ' highcharts-color-' + point.colorIndex : '') +\n (point.options.className ? ' ' + point.options.className : '') +\n (point.zone && point.zone.className ? ' ' +\n point.zone.className.replace('highcharts-negative', '') : '');\n };\n /**\n * Get props of all existing graphical point elements.\n *\n * @private\n * @function Highcharts.Point#getGraphicalProps\n */\n Point.prototype.getGraphicalProps = function (kinds) {\n var point = this,\n props = [],\n graphicalProps = { singular: [],\n plural: [] };\n var prop,\n i;\n kinds = kinds || { graphic: 1, dataLabel: 1 };\n if (kinds.graphic) {\n props.push('graphic', 'shadowGroup');\n }\n if (kinds.dataLabel) {\n props.push('dataLabel', 'dataLabelPath', 'dataLabelUpper', 'connector');\n }\n i = props.length;\n while (i--) {\n prop = props[i];\n if (point[prop]) {\n graphicalProps.singular.push(prop);\n }\n }\n [\n 'graphic',\n 'dataLabel',\n 'connector'\n ].forEach(function (prop) {\n var plural = prop + 's';\n if (kinds[prop] && point[plural]) {\n graphicalProps.plural.push(plural);\n }\n });\n return graphicalProps;\n };\n /**\n * Return the configuration hash needed for the data label and tooltip\n * formatters.\n *\n * @function Highcharts.Point#getLabelConfig\n *\n * @return {Highcharts.PointLabelObject}\n * Abstract object used in formatters and formats.\n */\n Point.prototype.getLabelConfig = function () {\n return {\n x: this.category,\n y: this.y,\n color: this.color,\n colorIndex: this.colorIndex,\n key: this.name || this.category,\n series: this.series,\n point: this,\n percentage: this.percentage,\n total: this.total || this.stackTotal\n };\n };\n /**\n * Returns the value of the point property for a given value.\n * @private\n */\n Point.prototype.getNestedProperty = function (key) {\n if (!key) {\n return;\n }\n if (key.indexOf('custom.') === 0) {\n return getNestedProperty(key, this.options);\n }\n return this[key];\n };\n /**\n * In a series with `zones`, return the zone that the point belongs to.\n *\n * @function Highcharts.Point#getZone\n *\n * @return {Highcharts.SeriesZonesOptionsObject}\n * The zone item.\n */\n Point.prototype.getZone = function () {\n var series = this.series,\n zones = series.zones,\n zoneAxis = series.zoneAxis || 'y';\n var zone,\n i = 0;\n zone = zones[i];\n while (this[zoneAxis] >= zone.value) {\n zone = zones[++i];\n }\n // For resetting or reusing the point (#8100)\n if (!this.nonZonedColor) {\n this.nonZonedColor = this.color;\n }\n if (zone && zone.color && !this.options.color) {\n this.color = zone.color;\n }\n else {\n this.color = this.nonZonedColor;\n }\n return zone;\n };\n /**\n * Utility to check if point has new shape type. Used in column series and\n * all others that are based on column series.\n * @private\n */\n Point.prototype.hasNewShapeType = function () {\n var point = this;\n var oldShapeType = point.graphic &&\n (point.graphic.symbolName || point.graphic.element.nodeName);\n return oldShapeType !== this.shapeType;\n };\n /**\n * Initialize the point. Called internally based on the `series.data`\n * option.\n *\n * @function Highcharts.Point#init\n *\n * @param {Highcharts.Series} series\n * The series object containing this point.\n *\n * @param {Highcharts.PointOptionsType} options\n * The data in either number, array or object format.\n *\n * @param {number} [x]\n * Optionally, the X value of the point.\n *\n * @return {Highcharts.Point}\n * The Point instance.\n *\n * @emits Highcharts.Point#event:afterInit\n */\n Point.prototype.init = function (series, options, x) {\n this.series = series;\n this.applyOptions(options, x);\n // Add a unique ID to the point if none is assigned\n this.id = defined(this.id) ? this.id : uniqueKey();\n this.resolveColor();\n series.chart.pointCount++;\n fireEvent(this, 'afterInit');\n return this;\n };\n /**\n * Determine if point is valid.\n * @private\n * @function Highcharts.Point#isValid\n */\n Point.prototype.isValid = function () {\n return this.x !== null && isNumber(this.y);\n };\n /**\n * Transform number or array configs into objects. Also called for object\n * configs. Used internally to unify the different configuration formats for\n * points. For example, a simple number `10` in a line series will be\n * transformed to `{ y: 10 }`, and an array config like `[1, 10]` in a\n * scatter series will be transformed to `{ x: 1, y: 10 }`.\n *\n * @deprecated\n * @function Highcharts.Point#optionsToObject\n *\n * @param {Highcharts.PointOptionsType} options\n * Series data options.\n *\n * @return {Highcharts.Dictionary<*>}\n * Transformed point options.\n */\n Point.prototype.optionsToObject = function (options) {\n var series = this.series,\n keys = series.options.keys,\n pointArrayMap = keys || series.pointArrayMap || ['y'],\n valueCount = pointArrayMap.length;\n var ret = {},\n firstItemType,\n i = 0,\n j = 0;\n if (isNumber(options) || options === null) {\n ret[pointArrayMap[0]] = options;\n }\n else if (isArray(options)) {\n // with leading x value\n if (!keys && options.length > valueCount) {\n firstItemType = typeof options[0];\n if (firstItemType === 'string') {\n ret.name = options[0];\n }\n else if (firstItemType === 'number') {\n ret.x = options[0];\n }\n i++;\n }\n while (j < valueCount) {\n // Skip undefined positions for keys\n if (!keys || typeof options[i] !== 'undefined') {\n if (pointArrayMap[j].indexOf('.') > 0) {\n // Handle nested keys, e.g. ['color.pattern.image']\n // Avoid function call unless necessary.\n Point.prototype.setNestedProperty(ret, options[i], pointArrayMap[j]);\n }\n else {\n ret[pointArrayMap[j]] = options[i];\n }\n }\n i++;\n j++;\n }\n }\n else if (typeof options === 'object') {\n ret = options;\n // This is the fastest way to detect if there are individual point\n // dataLabels that need to be considered in drawDataLabels. These\n // can only occur in object configs.\n if (options.dataLabels) {\n series._hasPointLabels = true;\n }\n // Same approach as above for markers\n if (options.marker) {\n series._hasPointMarkers = true;\n }\n }\n return ret;\n };\n /**\n * Get the pixel position of the point relative to the plot area.\n * @private\n * @function Highcharts.Point#pos\n */\n Point.prototype.pos = function (chartCoordinates, plotY) {\n if (plotY === void 0) { plotY = this.plotY; }\n var _a = this,\n plotX = _a.plotX,\n series = _a.series,\n chart = series.chart,\n xAxis = series.xAxis,\n yAxis = series.yAxis;\n var posX = 0,\n posY = 0;\n if (isNumber(plotX) && isNumber(plotY)) {\n if (chartCoordinates) {\n posX = xAxis ? xAxis.pos : chart.plotLeft;\n posY = yAxis ? yAxis.pos : chart.plotTop;\n }\n return chart.inverted && xAxis && yAxis ?\n [yAxis.len - plotY + posY, xAxis.len - plotX + posX] :\n [plotX + posX, plotY + posY];\n }\n };\n /**\n * @private\n * @function Highcharts.Point#resolveColor\n */\n Point.prototype.resolveColor = function () {\n var series = this.series,\n optionsChart = series.chart.options.chart,\n styledMode = series.chart.styledMode;\n var color,\n colors,\n colorCount = optionsChart.colorCount,\n colorIndex;\n // remove points nonZonedColor for later recalculation\n delete this.nonZonedColor;\n if (series.options.colorByPoint) {\n if (!styledMode) {\n colors = series.options.colors || series.chart.options.colors;\n color = colors[series.colorCounter];\n colorCount = colors.length;\n }\n colorIndex = series.colorCounter;\n series.colorCounter++;\n // loop back to zero\n if (series.colorCounter === colorCount) {\n series.colorCounter = 0;\n }\n }\n else {\n if (!styledMode) {\n color = series.color;\n }\n colorIndex = series.colorIndex;\n }\n /**\n * The point's current color index, used in styled mode instead of\n * `color`. The color index is inserted in class names used for styling.\n *\n * @name Highcharts.Point#colorIndex\n * @type {number|undefined}\n */\n this.colorIndex = pick(this.options.colorIndex, colorIndex);\n /**\n * The point's current color.\n *\n * @name Highcharts.Point#color\n * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject|undefined}\n */\n this.color = pick(this.options.color, color);\n };\n /**\n * Set a value in an object, on the property defined by key. The key\n * supports nested properties using dot notation. The function modifies the\n * input object and does not make a copy.\n *\n * @function Highcharts.Point#setNestedProperty\n *\n * @param {T} object\n * The object to set the value on.\n *\n * @param {*} value\n * The value to set.\n *\n * @param {string} key\n * Key to the property to set.\n *\n * @return {T}\n * The modified object.\n */\n Point.prototype.setNestedProperty = function (object, value, key) {\n var nestedKeys = key.split('.');\n nestedKeys.reduce(function (result, key, i, arr) {\n var isLastKey = arr.length - 1 === i;\n result[key] = (isLastKey ?\n value :\n isObject(result[key], true) ?\n result[key] :\n {});\n return result[key];\n }, object);\n return object;\n };\n Point.prototype.shouldDraw = function () {\n return !this.isNull;\n };\n /**\n * Extendable method for formatting each point's tooltip line.\n *\n * @function Highcharts.Point#tooltipFormatter\n *\n * @param {string} pointFormat\n * The point format.\n *\n * @return {string}\n * A string to be concatenated in to the common tooltip text.\n */\n Point.prototype.tooltipFormatter = function (pointFormat) {\n // Insert options for valueDecimals, valuePrefix, and valueSuffix\n var series = this.series, seriesTooltipOptions = series.tooltipOptions, valueDecimals = pick(seriesTooltipOptions.valueDecimals, ''), valuePrefix = seriesTooltipOptions.valuePrefix || '', valueSuffix = seriesTooltipOptions.valueSuffix || '';\n // Replace default point style with class name\n if (series.chart.styledMode) {\n pointFormat =\n series.chart.tooltip.styledModeFormat(pointFormat);\n }\n // Loop over the point array map and replace unformatted values with\n // sprintf formatting markup\n (series.pointArrayMap || ['y']).forEach(function (key) {\n key = '{point.' + key; // without the closing bracket\n if (valuePrefix || valueSuffix) {\n pointFormat = pointFormat.replace(RegExp(key + '}', 'g'), valuePrefix + key + '}' + valueSuffix);\n }\n pointFormat = pointFormat.replace(RegExp(key + '}', 'g'), key + ':,.' + valueDecimals + 'f}');\n });\n return format(pointFormat, {\n point: this,\n series: this.series\n }, series.chart);\n };\n /**\n * Update point with new options (typically x/y data) and optionally redraw\n * the series.\n *\n * @sample highcharts/members/point-update-column/\n * Update column value\n * @sample highcharts/members/point-update-pie/\n * Update pie slice\n * @sample maps/members/point-update/\n * Update map area value in Highmaps\n *\n * @function Highcharts.Point#update\n *\n * @param {Highcharts.PointOptionsType} options\n * The point options. Point options are handled as described under\n * the `series.type.data` item for each series type. For example\n * for a line series, if options is a single number, the point will\n * be given that number as the marin y value. If it is an array, it\n * will be interpreted as x and y values respectively. If it is an\n * object, advanced options are applied.\n *\n * @param {boolean} [redraw=true]\n * Whether to redraw the chart after the point is updated. If doing\n * more operations on the chart, it is best practice to set\n * `redraw` to false and call `chart.redraw()` after.\n *\n * @param {boolean|Partial} [animation=true]\n * Whether to apply animation, and optionally animation\n * configuration.\n *\n * @emits Highcharts.Point#event:update\n */\n Point.prototype.update = function (options, redraw, animation, runEvent) {\n var point = this,\n series = point.series,\n graphic = point.graphic,\n chart = series.chart,\n seriesOptions = series.options;\n var i;\n redraw = pick(redraw, true);\n /**\n * @private\n */\n function update() {\n point.applyOptions(options);\n // Update visuals, #4146\n // Handle mock graphic elements for a11y, #12718\n var hasMockGraphic = graphic && point.hasMockGraphic;\n var shouldDestroyGraphic = point.y === null ?\n !hasMockGraphic :\n hasMockGraphic;\n if (graphic && shouldDestroyGraphic) {\n point.graphic = graphic.destroy();\n delete point.hasMockGraphic;\n }\n if (isObject(options, true)) {\n // Destroy so we can get new elements\n if (graphic && graphic.element) {\n // \"null\" is also a valid symbol\n if (options &&\n options.marker &&\n typeof options.marker.symbol !== 'undefined') {\n point.graphic = graphic.destroy();\n }\n }\n if (options && options.dataLabels && point.dataLabel) {\n point.dataLabel = point.dataLabel.destroy(); // #2468\n }\n if (point.connector) {\n point.connector = point.connector.destroy(); // #7243\n }\n }\n // record changes in the parallel arrays\n i = point.index;\n series.updateParallelArrays(point, i);\n // Record the options to options.data. If the old or the new config\n // is an object, use point options, otherwise use raw options\n // (#4701, #4916).\n seriesOptions.data[i] = (isObject(seriesOptions.data[i], true) ||\n isObject(options, true)) ?\n point.options :\n pick(options, seriesOptions.data[i]);\n // redraw\n series.isDirty = series.isDirtyData = true;\n if (!series.fixedBox && series.hasCartesianSeries) { // #1906, #2320\n chart.isDirtyBox = true;\n }\n if (seriesOptions.legendType === 'point') { // #1831, #1885\n chart.isDirtyLegend = true;\n }\n if (redraw) {\n chart.redraw(animation);\n }\n }\n // Fire the event with a default handler of doing the update\n if (runEvent === false) { // When called from setData\n update();\n }\n else {\n point.firePointEvent('update', { options: options }, update);\n }\n };\n /**\n * Remove a point and optionally redraw the series and if necessary the axes\n *\n * @sample highcharts/plotoptions/series-point-events-remove/\n * Remove point and confirm\n * @sample highcharts/members/point-remove/\n * Remove pie slice\n * @sample maps/members/point-remove/\n * Remove selected points in Highmaps\n *\n * @function Highcharts.Point#remove\n *\n * @param {boolean} [redraw=true]\n * Whether to redraw the chart or wait for an explicit call. When\n * doing more operations on the chart, for example running\n * `point.remove()` in a loop, it is best practice to set `redraw`\n * to false and call `chart.redraw()` after.\n *\n * @param {boolean|Partial} [animation=false]\n * Whether to apply animation, and optionally animation\n * configuration.\n */\n Point.prototype.remove = function (redraw, animation) {\n this.series.removePoint(this.series.data.indexOf(this), redraw, animation);\n };\n /**\n * Toggle the selection status of a point.\n *\n * @see Highcharts.Chart#getSelectedPoints\n *\n * @sample highcharts/members/point-select/\n * Select a point from a button\n * @sample highcharts/chart/events-selection-points/\n * Select a range of points through a drag selection\n * @sample maps/series/data-id/\n * Select a point in Highmaps\n *\n * @function Highcharts.Point#select\n *\n * @param {boolean} [selected]\n * When `true`, the point is selected. When `false`, the point is\n * unselected. When `null` or `undefined`, the selection state is toggled.\n *\n * @param {boolean} [accumulate=false]\n * When `true`, the selection is added to other selected points.\n * When `false`, other selected points are deselected. Internally in\n * Highcharts, when\n * [allowPointSelect](https://api.highcharts.com/highcharts/plotOptions.series.allowPointSelect)\n * is `true`, selected points are accumulated on Control, Shift or Cmd\n * clicking the point.\n *\n * @emits Highcharts.Point#event:select\n * @emits Highcharts.Point#event:unselect\n */\n Point.prototype.select = function (selected, accumulate) {\n var point = this,\n series = point.series,\n chart = series.chart;\n selected = pick(selected, !point.selected);\n this.selectedStaging = selected;\n // fire the event with the default handler\n point.firePointEvent(selected ? 'select' : 'unselect', { accumulate: accumulate }, function () {\n /**\n * Whether the point is selected or not.\n *\n * @see Point#select\n * @see Chart#getSelectedPoints\n *\n * @name Highcharts.Point#selected\n * @type {boolean}\n */\n point.selected = point.options.selected = selected;\n series.options.data[series.data.indexOf(point)] =\n point.options;\n point.setState(selected && 'select');\n // unselect all other points unless Ctrl or Cmd + click\n if (!accumulate) {\n chart.getSelectedPoints().forEach(function (loopPoint) {\n var loopSeries = loopPoint.series;\n if (loopPoint.selected && loopPoint !== point) {\n loopPoint.selected = loopPoint.options.selected =\n false;\n loopSeries.options.data[loopSeries.data.indexOf(loopPoint)] = loopPoint.options;\n // Programatically selecting a point should restore\n // normal state, but when click happened on other\n // point, set inactive state to match other points\n loopPoint.setState(chart.hoverPoints &&\n loopSeries.options.inactiveOtherPoints ?\n 'inactive' : '');\n loopPoint.firePointEvent('unselect');\n }\n });\n }\n });\n delete this.selectedStaging;\n };\n /**\n * Runs on mouse over the point. Called internally from mouse and touch\n * events.\n *\n * @function Highcharts.Point#onMouseOver\n *\n * @param {Highcharts.PointerEventObject} [e]\n * The event arguments.\n */\n Point.prototype.onMouseOver = function (e) {\n var point = this,\n series = point.series,\n chart = series.chart,\n pointer = chart.pointer;\n e = e ?\n pointer.normalize(e) :\n // In cases where onMouseOver is called directly without an event\n pointer.getChartCoordinatesFromPoint(point, chart.inverted);\n pointer.runPointActions(e, point);\n };\n /**\n * Runs on mouse out from the point. Called internally from mouse and touch\n * events.\n *\n * @function Highcharts.Point#onMouseOut\n * @emits Highcharts.Point#event:mouseOut\n */\n Point.prototype.onMouseOut = function () {\n var point = this,\n chart = point.series.chart;\n point.firePointEvent('mouseOut');\n if (!point.series.options.inactiveOtherPoints) {\n (chart.hoverPoints || []).forEach(function (p) {\n p.setState();\n });\n }\n chart.hoverPoints = chart.hoverPoint = null;\n };\n /**\n * Import events from the series' and point's options. Only do it on\n * demand, to save processing time on hovering.\n *\n * @private\n * @function Highcharts.Point#importEvents\n */\n Point.prototype.importEvents = function () {\n if (!this.hasImportedEvents) {\n var point_1 = this,\n options = merge(point_1.series.options.point,\n point_1.options),\n events = options.events;\n point_1.events = events;\n objectEach(events, function (event, eventType) {\n if (isFunction(event)) {\n addEvent(point_1, eventType, event);\n }\n });\n this.hasImportedEvents = true;\n }\n };\n /**\n * Set the point's state.\n *\n * @function Highcharts.Point#setState\n *\n * @param {Highcharts.PointStateValue|\"\"} [state]\n * The new state, can be one of `'hover'`, `'select'`, `'inactive'`,\n * or `''` (an empty string), `'normal'` or `undefined` to set to\n * normal state.\n * @param {boolean} [move]\n * State for animation.\n *\n * @emits Highcharts.Point#event:afterSetState\n */\n Point.prototype.setState = function (state, move) {\n var point = this,\n series = point.series,\n previousState = point.state,\n stateOptions = (series.options.states[state || 'normal'] ||\n {}),\n markerOptions = (defaultOptions.plotOptions[series.type].marker &&\n series.options.marker),\n normalDisabled = (markerOptions && markerOptions.enabled === false),\n markerStateOptions = ((markerOptions &&\n markerOptions.states &&\n markerOptions.states[state || 'normal']) || {}),\n stateDisabled = markerStateOptions.enabled === false,\n pointMarker = point.marker || {},\n chart = series.chart,\n hasMarkers = (markerOptions && series.markerAttribs);\n var halo = series.halo,\n markerAttribs,\n pointAttribs,\n pointAttribsAnimation,\n stateMarkerGraphic = series.stateMarkerGraphic,\n newSymbol;\n state = state || ''; // empty string\n if (\n // already has this state\n (state === point.state && !move) ||\n // selected points don't respond to hover\n (point.selected && state !== 'select') ||\n // series' state options is disabled\n (stateOptions.enabled === false) ||\n // general point marker's state options is disabled\n (state && (stateDisabled ||\n (normalDisabled &&\n markerStateOptions.enabled === false))) ||\n // individual point marker's state options is disabled\n (state &&\n pointMarker.states &&\n pointMarker.states[state] &&\n pointMarker.states[state].enabled === false) // #1610\n ) {\n return;\n }\n point.state = state;\n if (hasMarkers) {\n markerAttribs = series.markerAttribs(point, state);\n }\n // Apply hover styles to the existing point\n // Prevent from mocked null points (#14966)\n if (point.graphic && !point.hasMockGraphic) {\n if (previousState) {\n point.graphic.removeClass('highcharts-point-' + previousState);\n }\n if (state) {\n point.graphic.addClass('highcharts-point-' + state);\n }\n if (!chart.styledMode) {\n pointAttribs = series.pointAttribs(point, state);\n pointAttribsAnimation = pick(chart.options.chart.animation, stateOptions.animation);\n var opacity_1 = pointAttribs.opacity;\n // Some inactive points (e.g. slices in pie) should apply\n // opacity also for their labels\n if (series.options.inactiveOtherPoints && isNumber(opacity_1)) {\n (point.dataLabels || []).forEach(function (label) {\n if (label &&\n !label.hasClass('highcharts-data-label-hidden')) {\n label.animate({ opacity: opacity_1 }, pointAttribsAnimation);\n }\n });\n if (point.connector) {\n point.connector.animate({ opacity: opacity_1 }, pointAttribsAnimation);\n }\n }\n point.graphic.animate(pointAttribs, pointAttribsAnimation);\n }\n if (markerAttribs) {\n point.graphic.animate(markerAttribs, pick(\n // Turn off globally:\n chart.options.chart.animation, markerStateOptions.animation, markerOptions.animation));\n }\n // Zooming in from a range with no markers to a range with markers\n if (stateMarkerGraphic) {\n stateMarkerGraphic.hide();\n }\n }\n else {\n // if a graphic is not applied to each point in the normal state,\n // create a shared graphic for the hover state\n if (state && markerStateOptions) {\n newSymbol = pointMarker.symbol || series.symbol;\n // If the point has another symbol than the previous one, throw\n // away the state marker graphic and force a new one (#1459)\n if (stateMarkerGraphic &&\n stateMarkerGraphic.currentSymbol !== newSymbol) {\n stateMarkerGraphic = stateMarkerGraphic.destroy();\n }\n // Add a new state marker graphic\n if (markerAttribs) {\n if (!stateMarkerGraphic) {\n if (newSymbol) {\n series.stateMarkerGraphic = stateMarkerGraphic =\n chart.renderer\n .symbol(newSymbol, markerAttribs.x, markerAttribs.y, markerAttribs.width, markerAttribs.height)\n .add(series.markerGroup);\n stateMarkerGraphic.currentSymbol = newSymbol;\n }\n // Move the existing graphic\n }\n else {\n stateMarkerGraphic[move ? 'animate' : 'attr']({\n x: markerAttribs.x,\n y: markerAttribs.y\n });\n }\n }\n if (!chart.styledMode && stateMarkerGraphic &&\n point.state !== 'inactive') {\n stateMarkerGraphic.attr(series.pointAttribs(point, state));\n }\n }\n if (stateMarkerGraphic) {\n stateMarkerGraphic[state && point.isInside ? 'show' : 'hide'](); // #2450\n stateMarkerGraphic.element.point = point; // #4310\n stateMarkerGraphic.addClass(point.getClassName(), true);\n }\n }\n // Show me your halo\n var haloOptions = stateOptions.halo;\n var markerGraphic = (point.graphic || stateMarkerGraphic);\n var markerVisibility = (markerGraphic && markerGraphic.visibility || 'inherit');\n if (haloOptions &&\n haloOptions.size &&\n markerGraphic &&\n markerVisibility !== 'hidden' &&\n !point.isCluster) {\n if (!halo) {\n series.halo = halo = chart.renderer.path()\n // #5818, #5903, #6705\n .add(markerGraphic.parentGroup);\n }\n halo.show()[move ? 'animate' : 'attr']({\n d: point.haloPath(haloOptions.size)\n });\n halo.attr({\n 'class': 'highcharts-halo highcharts-color-' +\n pick(point.colorIndex, series.colorIndex) +\n (point.className ? ' ' + point.className : ''),\n 'visibility': markerVisibility,\n 'zIndex': -1 // #4929, #8276\n });\n halo.point = point; // #6055\n if (!chart.styledMode) {\n halo.attr(extend({\n 'fill': point.color || series.color,\n 'fill-opacity': haloOptions.opacity\n }, AST.filterUserAttributes(haloOptions.attributes || {})));\n }\n }\n else if (halo && halo.point && halo.point.haloPath) {\n // Animate back to 0 on the current halo point (#6055)\n halo.animate({ d: halo.point.haloPath(0) }, null, \n // Hide after unhovering. The `complete` callback runs in the\n // halo's context (#7681).\n halo.hide);\n }\n fireEvent(point, 'afterSetState', { state: state });\n };\n /**\n * Get the path definition for the halo, which is usually a shadow-like\n * circle around the currently hovered point.\n *\n * @function Highcharts.Point#haloPath\n *\n * @param {number} size\n * The radius of the circular halo.\n *\n * @return {Highcharts.SVGPathArray}\n * The path definition.\n */\n Point.prototype.haloPath = function (size) {\n var pos = this.pos();\n return pos ? this.series.chart.renderer.symbols.circle(Math.floor(pos[0]) - size, pos[1] - size, size * 2, size * 2) : [];\n };\n return Point;\n }());\n /* *\n *\n * Default Export\n *\n * */\n /* *\n *\n * API Declarations\n *\n * */\n /**\n * Function callback when a series point is clicked. Return false to cancel the\n * action.\n *\n * @callback Highcharts.PointClickCallbackFunction\n *\n * @param {Highcharts.Point} this\n * The point where the event occured.\n *\n * @param {Highcharts.PointClickEventObject} event\n * Event arguments.\n */\n /**\n * Common information for a click event on a series point.\n *\n * @interface Highcharts.PointClickEventObject\n * @extends Highcharts.PointerEventObject\n */ /**\n * Clicked point.\n * @name Highcharts.PointClickEventObject#point\n * @type {Highcharts.Point}\n */\n /**\n * Configuration for the data label and tooltip formatters.\n *\n * @interface Highcharts.PointLabelObject\n */ /**\n * The point's current color.\n * @name Highcharts.PointLabelObject#color\n * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject|undefined}\n */ /**\n * The point's current color index, used in styled mode instead of `color`. The\n * color index is inserted in class names used for styling.\n * @name Highcharts.PointLabelObject#colorIndex\n * @type {number}\n */ /**\n * The name of the related point.\n * @name Highcharts.PointLabelObject#key\n * @type {string|undefined}\n */ /**\n * The percentage for related points in a stacked series or pies.\n * @name Highcharts.PointLabelObject#percentage\n * @type {number}\n */ /**\n * The related point. The point name, if defined, is available through\n * `this.point.name`.\n * @name Highcharts.PointLabelObject#point\n * @type {Highcharts.Point}\n */ /**\n * The related series. The series name is available through `this.series.name`.\n * @name Highcharts.PointLabelObject#series\n * @type {Highcharts.Series}\n */ /**\n * The total of values in either a stack for stacked series, or a pie in a pie\n * series.\n * @name Highcharts.PointLabelObject#total\n * @type {number|undefined}\n */ /**\n * For categorized axes this property holds the category name for the point. For\n * other axes it holds the X value.\n * @name Highcharts.PointLabelObject#x\n * @type {number|string|undefined}\n */ /**\n * The y value of the point.\n * @name Highcharts.PointLabelObject#y\n * @type {number|null|undefined}\n */\n /**\n * Gets fired when the mouse leaves the area close to the point.\n *\n * @callback Highcharts.PointMouseOutCallbackFunction\n *\n * @param {Highcharts.Point} this\n * Point where the event occured.\n *\n * @param {global.PointerEvent} event\n * Event that occured.\n */\n /**\n * Gets fired when the mouse enters the area close to the point.\n *\n * @callback Highcharts.PointMouseOverCallbackFunction\n *\n * @param {Highcharts.Point} this\n * Point where the event occured.\n *\n * @param {global.Event} event\n * Event that occured.\n */\n /**\n * The generic point options for all series.\n *\n * In TypeScript you have to extend `PointOptionsObject` with an additional\n * declaration to allow custom data options:\n *\n * ```\n * declare interface PointOptionsObject {\n * customProperty: string;\n * }\n * ```\n *\n * @interface Highcharts.PointOptionsObject\n */\n /**\n * Possible option types for a data point. Use `null` to indicate a gap.\n *\n * @typedef {number|string|Highcharts.PointOptionsObject|Array<(number|string|null)>|null} Highcharts.PointOptionsType\n */\n /**\n * Gets fired when the point is removed using the `.remove()` method.\n *\n * @callback Highcharts.PointRemoveCallbackFunction\n *\n * @param {Highcharts.Point} this\n * Point where the event occured.\n *\n * @param {global.Event} event\n * Event that occured.\n */\n /**\n * Possible key values for the point state options.\n *\n * @typedef {\"hover\"|\"inactive\"|\"normal\"|\"select\"} Highcharts.PointStateValue\n */\n /**\n * Gets fired when the point is updated programmatically through the `.update()`\n * method.\n *\n * @callback Highcharts.PointUpdateCallbackFunction\n *\n * @param {Highcharts.Point} this\n * Point where the event occured.\n *\n * @param {Highcharts.PointUpdateEventObject} event\n * Event that occured.\n */\n /**\n * Information about the update event.\n *\n * @interface Highcharts.PointUpdateEventObject\n * @extends global.Event\n */ /**\n * Options data of the update event.\n * @name Highcharts.PointUpdateEventObject#options\n * @type {Highcharts.PointOptionsType}\n */\n /**\n * @interface Highcharts.PointEventsOptionsObject\n */ /**\n * Fires when the point is selected either programmatically or following a click\n * on the point. One parameter, `event`, is passed to the function. Returning\n * `false` cancels the operation.\n * @name Highcharts.PointEventsOptionsObject#select\n * @type {Highcharts.PointSelectCallbackFunction|undefined}\n */ /**\n * Fires when the point is unselected either programmatically or following a\n * click on the point. One parameter, `event`, is passed to the function.\n * Returning `false` cancels the operation.\n * @name Highcharts.PointEventsOptionsObject#unselect\n * @type {Highcharts.PointUnselectCallbackFunction|undefined}\n */\n /**\n * Information about the select/unselect event.\n *\n * @interface Highcharts.PointInteractionEventObject\n * @extends global.Event\n */ /**\n * @name Highcharts.PointInteractionEventObject#accumulate\n * @type {boolean}\n */\n /**\n * Gets fired when the point is selected either programmatically or following a\n * click on the point.\n *\n * @callback Highcharts.PointSelectCallbackFunction\n *\n * @param {Highcharts.Point} this\n * Point where the event occured.\n *\n * @param {Highcharts.PointInteractionEventObject} event\n * Event that occured.\n */\n /**\n * Fires when the point is unselected either programmatically or following a\n * click on the point.\n *\n * @callback Highcharts.PointUnselectCallbackFunction\n *\n * @param {Highcharts.Point} this\n * Point where the event occured.\n *\n * @param {Highcharts.PointInteractionEventObject} event\n * Event that occured.\n */\n ''; // keeps doclets above in JS file.\n\n return Point;\n });\n _registerModule(_modules, 'Core/Pointer.js', [_modules['Core/Color/Color.js'], _modules['Core/Globals.js'], _modules['Core/Tooltip.js'], _modules['Core/Utilities.js']], function (Color, H, Tooltip, U) {\n /* *\n *\n * (c) 2010-2021 Torstein Honsi\n *\n * License: www.highcharts.com/license\n *\n * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!\n *\n * */\n var color = Color.parse;\n var charts = H.charts,\n noop = H.noop;\n var addEvent = U.addEvent,\n attr = U.attr,\n css = U.css,\n defined = U.defined,\n extend = U.extend,\n find = U.find,\n fireEvent = U.fireEvent,\n isNumber = U.isNumber,\n isObject = U.isObject,\n objectEach = U.objectEach,\n offset = U.offset,\n pick = U.pick,\n splat = U.splat;\n /* *\n *\n * Class\n *\n * */\n /* eslint-disable no-invalid-this, valid-jsdoc */\n /**\n * The mouse and touch tracker object. Each {@link Chart} item has one\n * associated Pointer item that can be accessed from the {@link Chart.pointer}\n * property.\n *\n * @class\n * @name Highcharts.Pointer\n *\n * @param {Highcharts.Chart} chart\n * The chart instance.\n *\n * @param {Highcharts.Options} options\n * The root options object. The pointer uses options from the chart and tooltip\n * structures.\n */\n var Pointer = /** @class */ (function () {\n /* *\n *\n * Constructors\n *\n * */\n function Pointer(chart, options) {\n this.lastValidTouch = {};\n this.pinchDown = [];\n this.runChartClick = false;\n this.eventsToUnbind = [];\n this.chart = chart;\n this.hasDragged = false;\n this.options = options;\n this.init(chart, options);\n }\n /* *\n *\n * Functions\n *\n * */\n /**\n * Set inactive state to all series that are not currently hovered,\n * or, if `inactiveOtherPoints` is set to true, set inactive state to\n * all points within that series.\n *\n * @private\n * @function Highcharts.Pointer#applyInactiveState\n *\n * @param {Array} points\n * Currently hovered points\n */\n Pointer.prototype.applyInactiveState = function (points) {\n var activeSeries = [],\n series;\n // Get all active series from the hovered points\n (points || []).forEach(function (item) {\n series = item.series;\n // Include itself\n activeSeries.push(series);\n // Include parent series\n if (series.linkedParent) {\n activeSeries.push(series.linkedParent);\n }\n // Include all child series\n if (series.linkedSeries) {\n activeSeries = activeSeries.concat(series.linkedSeries);\n }\n // Include navigator series\n if (series.navigatorSeries) {\n activeSeries.push(series.navigatorSeries);\n }\n });\n // Now loop over all series, filtering out active series\n this.chart.series.forEach(function (inactiveSeries) {\n if (activeSeries.indexOf(inactiveSeries) === -1) {\n // Inactive series\n inactiveSeries.setState('inactive', true);\n }\n else if (inactiveSeries.options.inactiveOtherPoints) {\n // Active series, but other points should be inactivated\n inactiveSeries.setAllPointsToState('inactive');\n }\n });\n };\n /**\n * Destroys the Pointer object and disconnects DOM events.\n *\n * @function Highcharts.Pointer#destroy\n */\n Pointer.prototype.destroy = function () {\n var pointer = this;\n this.eventsToUnbind.forEach(function (unbind) { return unbind(); });\n this.eventsToUnbind = [];\n if (!H.chartCount) {\n if (Pointer.unbindDocumentMouseUp) {\n Pointer.unbindDocumentMouseUp = Pointer.unbindDocumentMouseUp();\n }\n if (Pointer.unbindDocumentTouchEnd) {\n Pointer.unbindDocumentTouchEnd = (Pointer.unbindDocumentTouchEnd());\n }\n }\n // memory and CPU leak\n clearInterval(pointer.tooltipTimeout);\n objectEach(pointer, function (_val, prop) {\n pointer[prop] = void 0;\n });\n };\n /**\n * Calculate attrs for selection marker.\n * @private\n * @function Highcharts.Pointer#getSelectionMarkerAttrs\n * @emits getSelectionMarkerAttrs\n */\n Pointer.prototype.getSelectionMarkerAttrs = function (chartX, chartY) {\n var _this = this;\n var e = {\n args: { chartX: chartX,\n chartY: chartY },\n attrs: {},\n shapeType: 'rect'\n };\n fireEvent(this, 'getSelectionMarkerAttrs', e, function (e) {\n var _a = _this,\n chart = _a.chart,\n _b = _a.mouseDownX,\n mouseDownX = _b === void 0 ? 0 : _b,\n _c = _a.mouseDownY,\n mouseDownY = _c === void 0 ? 0 : _c,\n zoomHor = _a.zoomHor,\n zoomVert = _a.zoomVert,\n attrs = e.attrs;\n var size;\n attrs.x = chart.plotLeft;\n attrs.y = chart.plotTop;\n attrs.width = zoomHor ? 1 : chart.plotWidth;\n attrs.height = zoomVert ? 1 : chart.plotHeight;\n // Adjust the width of the selection marker\n if (zoomHor) {\n size = chartX - mouseDownX;\n attrs.width = Math.abs(size);\n attrs.x = (size > 0 ? 0 : size) + mouseDownX;\n }\n // Adjust the height of the selection marker\n if (zoomVert) {\n size = chartY - mouseDownY;\n attrs.height = Math.abs(size);\n attrs.y = (size > 0 ? 0 : size) + mouseDownY;\n }\n });\n return e;\n };\n /**\n * Perform a drag operation in response to a mousemove event while the mouse\n * is down.\n * @private\n * @function Highcharts.Pointer#drag\n */\n Pointer.prototype.drag = function (e) {\n var chart = this.chart,\n chartOptions = chart.options.chart,\n plotLeft = chart.plotLeft,\n plotTop = chart.plotTop,\n plotWidth = chart.plotWidth,\n plotHeight = chart.plotHeight,\n mouseDownX = (this.mouseDownX || 0),\n mouseDownY = (this.mouseDownY || 0),\n panningEnabled = isObject(chartOptions.panning) ?\n chartOptions.panning && chartOptions.panning.enabled :\n chartOptions.panning,\n panKey = (chartOptions.panKey && e[chartOptions.panKey + 'Key']);\n var chartX = e.chartX,\n chartY = e.chartY,\n clickedInside,\n selectionMarker = this.selectionMarker;\n // If the device supports both touch and mouse (like IE11), and we are\n // touch-dragging inside the plot area, don't handle the mouse event.\n // #4339.\n if (selectionMarker && selectionMarker.touch) {\n return;\n }\n // If the mouse is outside the plot area, adjust to coordinates\n // inside to prevent the selection marker from going outside\n if (chartX < plotLeft) {\n chartX = plotLeft;\n }\n else if (chartX > plotLeft + plotWidth) {\n chartX = plotLeft + plotWidth;\n }\n if (chartY < plotTop) {\n chartY = plotTop;\n }\n else if (chartY > plotTop + plotHeight) {\n chartY = plotTop + plotHeight;\n }\n // determine if the mouse has moved more than 10px\n this.hasDragged = Math.sqrt(Math.pow(mouseDownX - chartX, 2) +\n Math.pow(mouseDownY - chartY, 2));\n if (this.hasDragged > 10) {\n clickedInside = chart.isInsidePlot(mouseDownX - plotLeft, mouseDownY - plotTop, {\n visiblePlotOnly: true\n });\n var _a = this.getSelectionMarkerAttrs(chartX,\n chartY),\n shapeType = _a.shapeType,\n attrs = _a.attrs;\n // make a selection\n if ((chart.hasCartesianSeries || chart.mapView) &&\n (this.zoomX || this.zoomY) &&\n clickedInside &&\n !panKey) {\n if (!selectionMarker) {\n this.selectionMarker = selectionMarker =\n chart.renderer[shapeType]();\n selectionMarker\n .attr({\n 'class': 'highcharts-selection-marker',\n zIndex: 7\n })\n .add();\n if (!chart.styledMode) {\n selectionMarker.attr({\n fill: chartOptions.selectionMarkerFill ||\n color(\"#335cad\" /* Palette.highlightColor80 */)\n .setOpacity(0.25).get()\n });\n }\n }\n }\n if (selectionMarker) {\n selectionMarker.attr(attrs);\n }\n // panning\n if (clickedInside &&\n !selectionMarker &&\n panningEnabled) {\n chart.pan(e, chartOptions.panning);\n }\n }\n };\n /**\n * Start a drag operation.\n * @private\n * @function Highcharts.Pointer#dragStart\n */\n Pointer.prototype.dragStart = function (e) {\n var chart = this.chart;\n // Record the start position\n chart.mouseIsDown = e.type;\n chart.cancelClick = false;\n chart.mouseDownX = this.mouseDownX = e.chartX;\n chart.mouseDownY = this.mouseDownY = e.chartY;\n };\n /**\n * Get selection box to calculate extremes\n * @private\n * @function Highcharts.Pointer#getSelectionBox\n * @emits getSelectionBox\n */\n Pointer.prototype.getSelectionBox = function (marker) {\n var e = {\n args: { marker: marker },\n result: {}\n };\n fireEvent(this, 'getSelectionBox', e, function (e) {\n e.result = {\n x: marker.attr ? +marker.attr('x') : marker.x,\n y: marker.attr ? +marker.attr('y') : marker.y,\n width: marker.attr ? marker.attr('width') : marker.width,\n height: marker.attr ? marker.attr('height') : marker.height\n };\n });\n return e.result;\n };\n /**\n * On mouse up or touch end across the entire document, drop the selection.\n * @private\n * @function Highcharts.Pointer#drop\n */\n Pointer.prototype.drop = function (e) {\n var pointer = this,\n chart = this.chart,\n hasPinched = this.hasPinched;\n if (this.selectionMarker) {\n var _a = this.getSelectionBox(this.selectionMarker),\n x_1 = _a.x,\n y_1 = _a.y,\n width_1 = _a.width,\n height_1 = _a.height;\n var selectionData_1 = {\n originalEvent: e,\n xAxis: [],\n yAxis: [],\n x: x_1,\n y: y_1,\n width: width_1,\n height: height_1\n }, \n // Start by false runZoom, unless when we have a mapView, in\n // which case the zoom will be handled in the selection event.\n runZoom_1 = Boolean(chart.mapView);\n // a selection has been made\n if (this.hasDragged || hasPinched) {\n // record each axis' min and max\n chart.axes.forEach(function (axis) {\n if (axis.zoomEnabled &&\n defined(axis.min) &&\n (hasPinched ||\n pointer[{\n xAxis: 'zoomX',\n yAxis: 'zoomY'\n }[axis.coll]]) &&\n isNumber(x_1) &&\n isNumber(y_1) &&\n isNumber(width_1) &&\n isNumber(height_1)) { // #859, #3569\n var horiz = axis.horiz,\n minPixelPadding = e.type === 'touchend' ?\n axis.minPixelPadding :\n 0, // #1207, #3075\n selectionMin = axis.toValue((horiz ? x_1 : y_1) + minPixelPadding),\n selectionMax = axis.toValue((horiz ? x_1 + width_1 : y_1 + height_1) -\n minPixelPadding);\n selectionData_1[axis.coll].push({\n axis: axis,\n // Min/max for reversed axes\n min: Math.min(selectionMin, selectionMax),\n max: Math.max(selectionMin, selectionMax)\n });\n runZoom_1 = true;\n }\n });\n if (runZoom_1) {\n fireEvent(chart, 'selection', selectionData_1, function (args) {\n chart.zoom(extend(args, hasPinched ?\n { animation: false } :\n null));\n });\n }\n }\n if (isNumber(chart.index)) {\n this.selectionMarker = this.selectionMarker.destroy();\n }\n // Reset scaling preview\n if (hasPinched) {\n this.scaleGroups();\n }\n }\n // Reset all. Check isNumber because it may be destroyed on mouse up\n // (#877)\n if (chart && isNumber(chart.index)) {\n css(chart.container, { cursor: chart._cursor });\n chart.cancelClick = this.hasDragged > 10; // #370\n chart.mouseIsDown = this.hasDragged = this.hasPinched = false;\n this.pinchDown = [];\n }\n };\n /**\n * Finds the closest point to a set of coordinates, using the k-d-tree\n * algorithm.\n *\n * @function Highcharts.Pointer#findNearestKDPoint\n *\n * @param {Array} series\n * All the series to search in.\n *\n * @param {boolean|undefined} shared\n * Whether it is a shared tooltip or not.\n *\n * @param {Highcharts.PointerEventObject} e\n * The pointer event object, containing chart coordinates of the pointer.\n *\n * @return {Highcharts.Point|undefined}\n * The point closest to given coordinates.\n */\n Pointer.prototype.findNearestKDPoint = function (series, shared, e) {\n var closest;\n /** @private */\n function sort(p1, p2) {\n var isCloserX = p1.distX - p2.distX,\n isCloser = p1.dist - p2.dist,\n isAbove = ((p2.series.group && p2.series.group.zIndex) -\n (p1.series.group && p1.series.group.zIndex));\n var result;\n // We have two points which are not in the same place on xAxis\n // and shared tooltip:\n if (isCloserX !== 0 && shared) { // #5721\n result = isCloserX;\n // Points are not exactly in the same place on x/yAxis:\n }\n else if (isCloser !== 0) {\n result = isCloser;\n // The same xAxis and yAxis position, sort by z-index:\n }\n else if (isAbove !== 0) {\n result = isAbove;\n // The same zIndex, sort by array index:\n }\n else {\n result =\n p1.series.index > p2.series.index ?\n -1 :\n 1;\n }\n return result;\n }\n series.forEach(function (s) {\n var noSharedTooltip = s.noSharedTooltip && shared,\n compareX = (!noSharedTooltip &&\n s.options.findNearestPointBy.indexOf('y') < 0),\n point = s.searchPoint(e,\n compareX);\n if ( // Check that we actually found a point on the series.\n isObject(point, true) && point.series &&\n // Use the new point if it is closer.\n (!isObject(closest, true) ||\n (sort(closest, point) > 0))) {\n closest = point;\n }\n });\n return closest;\n };\n /**\n * @private\n * @function Highcharts.Pointer#getChartCoordinatesFromPoint\n */\n Pointer.prototype.getChartCoordinatesFromPoint = function (point, inverted) {\n var series = point.series,\n xAxis = series.xAxis,\n yAxis = series.yAxis,\n shapeArgs = point.shapeArgs;\n if (xAxis && yAxis) {\n var x = pick(point.clientX,\n point.plotX);\n var y = point.plotY || 0;\n if (point.isNode &&\n shapeArgs &&\n isNumber(shapeArgs.x) &&\n isNumber(shapeArgs.y)) {\n x = shapeArgs.x;\n y = shapeArgs.y;\n }\n return inverted ? {\n chartX: yAxis.len + yAxis.pos - y,\n chartY: xAxis.len + xAxis.pos - x\n } : {\n chartX: x + xAxis.pos,\n chartY: y + yAxis.pos\n };\n }\n if (shapeArgs && shapeArgs.x && shapeArgs.y) {\n // E.g. pies do not have axes\n return {\n chartX: shapeArgs.x,\n chartY: shapeArgs.y\n };\n }\n };\n /**\n * Return the cached chartPosition if it is available on the Pointer,\n * otherwise find it. Running offset is quite expensive, so it should be\n * avoided when we know the chart hasn't moved.\n *\n * @function Highcharts.Pointer#getChartPosition\n *\n * @return {Highcharts.ChartPositionObject}\n * The offset of the chart container within the page\n */\n Pointer.prototype.getChartPosition = function () {\n if (this.chartPosition) {\n return this.chartPosition;\n }\n var container = this.chart.container;\n var pos = offset(container);\n this.chartPosition = {\n left: pos.left,\n top: pos.top,\n scaleX: 1,\n scaleY: 1\n };\n var offsetWidth = container.offsetWidth;\n var offsetHeight = container.offsetHeight;\n // #13342 - tooltip was not visible in Chrome, when chart\n // updates height.\n if (offsetWidth > 2 && // #13342\n offsetHeight > 2 // #13342\n ) {\n this.chartPosition.scaleX = pos.width / offsetWidth;\n this.chartPosition.scaleY = pos.height / offsetHeight;\n }\n return this.chartPosition;\n };\n /**\n * Get the click position in terms of axis values.\n *\n * @function Highcharts.Pointer#getCoordinates\n *\n * @param {Highcharts.PointerEventObject} e\n * Pointer event, extended with `chartX` and `chartY` properties.\n *\n * @return {Highcharts.PointerAxisCoordinatesObject}\n * Axis coordinates.\n */\n Pointer.prototype.getCoordinates = function (e) {\n var coordinates = {\n xAxis: [],\n yAxis: []\n };\n this.chart.axes.forEach(function (axis) {\n coordinates[axis.isXAxis ? 'xAxis' : 'yAxis'].push({\n axis: axis,\n value: axis.toValue(e[axis.horiz ? 'chartX' : 'chartY'])\n });\n });\n return coordinates;\n };\n /**\n * Calculates what is the current hovered point/points and series.\n *\n * @private\n * @function Highcharts.Pointer#getHoverData\n *\n * @param {Highcharts.Point|undefined} existingHoverPoint\n * The point currently being hovered.\n *\n * @param {Highcharts.Series|undefined} existingHoverSeries\n * The series currently being hovered.\n *\n * @param {Array} series\n * All the series in the chart.\n *\n * @param {boolean} isDirectTouch\n * Is the pointer directly hovering the point.\n *\n * @param {boolean|undefined} shared\n * Whether it is a shared tooltip or not.\n *\n * @param {Highcharts.PointerEventObject} [e]\n * The triggering event, containing chart coordinates of the pointer.\n *\n * @return {Object}\n * Object containing resulting hover data: hoverPoint, hoverSeries, and\n * hoverPoints.\n */\n Pointer.prototype.getHoverData = function (existingHoverPoint, existingHoverSeries, series, isDirectTouch, shared, e) {\n var hoverPoints = [],\n useExisting = !!(isDirectTouch && existingHoverPoint),\n filter = function (s) {\n return (s.visible &&\n !(!shared && s.directTouch) && // #3821\n pick(s.options.enableMouseTracking,\n true));\n };\n var hoverSeries = existingHoverSeries, \n // Which series to look in for the hover point\n searchSeries, \n // Parameters needed for beforeGetHoverData event.\n eventArgs = {\n chartX: e ? e.chartX : void 0,\n chartY: e ? e.chartY : void 0,\n shared: shared\n };\n // Find chart.hoverPane and update filter method in polar.\n fireEvent(this, 'beforeGetHoverData', eventArgs);\n var notSticky = hoverSeries && !hoverSeries.stickyTracking;\n searchSeries = notSticky ?\n // Only search on hovered series if it has stickyTracking false\n [hoverSeries] :\n // Filter what series to look in.\n series.filter(function (s) { return s.stickyTracking &&\n (eventArgs.filter || filter)(s); });\n // Use existing hovered point or find the one closest to coordinates.\n var hoverPoint = useExisting || !e ?\n existingHoverPoint :\n this.findNearestKDPoint(searchSeries,\n shared,\n e);\n // Assign hover series\n hoverSeries = hoverPoint && hoverPoint.series;\n // If we have a hoverPoint, assign hoverPoints.\n if (hoverPoint) {\n // When tooltip is shared, it displays more than one point\n if (shared && !hoverSeries.noSharedTooltip) {\n searchSeries = series.filter(function (s) {\n return eventArgs.filter ?\n eventArgs.filter(s) : filter(s) && !s.noSharedTooltip;\n });\n // Get all points with the same x value as the hoverPoint\n searchSeries.forEach(function (s) {\n var point = find(s.points,\n function (p) {\n return p.x === hoverPoint.x && !p.isNull;\n });\n if (isObject(point)) {\n /*\n * Boost returns a minimal point. Convert it to a usable\n * point for tooltip and states.\n */\n if (s.boosted && s.boost) {\n point = s.boost.getPoint(point);\n }\n hoverPoints.push(point);\n }\n });\n }\n else {\n hoverPoints.push(hoverPoint);\n }\n }\n // Check whether the hoverPoint is inside pane we are hovering over.\n eventArgs = { hoverPoint: hoverPoint };\n fireEvent(this, 'afterGetHoverData', eventArgs);\n return {\n hoverPoint: eventArgs.hoverPoint,\n hoverSeries: hoverSeries,\n hoverPoints: hoverPoints\n };\n };\n /**\n * @private\n * @function Highcharts.Pointer#getPointFromEvent\n */\n Pointer.prototype.getPointFromEvent = function (e) {\n var target = e.target,\n point;\n while (target && !point) {\n point = target.point;\n target = target.parentNode;\n }\n return point;\n };\n /**\n * @private\n * @function Highcharts.Pointer#onTrackerMouseOut\n */\n Pointer.prototype.onTrackerMouseOut = function (e) {\n var chart = this.chart;\n var relatedTarget = e.relatedTarget || e.toElement;\n var series = chart.hoverSeries;\n this.isDirectTouch = false;\n if (series &&\n relatedTarget &&\n !series.stickyTracking &&\n !this.inClass(relatedTarget, 'highcharts-tooltip') &&\n (!this.inClass(relatedTarget, 'highcharts-series-' + series.index) || // #2499, #4465, #5553\n !this.inClass(relatedTarget, 'highcharts-tracker'))) {\n series.onMouseOut();\n }\n };\n /**\n * Utility to detect whether an element has, or has a parent with, a\n * specific class name. Used on detection of tracker objects and on deciding\n * whether hovering the tooltip should cause the active series to mouse out.\n *\n * @function Highcharts.Pointer#inClass\n *\n * @param {Highcharts.SVGDOMElement|Highcharts.HTMLDOMElement} element\n * The element to investigate.\n *\n * @param {string} className\n * The class name to look for.\n *\n * @return {boolean|undefined}\n * True if either the element or one of its parents has the given class\n * name.\n */\n Pointer.prototype.inClass = function (element, className) {\n var elem = element,\n elemClassName;\n while (elem) {\n elemClassName = attr(elem, 'class');\n if (elemClassName) {\n if (elemClassName.indexOf(className) !== -1) {\n return true;\n }\n if (elemClassName.indexOf('highcharts-container') !== -1) {\n return false;\n }\n }\n elem = elem.parentElement;\n }\n };\n /**\n * Initialize the Pointer.\n *\n * @private\n * @function Highcharts.Pointer#init\n *\n * @param {Highcharts.Chart} chart\n * The Chart instance.\n *\n * @param {Highcharts.Options} options\n * The root options object. The pointer uses options from the chart and\n * tooltip structures.\n */\n Pointer.prototype.init = function (chart, options) {\n // Store references\n this.options = options;\n this.chart = chart;\n // Do we need to handle click on a touch device?\n this.runChartClick = Boolean(options.chart.events && options.chart.events.click);\n this.pinchDown = [];\n this.lastValidTouch = {};\n if (Tooltip) {\n /**\n * Tooltip object for points of series.\n *\n * @name Highcharts.Chart#tooltip\n * @type {Highcharts.Tooltip}\n */\n chart.tooltip = new Tooltip(chart, options.tooltip);\n }\n this.setDOMEvents();\n };\n /**\n * Takes a browser event object and extends it with custom Highcharts\n * properties `chartX` and `chartY` in order to work on the internal\n * coordinate system.\n *\n * On map charts, the properties `lon` and `lat` are added to the event\n * object given that the chart has projection information.\n *\n * @function Highcharts.Pointer#normalize\n *\n * @param {global.MouseEvent|global.PointerEvent|global.TouchEvent} e\n * Event object in standard browsers.\n *\n * @param {Highcharts.OffsetObject} [chartPosition]\n * Additional chart offset.\n *\n * @return {Highcharts.PointerEventObject}\n * A browser event with extended properties `chartX` and `chartY`.\n */\n Pointer.prototype.normalize = function (e, chartPosition) {\n var touches = e.touches;\n // iOS (#2757)\n var ePos = (touches ?\n touches.length ?\n touches.item(0) :\n (pick(// #13534\n touches.changedTouches,\n e.changedTouches))[0] :\n e);\n // Get mouse position\n if (!chartPosition) {\n chartPosition = this.getChartPosition();\n }\n var chartX = ePos.pageX - chartPosition.left,\n chartY = ePos.pageY - chartPosition.top;\n // #11329 - when there is scaling on a parent element, we need to take\n // this into account\n chartX /= chartPosition.scaleX;\n chartY /= chartPosition.scaleY;\n return extend(e, {\n chartX: Math.round(chartX),\n chartY: Math.round(chartY)\n });\n };\n /**\n * @private\n * @function Highcharts.Pointer#onContainerClick\n */\n Pointer.prototype.onContainerClick = function (e) {\n var chart = this.chart;\n var hoverPoint = chart.hoverPoint;\n var pEvt = this.normalize(e);\n var plotLeft = chart.plotLeft;\n var plotTop = chart.plotTop;\n if (!chart.cancelClick) {\n // On tracker click, fire the series and point events. #783, #1583\n if (hoverPoint &&\n this.inClass(pEvt.target, 'highcharts-tracker')) {\n // the series click event\n fireEvent(hoverPoint.series, 'click', extend(pEvt, {\n point: hoverPoint\n }));\n // the point click event\n if (chart.hoverPoint) { // it may be destroyed (#1844)\n hoverPoint.firePointEvent('click', pEvt);\n }\n // When clicking outside a tracker, fire a chart event\n }\n else {\n extend(pEvt, this.getCoordinates(pEvt));\n // fire a click event in the chart\n if (chart.isInsidePlot(pEvt.chartX - plotLeft, pEvt.chartY - plotTop, {\n visiblePlotOnly: true\n })) {\n fireEvent(chart, 'click', pEvt);\n }\n }\n }\n };\n /**\n * @private\n * @function Highcharts.Pointer#onContainerMouseDown\n */\n Pointer.prototype.onContainerMouseDown = function (e) {\n var isPrimaryButton = ((e.buttons || e.button) & 1) === 1;\n // Normalize before the 'if' for the legacy IE (#7850)\n e = this.normalize(e);\n // #11635, Firefox does not reliable fire move event after click scroll\n if (H.isFirefox &&\n e.button !== 0) {\n this.onContainerMouseMove(e);\n }\n // #11635, limiting to primary button (incl. IE 8 support)\n if (typeof e.button === 'undefined' ||\n isPrimaryButton) {\n this.zoomOption(e);\n // #295, #13737 solve conflict between container drag and chart zoom\n if (isPrimaryButton &&\n e.preventDefault) {\n e.preventDefault();\n }\n this.dragStart(e);\n }\n };\n /**\n * When mouse leaves the container, hide the tooltip.\n * @private\n * @function Highcharts.Pointer#onContainerMouseLeave\n */\n Pointer.prototype.onContainerMouseLeave = function (e) {\n var chart = charts[pick(Pointer.hoverChartIndex, -1)];\n var tooltip = this.chart.tooltip;\n e = this.normalize(e);\n // #4886, MS Touch end fires mouseleave but with no related target\n if (chart &&\n (e.relatedTarget || e.toElement)) {\n chart.pointer.reset();\n // Also reset the chart position, used in #149 fix\n chart.pointer.chartPosition = void 0;\n }\n // #11635, Firefox wheel scroll does not fire out events consistently\n if (tooltip && !tooltip.isHidden) {\n this.reset();\n }\n };\n /**\n * When mouse enters the container, delete pointer's chartPosition.\n * @private\n * @function Highcharts.Pointer#onContainerMouseEnter\n */\n Pointer.prototype.onContainerMouseEnter = function (e) {\n delete this.chartPosition;\n };\n /**\n * The mousemove, touchmove and touchstart event handler\n * @private\n * @function Highcharts.Pointer#onContainerMouseMove\n */\n Pointer.prototype.onContainerMouseMove = function (e) {\n var chart = this.chart,\n tooltip = chart.tooltip,\n pEvt = this.normalize(e);\n this.setHoverChartIndex();\n // In IE8 we apparently need this returnValue set to false in order to\n // avoid text being selected. But in Chrome, e.returnValue is prevented,\n // plus we don't need to run e.preventDefault to prevent selected text\n // in modern browsers. So we set it conditionally. Remove it when IE8 is\n // no longer needed. #2251, #3224.\n if (!pEvt.preventDefault) {\n pEvt.returnValue = false;\n }\n if (chart.mouseIsDown === 'mousedown' || this.touchSelect(pEvt)) {\n this.drag(pEvt);\n }\n // Show the tooltip and run mouse over events (#977)\n if (!chart.openMenu &&\n (this.inClass(pEvt.target, 'highcharts-tracker') ||\n chart.isInsidePlot(pEvt.chartX - chart.plotLeft, pEvt.chartY - chart.plotTop, {\n visiblePlotOnly: true\n })) &&\n // If the tooltip has stickOnContact enabled, do nothing. This\n // applies regardless of any combinations of the `split` and\n // `useHTML` options.\n !(tooltip &&\n tooltip.shouldStickOnContact(pEvt))) {\n if (this.inClass(pEvt.target, 'highcharts-no-tooltip')) {\n this.reset(false, 0);\n }\n else {\n this.runPointActions(pEvt);\n }\n }\n };\n /**\n * @private\n * @function Highcharts.Pointer#onDocumentTouchEnd\n */\n Pointer.prototype.onDocumentTouchEnd = function (e) {\n var hoverChart = charts[pick(Pointer.hoverChartIndex, -1)];\n if (hoverChart) {\n hoverChart.pointer.drop(e);\n }\n };\n /**\n * @private\n * @function Highcharts.Pointer#onContainerTouchMove\n */\n Pointer.prototype.onContainerTouchMove = function (e) {\n if (this.touchSelect(e)) {\n this.onContainerMouseMove(e);\n }\n else {\n this.touch(e);\n }\n };\n /**\n * @private\n * @function Highcharts.Pointer#onContainerTouchStart\n */\n Pointer.prototype.onContainerTouchStart = function (e) {\n if (this.touchSelect(e)) {\n this.onContainerMouseDown(e);\n }\n else {\n this.zoomOption(e);\n this.touch(e, true);\n }\n };\n /**\n * Special handler for mouse move that will hide the tooltip when the mouse\n * leaves the plotarea. Issue #149 workaround. The mouseleave event does not\n * always fire.\n * @private\n * @function Highcharts.Pointer#onDocumentMouseMove\n */\n Pointer.prototype.onDocumentMouseMove = function (e) {\n var chart = this.chart;\n var tooltip = chart.tooltip;\n var chartPosition = this.chartPosition;\n var pEvt = this.normalize(e,\n chartPosition);\n // If we're outside, hide the tooltip\n if (chartPosition &&\n !chart.isInsidePlot(pEvt.chartX - chart.plotLeft, pEvt.chartY - chart.plotTop, {\n visiblePlotOnly: true\n }) &&\n !(tooltip &&\n tooltip.shouldStickOnContact(pEvt)) &&\n !this.inClass(pEvt.target, 'highcharts-tracker')) {\n this.reset();\n }\n };\n /**\n * @private\n * @function Highcharts.Pointer#onDocumentMouseUp\n */\n Pointer.prototype.onDocumentMouseUp = function (e) {\n var chart = charts[pick(Pointer.hoverChartIndex, -1)];\n if (chart) {\n chart.pointer.drop(e);\n }\n };\n /**\n * Handle touch events with two touches\n * @private\n * @function Highcharts.Pointer#pinch\n */\n Pointer.prototype.pinch = function (e) {\n var self = this,\n chart = self.chart,\n pinchDown = self.pinchDown,\n touches = (e.touches || []),\n touchesLength = touches.length,\n lastValidTouch = self.lastValidTouch,\n hasZoom = self.hasZoom,\n transform = {},\n fireClickEvent = touchesLength === 1 && ((self.inClass(e.target, 'highcharts-tracker') &&\n chart.runTrackerClick) ||\n self.runChartClick),\n clip = {},\n tooltip = self.chart.tooltip,\n followTouchMove = touchesLength === 1 &&\n pick((tooltip && tooltip.options.followTouchMove),\n true);\n var selectionMarker = self.selectionMarker;\n // Don't initiate panning until the user has pinched. This prevents us\n // from blocking page scrolling as users scroll down a long page\n // (#4210).\n if (touchesLength > 1) {\n self.initiated = true;\n }\n else if (followTouchMove) {\n // #16119: Prevent blocking scroll when single-finger panning is\n // not enabled\n self.initiated = false;\n }\n // On touch devices, only proceed to trigger click if a handler is\n // defined\n if (hasZoom &&\n self.initiated &&\n !fireClickEvent &&\n e.cancelable !== false) {\n e.preventDefault();\n }\n // Normalize each touch\n [].map.call(touches, function (e) {\n return self.normalize(e);\n });\n // Register the touch start position\n if (e.type === 'touchstart') {\n [].forEach.call(touches, function (e, i) {\n pinchDown[i] = { chartX: e.chartX, chartY: e.chartY };\n });\n lastValidTouch.x = [pinchDown[0].chartX, pinchDown[1] &&\n pinchDown[1].chartX];\n lastValidTouch.y = [pinchDown[0].chartY, pinchDown[1] &&\n pinchDown[1].chartY];\n // Identify the data bounds in pixels\n chart.axes.forEach(function (axis) {\n if (axis.zoomEnabled) {\n var bounds = chart.bounds[axis.horiz ? 'h' : 'v'],\n minPixelPadding = axis.minPixelPadding,\n min = axis.toPixels(Math.min(pick(axis.options.min,\n axis.dataMin),\n axis.dataMin)),\n max = axis.toPixels(Math.max(pick(axis.options.max,\n axis.dataMax),\n axis.dataMax)),\n absMin = Math.min(min,\n max),\n absMax = Math.max(min,\n max);\n // Store the bounds for use in the touchmove handler\n bounds.min = Math.min(axis.pos, absMin - minPixelPadding);\n bounds.max = Math.max(axis.pos + axis.len, absMax + minPixelPadding);\n }\n });\n self.res = true; // reset on next move\n // Optionally move the tooltip on touchmove\n }\n else if (followTouchMove) {\n this.runPointActions(self.normalize(e));\n // Event type is touchmove, handle panning and pinching\n }\n else if (pinchDown.length) { // can be 0 when releasing, if touchend\n // fires first\n fireEvent(chart, 'touchpan', { originalEvent: e }, function () {\n // Set the marker\n if (!selectionMarker) {\n // @todo It's a mock object, so maybe we need a separate\n // interface\n self.selectionMarker = selectionMarker = extend({\n destroy: noop,\n touch: true\n }, chart.plotBox);\n }\n self.pinchTranslate(pinchDown, touches, transform, selectionMarker, clip, lastValidTouch);\n self.hasPinched = hasZoom;\n // Scale and translate the groups to provide visual feedback\n // during pinching\n self.scaleGroups(transform, clip);\n });\n if (self.res) {\n self.res = false;\n this.reset(false, 0);\n }\n }\n };\n /**\n * Run translation operations\n * @private\n * @function Highcharts.Pointer#pinchTranslate\n */\n Pointer.prototype.pinchTranslate = function (pinchDown, touches, transform, selectionMarker, clip, lastValidTouch) {\n if (this.zoomHor) {\n this.pinchTranslateDirection(true, pinchDown, touches, transform, selectionMarker, clip, lastValidTouch);\n }\n if (this.zoomVert) {\n this.pinchTranslateDirection(false, pinchDown, touches, transform, selectionMarker, clip, lastValidTouch);\n }\n };\n /**\n * Run translation operations for each direction (horizontal and vertical)\n * independently.\n * @private\n * @function Highcharts.Pointer#pinchTranslateDirection\n */\n Pointer.prototype.pinchTranslateDirection = function (horiz, pinchDown, touches, transform, selectionMarker, clip, lastValidTouch, forcedScale) {\n var chart = this.chart, xy = horiz ? 'x' : 'y', XY = horiz ? 'X' : 'Y', sChartXY = ('chart' + XY), wh = horiz ? 'width' : 'height', plotLeftTop = chart['plot' + (horiz ? 'Left' : 'Top')], inverted = chart.inverted, bounds = chart.bounds[horiz ? 'h' : 'v'], singleTouch = pinchDown.length === 1, touch0Start = pinchDown[0][sChartXY], touch1Start = !singleTouch && pinchDown[1][sChartXY], setScale = function () {\n // Don't zoom if fingers are too close on this axis\n if (typeof touch1Now === 'number' &&\n Math.abs(touch0Start - touch1Start) > 20) {\n scale = forcedScale ||\n Math.abs(touch0Now - touch1Now) /\n Math.abs(touch0Start - touch1Start);\n }\n clipXY = ((plotLeftTop - touch0Now) / scale) + touch0Start;\n selectionWH = chart['plot' + (horiz ? 'Width' : 'Height')] / scale;\n };\n var selectionWH,\n selectionXY,\n clipXY,\n scale = forcedScale || 1,\n touch0Now = touches[0][sChartXY],\n touch1Now = !singleTouch && touches[1][sChartXY],\n outOfBounds;\n // Set the scale, first pass\n setScale();\n // The clip position (x or y) is altered if out of bounds, the selection\n // position is not\n selectionXY = clipXY;\n // Out of bounds\n if (selectionXY < bounds.min) {\n selectionXY = bounds.min;\n outOfBounds = true;\n }\n else if (selectionXY + selectionWH > bounds.max) {\n selectionXY = bounds.max - selectionWH;\n outOfBounds = true;\n }\n // Is the chart dragged off its bounds, determined by dataMin and\n // dataMax?\n if (outOfBounds) {\n // Modify the touchNow position in order to create an elastic drag\n // movement. This indicates to the user that the chart is responsive\n // but can't be dragged further.\n touch0Now -= 0.8 * (touch0Now - lastValidTouch[xy][0]);\n if (typeof touch1Now === 'number') {\n touch1Now -= 0.8 * (touch1Now - lastValidTouch[xy][1]);\n }\n // Set the scale, second pass to adapt to the modified touchNow\n // positions\n setScale();\n }\n else {\n lastValidTouch[xy] = [touch0Now, touch1Now];\n }\n // Set geometry for clipping, selection and transformation\n if (!inverted) {\n clip[xy] = clipXY - plotLeftTop;\n clip[wh] = selectionWH;\n }\n var scaleKey = inverted ?\n (horiz ? 'scaleY' : 'scaleX') : 'scale' + XY;\n var transformScale = inverted ? 1 / scale : scale;\n selectionMarker[wh] = selectionWH;\n selectionMarker[xy] = selectionXY;\n transform[scaleKey] = scale;\n transform['translate' + XY] = (transformScale * plotLeftTop) +\n (touch0Now - (transformScale * touch0Start));\n };\n /**\n * Reset the tracking by hiding the tooltip, the hover series state and the\n * hover point\n *\n * @function Highcharts.Pointer#reset\n *\n * @param {boolean} [allowMove]\n * Instead of destroying the tooltip altogether, allow moving it if\n * possible.\n *\n * @param {number} [delay]\n */\n Pointer.prototype.reset = function (allowMove, delay) {\n var pointer = this,\n chart = pointer.chart,\n hoverSeries = chart.hoverSeries,\n hoverPoint = chart.hoverPoint,\n hoverPoints = chart.hoverPoints,\n tooltip = chart.tooltip,\n tooltipPoints = tooltip && tooltip.shared ?\n hoverPoints :\n hoverPoint;\n // Check if the points have moved outside the plot area (#1003, #4736,\n // #5101)\n if (allowMove && tooltipPoints) {\n splat(tooltipPoints).forEach(function (point) {\n if (point.series.isCartesian &&\n typeof point.plotX === 'undefined') {\n allowMove = false;\n }\n });\n }\n // Just move the tooltip, #349\n if (allowMove) {\n if (tooltip && tooltipPoints && splat(tooltipPoints).length) {\n tooltip.refresh(tooltipPoints);\n if (tooltip.shared && hoverPoints) { // #8284\n hoverPoints.forEach(function (point) {\n point.setState(point.state, true);\n if (point.series.isCartesian) {\n if (point.series.xAxis.crosshair) {\n point.series.xAxis\n .drawCrosshair(null, point);\n }\n if (point.series.yAxis.crosshair) {\n point.series.yAxis\n .drawCrosshair(null, point);\n }\n }\n });\n }\n else if (hoverPoint) { // #2500\n hoverPoint.setState(hoverPoint.state, true);\n chart.axes.forEach(function (axis) {\n if (axis.crosshair &&\n hoverPoint.series[axis.coll] === axis) {\n axis.drawCrosshair(null, hoverPoint);\n }\n });\n }\n }\n // Full reset\n }\n else {\n if (hoverPoint) {\n hoverPoint.onMouseOut();\n }\n if (hoverPoints) {\n hoverPoints.forEach(function (point) {\n point.setState();\n });\n }\n if (hoverSeries) {\n hoverSeries.onMouseOut();\n }\n if (tooltip) {\n tooltip.hide(delay);\n }\n if (pointer.unDocMouseMove) {\n pointer.unDocMouseMove = pointer.unDocMouseMove();\n }\n // Remove crosshairs\n chart.axes.forEach(function (axis) {\n axis.hideCrosshair();\n });\n pointer.hoverX = chart.hoverPoints = chart.hoverPoint = null;\n }\n };\n /**\n * With line type charts with a single tracker, get the point closest to the\n * mouse. Run Point.onMouseOver and display tooltip for the point or points.\n *\n * @private\n * @function Highcharts.Pointer#runPointActions\n *\n * @emits Highcharts.Point#event:mouseOut\n * @emits Highcharts.Point#event:mouseOver\n */\n Pointer.prototype.runPointActions = function (e, p, force) {\n var pointer = this,\n chart = pointer.chart,\n series = chart.series,\n tooltip = (chart.tooltip && chart.tooltip.options.enabled ?\n chart.tooltip :\n void 0),\n shared = (tooltip ?\n tooltip.shared :\n false);\n var hoverPoint = p || chart.hoverPoint,\n hoverSeries = hoverPoint && hoverPoint.series || chart.hoverSeries;\n var // onMouseOver or already hovering a series with directTouch\n isDirectTouch = (!e || e.type !== 'touchmove') && (!!p || ((hoverSeries && hoverSeries.directTouch) &&\n pointer.isDirectTouch)),\n hoverData = this.getHoverData(hoverPoint,\n hoverSeries,\n series,\n isDirectTouch,\n shared,\n e);\n // Update variables from hoverData.\n hoverPoint = hoverData.hoverPoint;\n hoverSeries = hoverData.hoverSeries;\n var points = hoverData.hoverPoints,\n followPointer = hoverSeries &&\n hoverSeries.tooltipOptions.followPointer &&\n !hoverSeries.tooltipOptions.split,\n useSharedTooltip = (shared &&\n hoverSeries &&\n !hoverSeries.noSharedTooltip);\n // Refresh tooltip for kdpoint if new hover point or tooltip was hidden\n // #3926, #4200\n if (hoverPoint &&\n (force ||\n hoverPoint !== chart.hoverPoint ||\n (tooltip && tooltip.isHidden))) {\n (chart.hoverPoints || []).forEach(function (p) {\n if (points.indexOf(p) === -1) {\n p.setState();\n }\n });\n // Set normal state to previous series\n if (chart.hoverSeries !== hoverSeries) {\n hoverSeries.onMouseOver();\n }\n pointer.applyInactiveState(points);\n // Do mouseover on all points (#3919, #3985, #4410, #5622)\n (points || []).forEach(function (p) {\n p.setState('hover');\n });\n // If tracking is on series in stead of on each point,\n // fire mouseOver on hover point. // #4448\n if (chart.hoverPoint) {\n chart.hoverPoint.firePointEvent('mouseOut');\n }\n // Hover point may have been destroyed in the event handlers (#7127)\n if (!hoverPoint.series) {\n return;\n }\n /**\n * Contains all hovered points.\n *\n * @name Highcharts.Chart#hoverPoints\n * @type {Array|null}\n */\n chart.hoverPoints = points;\n /**\n * Contains the original hovered point.\n *\n * @name Highcharts.Chart#hoverPoint\n * @type {Highcharts.Point|null}\n */\n chart.hoverPoint = hoverPoint;\n /**\n * Hover state should not be lost when axis is updated (#12569)\n * Axis.update runs pointer.reset which uses chart.hoverPoint.state\n * to apply state which does not exist in hoverPoint yet.\n * The mouseOver event should be triggered when hoverPoint\n * is correct.\n */\n hoverPoint.firePointEvent('mouseOver', void 0, function () {\n // Draw tooltip if necessary\n if (tooltip && hoverPoint) {\n tooltip.refresh(useSharedTooltip ? points : hoverPoint, e);\n }\n });\n // Update positions (regardless of kdpoint or hoverPoint)\n }\n else if (followPointer && tooltip && !tooltip.isHidden) {\n var anchor = tooltip.getAnchor([{}],\n e);\n if (chart.isInsidePlot(anchor[0], anchor[1], {\n visiblePlotOnly: true\n })) {\n tooltip.updatePosition({ plotX: anchor[0], plotY: anchor[1] });\n }\n }\n // Start the event listener to pick up the tooltip and crosshairs\n if (!pointer.unDocMouseMove) {\n pointer.unDocMouseMove = addEvent(chart.container.ownerDocument, 'mousemove', function (e) {\n var chart = charts[Pointer.hoverChartIndex];\n if (chart) {\n chart.pointer.onDocumentMouseMove(e);\n }\n });\n pointer.eventsToUnbind.push(pointer.unDocMouseMove);\n }\n // Issues related to crosshair #4927, #5269 #5066, #5658\n chart.axes.forEach(function drawAxisCrosshair(axis) {\n var snap = pick((axis.crosshair || {}).snap,\n true);\n var point;\n if (snap) {\n point = chart.hoverPoint; // #13002\n if (!point || point.series[axis.coll] !== axis) {\n point = find(points, function (p) {\n return p.series && p.series[axis.coll] === axis;\n });\n }\n }\n // Axis has snapping crosshairs, and one of the hover points belongs\n // to axis. Always call drawCrosshair when it is not snap.\n if (point || !snap) {\n axis.drawCrosshair(e, point);\n // Axis has snapping crosshairs, but no hover point belongs to axis\n }\n else {\n axis.hideCrosshair();\n }\n });\n };\n /**\n * Scale series groups to a certain scale and translation.\n * @private\n * @function Highcharts.Pointer#scaleGroups\n */\n Pointer.prototype.scaleGroups = function (attribs, clip) {\n var chart = this.chart;\n // Scale each series\n chart.series.forEach(function (series) {\n var seriesAttribs = attribs || series.getPlotBox(); // #1701\n if (series.group &&\n ((series.xAxis && series.xAxis.zoomEnabled) ||\n chart.mapView)) {\n series.group.attr(seriesAttribs);\n if (series.markerGroup) {\n series.markerGroup.attr(seriesAttribs);\n series.markerGroup.clip(clip ? chart.clipRect : null);\n }\n if (series.dataLabelsGroup) {\n series.dataLabelsGroup.attr(seriesAttribs);\n }\n }\n });\n // Clip\n chart.clipRect.attr(clip || chart.clipBox);\n };\n /**\n * Set the JS DOM events on the container and document. This method should\n * contain a one-to-one assignment between methods and their handlers. Any\n * advanced logic should be moved to the handler reflecting the event's\n * name.\n * @private\n * @function Highcharts.Pointer#setDOMEvents\n */\n Pointer.prototype.setDOMEvents = function () {\n var _this = this;\n var container = this.chart.container,\n ownerDoc = container.ownerDocument;\n container.onmousedown = this.onContainerMouseDown.bind(this);\n container.onmousemove = this.onContainerMouseMove.bind(this);\n container.onclick = this.onContainerClick.bind(this);\n this.eventsToUnbind.push(addEvent(container, 'mouseenter', this.onContainerMouseEnter.bind(this)));\n this.eventsToUnbind.push(addEvent(container, 'mouseleave', this.onContainerMouseLeave.bind(this)));\n if (!Pointer.unbindDocumentMouseUp) {\n Pointer.unbindDocumentMouseUp = addEvent(ownerDoc, 'mouseup', this.onDocumentMouseUp.bind(this));\n }\n // In case we are dealing with overflow, reset the chart position when\n // scrolling parent elements\n var parent = this.chart.renderTo.parentElement;\n while (parent && parent.tagName !== 'BODY') {\n this.eventsToUnbind.push(addEvent(parent, 'scroll', function () {\n delete _this.chartPosition;\n }));\n parent = parent.parentElement;\n }\n if (H.hasTouch) {\n this.eventsToUnbind.push(addEvent(container, 'touchstart', this.onContainerTouchStart.bind(this), { passive: false }));\n this.eventsToUnbind.push(addEvent(container, 'touchmove', this.onContainerTouchMove.bind(this), { passive: false }));\n if (!Pointer.unbindDocumentTouchEnd) {\n Pointer.unbindDocumentTouchEnd = addEvent(ownerDoc, 'touchend', this.onDocumentTouchEnd.bind(this), { passive: false });\n }\n }\n };\n /**\n * Sets the index of the hovered chart and leaves the previous hovered\n * chart, to reset states like tooltip.\n * @private\n * @function Highcharts.Pointer#setHoverChartIndex\n */\n Pointer.prototype.setHoverChartIndex = function () {\n var chart = this.chart;\n var hoverChart = H.charts[pick(Pointer.hoverChartIndex, -1)];\n if (hoverChart &&\n hoverChart !== chart) {\n hoverChart.pointer.onContainerMouseLeave({ relatedTarget: chart.container });\n }\n if (!hoverChart ||\n !hoverChart.mouseIsDown) {\n Pointer.hoverChartIndex = chart.index;\n }\n };\n /**\n * General touch handler shared by touchstart and touchmove.\n * @private\n * @function Highcharts.Pointer#touch\n */\n Pointer.prototype.touch = function (e, start) {\n var chart = this.chart;\n var hasMoved,\n pinchDown,\n isInside;\n this.setHoverChartIndex();\n if (e.touches.length === 1) {\n e = this.normalize(e);\n isInside = chart.isInsidePlot(e.chartX - chart.plotLeft, e.chartY - chart.plotTop, {\n visiblePlotOnly: true\n });\n if (isInside && !chart.openMenu) {\n // Run mouse events and display tooltip etc\n if (start) {\n this.runPointActions(e);\n }\n // Android fires touchmove events after the touchstart even if\n // the finger hasn't moved, or moved only a pixel or two. In iOS\n // however, the touchmove doesn't fire unless the finger moves\n // more than ~4px. So we emulate this behaviour in Android by\n // checking how much it moved, and cancelling on small\n // distances. #3450.\n if (e.type === 'touchmove') {\n pinchDown = this.pinchDown;\n hasMoved = pinchDown[0] ? Math.sqrt(// #5266\n Math.pow(pinchDown[0].chartX - e.chartX, 2) +\n Math.pow(pinchDown[0].chartY - e.chartY, 2)) >= 4 : false;\n }\n if (pick(hasMoved, true)) {\n this.pinch(e);\n }\n }\n else if (start) {\n // Hide the tooltip on touching outside the plot area (#1203)\n this.reset();\n }\n }\n else if (e.touches.length === 2) {\n this.pinch(e);\n }\n };\n /**\n * Returns true if the chart is set up for zooming by single touch and the\n * event is capable\n * @private\n * @function Highcharts.Pointer#touchSelect\n */\n Pointer.prototype.touchSelect = function (e) {\n return Boolean(this.chart.options.chart.zooming.singleTouch &&\n e.touches &&\n e.touches.length === 1);\n };\n /**\n * Resolve the zoomType option, this is reset on all touch start and mouse\n * down events.\n * @private\n * @function Highcharts.Pointer#zoomOption\n */\n Pointer.prototype.zoomOption = function (e) {\n var chart = this.chart,\n options = chart.options.chart,\n inverted = chart.inverted;\n var zoomType = options.zooming.type || '',\n zoomX,\n zoomY;\n // Look for the pinchType option\n if (/touch/.test(e.type)) {\n zoomType = pick(options.zooming.pinchType, zoomType);\n }\n this.zoomX = zoomX = /x/.test(zoomType);\n this.zoomY = zoomY = /y/.test(zoomType);\n this.zoomHor = (zoomX && !inverted) || (zoomY && inverted);\n this.zoomVert = (zoomY && !inverted) || (zoomX && inverted);\n this.hasZoom = zoomX || zoomY;\n };\n return Pointer;\n }());\n /* *\n *\n * Default Export\n *\n * */\n /* *\n *\n * API Declarations\n *\n * */\n /**\n * Chart position and scale.\n *\n * @interface Highcharts.ChartPositionObject\n */ /**\n * @name Highcharts.ChartPositionObject#left\n * @type {number}\n */ /**\n * @name Highcharts.ChartPositionObject#scaleX\n * @type {number}\n */ /**\n * @name Highcharts.ChartPositionObject#scaleY\n * @type {number}\n */ /**\n * @name Highcharts.ChartPositionObject#top\n * @type {number}\n */\n /**\n * One position in relation to an axis.\n *\n * @interface Highcharts.PointerAxisCoordinateObject\n */ /**\n * Related axis.\n *\n * @name Highcharts.PointerAxisCoordinateObject#axis\n * @type {Highcharts.Axis}\n */ /**\n * Axis value.\n *\n * @name Highcharts.PointerAxisCoordinateObject#value\n * @type {number}\n */\n /**\n * Positions in terms of axis values.\n *\n * @interface Highcharts.PointerAxisCoordinatesObject\n */ /**\n * Positions on the x-axis.\n * @name Highcharts.PointerAxisCoordinatesObject#xAxis\n * @type {Array}\n */ /**\n * Positions on the y-axis.\n * @name Highcharts.PointerAxisCoordinatesObject#yAxis\n * @type {Array}\n */\n /**\n * Pointer coordinates.\n *\n * @interface Highcharts.PointerCoordinatesObject\n */ /**\n * @name Highcharts.PointerCoordinatesObject#chartX\n * @type {number}\n */ /**\n * @name Highcharts.PointerCoordinatesObject#chartY\n * @type {number}\n */\n /**\n * A native browser mouse or touch event, extended with position information\n * relative to the {@link Chart.container}.\n *\n * @interface Highcharts.PointerEventObject\n * @extends global.PointerEvent\n */ /**\n * The X coordinate of the pointer interaction relative to the chart.\n *\n * @name Highcharts.PointerEventObject#chartX\n * @type {number}\n */ /**\n * The Y coordinate of the pointer interaction relative to the chart.\n *\n * @name Highcharts.PointerEventObject#chartY\n * @type {number}\n */\n /**\n * Axis-specific data of a selection.\n *\n * @interface Highcharts.SelectDataObject\n */ /**\n * The selected Axis.\n * @name Highcharts.SelectDataObject#axis\n * @type {Highcharts.Axis}\n */ /**\n * The maximum axis value, either automatic or set manually.\n * @name Highcharts.SelectDataObject#max\n * @type {number}\n */ /**\n * The minimum axis value, either automatic or set manually.\n * @name Highcharts.SelectDataObject#min\n * @type {number}\n */\n /**\n * Object for select events.\n * The primary axes are `xAxis[0]` and `yAxis[0]`. Remember the unit of a\n * datetime axis is milliseconds since 1970-01-01 00:00:00.\n *\n * @interface Highcharts.SelectEventObject\n */ /**\n * The related browser event.\n * @name Highcharts.SelectEventObject#originalEvent\n * @type {global.Event}\n */ /**\n * Indicates a reset event to restore default state.\n * @name Highcharts.SelectEventObject#resetSelection\n * @type {boolean|undefined}\n */ /**\n * Arrays containing the axes of each dimension and each axis' min and max\n * values.\n * @name Highcharts.SelectEventObject#xAxis\n * @type {Array}\n */ /**\n * Arrays containing the axes of each dimension and each axis' min and max\n * values.\n * @name Highcharts.SelectEventObject#yAxis\n * @type {Array}\n */\n ''; // keeps doclets above in JS file\n\n return Pointer;\n });\n _registerModule(_modules, 'Core/MSPointer.js', [_modules['Core/Globals.js'], _modules['Core/Pointer.js'], _modules['Core/Utilities.js']], function (H, Pointer, U) {\n /* *\n *\n * (c) 2010-2021 Torstein Honsi\n *\n * License: www.highcharts.com/license\n *\n * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!\n *\n * */\n var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d,\n b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d,\n b) { d.__proto__ = b; }) ||\n function (d,\n b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n })();\n var charts = H.charts,\n doc = H.doc,\n noop = H.noop,\n win = H.win;\n var addEvent = U.addEvent,\n css = U.css,\n objectEach = U.objectEach,\n pick = U.pick,\n removeEvent = U.removeEvent;\n /* *\n *\n * Constants\n *\n * */\n // The touches object keeps track of the points being touched at all times\n var touches = {};\n var hasPointerEvent = !!win.PointerEvent;\n /* *\n *\n * Functions\n *\n * */\n /* eslint-disable valid-jsdoc */\n /** @private */\n function getWebkitTouches() {\n var fake = [];\n fake.item = function (i) {\n return this[i];\n };\n objectEach(touches, function (touch) {\n fake.push({\n pageX: touch.pageX,\n pageY: touch.pageY,\n target: touch.target\n });\n });\n return fake;\n }\n /** @private */\n function translateMSPointer(e, method, wktype, func) {\n var chart = charts[Pointer.hoverChartIndex || NaN];\n if ((e.pointerType === 'touch' ||\n e.pointerType === e.MSPOINTER_TYPE_TOUCH) && chart) {\n var p = chart.pointer;\n func(e);\n p[method]({\n type: wktype,\n target: e.currentTarget,\n preventDefault: noop,\n touches: getWebkitTouches()\n });\n }\n }\n /* *\n *\n * Class\n *\n * */\n /** @private */\n var MSPointer = /** @class */ (function (_super) {\n __extends(MSPointer, _super);\n function MSPointer() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /* *\n *\n * Static Functions\n *\n * */\n MSPointer.isRequired = function () {\n return !!(!H.hasTouch && (win.PointerEvent || win.MSPointerEvent));\n };\n /* *\n *\n * Functions\n *\n * */\n /**\n * Add or remove the MS Pointer specific events\n * @private\n * @function Highcharts.Pointer#batchMSEvents\n */\n MSPointer.prototype.batchMSEvents = function (fn) {\n fn(this.chart.container, hasPointerEvent ? 'pointerdown' : 'MSPointerDown', this.onContainerPointerDown);\n fn(this.chart.container, hasPointerEvent ? 'pointermove' : 'MSPointerMove', this.onContainerPointerMove);\n fn(doc, hasPointerEvent ? 'pointerup' : 'MSPointerUp', this.onDocumentPointerUp);\n };\n // Destroy MS events also\n MSPointer.prototype.destroy = function () {\n this.batchMSEvents(removeEvent);\n _super.prototype.destroy.call(this);\n };\n // Disable default IE actions for pinch and such on chart element\n MSPointer.prototype.init = function (chart, options) {\n _super.prototype.init.call(this, chart, options);\n if (this.hasZoom) { // #4014\n css(chart.container, {\n '-ms-touch-action': 'none',\n 'touch-action': 'none'\n });\n }\n };\n /**\n * @private\n * @function Highcharts.Pointer#onContainerPointerDown\n */\n MSPointer.prototype.onContainerPointerDown = function (e) {\n translateMSPointer(e, 'onContainerTouchStart', 'touchstart', function (e) {\n touches[e.pointerId] = {\n pageX: e.pageX,\n pageY: e.pageY,\n target: e.currentTarget\n };\n });\n };\n /**\n * @private\n * @function Highcharts.Pointer#onContainerPointerMove\n */\n MSPointer.prototype.onContainerPointerMove = function (e) {\n translateMSPointer(e, 'onContainerTouchMove', 'touchmove', function (e) {\n touches[e.pointerId] = ({ pageX: e.pageX, pageY: e.pageY });\n if (!touches[e.pointerId].target) {\n touches[e.pointerId].target = e.currentTarget;\n }\n });\n };\n /**\n * @private\n * @function Highcharts.Pointer#onDocumentPointerUp\n */\n MSPointer.prototype.onDocumentPointerUp = function (e) {\n translateMSPointer(e, 'onDocumentTouchEnd', 'touchend', function (e) {\n delete touches[e.pointerId];\n });\n };\n // Add IE specific touch events to chart\n MSPointer.prototype.setDOMEvents = function () {\n var tooltip = this.chart.tooltip;\n _super.prototype.setDOMEvents.call(this);\n if (this.hasZoom ||\n pick((tooltip && tooltip.options.followTouchMove), true)) {\n this.batchMSEvents(addEvent);\n }\n };\n return MSPointer;\n }(Pointer));\n /* *\n *\n * Default Export\n *\n * */\n\n return MSPointer;\n });\n _registerModule(_modules, 'Core/Legend/Legend.js', [_modules['Core/Animation/AnimationUtilities.js'], _modules['Core/FormatUtilities.js'], _modules['Core/Globals.js'], _modules['Core/Series/Point.js'], _modules['Core/Renderer/RendererUtilities.js'], _modules['Core/Utilities.js']], function (A, F, H, Point, R, U) {\n /* *\n *\n * (c) 2010-2021 Torstein Honsi\n *\n * License: www.highcharts.com/license\n *\n * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!\n *\n * */\n var animObject = A.animObject,\n setAnimation = A.setAnimation;\n var format = F.format;\n var isFirefox = H.isFirefox,\n marginNames = H.marginNames,\n win = H.win;\n var distribute = R.distribute;\n var addEvent = U.addEvent,\n createElement = U.createElement,\n css = U.css,\n defined = U.defined,\n discardElement = U.discardElement,\n find = U.find,\n fireEvent = U.fireEvent,\n isNumber = U.isNumber,\n merge = U.merge,\n pick = U.pick,\n relativeLength = U.relativeLength,\n stableSort = U.stableSort,\n syncTimeout = U.syncTimeout,\n wrap = U.wrap;\n /* *\n *\n * Class\n *\n * */\n /**\n * The overview of the chart's series. The legend object is instanciated\n * internally in the chart constructor, and is available from the `chart.legend`\n * property. Each chart has only one legend.\n *\n * @class\n * @name Highcharts.Legend\n *\n * @param {Highcharts.Chart} chart\n * The chart instance.\n *\n * @param {Highcharts.LegendOptions} options\n * Legend options.\n */\n var Legend = /** @class */ (function () {\n /* *\n *\n * Constructors\n *\n * */\n function Legend(chart, options) {\n /* *\n *\n * Properties\n *\n * */\n this.allItems = [];\n this.box = void 0;\n this.contentGroup = void 0;\n this.display = false;\n this.group = void 0;\n this.initialItemY = 0;\n this.itemHeight = 0;\n this.itemMarginBottom = 0;\n this.itemMarginTop = 0;\n this.itemX = 0;\n this.itemY = 0;\n this.lastItemY = 0;\n this.lastLineHeight = 0;\n this.legendHeight = 0;\n this.legendWidth = 0;\n this.maxItemWidth = 0;\n this.maxLegendWidth = 0;\n this.offsetWidth = 0;\n this.options = void 0;\n this.padding = 0;\n this.pages = [];\n this.proximate = false;\n this.scrollGroup = void 0;\n this.symbolHeight = 0;\n this.symbolWidth = 0;\n this.titleHeight = 0;\n this.totalItemWidth = 0;\n this.widthOption = 0;\n this.chart = chart;\n this.init(chart, options);\n }\n /* *\n *\n * Functions\n *\n * */\n /* eslint-disable valid-jsdoc */\n /**\n * Initialize the legend.\n *\n * @private\n * @function Highcharts.Legend#init\n *\n * @param {Highcharts.Chart} chart\n * The chart instance.\n *\n * @param {Highcharts.LegendOptions} options\n * Legend options.\n */\n Legend.prototype.init = function (chart, options) {\n /**\n * Chart of this legend.\n *\n * @readonly\n * @name Highcharts.Legend#chart\n * @type {Highcharts.Chart}\n */\n this.chart = chart;\n this.setOptions(options);\n if (options.enabled) {\n // Render it\n this.render();\n // move checkboxes\n addEvent(this.chart, 'endResize', function () {\n this.legend.positionCheckboxes();\n });\n if (this.proximate) {\n this.unchartrender = addEvent(this.chart, 'render', function () {\n this.legend.proximatePositions();\n this.legend.positionItems();\n });\n }\n else if (this.unchartrender) {\n this.unchartrender();\n }\n }\n };\n /**\n * @private\n * @function Highcharts.Legend#setOptions\n * @param {Highcharts.LegendOptions} options\n */\n Legend.prototype.setOptions = function (options) {\n var padding = pick(options.padding, 8);\n /**\n * Legend options.\n *\n * @readonly\n * @name Highcharts.Legend#options\n * @type {Highcharts.LegendOptions}\n */\n this.options = options;\n if (!this.chart.styledMode) {\n this.itemStyle = options.itemStyle;\n this.itemHiddenStyle = merge(this.itemStyle, options.itemHiddenStyle);\n }\n this.itemMarginTop = options.itemMarginTop || 0;\n this.itemMarginBottom = options.itemMarginBottom || 0;\n this.padding = padding;\n this.initialItemY = padding - 5; // 5 is pixels above the text\n this.symbolWidth = pick(options.symbolWidth, 16);\n this.pages = [];\n this.proximate = options.layout === 'proximate' && !this.chart.inverted;\n // #12705: baseline has to be reset on every update\n this.baseline = void 0;\n };\n /**\n * Update the legend with new options. Equivalent to running `chart.update`\n * with a legend configuration option.\n *\n * @sample highcharts/legend/legend-update/\n * Legend update\n *\n * @function Highcharts.Legend#update\n *\n * @param {Highcharts.LegendOptions} options\n * Legend options.\n *\n * @param {boolean} [redraw=true]\n * Whether to redraw the chart after the axis is altered. If doing more\n * operations on the chart, it is a good idea to set redraw to false and\n * call {@link Chart#redraw} after. Whether to redraw the chart.\n *\n * @emits Highcharts.Legends#event:afterUpdate\n */\n Legend.prototype.update = function (options, redraw) {\n var chart = this.chart;\n this.setOptions(merge(true, this.options, options));\n this.destroy();\n chart.isDirtyLegend = chart.isDirtyBox = true;\n if (pick(redraw, true)) {\n chart.redraw();\n }\n fireEvent(this, 'afterUpdate');\n };\n /**\n * Set the colors for the legend item.\n *\n * @private\n * @function Highcharts.Legend#colorizeItem\n * @param {Highcharts.BubbleLegendItem|Highcharts.Point|Highcharts.Series} item\n * A Series or Point instance\n * @param {boolean} [visible=false]\n * Dimmed or colored\n *\n * @todo\n * Make events official: Fires the event `afterColorizeItem`.\n */\n Legend.prototype.colorizeItem = function (item, visible) {\n var _a = item.legendItem || {},\n group = _a.group,\n label = _a.label,\n line = _a.line,\n symbol = _a.symbol;\n if (group) {\n group[visible ? 'removeClass' : 'addClass']('highcharts-legend-item-hidden');\n }\n if (!this.chart.styledMode) {\n var legend = this,\n options = legend.options,\n hiddenColor = legend.itemHiddenStyle.color,\n textColor = visible ?\n options.itemStyle.color :\n hiddenColor,\n symbolColor = visible ?\n (item.color || hiddenColor) :\n hiddenColor,\n markerOptions = item.options && item.options.marker;\n var symbolAttr = { fill: symbolColor };\n if (label) {\n label.css({\n fill: textColor,\n color: textColor // #1553, oldIE\n });\n }\n if (line) {\n line.attr({ stroke: symbolColor });\n }\n if (symbol) {\n // Apply marker options\n if (markerOptions && symbol.isMarker) { // #585\n symbolAttr = item.pointAttribs();\n if (!visible) {\n // #6769\n symbolAttr.stroke = symbolAttr.fill = hiddenColor;\n }\n }\n symbol.attr(symbolAttr);\n }\n }\n fireEvent(this, 'afterColorizeItem', { item: item, visible: visible });\n };\n /**\n * @private\n * @function Highcharts.Legend#positionItems\n */\n Legend.prototype.positionItems = function () {\n // Now that the legend width and height are established, put the items\n // in the final position\n this.allItems.forEach(this.positionItem, this);\n if (!this.chart.isResizing) {\n this.positionCheckboxes();\n }\n };\n /**\n * Position the legend item.\n *\n * @private\n * @function Highcharts.Legend#positionItem\n * @param {Highcharts.BubbleLegendItem|Highcharts.Point|Highcharts.Series} item\n * The item to position\n */\n Legend.prototype.positionItem = function (item) {\n var _this = this;\n var legend = this,\n _a = item.legendItem || {},\n group = _a.group,\n _b = _a.x,\n x = _b === void 0 ? 0 : _b,\n _c = _a.y,\n y = _c === void 0 ? 0 : _c,\n options = legend.options,\n symbolPadding = options.symbolPadding,\n ltr = !options.rtl,\n checkbox = item.checkbox;\n if (group && group.element) {\n var attribs = {\n translateX: ltr ?\n x :\n legend.legendWidth - x - 2 * symbolPadding - 4,\n translateY: y\n };\n var complete = function () {\n fireEvent(_this, 'afterPositionItem', { item: item });\n };\n group[defined(group.translateY) ? 'animate' : 'attr'](attribs, void 0, complete);\n }\n if (checkbox) {\n checkbox.x = x;\n checkbox.y = y;\n }\n };\n /**\n * Destroy a single legend item, used internally on removing series items.\n *\n * @private\n * @function Highcharts.Legend#destroyItem\n * @param {Highcharts.BubbleLegendItem|Highcharts.Point|Highcharts.Series} item\n * The item to remove\n */\n Legend.prototype.destroyItem = function (item) {\n var checkbox = item.checkbox,\n legendItem = item.legendItem || {};\n // destroy SVG elements\n for (var _i = 0, _a = ['group', 'label', 'line', 'symbol']; _i < _a.length; _i++) {\n var key = _a[_i];\n if (legendItem[key]) {\n legendItem[key] = legendItem[key].destroy();\n }\n }\n if (checkbox) {\n discardElement(checkbox);\n }\n item.legendItem = void 0;\n };\n /**\n * Destroy the legend. Used internally. To reflow objects, `chart.redraw`\n * must be called after destruction.\n *\n * @private\n * @function Highcharts.Legend#destroy\n */\n Legend.prototype.destroy = function () {\n var legend = this;\n // Destroy items\n for (var _i = 0, _a = this.getAllItems(); _i < _a.length; _i++) {\n var item = _a[_i];\n this.destroyItem(item);\n }\n // Destroy legend elements\n for (var _b = 0, _c = [\n 'clipRect',\n 'up',\n 'down',\n 'pager',\n 'nav',\n 'box',\n 'title',\n 'group'\n ]; _b < _c.length; _b++) {\n var key = _c[_b];\n if (legend[key]) {\n legend[key] = legend[key].destroy();\n }\n }\n this.display = null; // Reset in .render on update.\n };\n /**\n * Position the checkboxes after the width is determined.\n *\n * @private\n * @function Highcharts.Legend#positionCheckboxes\n */\n Legend.prototype.positionCheckboxes = function () {\n var alignAttr = this.group && this.group.alignAttr,\n clipHeight = this.clipHeight || this.legendHeight,\n titleHeight = this.titleHeight;\n var translateY;\n if (alignAttr) {\n translateY = alignAttr.translateY;\n this.allItems.forEach(function (item) {\n var checkbox = item.checkbox;\n var top;\n if (checkbox) {\n top = translateY + titleHeight + checkbox.y +\n (this.scrollOffset || 0) + 3;\n css(checkbox, {\n left: (alignAttr.translateX + item.checkboxOffset +\n checkbox.x - 20) + 'px',\n top: top + 'px',\n display: this.proximate || (top > translateY - 6 &&\n top < translateY + clipHeight - 6) ?\n '' :\n 'none'\n });\n }\n }, this);\n }\n };\n /**\n * Render the legend title on top of the legend.\n *\n * @private\n * @function Highcharts.Legend#renderTitle\n */\n Legend.prototype.renderTitle = function () {\n var options = this.options,\n padding = this.padding,\n titleOptions = options.title;\n var bBox,\n titleHeight = 0;\n if (titleOptions.text) {\n if (!this.title) {\n /**\n * SVG element of the legend title.\n *\n * @readonly\n * @name Highcharts.Legend#title\n * @type {Highcharts.SVGElement}\n */\n this.title = this.chart.renderer.label(titleOptions.text, padding - 3, padding - 4, void 0, void 0, void 0, options.useHTML, void 0, 'legend-title')\n .attr({ zIndex: 1 });\n if (!this.chart.styledMode) {\n this.title.css(titleOptions.style);\n }\n this.title.add(this.group);\n }\n // Set the max title width (#7253)\n if (!titleOptions.width) {\n this.title.css({\n width: this.maxLegendWidth + 'px'\n });\n }\n bBox = this.title.getBBox();\n titleHeight = bBox.height;\n this.offsetWidth = bBox.width; // #1717\n this.contentGroup.attr({ translateY: titleHeight });\n }\n this.titleHeight = titleHeight;\n };\n /**\n * Set the legend item text.\n *\n * @function Highcharts.Legend#setText\n * @param {Highcharts.Point|Highcharts.Series} item\n * The item for which to update the text in the legend.\n */\n Legend.prototype.setText = function (item) {\n var options = this.options;\n item.legendItem.label.attr({\n text: options.labelFormat ?\n format(options.labelFormat, item, this.chart) :\n options.labelFormatter.call(item)\n });\n };\n /**\n * Render a single specific legend item. Called internally from the `render`\n * function.\n *\n * @private\n * @function Highcharts.Legend#renderItem\n * @param {Highcharts.BubbleLegendItem|Highcharts.Point|Highcharts.Series} item\n * The item to render.\n */\n Legend.prototype.renderItem = function (item) {\n var legend = this,\n legendItem = item.legendItem = item.legendItem || {},\n chart = legend.chart,\n renderer = chart.renderer,\n options = legend.options,\n horizontal = options.layout === 'horizontal',\n symbolWidth = legend.symbolWidth,\n symbolPadding = options.symbolPadding || 0,\n itemStyle = legend.itemStyle,\n itemHiddenStyle = legend.itemHiddenStyle,\n itemDistance = horizontal ? pick(options.itemDistance, 20) : 0,\n ltr = !options.rtl,\n isSeries = !item.series,\n series = !isSeries && item.series.drawLegendSymbol ?\n item.series :\n item,\n seriesOptions = series.options,\n showCheckbox = (legend.createCheckboxForItem) &&\n seriesOptions &&\n seriesOptions.showCheckbox,\n useHTML = options.useHTML,\n itemClassName = item.options.className;\n var label = legendItem.label, \n // full width minus text width\n itemExtraWidth = symbolWidth + symbolPadding +\n itemDistance + (showCheckbox ? 20 : 0);\n if (!label) { // generate it once, later move it\n // Generate the group box, a group to hold the symbol and text. Text\n // is to be appended in Legend class.\n legendItem.group = renderer\n .g('legend-item')\n .addClass('highcharts-' + series.type + '-series ' +\n 'highcharts-color-' + item.colorIndex +\n (itemClassName ? ' ' + itemClassName : '') +\n (isSeries ?\n ' highcharts-series-' + item.index :\n ''))\n .attr({ zIndex: 1 })\n .add(legend.scrollGroup);\n // Generate the list item text and add it to the group\n legendItem.label = label = renderer.text('', ltr ?\n symbolWidth + symbolPadding :\n -symbolPadding, legend.baseline || 0, useHTML);\n if (!chart.styledMode) {\n // merge to prevent modifying original (#1021)\n label.css(merge(item.visible ?\n itemStyle :\n itemHiddenStyle));\n }\n label\n .attr({\n align: ltr ? 'left' : 'right',\n zIndex: 2\n })\n .add(legendItem.group);\n // Get the baseline for the first item - the font size is equal for\n // all\n if (!legend.baseline) {\n legend.fontMetrics = renderer.fontMetrics(chart.styledMode ? 12 : itemStyle.fontSize, label);\n legend.baseline =\n legend.fontMetrics.f + 3 + legend.itemMarginTop;\n label.attr('y', legend.baseline);\n legend.symbolHeight =\n options.symbolHeight || legend.fontMetrics.f;\n if (options.squareSymbol) {\n legend.symbolWidth = pick(options.symbolWidth, Math.max(legend.symbolHeight, 16));\n itemExtraWidth = legend.symbolWidth + symbolPadding +\n itemDistance + (showCheckbox ? 20 : 0);\n if (ltr) {\n label.attr('x', legend.symbolWidth + symbolPadding);\n }\n }\n }\n // Draw the legend symbol inside the group box\n series.drawLegendSymbol(legend, item);\n if (legend.setItemEvents) {\n legend.setItemEvents(item, label, useHTML);\n }\n }\n // Add the HTML checkbox on top\n if (showCheckbox && !item.checkbox && legend.createCheckboxForItem) {\n legend.createCheckboxForItem(item);\n }\n // Colorize the items\n legend.colorizeItem(item, item.visible);\n // Take care of max width and text overflow (#6659)\n if (chart.styledMode || !itemStyle.width) {\n label.css({\n width: ((options.itemWidth ||\n legend.widthOption ||\n chart.spacingBox.width) - itemExtraWidth) + 'px'\n });\n }\n // Always update the text\n legend.setText(item);\n // calculate the positions for the next line\n var bBox = label.getBBox();\n var fontMetricsH = (legend.fontMetrics && legend.fontMetrics.h) || 0;\n item.itemWidth = item.checkboxOffset =\n options.itemWidth ||\n legendItem.labelWidth ||\n bBox.width + itemExtraWidth;\n legend.maxItemWidth = Math.max(legend.maxItemWidth, item.itemWidth);\n legend.totalItemWidth += item.itemWidth;\n legend.itemHeight = item.itemHeight = Math.round(legendItem.labelHeight ||\n // use bBox for multiline (#16398)\n (bBox.height > fontMetricsH * 1.5 ? bBox.height : fontMetricsH));\n };\n /**\n * Get the position of the item in the layout. We now know the\n * maxItemWidth from the previous loop.\n *\n * @private\n * @function Highcharts.Legend#layoutItem\n * @param {Highcharts.BubbleLegendItem|Highcharts.Point|Highcharts.Series} item\n */\n Legend.prototype.layoutItem = function (item) {\n var options = this.options,\n padding = this.padding,\n horizontal = options.layout === 'horizontal',\n itemHeight = item.itemHeight,\n itemMarginBottom = this.itemMarginBottom,\n itemMarginTop = this.itemMarginTop,\n itemDistance = horizontal ? pick(options.itemDistance, 20) : 0,\n maxLegendWidth = this.maxLegendWidth,\n itemWidth = (options.alignColumns &&\n this.totalItemWidth > maxLegendWidth) ?\n this.maxItemWidth :\n item.itemWidth,\n legendItem = item.legendItem || {};\n // If the item exceeds the width, start a new line\n if (horizontal &&\n this.itemX - padding + itemWidth > maxLegendWidth) {\n this.itemX = padding;\n if (this.lastLineHeight) { // Not for the first line (#10167)\n this.itemY += (itemMarginTop +\n this.lastLineHeight +\n itemMarginBottom);\n }\n this.lastLineHeight = 0; // reset for next line (#915, #3976)\n }\n // Set the edge positions\n this.lastItemY = itemMarginTop + this.itemY + itemMarginBottom;\n this.lastLineHeight = Math.max(// #915\n itemHeight, this.lastLineHeight);\n // cache the position of the newly generated or reordered items\n legendItem.x = this.itemX;\n legendItem.y = this.itemY;\n // advance\n if (horizontal) {\n this.itemX += itemWidth;\n }\n else {\n this.itemY +=\n itemMarginTop + itemHeight + itemMarginBottom;\n this.lastLineHeight = itemHeight;\n }\n // the width of the widest item\n this.offsetWidth = this.widthOption || Math.max((horizontal ? this.itemX - padding - (item.checkbox ?\n // decrease by itemDistance only when no checkbox #4853\n 0 :\n itemDistance) : itemWidth) + padding, this.offsetWidth);\n };\n /**\n * Get all items, which is one item per series for most series and one\n * item per point for pie series and its derivatives. Fires the event\n * `afterGetAllItems`.\n *\n * @private\n * @function Highcharts.Legend#getAllItems\n * @return {Array<(Highcharts.BubbleLegendItem|Highcharts.Point|Highcharts.Series)>}\n * The current items in the legend.\n * @emits Highcharts.Legend#event:afterGetAllItems\n */\n Legend.prototype.getAllItems = function () {\n var allItems = [];\n this.chart.series.forEach(function (series) {\n var seriesOptions = series && series.options;\n // Handle showInLegend. If the series is linked to another series,\n // defaults to false.\n if (series && pick(seriesOptions.showInLegend, !defined(seriesOptions.linkedTo) ? void 0 : false, true)) {\n // Use points or series for the legend item depending on\n // legendType\n allItems = allItems.concat((series.legendItem || {}).labels ||\n (seriesOptions.legendType === 'point' ?\n series.data :\n series));\n }\n });\n fireEvent(this, 'afterGetAllItems', { allItems: allItems });\n return allItems;\n };\n /**\n * Get a short, three letter string reflecting the alignment and layout.\n *\n * @private\n * @function Highcharts.Legend#getAlignment\n * @return {string}\n * The alignment, empty string if floating\n */\n Legend.prototype.getAlignment = function () {\n var options = this.options;\n // Use the first letter of each alignment option in order to detect\n // the side. (#4189 - use charAt(x) notation instead of [x] for IE7)\n if (this.proximate) {\n return options.align.charAt(0) + 'tv';\n }\n return options.floating ? '' : (options.align.charAt(0) +\n options.verticalAlign.charAt(0) +\n options.layout.charAt(0));\n };\n /**\n * Adjust the chart margins by reserving space for the legend on only one\n * side of the chart. If the position is set to a corner, top or bottom is\n * reserved for horizontal legends and left or right for vertical ones.\n *\n * @private\n * @function Highcharts.Legend#adjustMargins\n * @param {Array} margin\n * @param {Array} spacing\n */\n Legend.prototype.adjustMargins = function (margin, spacing) {\n var chart = this.chart,\n options = this.options,\n alignment = this.getAlignment();\n if (alignment) {\n ([\n /(lth|ct|rth)/,\n /(rtv|rm|rbv)/,\n /(rbh|cb|lbh)/,\n /(lbv|lm|ltv)/\n ]).forEach(function (alignments, side) {\n if (alignments.test(alignment) && !defined(margin[side])) {\n // Now we have detected on which side of the chart we should\n // reserve space for the legend\n chart[marginNames[side]] = Math.max(chart[marginNames[side]], (chart.legend[(side + 1) % 2 ? 'legendHeight' : 'legendWidth'] +\n [1, -1, -1, 1][side] * options[(side % 2) ? 'x' : 'y'] +\n pick(options.margin, 12) +\n spacing[side] +\n (chart.titleOffset[side] || 0)));\n }\n });\n }\n };\n /**\n * @private\n * @function Highcharts.Legend#proximatePositions\n */\n Legend.prototype.proximatePositions = function () {\n var chart = this.chart,\n boxes = [],\n alignLeft = this.options.align === 'left';\n this.allItems.forEach(function (item) {\n var lastPoint,\n height,\n useFirstPoint = alignLeft,\n target,\n top;\n if (item.yAxis) {\n if (item.xAxis.options.reversed) {\n useFirstPoint = !useFirstPoint;\n }\n if (item.points) {\n lastPoint = find(useFirstPoint ?\n item.points :\n item.points.slice(0).reverse(), function (item) {\n return isNumber(item.plotY);\n });\n }\n height = this.itemMarginTop +\n item.legendItem.label.getBBox().height +\n this.itemMarginBottom;\n top = item.yAxis.top - chart.plotTop;\n if (item.visible) {\n target = lastPoint ?\n lastPoint.plotY :\n item.yAxis.height;\n target += top - 0.3 * height;\n }\n else {\n target = top + item.yAxis.height;\n }\n boxes.push({\n target: target,\n size: height,\n item: item\n });\n }\n }, this);\n var legendItem;\n for (var _i = 0, _a = distribute(boxes, chart.plotHeight); _i < _a.length; _i++) {\n var box = _a[_i];\n legendItem = box.item.legendItem || {};\n if (isNumber(box.pos)) {\n legendItem.y = chart.plotTop - chart.spacing[0] + box.pos;\n }\n }\n };\n /**\n * Render the legend. This method can be called both before and after\n * `chart.render`. If called after, it will only rearrange items instead\n * of creating new ones. Called internally on initial render and after\n * redraws.\n *\n * @private\n * @function Highcharts.Legend#render\n */\n Legend.prototype.render = function () {\n var legend = this,\n chart = legend.chart,\n renderer = chart.renderer,\n options = legend.options,\n padding = legend.padding, \n // add each series or point\n allItems = legend.getAllItems();\n var display,\n legendWidth,\n legendHeight,\n legendGroup = legend.group,\n allowedWidth,\n box = legend.box;\n legend.itemX = padding;\n legend.itemY = legend.initialItemY;\n legend.offsetWidth = 0;\n legend.lastItemY = 0;\n legend.widthOption = relativeLength(options.width, chart.spacingBox.width - padding);\n // Compute how wide the legend is allowed to be\n allowedWidth = chart.spacingBox.width - 2 * padding - options.x;\n if (['rm', 'lm'].indexOf(legend.getAlignment().substring(0, 2)) > -1) {\n allowedWidth /= 2;\n }\n legend.maxLegendWidth = legend.widthOption || allowedWidth;\n if (!legendGroup) {\n /**\n * SVG group of the legend.\n *\n * @readonly\n * @name Highcharts.Legend#group\n * @type {Highcharts.SVGElement}\n */\n legend.group = legendGroup = renderer\n .g('legend')\n .addClass(options.className || '')\n .attr({ zIndex: 7 })\n .add();\n legend.contentGroup = renderer\n .g()\n .attr({ zIndex: 1 }) // above background\n .add(legendGroup);\n legend.scrollGroup = renderer\n .g()\n .add(legend.contentGroup);\n }\n legend.renderTitle();\n // sort by legendIndex\n stableSort(allItems, function (a, b) {\n return ((a.options && a.options.legendIndex) || 0) -\n ((b.options && b.options.legendIndex) || 0);\n });\n // reversed legend\n if (options.reversed) {\n allItems.reverse();\n }\n /**\n * All items for the legend, which is an array of series for most series\n * and an array of points for pie series and its derivatives.\n *\n * @readonly\n * @name Highcharts.Legend#allItems\n * @type {Array<(Highcharts.Point|Highcharts.Series)>}\n */\n legend.allItems = allItems;\n legend.display = display = !!allItems.length;\n // Render the items. First we run a loop to set the text and properties\n // and read all the bounding boxes. The next loop computes the item\n // positions based on the bounding boxes.\n legend.lastLineHeight = 0;\n legend.maxItemWidth = 0;\n legend.totalItemWidth = 0;\n legend.itemHeight = 0;\n allItems.forEach(legend.renderItem, legend);\n allItems.forEach(legend.layoutItem, legend);\n // Get the box\n legendWidth = (legend.widthOption || legend.offsetWidth) + padding;\n legendHeight = legend.lastItemY + legend.lastLineHeight +\n legend.titleHeight;\n legendHeight = legend.handleOverflow(legendHeight);\n legendHeight += padding;\n // Draw the border and/or background\n if (!box) {\n /**\n * SVG element of the legend box.\n *\n * @readonly\n * @name Highcharts.Legend#box\n * @type {Highcharts.SVGElement}\n */\n legend.box = box = renderer.rect()\n .addClass('highcharts-legend-box')\n .attr({\n r: options.borderRadius\n })\n .add(legendGroup);\n }\n // Presentational\n if (!chart.styledMode) {\n box\n .attr({\n stroke: options.borderColor,\n 'stroke-width': options.borderWidth || 0,\n fill: options.backgroundColor || 'none'\n })\n .shadow(options.shadow);\n }\n if (legendWidth > 0 && legendHeight > 0) {\n box[box.placed ? 'animate' : 'attr'](box.crisp.call({}, {\n x: 0,\n y: 0,\n width: legendWidth,\n height: legendHeight\n }, box.strokeWidth()));\n }\n // hide the border if no items\n legendGroup[display ? 'show' : 'hide']();\n // Open for responsiveness\n if (chart.styledMode && legendGroup.getStyle('display') === 'none') {\n legendWidth = legendHeight = 0;\n }\n legend.legendWidth = legendWidth;\n legend.legendHeight = legendHeight;\n if (display) {\n legend.align();\n }\n if (!this.proximate) {\n this.positionItems();\n }\n fireEvent(this, 'afterRender');\n };\n /**\n * Align the legend to chart's box.\n *\n * @private\n * @function Highcharts.align\n * @param {Highcharts.BBoxObject} alignTo\n */\n Legend.prototype.align = function (alignTo) {\n if (alignTo === void 0) { alignTo = this.chart.spacingBox; }\n var chart = this.chart,\n options = this.options;\n // If aligning to the top and the layout is horizontal, adjust for\n // the title (#7428)\n var y = alignTo.y;\n if (/(lth|ct|rth)/.test(this.getAlignment()) &&\n chart.titleOffset[0] > 0) {\n y += chart.titleOffset[0];\n }\n else if (/(lbh|cb|rbh)/.test(this.getAlignment()) &&\n chart.titleOffset[2] > 0) {\n y -= chart.titleOffset[2];\n }\n if (y !== alignTo.y) {\n alignTo = merge(alignTo, { y: y });\n }\n if (!chart.hasRendered) {\n // Avoid animation when adjusting alignment for responsiveness and\n // colorAxis label layout\n this.group.placed = false;\n }\n this.group.align(merge(options, {\n width: this.legendWidth,\n height: this.legendHeight,\n verticalAlign: this.proximate ? 'top' : options.verticalAlign\n }), true, alignTo);\n };\n /**\n * Set up the overflow handling by adding navigation with up and down arrows\n * below the legend.\n *\n * @private\n * @function Highcharts.Legend#handleOverflow\n */\n Legend.prototype.handleOverflow = function (legendHeight) {\n var legend = this,\n chart = this.chart,\n renderer = chart.renderer,\n options = this.options,\n optionsY = options.y,\n alignTop = options.verticalAlign === 'top',\n padding = this.padding,\n maxHeight = options.maxHeight,\n navOptions = options.navigation,\n animation = pick(navOptions.animation,\n true),\n arrowSize = navOptions.arrowSize || 12,\n pages = this.pages,\n allItems = this.allItems,\n clipToHeight = function (height) {\n if (typeof height === 'number') {\n clipRect.attr({\n height: height\n });\n }\n else if (clipRect) { // Reset (#5912)\n legend.clipRect = clipRect.destroy();\n legend.contentGroup.clip();\n }\n // useHTML\n if (legend.contentGroup.div) {\n legend.contentGroup.div.style.clip = height ?\n 'rect(' + padding + 'px,9999px,' +\n (padding + height) + 'px,0)' :\n 'auto';\n }\n }, addTracker = function (key) {\n legend[key] = renderer\n .circle(0, 0, arrowSize * 1.3)\n .translate(arrowSize / 2, arrowSize / 2)\n .add(nav);\n if (!chart.styledMode) {\n legend[key].attr('fill', 'rgba(0,0,0,0.0001)');\n }\n return legend[key];\n };\n var clipHeight,\n lastY,\n legendItem,\n spaceHeight = (chart.spacingBox.height +\n (alignTop ? -optionsY : optionsY) - padding),\n nav = this.nav,\n clipRect = this.clipRect;\n // Adjust the height\n if (options.layout === 'horizontal' &&\n options.verticalAlign !== 'middle' &&\n !options.floating) {\n spaceHeight /= 2;\n }\n if (maxHeight) {\n spaceHeight = Math.min(spaceHeight, maxHeight);\n }\n // Reset the legend height and adjust the clipping rectangle\n pages.length = 0;\n if (legendHeight &&\n spaceHeight > 0 &&\n legendHeight > spaceHeight &&\n navOptions.enabled !== false) {\n this.clipHeight = clipHeight =\n Math.max(spaceHeight - 20 - this.titleHeight - padding, 0);\n this.currentPage = pick(this.currentPage, 1);\n this.fullHeight = legendHeight;\n // Fill pages with Y positions so that the top of each a legend item\n // defines the scroll top for each page (#2098)\n allItems.forEach(function (item, i) {\n legendItem = item.legendItem || {};\n var y = legendItem.y || 0,\n h = Math.round(legendItem.label.getBBox().height);\n var len = pages.length;\n if (!len || (y - pages[len - 1] > clipHeight &&\n (lastY || y) !== pages[len - 1])) {\n pages.push(lastY || y);\n len++;\n }\n // Keep track of which page each item is on\n legendItem.pageIx = len - 1;\n if (lastY) {\n (allItems[i - 1].legendItem || {}).pageIx = len - 1;\n }\n // add the last page if needed (#2617, #13683)\n if (\n // check the last item\n i === allItems.length - 1 &&\n // if adding next page is needed\n y + h - pages[len - 1] > clipHeight &&\n // and will fully fit inside a new page\n h <= clipHeight) {\n pages.push(y);\n legendItem.pageIx = len;\n }\n if (y !== lastY) {\n lastY = y;\n }\n });\n // Only apply clipping if needed. Clipping causes blurred legend in\n // PDF export (#1787)\n if (!clipRect) {\n clipRect = legend.clipRect =\n renderer.clipRect(0, padding, 9999, 0);\n legend.contentGroup.clip(clipRect);\n }\n clipToHeight(clipHeight);\n // Add navigation elements\n if (!nav) {\n this.nav = nav = renderer.g()\n .attr({ zIndex: 1 })\n .add(this.group);\n this.up = renderer\n .symbol('triangle', 0, 0, arrowSize, arrowSize)\n .add(nav);\n addTracker('upTracker')\n .on('click', function () {\n legend.scroll(-1, animation);\n });\n this.pager = renderer.text('', 15, 10)\n .addClass('highcharts-legend-navigation');\n if (!chart.styledMode && navOptions.style) {\n this.pager.css(navOptions.style);\n }\n this.pager.add(nav);\n this.down = renderer\n .symbol('triangle-down', 0, 0, arrowSize, arrowSize)\n .add(nav);\n addTracker('downTracker')\n .on('click', function () {\n legend.scroll(1, animation);\n });\n }\n // Set initial position\n legend.scroll(0);\n legendHeight = spaceHeight;\n // Reset\n }\n else if (nav) {\n clipToHeight();\n this.nav = nav.destroy(); // #6322\n this.scrollGroup.attr({\n translateY: 1\n });\n this.clipHeight = 0; // #1379\n }\n return legendHeight;\n };\n /**\n * Scroll the legend by a number of pages.\n *\n * @private\n * @function Highcharts.Legend#scroll\n *\n * @param {number} scrollBy\n * The number of pages to scroll.\n *\n * @param {boolean|Partial} [animation]\n * Whether and how to apply animation.\n *\n */\n Legend.prototype.scroll = function (scrollBy, animation) {\n var _this = this;\n var chart = this.chart,\n pages = this.pages,\n pageCount = pages.length,\n clipHeight = this.clipHeight,\n navOptions = this.options.navigation,\n pager = this.pager,\n padding = this.padding;\n var currentPage = this.currentPage + scrollBy;\n // When resizing while looking at the last page\n if (currentPage > pageCount) {\n currentPage = pageCount;\n }\n if (currentPage > 0) {\n if (typeof animation !== 'undefined') {\n setAnimation(animation, chart);\n }\n this.nav.attr({\n translateX: padding,\n translateY: clipHeight + this.padding + 7 + this.titleHeight,\n visibility: 'inherit'\n });\n [this.up, this.upTracker].forEach(function (elem) {\n elem.attr({\n 'class': currentPage === 1 ?\n 'highcharts-legend-nav-inactive' :\n 'highcharts-legend-nav-active'\n });\n });\n pager.attr({\n text: currentPage + '/' + pageCount\n });\n [this.down, this.downTracker].forEach(function (elem) {\n elem.attr({\n // adjust to text width\n x: 18 + this.pager.getBBox().width,\n 'class': currentPage === pageCount ?\n 'highcharts-legend-nav-inactive' :\n 'highcharts-legend-nav-active'\n });\n }, this);\n if (!chart.styledMode) {\n this.up\n .attr({\n fill: currentPage === 1 ?\n navOptions.inactiveColor :\n navOptions.activeColor\n });\n this.upTracker\n .css({\n cursor: currentPage === 1 ? 'default' : 'pointer'\n });\n this.down\n .attr({\n fill: currentPage === pageCount ?\n navOptions.inactiveColor :\n navOptions.activeColor\n });\n this.downTracker\n .css({\n cursor: currentPage === pageCount ?\n 'default' :\n 'pointer'\n });\n }\n this.scrollOffset = -pages[currentPage - 1] + this.initialItemY;\n this.scrollGroup.animate({\n translateY: this.scrollOffset\n });\n this.currentPage = currentPage;\n this.positionCheckboxes();\n // Fire event after scroll animation is complete\n var animOptions = animObject(pick(animation,\n chart.renderer.globalAnimation,\n true));\n syncTimeout(function () {\n fireEvent(_this, 'afterScroll', { currentPage: currentPage });\n }, animOptions.duration);\n }\n };\n /**\n * @private\n * @function Highcharts.Legend#setItemEvents\n * @param {Highcharts.BubbleLegendItem|Point|Highcharts.Series} item\n * @param {Highcharts.SVGElement} legendLabel\n * @param {boolean} [useHTML=false]\n * @emits Highcharts.Point#event:legendItemClick\n * @emits Highcharts.Series#event:legendItemClick\n */\n Legend.prototype.setItemEvents = function (item, legendLabel, useHTML) {\n var legend = this,\n legendItem = item.legendItem || {},\n boxWrapper = legend.chart.renderer.boxWrapper,\n isPoint = item instanceof Point,\n activeClass = 'highcharts-legend-' +\n (isPoint ? 'point' : 'series') + '-active',\n styledMode = legend.chart.styledMode, \n // When `useHTML`, the symbol is rendered in other group, so\n // we need to apply events listeners to both places\n legendElements = useHTML ?\n [legendLabel,\n legendItem.symbol] :\n [legendItem.group];\n var setOtherItemsState = function (state) {\n legend.allItems.forEach(function (otherItem) {\n if (item !== otherItem) {\n [otherItem]\n .concat(otherItem.linkedSeries || [])\n .forEach(function (otherItem) {\n otherItem.setState(state, !isPoint);\n });\n }\n });\n };\n // Set the events on the item group, or in case of useHTML, the item\n // itself (#1249)\n for (var _i = 0, legendElements_1 = legendElements; _i < legendElements_1.length; _i++) {\n var element = legendElements_1[_i];\n if (element) {\n element\n .on('mouseover', function () {\n if (item.visible) {\n setOtherItemsState('inactive');\n }\n item.setState('hover');\n // A CSS class to dim or hide other than the hovered\n // series.\n // Works only if hovered series is visible (#10071).\n if (item.visible) {\n boxWrapper.addClass(activeClass);\n }\n if (!styledMode) {\n legendLabel.css(legend.options.itemHoverStyle);\n }\n })\n .on('mouseout', function () {\n if (!legend.chart.styledMode) {\n legendLabel.css(merge(item.visible ?\n legend.itemStyle :\n legend.itemHiddenStyle));\n }\n setOtherItemsState('');\n // A CSS class to dim or hide other than the hovered\n // series.\n boxWrapper.removeClass(activeClass);\n item.setState();\n })\n .on('click', function (event) {\n var strLegendItemClick = 'legendItemClick',\n fnLegendItemClick = function () {\n if (item.setVisible) {\n item.setVisible();\n }\n // Reset inactive state\n setOtherItemsState(item.visible ? 'inactive' : '');\n };\n // A CSS class to dim or hide other than the hovered\n // series. Event handling in iOS causes the activeClass\n // to be added prior to click in some cases (#7418).\n boxWrapper.removeClass(activeClass);\n // Pass over the click/touch event. #4.\n event = {\n browserEvent: event\n };\n // click the name or symbol\n if (item.firePointEvent) { // point\n item.firePointEvent(strLegendItemClick, event, fnLegendItemClick);\n }\n else {\n fireEvent(item, strLegendItemClick, event, fnLegendItemClick);\n }\n });\n }\n }\n };\n /**\n * @private\n * @function Highcharts.Legend#createCheckboxForItem\n * @param {Highcharts.BubbleLegendItem|Point|Highcharts.Series} item\n * @emits Highcharts.Series#event:checkboxClick\n */\n Legend.prototype.createCheckboxForItem = function (item) {\n var legend = this;\n item.checkbox = createElement('input', {\n type: 'checkbox',\n className: 'highcharts-legend-checkbox',\n checked: item.selected,\n defaultChecked: item.selected // required by IE7\n }, legend.options.itemCheckboxStyle, legend.chart.container);\n addEvent(item.checkbox, 'click', function (event) {\n var target = event.target;\n fireEvent(item.series || item, 'checkboxClick', {\n checked: target.checked,\n item: item\n }, function () {\n item.select();\n });\n });\n };\n return Legend;\n }());\n /* *\n *\n * Default Export\n *\n * */\n /* *\n *\n * API Declarations\n *\n * */\n /**\n * @interface Highcharts.LegendItemObject\n */ /**\n * @name Highcharts.LegendItemObject#item\n * @type {Highcharts.SVGElement|undefined}\n */ /**\n * @name Highcharts.LegendItemObject#line\n * @type {Highcharts.SVGElement|undefined}\n */ /**\n * @name Highcharts.LegendItemObject#symbol\n * @type {Highcharts.SVGElement|undefined}\n */\n /**\n * Gets fired when the legend item belonging to a point is clicked. The default\n * action is to toggle the visibility of the point. This can be prevented by\n * returning `false` or calling `event.preventDefault()`.\n *\n * @callback Highcharts.PointLegendItemClickCallbackFunction\n *\n * @param {Highcharts.Point} this\n * The point on which the event occured.\n *\n * @param {Highcharts.PointLegendItemClickEventObject} event\n * The event that occured.\n */\n /**\n * Information about the legend click event.\n *\n * @interface Highcharts.PointLegendItemClickEventObject\n */ /**\n * Related browser event.\n * @name Highcharts.PointLegendItemClickEventObject#browserEvent\n * @type {Highcharts.PointerEvent}\n */ /**\n * Prevent the default action of toggle the visibility of the point.\n * @name Highcharts.PointLegendItemClickEventObject#preventDefault\n * @type {Function}\n */ /**\n * Related point.\n * @name Highcharts.PointLegendItemClickEventObject#target\n * @type {Highcharts.Point}\n */ /**\n * Event type.\n * @name Highcharts.PointLegendItemClickEventObject#type\n * @type {\"legendItemClick\"}\n */\n /**\n * Series color as used by the legend and some series types.\n * @name Highcharts.Series#color\n * @type {Highcharts.ColorType|undefined}\n */ /**\n * Legend data for the series.\n * @name Highcharts.Series#legendItem\n * @type {Highcharts.LegendItemObject|undefined}\n * @since 10.3.0\n */\n /**\n * Gets fired when the legend item belonging to a series is clicked. The default\n * action is to toggle the visibility of the series. This can be prevented by\n * returning `false` or calling `event.preventDefault()`.\n *\n * @callback Highcharts.SeriesLegendItemClickCallbackFunction\n *\n * @param {Highcharts.Series} this\n * The series where the event occured.\n *\n * @param {Highcharts.SeriesLegendItemClickEventObject} event\n * The event that occured.\n */\n /**\n * Information about the legend click event.\n *\n * @interface Highcharts.SeriesLegendItemClickEventObject\n */ /**\n * Related browser event.\n * @name Highcharts.SeriesLegendItemClickEventObject#browserEvent\n * @type {Highcharts.PointerEvent}\n */ /**\n * Prevent the default action of toggle the visibility of the series.\n * @name Highcharts.SeriesLegendItemClickEventObject#preventDefault\n * @type {Function}\n */ /**\n * Related series.\n * @name Highcharts.SeriesLegendItemClickEventObject#target\n * @type {Highcharts.Series}\n */ /**\n * Event type.\n * @name Highcharts.SeriesLegendItemClickEventObject#type\n * @type {\"legendItemClick\"}\n */\n (''); // keeps doclets above in JS file\n\n return Legend;\n });\n _registerModule(_modules, 'Core/Series/SeriesRegistry.js', [_modules['Core/Globals.js'], _modules['Core/Defaults.js'], _modules['Core/Series/Point.js'], _modules['Core/Utilities.js']], function (H, D, Point, U) {\n /* *\n *\n * (c) 2010-2021 Torstein Honsi\n *\n * License: www.highcharts.com/license\n *\n * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!\n *\n * */\n var defaultOptions = D.defaultOptions;\n var extendClass = U.extendClass,\n merge = U.merge;\n /* *\n *\n * Namespace\n *\n * */\n var SeriesRegistry;\n (function (SeriesRegistry) {\n /* *\n *\n * Properties\n *\n * */\n /**\n * @internal\n * @todo Move `Globals.seriesTypes` code to her.\n */\n SeriesRegistry.seriesTypes = H.seriesTypes;\n /* *\n *\n * Functions\n *\n * */\n /**\n * Registers class pattern of a series.\n *\n * @private\n */\n function registerSeriesType(seriesType, SeriesClass) {\n var defaultPlotOptions = defaultOptions.plotOptions || {},\n seriesOptions = SeriesClass.defaultOptions,\n seriesProto = SeriesClass.prototype;\n seriesProto.type = seriesType;\n if (!seriesProto.pointClass) {\n seriesProto.pointClass = Point;\n }\n if (seriesOptions) {\n defaultPlotOptions[seriesType] = seriesOptions;\n }\n SeriesRegistry.seriesTypes[seriesType] = SeriesClass;\n }\n SeriesRegistry.registerSeriesType = registerSeriesType;\n /**\n * Old factory to create new series prototypes.\n *\n * @deprecated\n * @function Highcharts.seriesType\n *\n * @param {string} type\n * The series type name.\n *\n * @param {string} parent\n * The parent series type name. Use `line` to inherit from the basic\n * {@link Series} object.\n *\n * @param {Highcharts.SeriesOptionsType|Highcharts.Dictionary<*>} options\n * The additional default options that are merged with the parent's options.\n *\n * @param {Highcharts.Dictionary<*>} [props]\n * The properties (functions and primitives) to set on the new prototype.\n *\n * @param {Highcharts.Dictionary<*>} [pointProps]\n * Members for a series-specific extension of the {@link Point} prototype if\n * needed.\n *\n * @return {Highcharts.Series}\n * The newly created prototype as extended from {@link Series} or its\n * derivatives.\n */\n function seriesType(type, parent, options, seriesProto, pointProto) {\n var defaultPlotOptions = defaultOptions.plotOptions || {};\n parent = parent || '';\n // Merge the options\n defaultPlotOptions[type] = merge(defaultPlotOptions[parent], options);\n // Create the class\n registerSeriesType(type, extendClass(SeriesRegistry.seriesTypes[parent] || function () { }, seriesProto));\n SeriesRegistry.seriesTypes[type].prototype.type = type;\n // Create the point class if needed\n if (pointProto) {\n SeriesRegistry.seriesTypes[type].prototype.pointClass = extendClass(Point, pointProto);\n }\n return SeriesRegistry.seriesTypes[type];\n }\n SeriesRegistry.seriesType = seriesType;\n })(SeriesRegistry || (SeriesRegistry = {}));\n /* *\n *\n * Default Export\n *\n * */\n\n return SeriesRegistry;\n });\n _registerModule(_modules, 'Core/Chart/Chart.js', [_modules['Core/Animation/AnimationUtilities.js'], _modules['Core/Axis/Axis.js'], _modules['Core/Defaults.js'], _modules['Core/FormatUtilities.js'], _modules['Core/Foundation.js'], _modules['Core/Globals.js'], _modules['Core/Legend/Legend.js'], _modules['Core/MSPointer.js'], _modules['Core/Pointer.js'], _modules['Core/Renderer/RendererRegistry.js'], _modules['Core/Series/SeriesRegistry.js'], _modules['Core/Renderer/SVG/SVGRenderer.js'], _modules['Core/Time.js'], _modules['Core/Utilities.js'], _modules['Core/Renderer/HTML/AST.js']], function (A, Axis, D, FormatUtilities, Foundation, H, Legend, MSPointer, Pointer, RendererRegistry, SeriesRegistry, SVGRenderer, Time, U, AST) {\n /* *\n *\n * (c) 2010-2021 Torstein Honsi\n *\n * License: www.highcharts.com/license\n *\n * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!\n *\n * */\n var animate = A.animate,\n animObject = A.animObject,\n setAnimation = A.setAnimation;\n var defaultOptions = D.defaultOptions,\n defaultTime = D.defaultTime;\n var numberFormat = FormatUtilities.numberFormat;\n var registerEventOptions = Foundation.registerEventOptions;\n var charts = H.charts,\n doc = H.doc,\n marginNames = H.marginNames,\n svg = H.svg,\n win = H.win;\n var seriesTypes = SeriesRegistry.seriesTypes;\n var addEvent = U.addEvent,\n attr = U.attr,\n cleanRecursively = U.cleanRecursively,\n createElement = U.createElement,\n css = U.css,\n defined = U.defined,\n discardElement = U.discardElement,\n erase = U.erase,\n error = U.error,\n extend = U.extend,\n find = U.find,\n fireEvent = U.fireEvent,\n getStyle = U.getStyle,\n isArray = U.isArray,\n isNumber = U.isNumber,\n isObject = U.isObject,\n isString = U.isString,\n merge = U.merge,\n objectEach = U.objectEach,\n pick = U.pick,\n pInt = U.pInt,\n relativeLength = U.relativeLength,\n removeEvent = U.removeEvent,\n splat = U.splat,\n syncTimeout = U.syncTimeout,\n uniqueKey = U.uniqueKey;\n /* *\n *\n * Class\n *\n * */\n /* eslint-disable no-invalid-this, valid-jsdoc */\n /**\n * The Chart class. The recommended constructor is {@link Highcharts#chart}.\n *\n * @example\n * let chart = Highcharts.chart('container', {\n * title: {\n * text: 'My chart'\n * },\n * series: [{\n * data: [1, 3, 2, 4]\n * }]\n * })\n *\n * @class\n * @name Highcharts.Chart\n *\n * @param {string|Highcharts.HTMLDOMElement} [renderTo]\n * The DOM element to render to, or its id.\n *\n * @param {Highcharts.Options} options\n * The chart options structure.\n *\n * @param {Highcharts.ChartCallbackFunction} [callback]\n * Function to run when the chart has loaded and and all external images\n * are loaded. Defining a\n * [chart.events.load](https://api.highcharts.com/highcharts/chart.events.load)\n * handler is equivalent.\n */\n var Chart = /** @class */ (function () {\n function Chart(a, b, c) {\n this.axes = void 0;\n this.axisOffset = void 0;\n this.bounds = void 0;\n this.chartHeight = void 0;\n this.chartWidth = void 0;\n this.clipBox = void 0;\n this.colorCounter = void 0;\n this.container = void 0;\n this.eventOptions = void 0;\n this.index = void 0;\n this.isResizing = void 0;\n this.labelCollectors = void 0;\n this.legend = void 0;\n this.margin = void 0;\n this.numberFormatter = void 0;\n this.options = void 0;\n this.plotBox = void 0;\n this.plotHeight = void 0;\n this.plotLeft = void 0;\n this.plotTop = void 0;\n this.plotWidth = void 0;\n this.pointCount = void 0;\n this.pointer = void 0;\n this.renderer = void 0;\n this.renderTo = void 0;\n this.series = void 0;\n this.sharedClips = {};\n this.spacing = void 0;\n this.spacingBox = void 0;\n this.symbolCounter = void 0;\n this.time = void 0;\n this.titleOffset = void 0;\n this.userOptions = void 0;\n this.xAxis = void 0;\n this.yAxis = void 0;\n this.getArgs(a, b, c);\n }\n /**\n * Factory function for basic charts.\n *\n * @example\n * // Render a chart in to div#container\n * let chart = Highcharts.chart('container', {\n * title: {\n * text: 'My chart'\n * },\n * series: [{\n * data: [1, 3, 2, 4]\n * }]\n * });\n *\n * @function Highcharts.chart\n *\n * @param {string|Highcharts.HTMLDOMElement} [renderTo]\n * The DOM element to render to, or its id.\n *\n * @param {Highcharts.Options} options\n * The chart options structure.\n *\n * @param {Highcharts.ChartCallbackFunction} [callback]\n * Function to run when the chart has loaded and and all external images are\n * loaded. Defining a\n * [chart.events.load](https://api.highcharts.com/highcharts/chart.events.load)\n * handler is equivalent.\n *\n * @return {Highcharts.Chart}\n * Returns the Chart object.\n */\n Chart.chart = function (a, b, c) {\n return new Chart(a, b, c);\n };\n /* *\n *\n * Functions\n *\n * */\n /**\n * Handle the arguments passed to the constructor.\n *\n * @private\n * @function Highcharts.Chart#getArgs\n *\n * @param {...Array<*>} arguments\n * All arguments for the constructor.\n *\n * @emits Highcharts.Chart#event:init\n * @emits Highcharts.Chart#event:afterInit\n */\n Chart.prototype.getArgs = function (a, b, c) {\n // Remove the optional first argument, renderTo, and\n // set it on this.\n if (isString(a) || a.nodeName) {\n this.renderTo = a;\n this.init(b, c);\n }\n else {\n this.init(a, b);\n }\n };\n /**\n * Overridable function that initializes the chart. The constructor's\n * arguments are passed on directly.\n *\n * @function Highcharts.Chart#init\n *\n * @param {Highcharts.Options} userOptions\n * Custom options.\n *\n * @param {Function} [callback]\n * Function to run when the chart has loaded and and all external\n * images are loaded.\n *\n *\n * @emits Highcharts.Chart#event:init\n * @emits Highcharts.Chart#event:afterInit\n */\n Chart.prototype.init = function (userOptions, callback) {\n // Handle regular options\n var userPlotOptions = userOptions.plotOptions || {};\n // Fire the event with a default function\n fireEvent(this, 'init', { args: arguments }, function () {\n var options = merge(defaultOptions,\n userOptions); // do the merge\n var optionsChart = options.chart;\n // Override (by copy of user options) or clear tooltip options\n // in chart.options.plotOptions (#6218)\n objectEach(options.plotOptions, function (typeOptions, type) {\n if (isObject(typeOptions)) { // #8766\n typeOptions.tooltip = (userPlotOptions[type] && // override by copy:\n merge(userPlotOptions[type].tooltip)) || void 0; // or clear\n }\n });\n // User options have higher priority than default options\n // (#6218). In case of exporting: path is changed\n options.tooltip.userOptions = (userOptions.chart &&\n userOptions.chart.forExport &&\n userOptions.tooltip.userOptions) || userOptions.tooltip;\n /**\n * The original options given to the constructor or a chart factory\n * like {@link Highcharts.chart} and {@link Highcharts.stockChart}.\n *\n * @name Highcharts.Chart#userOptions\n * @type {Highcharts.Options}\n */\n this.userOptions = userOptions;\n this.margin = [];\n this.spacing = [];\n // Pixel data bounds for touch zoom\n this.bounds = { h: {}, v: {} };\n // An array of functions that returns labels that should be\n // considered for anti-collision\n this.labelCollectors = [];\n this.callback = callback;\n this.isResizing = 0;\n var zooming = optionsChart.zooming = optionsChart.zooming || {};\n // Other options have no default so just pick\n if (userOptions.chart && !userOptions.chart.zooming) {\n zooming.resetButton = optionsChart.resetZoomButton;\n }\n zooming.key = pick(zooming.key, optionsChart.zoomKey);\n zooming.pinchType = pick(zooming.pinchType, optionsChart.pinchType);\n zooming.singleTouch = pick(zooming.singleTouch, optionsChart.zoomBySingleTouch);\n zooming.type = pick(zooming.type, optionsChart.zoomType);\n /**\n * The options structure for the chart after merging\n * {@link #defaultOptions} and {@link #userOptions}. It contains\n * members for the sub elements like series, legend, tooltip etc.\n *\n * @name Highcharts.Chart#options\n * @type {Highcharts.Options}\n */\n this.options = options;\n /**\n * All the axes in the chart.\n *\n * @see Highcharts.Chart.xAxis\n * @see Highcharts.Chart.yAxis\n *\n * @name Highcharts.Chart#axes\n * @type {Array}\n */\n this.axes = [];\n /**\n * All the current series in the chart.\n *\n * @name Highcharts.Chart#series\n * @type {Array}\n */\n this.series = [];\n /**\n * The `Time` object associated with the chart. Since v6.0.5,\n * time settings can be applied individually for each chart. If\n * no individual settings apply, the `Time` object is shared by\n * all instances.\n *\n * @name Highcharts.Chart#time\n * @type {Highcharts.Time}\n */\n this.time =\n userOptions.time && Object.keys(userOptions.time).length ?\n new Time(userOptions.time) :\n H.time;\n /**\n * Callback function to override the default function that formats\n * all the numbers in the chart. Returns a string with the formatted\n * number.\n *\n * @name Highcharts.Chart#numberFormatter\n * @type {Highcharts.NumberFormatterCallbackFunction}\n */\n this.numberFormatter = optionsChart.numberFormatter || numberFormat;\n /**\n * Whether the chart is in styled mode, meaning all presentational\n * attributes are avoided.\n *\n * @name Highcharts.Chart#styledMode\n * @type {boolean}\n */\n this.styledMode = optionsChart.styledMode;\n this.hasCartesianSeries = optionsChart.showAxes;\n var chart = this;\n /**\n * Index position of the chart in the {@link Highcharts#charts}\n * property.\n *\n * @name Highcharts.Chart#index\n * @type {number}\n * @readonly\n */\n chart.index = charts.length; // Add the chart to the global lookup\n charts.push(chart);\n H.chartCount++;\n // Chart event handlers\n registerEventOptions(this, optionsChart);\n /**\n * A collection of the X axes in the chart.\n *\n * @name Highcharts.Chart#xAxis\n * @type {Array}\n */\n chart.xAxis = [];\n /**\n * A collection of the Y axes in the chart.\n *\n * @name Highcharts.Chart#yAxis\n * @type {Array}\n *\n * @todo\n * Make events official: Fire the event `afterInit`.\n */\n chart.yAxis = [];\n chart.pointCount = chart.colorCounter = chart.symbolCounter = 0;\n // Fire after init but before first render, before axes and series\n // have been initialized.\n fireEvent(chart, 'afterInit');\n chart.firstRender();\n });\n };\n /**\n * Internal function to unitialize an individual series.\n *\n * @private\n * @function Highcharts.Chart#initSeries\n */\n Chart.prototype.initSeries = function (options) {\n var chart = this,\n optionsChart = chart.options.chart,\n type = (options.type ||\n optionsChart.type ||\n optionsChart.defaultSeriesType),\n SeriesClass = seriesTypes[type];\n // No such series type\n if (!SeriesClass) {\n error(17, true, chart, { missingModuleFor: type });\n }\n var series = new SeriesClass();\n if (typeof series.init === 'function') {\n series.init(chart, options);\n }\n return series;\n };\n /**\n * Internal function to set data for all series with enabled sorting.\n *\n * @private\n * @function Highcharts.Chart#setSeriesData\n */\n Chart.prototype.setSeriesData = function () {\n this.getSeriesOrderByLinks().forEach(function (series) {\n // We need to set data for series with sorting after series init\n if (!series.points && !series.data && series.enabledDataSorting) {\n series.setData(series.options.data, false);\n }\n });\n };\n /**\n * Sort and return chart series in order depending on the number of linked\n * series.\n *\n * @private\n * @function Highcharts.Series#getSeriesOrderByLinks\n */\n Chart.prototype.getSeriesOrderByLinks = function () {\n return this.series.concat().sort(function (a, b) {\n if (a.linkedSeries.length || b.linkedSeries.length) {\n return b.linkedSeries.length - a.linkedSeries.length;\n }\n return 0;\n });\n };\n /**\n * Order all series above a given index. When series are added and ordered\n * by configuration, only the last series is handled (#248, #1123, #2456,\n * #6112). This function is called on series initialization and destroy.\n *\n * @private\n * @function Highcharts.Series#orderSeries\n * @param {number} [fromIndex]\n * If this is given, only the series above this index are handled.\n */\n Chart.prototype.orderSeries = function (fromIndex) {\n var series = this.series;\n for (var i = (fromIndex || 0), iEnd = series.length; i < iEnd; ++i) {\n if (series[i]) {\n /**\n * Contains the series' index in the `Chart.series` array.\n *\n * @name Highcharts.Series#index\n * @type {number}\n * @readonly\n */\n series[i].index = i;\n series[i].name = series[i].getName();\n }\n }\n };\n /**\n * Check whether a given point is within the plot area.\n *\n * @function Highcharts.Chart#isInsidePlot\n *\n * @param {number} plotX\n * Pixel x relative to the plot area.\n *\n * @param {number} plotY\n * Pixel y relative to the plot area.\n *\n * @param {Highcharts.ChartIsInsideOptionsObject} [options]\n * Options object.\n *\n * @return {boolean}\n * Returns true if the given point is inside the plot area.\n */\n Chart.prototype.isInsidePlot = function (plotX, plotY, options) {\n var _a;\n if (options === void 0) { options = {}; }\n var _b = this,\n inverted = _b.inverted,\n plotBox = _b.plotBox,\n plotLeft = _b.plotLeft,\n plotTop = _b.plotTop,\n scrollablePlotBox = _b.scrollablePlotBox;\n var scrollLeft = 0,\n scrollTop = 0;\n if (options.visiblePlotOnly && this.scrollingContainer) {\n (_a = this.scrollingContainer, scrollLeft = _a.scrollLeft, scrollTop = _a.scrollTop);\n }\n var series = options.series,\n box = (options.visiblePlotOnly && scrollablePlotBox) || plotBox,\n x = options.inverted ? plotY : plotX,\n y = options.inverted ? plotX : plotY,\n e = {\n x: x,\n y: y,\n isInsidePlot: true,\n options: options\n };\n if (!options.ignoreX) {\n var xAxis = (series &&\n (inverted && !this.polar ? series.yAxis : series.xAxis)) || {\n pos: plotLeft,\n len: Infinity\n };\n var chartX = options.paneCoordinates ?\n xAxis.pos + x : plotLeft + x;\n if (!(chartX >= Math.max(scrollLeft + plotLeft, xAxis.pos) &&\n chartX <= Math.min(scrollLeft + plotLeft + box.width, xAxis.pos + xAxis.len))) {\n e.isInsidePlot = false;\n }\n }\n if (!options.ignoreY && e.isInsidePlot) {\n var yAxis = (options.axis && !options.axis.isXAxis && options.axis) || (series && (inverted ? series.xAxis : series.yAxis)) || {\n pos: plotTop,\n len: Infinity\n };\n var chartY = options.paneCoordinates ?\n yAxis.pos + y : plotTop + y;\n if (!(chartY >= Math.max(scrollTop + plotTop, yAxis.pos) &&\n chartY <= Math.min(scrollTop + plotTop + box.height, yAxis.pos + yAxis.len))) {\n e.isInsidePlot = false;\n }\n }\n fireEvent(this, 'afterIsInsidePlot', e);\n return e.isInsidePlot;\n };\n /**\n * Redraw the chart after changes have been done to the data, axis extremes\n * chart size or chart elements. All methods for updating axes, series or\n * points have a parameter for redrawing the chart. This is `true` by\n * default. But in many cases you want to do more than one operation on the\n * chart before redrawing, for example add a number of points. In those\n * cases it is a waste of resources to redraw the chart for each new point\n * added. So you add the points and call `chart.redraw()` after.\n *\n * @function Highcharts.Chart#redraw\n *\n * @param {boolean|Partial} [animation]\n * If or how to apply animation to the redraw.\n *\n * @emits Highcharts.Chart#event:afterSetExtremes\n * @emits Highcharts.Chart#event:beforeRedraw\n * @emits Highcharts.Chart#event:predraw\n * @emits Highcharts.Chart#event:redraw\n * @emits Highcharts.Chart#event:render\n * @emits Highcharts.Chart#event:updatedData\n */\n Chart.prototype.redraw = function (animation) {\n fireEvent(this, 'beforeRedraw');\n var chart = this,\n axes = chart.hasCartesianSeries ? chart.axes : chart.colorAxis || [],\n series = chart.series,\n pointer = chart.pointer,\n legend = chart.legend,\n legendUserOptions = chart.userOptions.legend,\n renderer = chart.renderer,\n isHiddenChart = renderer.isHidden(),\n afterRedraw = [];\n var hasDirtyStacks,\n hasStackedSeries,\n i,\n isDirtyBox = chart.isDirtyBox,\n redrawLegend = chart.isDirtyLegend,\n serie;\n // Handle responsive rules, not only on resize (#6130)\n if (chart.setResponsive) {\n chart.setResponsive(false);\n }\n // Set the global animation. When chart.hasRendered is not true, the\n // redraw call comes from a responsive rule and animation should not\n // occur.\n setAnimation(chart.hasRendered ? animation : false, chart);\n if (isHiddenChart) {\n chart.temporaryDisplay();\n }\n // Adjust title layout (reflow multiline text)\n chart.layOutTitles();\n // link stacked series\n i = series.length;\n while (i--) {\n serie = series[i];\n if (serie.options.stacking || serie.options.centerInCategory) {\n hasStackedSeries = true;\n if (serie.isDirty) {\n hasDirtyStacks = true;\n break;\n }\n }\n }\n if (hasDirtyStacks) { // mark others as dirty\n i = series.length;\n while (i--) {\n serie = series[i];\n if (serie.options.stacking) {\n serie.isDirty = true;\n }\n }\n }\n // Handle updated data in the series\n series.forEach(function (serie) {\n if (serie.isDirty) {\n if (serie.options.legendType === 'point') {\n if (typeof serie.updateTotals === 'function') {\n serie.updateTotals();\n }\n redrawLegend = true;\n }\n else if (legendUserOptions &&\n (legendUserOptions.labelFormatter ||\n legendUserOptions.labelFormat)) {\n redrawLegend = true; // #2165\n }\n }\n if (serie.isDirtyData) {\n fireEvent(serie, 'updatedData');\n }\n });\n // handle added or removed series\n if (redrawLegend && legend && legend.options.enabled) {\n // draw legend graphics\n legend.render();\n chart.isDirtyLegend = false;\n }\n // reset stacks\n if (hasStackedSeries) {\n chart.getStacks();\n }\n // set axes scales\n axes.forEach(function (axis) {\n axis.updateNames();\n axis.setScale();\n });\n chart.getMargins(); // #3098\n // If one axis is dirty, all axes must be redrawn (#792, #2169)\n axes.forEach(function (axis) {\n if (axis.isDirty) {\n isDirtyBox = true;\n }\n });\n // redraw axes\n axes.forEach(function (axis) {\n // Fire 'afterSetExtremes' only if extremes are set\n var key = axis.min + ',' + axis.max;\n if (axis.extKey !== key) { // #821, #4452\n axis.extKey = key;\n // prevent a recursive call to chart.redraw() (#1119)\n afterRedraw.push(function () {\n fireEvent(axis, 'afterSetExtremes', extend(axis.eventArgs, axis.getExtremes())); // #747, #751\n delete axis.eventArgs;\n });\n }\n if (isDirtyBox || hasStackedSeries) {\n axis.redraw();\n }\n });\n // the plot areas size has changed\n if (isDirtyBox) {\n chart.drawChartBox();\n }\n // Fire an event before redrawing series, used by the boost module to\n // clear previous series renderings.\n fireEvent(chart, 'predraw');\n // redraw affected series\n series.forEach(function (serie) {\n if ((isDirtyBox || serie.isDirty) && serie.visible) {\n serie.redraw();\n }\n // Set it here, otherwise we will have unlimited 'updatedData' calls\n // for a hidden series after setData(). Fixes #6012\n serie.isDirtyData = false;\n });\n // move tooltip or reset\n if (pointer) {\n pointer.reset(true);\n }\n // redraw if canvas\n renderer.draw();\n // Fire the events\n fireEvent(chart, 'redraw');\n fireEvent(chart, 'render');\n if (isHiddenChart) {\n chart.temporaryDisplay(true);\n }\n // Fire callbacks that are put on hold until after the redraw\n afterRedraw.forEach(function (callback) {\n callback.call();\n });\n };\n /**\n * Get an axis, series or point object by `id` as given in the configuration\n * options. Returns `undefined` if no item is found.\n *\n * @sample highcharts/plotoptions/series-id/\n * Get series by id\n *\n * @function Highcharts.Chart#get\n *\n * @param {string} id\n * The id as given in the configuration options.\n *\n * @return {Highcharts.Axis|Highcharts.Series|Highcharts.Point|undefined}\n * The retrieved item.\n */\n Chart.prototype.get = function (id) {\n var series = this.series;\n /**\n * @private\n */\n function itemById(item) {\n return (item.id === id ||\n (item.options && item.options.id === id));\n }\n var ret = \n // Search axes\n find(this.axes,\n itemById) ||\n // Search series\n find(this.series,\n itemById);\n // Search points\n for (var i = 0; !ret && i < series.length; i++) {\n ret = find(series[i].points || [], itemById);\n }\n return ret;\n };\n /**\n * Create the Axis instances based on the config options.\n *\n * @private\n * @function Highcharts.Chart#getAxes\n * @emits Highcharts.Chart#event:afterGetAxes\n * @emits Highcharts.Chart#event:getAxes\n */\n Chart.prototype.getAxes = function () {\n var chart = this,\n options = this.options,\n xAxisOptions = options.xAxis = splat(options.xAxis || {}),\n yAxisOptions = options.yAxis = splat(options.yAxis || {});\n fireEvent(this, 'getAxes');\n // make sure the options are arrays and add some members\n xAxisOptions.forEach(function (axis, i) {\n axis.index = i;\n axis.isX = true;\n });\n yAxisOptions.forEach(function (axis, i) {\n axis.index = i;\n });\n // concatenate all axis options into one array\n var optionsArray = xAxisOptions.concat(yAxisOptions);\n optionsArray.forEach(function (axisOptions) {\n new Axis(chart, axisOptions); // eslint-disable-line no-new\n });\n fireEvent(this, 'afterGetAxes');\n };\n /**\n * Returns an array of all currently selected points in the chart. Points\n * can be selected by clicking or programmatically by the\n * {@link Highcharts.Point#select}\n * function.\n *\n * @sample highcharts/plotoptions/series-allowpointselect-line/\n * Get selected points\n *\n * @function Highcharts.Chart#getSelectedPoints\n *\n * @return {Array}\n * The currently selected points.\n */\n Chart.prototype.getSelectedPoints = function () {\n return this.series.reduce(function (acc, series) {\n // For one-to-one points inspect series.data in order to retrieve\n // points outside the visible range (#6445). For grouped data,\n // inspect the generated series.points.\n series.getPointsCollection()\n .forEach(function (point) {\n if (pick(point.selectedStaging, point.selected)) {\n acc.push(point);\n }\n });\n return acc;\n }, []);\n };\n /**\n * Returns an array of all currently selected series in the chart. Series\n * can be selected either programmatically by the\n * {@link Highcharts.Series#select}\n * function or by checking the checkbox next to the legend item if\n * [series.showCheckBox](https://api.highcharts.com/highcharts/plotOptions.series.showCheckbox)\n * is true.\n *\n * @sample highcharts/members/chart-getselectedseries/\n * Get selected series\n *\n * @function Highcharts.Chart#getSelectedSeries\n *\n * @return {Array}\n * The currently selected series.\n */\n Chart.prototype.getSelectedSeries = function () {\n return this.series.filter(function (serie) {\n return serie.selected;\n });\n };\n /**\n * Set a new title or subtitle for the chart.\n *\n * @sample highcharts/members/chart-settitle/\n * Set title text and styles\n *\n * @function Highcharts.Chart#setTitle\n *\n * @param {Highcharts.TitleOptions} [titleOptions]\n * New title options. The title text itself is set by the\n * `titleOptions.text` property.\n *\n * @param {Highcharts.SubtitleOptions} [subtitleOptions]\n * New subtitle options. The subtitle text itself is set by the\n * `subtitleOptions.text` property.\n *\n * @param {boolean} [redraw]\n * Whether to redraw the chart or wait for a later call to\n * `chart.redraw()`.\n */\n Chart.prototype.setTitle = function (titleOptions, subtitleOptions, redraw) {\n this.applyDescription('title', titleOptions);\n this.applyDescription('subtitle', subtitleOptions);\n // The initial call also adds the caption. On update, chart.update will\n // relay to Chart.setCaption.\n this.applyDescription('caption', void 0);\n this.layOutTitles(redraw);\n };\n /**\n * Apply a title, subtitle or caption for the chart\n *\n * @private\n * @function Highcharts.Chart#applyDescription\n * @param name {string}\n * Either title, subtitle or caption\n * @param {Highcharts.TitleOptions|Highcharts.SubtitleOptions|Highcharts.CaptionOptions|undefined} explicitOptions\n * The options to set, will be merged with default options.\n */\n Chart.prototype.applyDescription = function (name, explicitOptions) {\n var chart = this;\n // Default style\n var style = name === 'title' ? {\n color: \"#333333\" /* Palette.neutralColor80 */,\n fontSize: this.options.isStock ? '16px' : '18px' // #2944\n } : {\n color: \"#666666\" /* Palette.neutralColor60 */\n };\n // Merge default options with explicit options\n var options = this.options[name] = merge(\n // Default styles\n (!this.styledMode && { style: style }),\n this.options[name],\n explicitOptions);\n var elem = this[name];\n if (elem && explicitOptions) {\n this[name] = elem = elem.destroy(); // remove old\n }\n if (options && !elem) {\n elem = this.renderer.text(options.text, 0, 0, options.useHTML)\n .attr({\n align: options.align,\n 'class': 'highcharts-' + name,\n zIndex: options.zIndex || 4\n })\n .add();\n // Update methods, shortcut to Chart.setTitle, Chart.setSubtitle and\n // Chart.setCaption\n elem.update = function (updateOptions) {\n var fn = {\n title: 'setTitle',\n subtitle: 'setSubtitle',\n caption: 'setCaption'\n }[name];\n chart[fn](updateOptions);\n };\n // Presentational\n if (!this.styledMode) {\n elem.css(options.style);\n }\n /**\n * The chart title. The title has an `update` method that allows\n * modifying the options directly or indirectly via\n * `chart.update`.\n *\n * @sample highcharts/members/title-update/\n * Updating titles\n *\n * @name Highcharts.Chart#title\n * @type {Highcharts.TitleObject}\n */\n /**\n * The chart subtitle. The subtitle has an `update` method that\n * allows modifying the options directly or indirectly via\n * `chart.update`.\n *\n * @name Highcharts.Chart#subtitle\n * @type {Highcharts.SubtitleObject}\n */\n this[name] = elem;\n }\n };\n /**\n * Internal function to lay out the chart title, subtitle and caption, and\n * cache the full offset height for use in `getMargins`. The result is\n * stored in `this.titleOffset`.\n *\n * @private\n * @function Highcharts.Chart#layOutTitles\n *\n * @param {boolean} [redraw=true]\n * @emits Highcharts.Chart#event:afterLayOutTitles\n */\n Chart.prototype.layOutTitles = function (redraw) {\n var titleOffset = [0, 0, 0],\n renderer = this.renderer,\n spacingBox = this.spacingBox;\n // Lay out the title and the subtitle respectively\n ['title', 'subtitle', 'caption'].forEach(function (key) {\n var title = this[key], titleOptions = (this.options[key]), verticalAlign = titleOptions.verticalAlign || 'top', offset = key === 'title' ?\n verticalAlign === 'top' ? -3 : 0 :\n // Floating subtitle (#6574)\n verticalAlign === 'top' ? titleOffset[0] + 2 : 0;\n var titleSize,\n height;\n if (title) {\n if (!this.styledMode) {\n titleSize = (titleOptions.style &&\n titleOptions.style.fontSize);\n }\n titleSize = renderer.fontMetrics(titleSize, title).b;\n title\n .css({\n width: (titleOptions.width ||\n spacingBox.width + (titleOptions.widthAdjust || 0)) + 'px'\n });\n // Skip the cache for HTML (#3481, #11666)\n height = Math.round(title.getBBox(titleOptions.useHTML).height);\n title.align(extend({\n y: verticalAlign === 'bottom' ?\n titleSize :\n offset + titleSize,\n height: height\n }, titleOptions), false, 'spacingBox');\n if (!titleOptions.floating) {\n if (verticalAlign === 'top') {\n titleOffset[0] = Math.ceil(titleOffset[0] +\n height);\n }\n else if (verticalAlign === 'bottom') {\n titleOffset[2] = Math.ceil(titleOffset[2] +\n height);\n }\n }\n }\n }, this);\n // Handle title.margin and caption.margin\n if (titleOffset[0] &&\n (this.options.title.verticalAlign || 'top') === 'top') {\n titleOffset[0] += this.options.title.margin;\n }\n if (titleOffset[2] &&\n this.options.caption.verticalAlign === 'bottom') {\n titleOffset[2] += this.options.caption.margin;\n }\n var requiresDirtyBox = (!this.titleOffset ||\n this.titleOffset.join(',') !== titleOffset.join(','));\n // Used in getMargins\n this.titleOffset = titleOffset;\n fireEvent(this, 'afterLayOutTitles');\n if (!this.isDirtyBox && requiresDirtyBox) {\n this.isDirtyBox = this.isDirtyLegend = requiresDirtyBox;\n // Redraw if necessary (#2719, #2744)\n if (this.hasRendered && pick(redraw, true) && this.isDirtyBox) {\n this.redraw();\n }\n }\n };\n /**\n * Internal function to get the chart width and height according to options\n * and container size. Sets {@link Chart.chartWidth} and\n * {@link Chart.chartHeight}.\n *\n * @private\n * @function Highcharts.Chart#getChartSize\n */\n Chart.prototype.getChartSize = function () {\n var chart = this,\n optionsChart = chart.options.chart,\n widthOption = optionsChart.width,\n heightOption = optionsChart.height,\n renderTo = chart.renderTo;\n // Get inner width and height\n if (!defined(widthOption)) {\n chart.containerWidth = getStyle(renderTo, 'width');\n }\n if (!defined(heightOption)) {\n chart.containerHeight = getStyle(renderTo, 'height');\n }\n /**\n * The current pixel width of the chart.\n *\n * @name Highcharts.Chart#chartWidth\n * @type {number}\n */\n chart.chartWidth = Math.max(// #1393\n 0, widthOption || chart.containerWidth || 600 // #1460\n );\n /**\n * The current pixel height of the chart.\n *\n * @name Highcharts.Chart#chartHeight\n * @type {number}\n */\n chart.chartHeight = Math.max(0, relativeLength(heightOption, chart.chartWidth) ||\n (chart.containerHeight > 1 ?\n chart.containerHeight :\n 400));\n };\n /**\n * If the renderTo element has no offsetWidth, most likely one or more of\n * its parents are hidden. Loop up the DOM tree to temporarily display the\n * parents, then save the original display properties, and when the true\n * size is retrieved, reset them. Used on first render and on redraws.\n *\n * @private\n * @function Highcharts.Chart#temporaryDisplay\n *\n * @param {boolean} [revert]\n * Revert to the saved original styles.\n */\n Chart.prototype.temporaryDisplay = function (revert) {\n var node = this.renderTo,\n tempStyle;\n if (!revert) {\n while (node && node.style) {\n // When rendering to a detached node, it needs to be temporarily\n // attached in order to read styling and bounding boxes (#5783,\n // #7024).\n if (!doc.body.contains(node) && !node.parentNode) {\n node.hcOrigDetached = true;\n doc.body.appendChild(node);\n }\n if (getStyle(node, 'display', false) === 'none' ||\n node.hcOricDetached) {\n node.hcOrigStyle = {\n display: node.style.display,\n height: node.style.height,\n overflow: node.style.overflow\n };\n tempStyle = {\n display: 'block',\n overflow: 'hidden'\n };\n if (node !== this.renderTo) {\n tempStyle.height = 0;\n }\n css(node, tempStyle);\n // If it still doesn't have an offset width after setting\n // display to block, it probably has an !important priority\n // #2631, 6803\n if (!node.offsetWidth) {\n node.style.setProperty('display', 'block', 'important');\n }\n }\n node = node.parentNode;\n if (node === doc.body) {\n break;\n }\n }\n }\n else {\n while (node && node.style) {\n if (node.hcOrigStyle) {\n css(node, node.hcOrigStyle);\n delete node.hcOrigStyle;\n }\n if (node.hcOrigDetached) {\n doc.body.removeChild(node);\n node.hcOrigDetached = false;\n }\n node = node.parentNode;\n }\n }\n };\n /**\n * Set the {@link Chart.container|chart container's} class name, in\n * addition to `highcharts-container`.\n *\n * @function Highcharts.Chart#setClassName\n *\n * @param {string} [className]\n * The additional class name.\n */\n Chart.prototype.setClassName = function (className) {\n this.container.className = 'highcharts-container ' + (className || '');\n };\n /**\n * Get the containing element, determine the size and create the inner\n * container div to hold the chart.\n *\n * @private\n * @function Highcharts.Chart#afterGetContainer\n * @emits Highcharts.Chart#event:afterGetContainer\n */\n Chart.prototype.getContainer = function () {\n var chart = this,\n options = chart.options,\n optionsChart = options.chart,\n indexAttrName = 'data-highcharts-chart',\n containerId = uniqueKey();\n var containerStyle,\n renderTo = chart.renderTo;\n if (!renderTo) {\n chart.renderTo = renderTo =\n optionsChart.renderTo;\n }\n if (isString(renderTo)) {\n chart.renderTo = renderTo =\n doc.getElementById(renderTo);\n }\n // Display an error if the renderTo is wrong\n if (!renderTo) {\n error(13, true, chart);\n }\n // If the container already holds a chart, destroy it. The check for\n // hasRendered is there because web pages that are saved to disk from\n // the browser, will preserve the data-highcharts-chart attribute and\n // the SVG contents, but not an interactive chart. So in this case,\n // charts[oldChartIndex] will point to the wrong chart if any (#2609).\n var oldChartIndex = pInt(attr(renderTo,\n indexAttrName));\n if (isNumber(oldChartIndex) &&\n charts[oldChartIndex] &&\n charts[oldChartIndex].hasRendered) {\n charts[oldChartIndex].destroy();\n }\n // Make a reference to the chart from the div\n attr(renderTo, indexAttrName, chart.index);\n // remove previous chart\n renderTo.innerHTML = AST.emptyHTML;\n // If the container doesn't have an offsetWidth, it has or is a child of\n // a node that has display:none. We need to temporarily move it out to a\n // visible state to determine the size, else the legend and tooltips\n // won't render properly. The skipClone option is used in sparklines as\n // a micro optimization, saving about 1-2 ms each chart.\n if (!optionsChart.skipClone && !renderTo.offsetWidth) {\n chart.temporaryDisplay();\n }\n // get the width and height\n chart.getChartSize();\n var chartWidth = chart.chartWidth;\n var chartHeight = chart.chartHeight;\n // Allow table cells and flex-boxes to shrink without the chart blocking\n // them out (#6427)\n css(renderTo, { overflow: 'hidden' });\n // Create the inner container\n if (!chart.styledMode) {\n containerStyle = extend({\n position: 'relative',\n // needed for context menu (avoidscrollbars) and content\n // overflow in IE\n overflow: 'hidden',\n width: chartWidth + 'px',\n height: chartHeight + 'px',\n textAlign: 'left',\n lineHeight: 'normal',\n zIndex: 0,\n '-webkit-tap-highlight-color': 'rgba(0,0,0,0)',\n userSelect: 'none',\n 'touch-action': 'manipulation',\n outline: 'none'\n }, optionsChart.style || {});\n }\n /**\n * The containing HTML element of the chart. The container is\n * dynamically inserted into the element given as the `renderTo`\n * parameter in the {@link Highcharts#chart} constructor.\n *\n * @name Highcharts.Chart#container\n * @type {Highcharts.HTMLDOMElement}\n */\n var container = createElement('div', {\n id: containerId\n },\n containerStyle,\n renderTo);\n chart.container = container;\n // cache the cursor (#1650)\n chart._cursor = container.style.cursor;\n // Initialize the renderer\n var Renderer = optionsChart.renderer || !svg ?\n RendererRegistry.getRendererType(optionsChart.renderer) :\n SVGRenderer;\n /**\n * The renderer instance of the chart. Each chart instance has only one\n * associated renderer.\n *\n * @name Highcharts.Chart#renderer\n * @type {Highcharts.SVGRenderer}\n */\n chart.renderer = new Renderer(container, chartWidth, chartHeight, void 0, optionsChart.forExport, options.exporting && options.exporting.allowHTML, chart.styledMode);\n // Set the initial animation from the options\n setAnimation(void 0, chart);\n chart.setClassName(optionsChart.className);\n if (!chart.styledMode) {\n chart.renderer.setStyle(optionsChart.style);\n }\n else {\n // Initialize definitions\n for (var key in options.defs) { // eslint-disable-line guard-for-in\n this.renderer.definition(options.defs[key]);\n }\n }\n // Add a reference to the charts index\n chart.renderer.chartIndex = chart.index;\n fireEvent(this, 'afterGetContainer');\n };\n /**\n * Calculate margins by rendering axis labels in a preliminary position.\n * Title, subtitle and legend have already been rendered at this stage, but\n * will be moved into their final positions.\n *\n * @private\n * @function Highcharts.Chart#getMargins\n * @emits Highcharts.Chart#event:getMargins\n */\n Chart.prototype.getMargins = function (skipAxes) {\n var _a = this,\n spacing = _a.spacing,\n margin = _a.margin,\n titleOffset = _a.titleOffset;\n this.resetMargins();\n // Adjust for title and subtitle\n if (titleOffset[0] && !defined(margin[0])) {\n this.plotTop = Math.max(this.plotTop, titleOffset[0] + spacing[0]);\n }\n if (titleOffset[2] && !defined(margin[2])) {\n this.marginBottom = Math.max(this.marginBottom, titleOffset[2] + spacing[2]);\n }\n // Adjust for legend\n if (this.legend && this.legend.display) {\n this.legend.adjustMargins(margin, spacing);\n }\n fireEvent(this, 'getMargins');\n if (!skipAxes) {\n this.getAxisMargins();\n }\n };\n /**\n * @private\n * @function Highcharts.Chart#getAxisMargins\n */\n Chart.prototype.getAxisMargins = function () {\n var chart = this, \n // [top, right, bottom, left]\n axisOffset = chart.axisOffset = [0, 0, 0, 0],\n colorAxis = chart.colorAxis,\n margin = chart.margin,\n getOffset = function (axes) {\n axes.forEach(function (axis) {\n if (axis.visible) {\n axis.getOffset();\n }\n });\n };\n // pre-render axes to get labels offset width\n if (chart.hasCartesianSeries) {\n getOffset(chart.axes);\n }\n else if (colorAxis && colorAxis.length) {\n getOffset(colorAxis);\n }\n // Add the axis offsets\n marginNames.forEach(function (m, side) {\n if (!defined(margin[side])) {\n chart[m] += axisOffset[side];\n }\n });\n chart.setChartSize();\n };\n /**\n * Reflows the chart to its container. By default, the chart reflows\n * automatically to its container following a `window.resize` event, as per\n * the [chart.reflow](https://api.highcharts.com/highcharts/chart.reflow)\n * option. However, there are no reliable events for div resize, so if the\n * container is resized without a window resize event, this must be called\n * explicitly.\n *\n * @sample highcharts/members/chart-reflow/\n * Resize div and reflow\n * @sample highcharts/chart/events-container/\n * Pop up and reflow\n *\n * @function Highcharts.Chart#reflow\n *\n * @param {global.Event} [e]\n * Event arguments. Used primarily when the function is called\n * internally as a response to window resize.\n */\n Chart.prototype.reflow = function (e) {\n var chart = this, optionsChart = chart.options.chart, renderTo = chart.renderTo, hasUserSize = (defined(optionsChart.width) &&\n defined(optionsChart.height)), width = optionsChart.width || getStyle(renderTo, 'width'), height = optionsChart.height || getStyle(renderTo, 'height'), target = e ? e.target : win;\n delete chart.pointer.chartPosition;\n // Width and height checks for display:none. Target is doc in IE8 and\n // Opera, win in Firefox, Chrome and IE9.\n if (!hasUserSize &&\n !chart.isPrinting &&\n width &&\n height &&\n (target === win || target === doc)) {\n if (width !== chart.containerWidth ||\n height !== chart.containerHeight) {\n U.clearTimeout(chart.reflowTimeout);\n // When called from window.resize, e is set, else it's called\n // directly (#2224)\n chart.reflowTimeout = syncTimeout(function () {\n // Set size, it may have been destroyed in the meantime\n // (#1257)\n if (chart.container) {\n chart.setSize(void 0, void 0, false);\n }\n }, e ? 100 : 0);\n }\n chart.containerWidth = width;\n chart.containerHeight = height;\n }\n };\n /**\n * Toggle the event handlers necessary for auto resizing, depending on the\n * `chart.reflow` option.\n *\n * @private\n * @function Highcharts.Chart#setReflow\n */\n Chart.prototype.setReflow = function (reflow) {\n var chart = this;\n if (reflow !== false && !this.unbindReflow) {\n this.unbindReflow = addEvent(win, 'resize', function (e) {\n // a removed event listener still runs in Edge and IE if the\n // listener was removed while the event runs, so check if the\n // chart is not destroyed (#11609)\n if (chart.options) {\n chart.reflow(e);\n }\n });\n addEvent(this, 'destroy', this.unbindReflow);\n }\n else if (reflow === false && this.unbindReflow) {\n // Unbind and unset\n this.unbindReflow = this.unbindReflow();\n }\n // The following will add listeners to re-fit the chart before and after\n // printing (#2284). However it only works in WebKit. Should have worked\n // in Firefox, but not supported in IE.\n /*\n if (win.matchMedia) {\n win.matchMedia('print').addListener(function reflow() {\n chart.reflow();\n });\n }\n //*/\n };\n /**\n * Resize the chart to a given width and height. In order to set the width\n * only, the height argument may be skipped. To set the height only, pass\n * `undefined` for the width.\n *\n * @sample highcharts/members/chart-setsize-button/\n * Test resizing from buttons\n * @sample highcharts/members/chart-setsize-jquery-resizable/\n * Add a jQuery UI resizable\n * @sample stock/members/chart-setsize/\n * Highcharts Stock with UI resizable\n *\n * @function Highcharts.Chart#setSize\n *\n * @param {number|null} [width]\n * The new pixel width of the chart. Since v4.2.6, the argument can\n * be `undefined` in order to preserve the current value (when\n * setting height only), or `null` to adapt to the width of the\n * containing element.\n *\n * @param {number|null} [height]\n * The new pixel height of the chart. Since v4.2.6, the argument can\n * be `undefined` in order to preserve the current value, or `null`\n * in order to adapt to the height of the containing element.\n *\n * @param {boolean|Partial} [animation=true]\n * Whether and how to apply animation.\n *\n *\n * @emits Highcharts.Chart#event:endResize\n * @emits Highcharts.Chart#event:resize\n */\n Chart.prototype.setSize = function (width, height, animation) {\n var chart = this,\n renderer = chart.renderer;\n // Handle the isResizing counter\n chart.isResizing += 1;\n // set the animation for the current process\n setAnimation(animation, chart);\n var globalAnimation = renderer.globalAnimation;\n chart.oldChartHeight = chart.chartHeight;\n chart.oldChartWidth = chart.chartWidth;\n if (typeof width !== 'undefined') {\n chart.options.chart.width = width;\n }\n if (typeof height !== 'undefined') {\n chart.options.chart.height = height;\n }\n chart.getChartSize();\n // Resize the container with the global animation applied if enabled\n // (#2503)\n if (!chart.styledMode) {\n (globalAnimation ? animate : css)(chart.container, {\n width: chart.chartWidth + 'px',\n height: chart.chartHeight + 'px'\n }, globalAnimation);\n }\n chart.setChartSize(true);\n renderer.setSize(chart.chartWidth, chart.chartHeight, globalAnimation);\n // handle axes\n chart.axes.forEach(function (axis) {\n axis.isDirty = true;\n axis.setScale();\n });\n chart.isDirtyLegend = true; // force legend redraw\n chart.isDirtyBox = true; // force redraw of plot and chart border\n chart.layOutTitles(); // #2857\n chart.getMargins();\n chart.redraw(globalAnimation);\n chart.oldChartHeight = null;\n fireEvent(chart, 'resize');\n // Fire endResize and set isResizing back. If animation is disabled,\n // fire without delay\n syncTimeout(function () {\n if (chart) {\n fireEvent(chart, 'endResize', null, function () {\n chart.isResizing -= 1;\n });\n }\n }, animObject(globalAnimation).duration);\n };\n /**\n * Set the public chart properties. This is done before and after the\n * pre-render to determine margin sizes.\n *\n * @private\n * @function Highcharts.Chart#setChartSize\n * @emits Highcharts.Chart#event:afterSetChartSize\n */\n Chart.prototype.setChartSize = function (skipAxes) {\n var chart = this,\n inverted = chart.inverted,\n renderer = chart.renderer,\n chartWidth = chart.chartWidth,\n chartHeight = chart.chartHeight,\n optionsChart = chart.options.chart,\n spacing = chart.spacing,\n clipOffset = chart.clipOffset;\n var plotLeft,\n plotTop,\n plotWidth,\n plotHeight;\n /**\n * The current left position of the plot area in pixels.\n *\n * @name Highcharts.Chart#plotLeft\n * @type {number}\n */\n chart.plotLeft = plotLeft = Math.round(chart.plotLeft);\n /**\n * The current top position of the plot area in pixels.\n *\n * @name Highcharts.Chart#plotTop\n * @type {number}\n */\n chart.plotTop = plotTop = Math.round(chart.plotTop);\n /**\n * The current width of the plot area in pixels.\n *\n * @name Highcharts.Chart#plotWidth\n * @type {number}\n */\n chart.plotWidth = plotWidth = Math.max(0, Math.round(chartWidth - plotLeft - chart.marginRight));\n /**\n * The current height of the plot area in pixels.\n *\n * @name Highcharts.Chart#plotHeight\n * @type {number}\n */\n chart.plotHeight = plotHeight = Math.max(0, Math.round(chartHeight - plotTop - chart.marginBottom));\n chart.plotSizeX = inverted ? plotHeight : plotWidth;\n chart.plotSizeY = inverted ? plotWidth : plotHeight;\n chart.plotBorderWidth = optionsChart.plotBorderWidth || 0;\n // Set boxes used for alignment\n chart.spacingBox = renderer.spacingBox = {\n x: spacing[3],\n y: spacing[0],\n width: chartWidth - spacing[3] - spacing[1],\n height: chartHeight - spacing[0] - spacing[2]\n };\n chart.plotBox = renderer.plotBox = {\n x: plotLeft,\n y: plotTop,\n width: plotWidth,\n height: plotHeight\n };\n var plotBorderWidth = 2 * Math.floor(chart.plotBorderWidth / 2),\n clipX = Math.ceil(Math.max(plotBorderWidth,\n clipOffset[3]) / 2),\n clipY = Math.ceil(Math.max(plotBorderWidth,\n clipOffset[0]) / 2);\n chart.clipBox = {\n x: clipX,\n y: clipY,\n width: Math.floor(chart.plotSizeX -\n Math.max(plotBorderWidth, clipOffset[1]) / 2 -\n clipX),\n height: Math.max(0, Math.floor(chart.plotSizeY -\n Math.max(plotBorderWidth, clipOffset[2]) / 2 -\n clipY))\n };\n if (!skipAxes) {\n chart.axes.forEach(function (axis) {\n axis.setAxisSize();\n axis.setAxisTranslation();\n });\n renderer.alignElements();\n }\n fireEvent(chart, 'afterSetChartSize', { skipAxes: skipAxes });\n };\n /**\n * Initial margins before auto size margins are applied.\n *\n * @private\n * @function Highcharts.Chart#resetMargins\n */\n Chart.prototype.resetMargins = function () {\n fireEvent(this, 'resetMargins');\n var chart = this,\n chartOptions = chart.options.chart;\n // Create margin and spacing array\n ['margin', 'spacing'].forEach(function splashArrays(target) {\n var value = chartOptions[target],\n values = isObject(value) ? value : [value,\n value,\n value,\n value];\n [\n 'Top',\n 'Right',\n 'Bottom',\n 'Left'\n ].forEach(function (sideName, side) {\n chart[target][side] = pick(chartOptions[target + sideName], values[side]);\n });\n });\n // Set margin names like chart.plotTop, chart.plotLeft,\n // chart.marginRight, chart.marginBottom.\n marginNames.forEach(function (m, side) {\n chart[m] = pick(chart.margin[side], chart.spacing[side]);\n });\n chart.axisOffset = [0, 0, 0, 0]; // top, right, bottom, left\n chart.clipOffset = [0, 0, 0, 0];\n };\n /**\n * Internal function to draw or redraw the borders and backgrounds for chart\n * and plot area.\n *\n * @private\n * @function Highcharts.Chart#drawChartBox\n * @emits Highcharts.Chart#event:afterDrawChartBox\n */\n Chart.prototype.drawChartBox = function () {\n var chart = this,\n optionsChart = chart.options.chart,\n renderer = chart.renderer,\n chartWidth = chart.chartWidth,\n chartHeight = chart.chartHeight,\n styledMode = chart.styledMode,\n plotBGImage = chart.plotBGImage,\n chartBackgroundColor = optionsChart.backgroundColor,\n plotBackgroundColor = optionsChart.plotBackgroundColor,\n plotBackgroundImage = optionsChart.plotBackgroundImage,\n plotLeft = chart.plotLeft,\n plotTop = chart.plotTop,\n plotWidth = chart.plotWidth,\n plotHeight = chart.plotHeight,\n plotBox = chart.plotBox,\n clipRect = chart.clipRect,\n clipBox = chart.clipBox;\n var chartBackground = chart.chartBackground,\n plotBackground = chart.plotBackground,\n plotBorder = chart.plotBorder,\n chartBorderWidth,\n mgn,\n bgAttr,\n verb = 'animate';\n // Chart area\n if (!chartBackground) {\n chart.chartBackground = chartBackground = renderer.rect()\n .addClass('highcharts-background')\n .add();\n verb = 'attr';\n }\n if (!styledMode) {\n // Presentational\n chartBorderWidth = optionsChart.borderWidth || 0;\n mgn = chartBorderWidth + (optionsChart.shadow ? 8 : 0);\n bgAttr = {\n fill: chartBackgroundColor || 'none'\n };\n if (chartBorderWidth || chartBackground['stroke-width']) { // #980\n bgAttr.stroke = optionsChart.borderColor;\n bgAttr['stroke-width'] = chartBorderWidth;\n }\n chartBackground\n .attr(bgAttr)\n .shadow(optionsChart.shadow);\n }\n else {\n chartBorderWidth = mgn = chartBackground.strokeWidth();\n }\n chartBackground[verb]({\n x: mgn / 2,\n y: mgn / 2,\n width: chartWidth - mgn - chartBorderWidth % 2,\n height: chartHeight - mgn - chartBorderWidth % 2,\n r: optionsChart.borderRadius\n });\n // Plot background\n verb = 'animate';\n if (!plotBackground) {\n verb = 'attr';\n chart.plotBackground = plotBackground = renderer.rect()\n .addClass('highcharts-plot-background')\n .add();\n }\n plotBackground[verb](plotBox);\n if (!styledMode) {\n // Presentational attributes for the background\n plotBackground\n .attr({\n fill: plotBackgroundColor || 'none'\n })\n .shadow(optionsChart.plotShadow);\n // Create the background image\n if (plotBackgroundImage) {\n if (!plotBGImage) {\n chart.plotBGImage = renderer.image(plotBackgroundImage, plotLeft, plotTop, plotWidth, plotHeight).add();\n }\n else {\n if (plotBackgroundImage !== plotBGImage.attr('href')) {\n plotBGImage.attr('href', plotBackgroundImage);\n }\n plotBGImage.animate(plotBox);\n }\n }\n }\n // Plot clip\n if (!clipRect) {\n chart.clipRect = renderer.clipRect(clipBox);\n }\n else {\n clipRect.animate({\n width: clipBox.width,\n height: clipBox.height\n });\n }\n // Plot area border\n verb = 'animate';\n if (!plotBorder) {\n verb = 'attr';\n chart.plotBorder = plotBorder = renderer.rect()\n .addClass('highcharts-plot-border')\n .attr({\n zIndex: 1 // Above the grid\n })\n .add();\n }\n if (!styledMode) {\n // Presentational\n plotBorder.attr({\n stroke: optionsChart.plotBorderColor,\n 'stroke-width': optionsChart.plotBorderWidth || 0,\n fill: 'none'\n });\n }\n plotBorder[verb](plotBorder.crisp({\n x: plotLeft,\n y: plotTop,\n width: plotWidth,\n height: plotHeight\n }, -plotBorder.strokeWidth())); // #3282 plotBorder should be negative;\n // reset\n chart.isDirtyBox = false;\n fireEvent(this, 'afterDrawChartBox');\n };\n /**\n * Detect whether a certain chart property is needed based on inspecting its\n * options and series. This mainly applies to the chart.inverted property,\n * and in extensions to the chart.angular and chart.polar properties.\n *\n * @private\n * @function Highcharts.Chart#propFromSeries\n */\n Chart.prototype.propFromSeries = function () {\n var chart = this,\n optionsChart = chart.options.chart,\n seriesOptions = chart.options.series;\n var i,\n klass,\n value;\n /**\n * The flag is set to `true` if a series of the chart is inverted.\n *\n * @name Highcharts.Chart#inverted\n * @type {boolean|undefined}\n */\n ['inverted', 'angular', 'polar'].forEach(function (key) {\n // The default series type's class\n klass = seriesTypes[(optionsChart.type || optionsChart.defaultSeriesType)];\n // Get the value from available chart-wide properties\n value =\n // It is set in the options:\n optionsChart[key] ||\n // The default series class:\n (klass && klass.prototype[key]);\n // requires it\n // 4. Check if any the chart's series require it\n i = seriesOptions && seriesOptions.length;\n while (!value && i--) {\n klass = seriesTypes[seriesOptions[i].type];\n if (klass && klass.prototype[key]) {\n value = true;\n }\n }\n // Set the chart property\n chart[key] = value;\n });\n };\n /**\n * Internal function to link two or more series together, based on the\n * `linkedTo` option. This is done from `Chart.render`, and after\n * `Chart.addSeries` and `Series.remove`.\n *\n * @private\n * @function Highcharts.Chart#linkSeries\n * @emits Highcharts.Chart#event:afterLinkSeries\n */\n Chart.prototype.linkSeries = function () {\n var chart = this,\n chartSeries = chart.series;\n // Reset links\n chartSeries.forEach(function (series) {\n series.linkedSeries.length = 0;\n });\n // Apply new links\n chartSeries.forEach(function (series) {\n var linkedTo = series.options.linkedTo;\n if (isString(linkedTo)) {\n if (linkedTo === ':previous') {\n linkedTo = chart.series[series.index - 1];\n }\n else {\n linkedTo = chart.get(linkedTo);\n }\n // #3341 avoid mutual linking\n if (linkedTo && linkedTo.linkedParent !== series) {\n linkedTo.linkedSeries.push(series);\n series.linkedParent = linkedTo;\n if (linkedTo.enabledDataSorting) {\n series.setDataSortingOptions();\n }\n series.visible = pick(series.options.visible, linkedTo.options.visible, series.visible); // #3879\n }\n }\n });\n fireEvent(this, 'afterLinkSeries');\n };\n /**\n * Render series for the chart.\n *\n * @private\n * @function Highcharts.Chart#renderSeries\n */\n Chart.prototype.renderSeries = function () {\n this.series.forEach(function (serie) {\n serie.translate();\n serie.render();\n });\n };\n /**\n * Render labels for the chart.\n *\n * @private\n * @function Highcharts.Chart#renderLabels\n */\n Chart.prototype.renderLabels = function () {\n var chart = this,\n labels = chart.options.labels;\n if (labels.items) {\n labels.items.forEach(function (label) {\n var style = extend(labels.style,\n label.style),\n x = pInt(style.left) + chart.plotLeft,\n y = pInt(style.top) + chart.plotTop + 12;\n // delete to prevent rewriting in IE\n delete style.left;\n delete style.top;\n chart.renderer.text(label.html, x, y)\n .attr({ zIndex: 2 })\n .css(style)\n .add();\n });\n }\n };\n /**\n * Render all graphics for the chart. Runs internally on initialization.\n *\n * @private\n * @function Highcharts.Chart#render\n */\n Chart.prototype.render = function () {\n var chart = this,\n axes = chart.axes,\n colorAxis = chart.colorAxis,\n renderer = chart.renderer,\n options = chart.options,\n renderAxes = function (axes) {\n axes.forEach(function (axis) {\n if (axis.visible) {\n axis.render();\n }\n });\n };\n var correction = 0; // correction for X axis labels\n // Title\n chart.setTitle();\n /**\n * The overview of the chart's series.\n *\n * @name Highcharts.Chart#legend\n * @type {Highcharts.Legend}\n */\n chart.legend = new Legend(chart, options.legend);\n // Get stacks\n if (chart.getStacks) {\n chart.getStacks();\n }\n // Get chart margins\n chart.getMargins(true);\n chart.setChartSize();\n // Record preliminary dimensions for later comparison\n var tempWidth = chart.plotWidth;\n axes.some(function (axis) {\n if (axis.horiz &&\n axis.visible &&\n axis.options.labels.enabled &&\n axis.series.length) {\n // 21 is the most common correction for X axis labels\n correction = 21;\n return true;\n }\n });\n // use Math.max to prevent negative plotHeight\n chart.plotHeight = Math.max(chart.plotHeight - correction, 0);\n var tempHeight = chart.plotHeight;\n // Get margins by pre-rendering axes\n axes.forEach(function (axis) {\n axis.setScale();\n });\n chart.getAxisMargins();\n // If the plot area size has changed significantly, calculate tick\n // positions again\n var redoHorizontal = tempWidth / chart.plotWidth > 1.1;\n // Height is more sensitive, use lower threshold\n var redoVertical = tempHeight / chart.plotHeight > 1.05;\n if (redoHorizontal || redoVertical) {\n axes.forEach(function (axis) {\n if ((axis.horiz && redoHorizontal) ||\n (!axis.horiz && redoVertical)) {\n // update to reflect the new margins\n axis.setTickInterval(true);\n }\n });\n chart.getMargins(); // second pass to check for new labels\n }\n // Draw the borders and backgrounds\n chart.drawChartBox();\n // Axes\n if (chart.hasCartesianSeries) {\n renderAxes(axes);\n }\n else if (colorAxis && colorAxis.length) {\n renderAxes(colorAxis);\n }\n // The series\n if (!chart.seriesGroup) {\n chart.seriesGroup = renderer.g('series-group')\n .attr({ zIndex: 3 })\n .add();\n }\n chart.renderSeries();\n // Labels\n chart.renderLabels();\n // Credits\n chart.addCredits();\n // Handle responsiveness\n if (chart.setResponsive) {\n chart.setResponsive();\n }\n // Set flag\n chart.hasRendered = true;\n };\n /**\n * Set a new credits label for the chart.\n *\n * @sample highcharts/credits/credits-update/\n * Add and update credits\n *\n * @function Highcharts.Chart#addCredits\n *\n * @param {Highcharts.CreditsOptions} [credits]\n * A configuration object for the new credits.\n */\n Chart.prototype.addCredits = function (credits) {\n var chart = this,\n creds = merge(true,\n this.options.credits,\n credits);\n if (creds.enabled && !this.credits) {\n /**\n * The chart's credits label. The label has an `update` method that\n * allows setting new options as per the\n * [credits options set](https://api.highcharts.com/highcharts/credits).\n *\n * @name Highcharts.Chart#credits\n * @type {Highcharts.SVGElement}\n */\n this.credits = this.renderer.text(creds.text + (this.mapCredits || ''), 0, 0)\n .addClass('highcharts-credits')\n .on('click', function () {\n if (creds.href) {\n win.location.href = creds.href;\n }\n })\n .attr({\n align: creds.position.align,\n zIndex: 8\n });\n if (!chart.styledMode) {\n this.credits.css(creds.style);\n }\n this.credits\n .add()\n .align(creds.position);\n // Dynamically update\n this.credits.update = function (options) {\n chart.credits = chart.credits.destroy();\n chart.addCredits(options);\n };\n }\n };\n /**\n * Remove the chart and purge memory. This method is called internally\n * before adding a second chart into the same container, as well as on\n * window unload to prevent leaks.\n *\n * @sample highcharts/members/chart-destroy/\n * Destroy the chart from a button\n * @sample stock/members/chart-destroy/\n * Destroy with Highcharts Stock\n *\n * @function Highcharts.Chart#destroy\n *\n * @emits Highcharts.Chart#event:destroy\n */\n Chart.prototype.destroy = function () {\n var chart = this,\n axes = chart.axes,\n series = chart.series,\n container = chart.container,\n parentNode = container && container.parentNode;\n var i;\n // fire the chart.destoy event\n fireEvent(chart, 'destroy');\n // Delete the chart from charts lookup array\n if (chart.renderer.forExport) {\n erase(charts, chart); // #6569\n }\n else {\n charts[chart.index] = void 0;\n }\n H.chartCount--;\n chart.renderTo.removeAttribute('data-highcharts-chart');\n // remove events\n removeEvent(chart);\n // ==== Destroy collections:\n // Destroy axes\n i = axes.length;\n while (i--) {\n axes[i] = axes[i].destroy();\n }\n // Destroy scroller & scroller series before destroying base series\n if (this.scroller && this.scroller.destroy) {\n this.scroller.destroy();\n }\n // Destroy each series\n i = series.length;\n while (i--) {\n series[i] = series[i].destroy();\n }\n // ==== Destroy chart properties:\n [\n 'title', 'subtitle', 'chartBackground', 'plotBackground',\n 'plotBGImage', 'plotBorder', 'seriesGroup', 'clipRect', 'credits',\n 'pointer', 'rangeSelector', 'legend', 'resetZoomButton', 'tooltip',\n 'renderer'\n ].forEach(function (name) {\n var prop = chart[name];\n if (prop && prop.destroy) {\n chart[name] = prop.destroy();\n }\n });\n // Remove container and all SVG, check container as it can break in IE\n // when destroyed before finished loading\n if (container) {\n container.innerHTML = AST.emptyHTML;\n removeEvent(container);\n if (parentNode) {\n discardElement(container);\n }\n }\n // clean it all up\n objectEach(chart, function (val, key) {\n delete chart[key];\n });\n };\n /**\n * Prepare for first rendering after all data are loaded.\n *\n * @private\n * @function Highcharts.Chart#firstRender\n * @emits Highcharts.Chart#event:beforeRender\n */\n Chart.prototype.firstRender = function () {\n var chart = this,\n options = chart.options;\n // Hook for oldIE to check whether the chart is ready to render\n if (chart.isReadyToRender && !chart.isReadyToRender()) {\n return;\n }\n // Create the container\n chart.getContainer();\n chart.resetMargins();\n chart.setChartSize();\n // Set the common chart properties (mainly invert) from the given series\n chart.propFromSeries();\n // get axes\n chart.getAxes();\n // Initialize the series\n (isArray(options.series) ? options.series : []).forEach(\n // #9680\n function (serieOptions) {\n chart.initSeries(serieOptions);\n });\n chart.linkSeries();\n chart.setSeriesData();\n // Run an event after axes and series are initialized, but before\n // render. At this stage, the series data is indexed and cached in the\n // xData and yData arrays, so we can access those before rendering. Used\n // in Highcharts Stock.\n fireEvent(chart, 'beforeRender');\n // depends on inverted and on margins being set\n if (Pointer) {\n if (MSPointer.isRequired()) {\n chart.pointer = new MSPointer(chart, options);\n }\n else {\n /**\n * The Pointer that keeps track of mouse and touch interaction.\n *\n * @memberof Highcharts.Chart\n * @name pointer\n * @type {Highcharts.Pointer}\n * @instance\n */\n chart.pointer = new Pointer(chart, options);\n }\n }\n chart.render();\n chart.pointer.getChartPosition(); // #14973\n // Fire the load event if there are no external images\n if (!chart.renderer.imgCount && !chart.hasLoaded) {\n chart.onload();\n }\n // If the chart was rendered outside the top container, put it back in\n // (#3679)\n chart.temporaryDisplay(true);\n };\n /**\n * Internal function that runs on chart load, async if any images are loaded\n * in the chart. Runs the callbacks and triggers the `load` and `render`\n * events.\n *\n * @private\n * @function Highcharts.Chart#onload\n * @emits Highcharts.Chart#event:load\n * @emits Highcharts.Chart#event:render\n */\n Chart.prototype.onload = function () {\n // Run callbacks, first the ones registered by modules, then user's one\n this.callbacks.concat([this.callback]).forEach(function (fn) {\n // Chart destroyed in its own callback (#3600)\n if (fn && typeof this.index !== 'undefined') {\n fn.apply(this, [this]);\n }\n }, this);\n fireEvent(this, 'load');\n fireEvent(this, 'render');\n // Set up auto resize, check for not destroyed (#6068)\n if (defined(this.index)) {\n this.setReflow(this.options.chart.reflow);\n }\n this.warnIfA11yModuleNotLoaded();\n // Don't run again\n this.hasLoaded = true;\n };\n /**\n * Emit console warning if the a11y module is not loaded.\n */\n Chart.prototype.warnIfA11yModuleNotLoaded = function () {\n var _a = this,\n options = _a.options,\n title = _a.title;\n if (options && !this.accessibility) {\n // Make chart behave as an image with the title as alt text\n this.renderer.boxWrapper.attr({\n role: 'img',\n 'aria-label': ((title && title.element.textContent) || ''\n // #17753, < is not allowed in SVG attributes\n ).replace(/} [animation]\n * Whether to apply animation, and optionally animation\n * configuration.\n *\n * @return {Highcharts.Series}\n * The newly created series object.\n *\n * @emits Highcharts.Chart#event:addSeries\n * @emits Highcharts.Chart#event:afterAddSeries\n */\n Chart.prototype.addSeries = function (options, redraw, animation) {\n var chart = this;\n var series;\n if (options) { // <- not necessary\n redraw = pick(redraw, true); // defaults to true\n fireEvent(chart, 'addSeries', { options: options }, function () {\n series = chart.initSeries(options);\n chart.isDirtyLegend = true;\n chart.linkSeries();\n if (series.enabledDataSorting) {\n // We need to call `setData` after `linkSeries`\n series.setData(options.data, false);\n }\n fireEvent(chart, 'afterAddSeries', { series: series });\n if (redraw) {\n chart.redraw(animation);\n }\n });\n }\n return series;\n };\n /**\n * Add an axis to the chart after render time. Note that this method should\n * never be used when adding data synchronously at chart render time, as it\n * adds expense to the calculations and rendering. When adding data at the\n * same time as the chart is initialized, add the axis as a configuration\n * option instead.\n *\n * @sample highcharts/members/chart-addaxis/\n * Add and remove axes\n *\n * @function Highcharts.Chart#addAxis\n *\n * @param {Highcharts.AxisOptions} options\n * The axis options.\n *\n * @param {boolean} [isX=false]\n * Whether it is an X axis or a value axis.\n *\n * @param {boolean} [redraw=true]\n * Whether to redraw the chart after adding.\n *\n * @param {boolean|Partial} [animation=true]\n * Whether and how to apply animation in the redraw.\n *\n * @return {Highcharts.Axis}\n * The newly generated Axis object.\n */\n Chart.prototype.addAxis = function (options, isX, redraw, animation) {\n return this.createAxis(isX ? 'xAxis' : 'yAxis', { axis: options, redraw: redraw, animation: animation });\n };\n /**\n * Add a color axis to the chart after render time. Note that this method\n * should never be used when adding data synchronously at chart render time,\n * as it adds expense to the calculations and rendering. When adding data at\n * the same time as the chart is initialized, add the axis as a\n * configuration option instead.\n *\n * @sample highcharts/members/chart-addaxis/\n * Add and remove axes\n *\n * @function Highcharts.Chart#addColorAxis\n *\n * @param {Highcharts.ColorAxisOptions} options\n * The axis options.\n *\n * @param {boolean} [redraw=true]\n * Whether to redraw the chart after adding.\n *\n * @param {boolean|Partial} [animation=true]\n * Whether and how to apply animation in the redraw.\n *\n * @return {Highcharts.ColorAxis}\n * The newly generated Axis object.\n */\n Chart.prototype.addColorAxis = function (options, redraw, animation) {\n return this.createAxis('colorAxis', { axis: options, redraw: redraw, animation: animation });\n };\n /**\n * Factory for creating different axis types.\n *\n * @private\n * @function Highcharts.Chart#createAxis\n *\n * @param {string} type\n * An axis type.\n *\n * @param {...Array<*>} arguments\n * All arguments for the constructor.\n *\n * @return {Highcharts.Axis | Highcharts.ColorAxis}\n * The newly generated Axis object.\n */\n Chart.prototype.createAxis = function (type, options) {\n var axis = new Axis(this,\n merge(options.axis, {\n index: this[type].length,\n isX: type === 'xAxis'\n }));\n if (pick(options.redraw, true)) {\n this.redraw(options.animation);\n }\n return axis;\n };\n /**\n * Dim the chart and show a loading text or symbol. Options for the loading\n * screen are defined in {@link\n * https://api.highcharts.com/highcharts/loading|the loading options}.\n *\n * @sample highcharts/members/chart-hideloading/\n * Show and hide loading from a button\n * @sample highcharts/members/chart-showloading/\n * Apply different text labels\n * @sample stock/members/chart-show-hide-loading/\n * Toggle loading in Highcharts Stock\n *\n * @function Highcharts.Chart#showLoading\n *\n * @param {string} [str]\n * An optional text to show in the loading label instead of the\n * default one. The default text is set in\n * [lang.loading](https://api.highcharts.com/highcharts/lang.loading).\n */\n Chart.prototype.showLoading = function (str) {\n var chart = this,\n options = chart.options,\n loadingOptions = options.loading,\n setLoadingSize = function () {\n if (loadingDiv) {\n css(loadingDiv, {\n left: chart.plotLeft + 'px',\n top: chart.plotTop + 'px',\n width: chart.plotWidth + 'px',\n height: chart.plotHeight + 'px'\n });\n }\n };\n var loadingDiv = chart.loadingDiv,\n loadingSpan = chart.loadingSpan;\n // create the layer at the first call\n if (!loadingDiv) {\n chart.loadingDiv = loadingDiv = createElement('div', {\n className: 'highcharts-loading highcharts-loading-hidden'\n }, null, chart.container);\n }\n if (!loadingSpan) {\n chart.loadingSpan = loadingSpan = createElement('span', { className: 'highcharts-loading-inner' }, null, loadingDiv);\n addEvent(chart, 'redraw', setLoadingSize); // #1080\n }\n loadingDiv.className = 'highcharts-loading';\n // Update text\n AST.setElementHTML(loadingSpan, pick(str, options.lang.loading, ''));\n if (!chart.styledMode) {\n // Update visuals\n css(loadingDiv, extend(loadingOptions.style, {\n zIndex: 10\n }));\n css(loadingSpan, loadingOptions.labelStyle);\n // Show it\n if (!chart.loadingShown) {\n css(loadingDiv, {\n opacity: 0,\n display: ''\n });\n animate(loadingDiv, {\n opacity: loadingOptions.style.opacity || 0.5\n }, {\n duration: loadingOptions.showDuration || 0\n });\n }\n }\n chart.loadingShown = true;\n setLoadingSize();\n };\n /**\n * Hide the loading layer.\n *\n * @see Highcharts.Chart#showLoading\n *\n * @sample highcharts/members/chart-hideloading/\n * Show and hide loading from a button\n * @sample stock/members/chart-show-hide-loading/\n * Toggle loading in Highcharts Stock\n *\n * @function Highcharts.Chart#hideLoading\n */\n Chart.prototype.hideLoading = function () {\n var options = this.options,\n loadingDiv = this.loadingDiv;\n if (loadingDiv) {\n loadingDiv.className =\n 'highcharts-loading highcharts-loading-hidden';\n if (!this.styledMode) {\n animate(loadingDiv, {\n opacity: 0\n }, {\n duration: options.loading.hideDuration || 100,\n complete: function () {\n css(loadingDiv, { display: 'none' });\n }\n });\n }\n }\n this.loadingShown = false;\n };\n /**\n * A generic function to update any element of the chart. Elements can be\n * enabled and disabled, moved, re-styled, re-formatted etc.\n *\n * A special case is configuration objects that take arrays, for example\n * [xAxis](https://api.highcharts.com/highcharts/xAxis),\n * [yAxis](https://api.highcharts.com/highcharts/yAxis) or\n * [series](https://api.highcharts.com/highcharts/series). For these\n * collections, an `id` option is used to map the new option set to an\n * existing object. If an existing object of the same id is not found, the\n * corresponding item is updated. So for example, running `chart.update`\n * with a series item without an id, will cause the existing chart's series\n * with the same index in the series array to be updated. When the\n * `oneToOne` parameter is true, `chart.update` will also take care of\n * adding and removing items from the collection. Read more under the\n * parameter description below.\n *\n * Note that when changing series data, `chart.update` may mutate the passed\n * data options.\n *\n * See also the\n * [responsive option set](https://api.highcharts.com/highcharts/responsive).\n * Switching between `responsive.rules` basically runs `chart.update` under\n * the hood.\n *\n * @sample highcharts/members/chart-update/\n * Update chart geometry\n *\n * @function Highcharts.Chart#update\n *\n * @param {Highcharts.Options} options\n * A configuration object for the new chart options.\n *\n * @param {boolean} [redraw=true]\n * Whether to redraw the chart.\n *\n * @param {boolean} [oneToOne=false]\n * When `true`, the `series`, `xAxis`, `yAxis` and `annotations`\n * collections will be updated one to one, and items will be either\n * added or removed to match the new updated options. For example,\n * if the chart has two series and we call `chart.update` with a\n * configuration containing three series, one will be added. If we\n * call `chart.update` with one series, one will be removed. Setting\n * an empty `series` array will remove all series, but leaving out\n * the`series` property will leave all series untouched. If the\n * series have id's, the new series options will be matched by id,\n * and the remaining ones removed.\n *\n * @param {boolean|Partial} [animation=true]\n * Whether to apply animation, and optionally animation\n * configuration.\n *\n * @emits Highcharts.Chart#event:update\n * @emits Highcharts.Chart#event:afterUpdate\n */\n Chart.prototype.update = function (options, redraw, oneToOne, animation) {\n var chart = this,\n adders = {\n credits: 'addCredits',\n title: 'setTitle',\n subtitle: 'setSubtitle',\n caption: 'setCaption'\n },\n isResponsiveOptions = options.isResponsiveOptions,\n itemsForRemoval = [];\n var updateAllAxes,\n updateAllSeries,\n runSetSize;\n fireEvent(chart, 'update', { options: options });\n // If there are responsive rules in action, undo the responsive rules\n // before we apply the updated options and replay the responsive rules\n // on top from the chart.redraw function (#9617).\n if (!isResponsiveOptions) {\n chart.setResponsive(false, true);\n }\n options = cleanRecursively(options, chart.options);\n chart.userOptions = merge(chart.userOptions, options);\n // If the top-level chart option is present, some special updates are\n // required\n var optionsChart = options.chart;\n if (optionsChart) {\n merge(true, chart.options.chart, optionsChart);\n // Setter function\n if ('className' in optionsChart) {\n chart.setClassName(optionsChart.className);\n }\n if ('reflow' in optionsChart) {\n chart.setReflow(optionsChart.reflow);\n }\n if ('inverted' in optionsChart ||\n 'polar' in optionsChart ||\n 'type' in optionsChart) {\n // Parse options.chart.inverted and options.chart.polar together\n // with the available series.\n chart.propFromSeries();\n updateAllAxes = true;\n }\n if ('alignTicks' in optionsChart) { // #6452\n updateAllAxes = true;\n }\n if ('events' in optionsChart) {\n // Chart event handlers\n registerEventOptions(this, optionsChart);\n }\n objectEach(optionsChart, function (val, key) {\n if (chart.propsRequireUpdateSeries.indexOf('chart.' + key) !==\n -1) {\n updateAllSeries = true;\n }\n // Only dirty box\n if (chart.propsRequireDirtyBox.indexOf(key) !== -1) {\n chart.isDirtyBox = true;\n }\n // Chart setSize\n if (chart.propsRequireReflow.indexOf(key) !== -1) {\n if (isResponsiveOptions) {\n chart.isDirtyBox = true;\n }\n else {\n runSetSize = true;\n }\n }\n });\n if (!chart.styledMode && optionsChart.style) {\n chart.renderer.setStyle(chart.options.chart.style || {});\n }\n }\n // Moved up, because tooltip needs updated plotOptions (#6218)\n if (!chart.styledMode && options.colors) {\n this.options.colors = options.colors;\n }\n if (options.time) {\n // Maintaining legacy global time. If the chart is instanciated\n // first with global time, then updated with time options, we need\n // to create a new Time instance to avoid mutating the global time\n // (#10536).\n if (this.time === defaultTime) {\n this.time = new Time(options.time);\n }\n // If we're updating, the time class is different from other chart\n // classes (chart.legend, chart.tooltip etc) in that it doesn't know\n // about the chart. The other chart[something].update functions also\n // set the chart.options[something]. For the time class however we\n // need to update the chart options separately. #14230.\n merge(true, chart.options.time, options.time);\n }\n // Some option stuctures correspond one-to-one to chart objects that\n // have update methods, for example\n // options.credits => chart.credits\n // options.legend => chart.legend\n // options.title => chart.title\n // options.tooltip => chart.tooltip\n // options.subtitle => chart.subtitle\n // options.mapNavigation => chart.mapNavigation\n // options.navigator => chart.navigator\n // options.scrollbar => chart.scrollbar\n objectEach(options, function (val, key) {\n if (chart[key] &&\n typeof chart[key].update === 'function') {\n chart[key].update(val, false);\n // If a one-to-one object does not exist, look for an adder function\n }\n else if (typeof chart[adders[key]] === 'function') {\n chart[adders[key]](val);\n // Else, just merge the options. For nodes like loading, noData,\n // plotOptions\n }\n else if (key !== 'colors' &&\n chart.collectionsWithUpdate.indexOf(key) === -1) {\n merge(true, chart.options[key], options[key]);\n }\n if (key !== 'chart' &&\n chart.propsRequireUpdateSeries.indexOf(key) !== -1) {\n updateAllSeries = true;\n }\n });\n // Setters for collections. For axes and series, each item is referred\n // by an id. If the id is not found, it defaults to the corresponding\n // item in the collection, so setting one series without an id, will\n // update the first series in the chart. Setting two series without\n // an id will update the first and the second respectively (#6019)\n // chart.update and responsive.\n this.collectionsWithUpdate.forEach(function (coll) {\n var indexMap;\n if (options[coll]) {\n // In stock charts, the navigator series are also part of the\n // chart.series array, but those series should not be handled\n // here (#8196) and neither should the navigator axis (#9671).\n indexMap = [];\n chart[coll].forEach(function (s, i) {\n if (!s.options.isInternal) {\n indexMap.push(pick(s.options.index, i));\n }\n });\n splat(options[coll]).forEach(function (newOptions, i) {\n var hasId = defined(newOptions.id);\n var item;\n // Match by id\n if (hasId) {\n item = chart.get(newOptions.id);\n }\n // No match by id found, match by index instead\n if (!item && chart[coll]) {\n item = chart[coll][indexMap ? indexMap[i] : i];\n // Check if we grabbed an item with an exising but\n // different id (#13541)\n if (item && hasId && defined(item.options.id)) {\n item = void 0;\n }\n }\n if (item && item.coll === coll) {\n item.update(newOptions, false);\n if (oneToOne) {\n item.touched = true;\n }\n }\n // If oneToOne and no matching item is found, add one\n if (!item && oneToOne && chart.collectionsWithInit[coll]) {\n chart.collectionsWithInit[coll][0].apply(chart, \n // [newOptions, ...extraArguments, redraw=false]\n [\n newOptions\n ].concat(\n // Not all initializers require extra args\n chart.collectionsWithInit[coll][1] || []).concat([\n false\n ])).touched = true;\n }\n });\n // Add items for removal\n if (oneToOne) {\n chart[coll].forEach(function (item) {\n if (!item.touched && !item.options.isInternal) {\n itemsForRemoval.push(item);\n }\n else {\n delete item.touched;\n }\n });\n }\n }\n });\n itemsForRemoval.forEach(function (item) {\n if (item.chart && item.remove) { // #9097, avoid removing twice\n item.remove(false);\n }\n });\n if (updateAllAxes) {\n chart.axes.forEach(function (axis) {\n axis.update({}, false);\n });\n }\n // Certain options require the whole series structure to be thrown away\n // and rebuilt\n if (updateAllSeries) {\n chart.getSeriesOrderByLinks().forEach(function (series) {\n // Avoid removed navigator series\n if (series.chart) {\n series.update({}, false);\n }\n }, this);\n }\n // Update size. Redraw is forced.\n var newWidth = optionsChart && optionsChart.width;\n var newHeight = optionsChart && (isString(optionsChart.height) ?\n relativeLength(optionsChart.height,\n newWidth || chart.chartWidth) :\n optionsChart.height);\n if (\n // In this case, run chart.setSize with newWidth and newHeight which\n // are undefined, only for reflowing chart elements because margin\n // or spacing has been set (#8190)\n runSetSize ||\n // In this case, the size is actually set\n (isNumber(newWidth) && newWidth !== chart.chartWidth) ||\n (isNumber(newHeight) && newHeight !== chart.chartHeight)) {\n chart.setSize(newWidth, newHeight, animation);\n }\n else if (pick(redraw, true)) {\n chart.redraw(animation);\n }\n fireEvent(chart, 'afterUpdate', {\n options: options,\n redraw: redraw,\n animation: animation\n });\n };\n /**\n * Shortcut to set the subtitle options. This can also be done from {@link\n * Chart#update} or {@link Chart#setTitle}.\n *\n * @function Highcharts.Chart#setSubtitle\n *\n * @param {Highcharts.SubtitleOptions} options\n * New subtitle options. The subtitle text itself is set by the\n * `options.text` property.\n */\n Chart.prototype.setSubtitle = function (options, redraw) {\n this.applyDescription('subtitle', options);\n this.layOutTitles(redraw);\n };\n /**\n * Set the caption options. This can also be done from {@link\n * Chart#update}.\n *\n * @function Highcharts.Chart#setCaption\n *\n * @param {Highcharts.CaptionOptions} options\n * New caption options. The caption text itself is set by the\n * `options.text` property.\n */\n Chart.prototype.setCaption = function (options, redraw) {\n this.applyDescription('caption', options);\n this.layOutTitles(redraw);\n };\n /**\n * Display the zoom button, so users can reset zoom to the default view\n * settings.\n *\n * @function Highcharts.Chart#showResetZoom\n *\n * @emits Highcharts.Chart#event:afterShowResetZoom\n * @emits Highcharts.Chart#event:beforeShowResetZoom\n */\n Chart.prototype.showResetZoom = function () {\n var chart = this,\n lang = defaultOptions.lang,\n btnOptions = chart.options.chart.zooming.resetButton,\n theme = btnOptions.theme,\n alignTo = (btnOptions.relativeTo === 'chart' ||\n btnOptions.relativeTo === 'spacingBox' ?\n null :\n 'scrollablePlotBox');\n /**\n * @private\n */\n function zoomOut() {\n chart.zoomOut();\n }\n fireEvent(this, 'beforeShowResetZoom', null, function () {\n chart.resetZoomButton = chart.renderer\n .button(lang.resetZoom, null, null, zoomOut, theme)\n .attr({\n align: btnOptions.position.align,\n title: lang.resetZoomTitle\n })\n .addClass('highcharts-reset-zoom')\n .add()\n .align(btnOptions.position, false, alignTo);\n });\n fireEvent(this, 'afterShowResetZoom');\n };\n /**\n * Zoom the chart out after a user has zoomed in. See also\n * [Axis.setExtremes](/class-reference/Highcharts.Axis#setExtremes).\n *\n * @function Highcharts.Chart#zoomOut\n *\n * @emits Highcharts.Chart#event:selection\n */\n Chart.prototype.zoomOut = function () {\n fireEvent(this, 'selection', { resetSelection: true }, this.zoom);\n };\n /**\n * Zoom into a given portion of the chart given by axis coordinates.\n *\n * @private\n * @function Highcharts.Chart#zoom\n * @param {Highcharts.SelectEventObject} event\n */\n Chart.prototype.zoom = function (event) {\n var chart = this,\n pointer = chart.pointer;\n var displayButton = false,\n hasZoomed;\n // If zoom is called with no arguments, reset the axes\n if (!event || event.resetSelection) {\n chart.axes.forEach(function (axis) {\n hasZoomed = axis.zoom();\n });\n pointer.initiated = false; // #6804\n }\n else { // else, zoom in on all axes\n event.xAxis.concat(event.yAxis).forEach(function (axisData) {\n var axis = axisData.axis,\n isXAxis = axis.isXAxis;\n // don't zoom more than minRange\n if (pointer[isXAxis ? 'zoomX' : 'zoomY'] &&\n (defined(pointer.mouseDownX) &&\n defined(pointer.mouseDownY) &&\n chart.isInsidePlot(pointer.mouseDownX - chart.plotLeft, pointer.mouseDownY - chart.plotTop, { axis: axis })) || !defined(chart.inverted ? pointer.mouseDownX : pointer.mouseDownY)) {\n hasZoomed = axis.zoom(axisData.min, axisData.max);\n if (axis.displayBtn) {\n displayButton = true;\n }\n }\n });\n }\n // Show or hide the Reset zoom button\n var resetZoomButton = chart.resetZoomButton;\n if (displayButton && !resetZoomButton) {\n chart.showResetZoom();\n }\n else if (!displayButton && isObject(resetZoomButton)) {\n chart.resetZoomButton = resetZoomButton.destroy();\n }\n // Redraw\n if (hasZoomed) {\n chart.redraw(pick(chart.options.chart.animation, event && event.animation, chart.pointCount < 100));\n }\n };\n /**\n * Pan the chart by dragging the mouse across the pane. This function is\n * called on mouse move, and the distance to pan is computed from chartX\n * compared to the first chartX position in the dragging operation.\n *\n * @private\n * @function Highcharts.Chart#pan\n * @param {Highcharts.PointerEventObject} e\n * @param {string} panning\n */\n Chart.prototype.pan = function (e, panning) {\n var chart = this,\n hoverPoints = chart.hoverPoints,\n panningOptions = (typeof panning === 'object' ?\n panning :\n {\n enabled: panning,\n type: 'x'\n }),\n chartOptions = chart.options.chart;\n if (chartOptions && chartOptions.panning) {\n chartOptions.panning = panningOptions;\n }\n var type = panningOptions.type;\n var doRedraw;\n fireEvent(this, 'pan', { originalEvent: e }, function () {\n // remove active points for shared tooltip\n if (hoverPoints) {\n hoverPoints.forEach(function (point) {\n point.setState();\n });\n }\n var axes = chart.xAxis;\n if (type === 'xy') {\n axes = axes.concat(chart.yAxis);\n }\n else if (type === 'y') {\n axes = chart.yAxis;\n }\n var nextMousePos = {};\n axes.forEach(function (axis) {\n if (!axis.options.panningEnabled || axis.options.isInternal) {\n return;\n }\n var horiz = axis.horiz, mousePos = e[horiz ? 'chartX' : 'chartY'], mouseDown = horiz ? 'mouseDownX' : 'mouseDownY', startPos = chart[mouseDown], halfPointRange = axis.minPointOffset || 0, pointRangeDirection = (axis.reversed && !chart.inverted) ||\n (!axis.reversed && chart.inverted) ?\n -1 :\n 1, extremes = axis.getExtremes(), panMin = axis.toValue(startPos - mousePos, true) +\n halfPointRange * pointRangeDirection, panMax = axis.toValue(startPos + axis.len - mousePos, true) -\n ((halfPointRange * pointRangeDirection) ||\n (axis.isXAxis && axis.pointRangePadding) ||\n 0), flipped = panMax < panMin, hasVerticalPanning = axis.hasVerticalPanning();\n var newMin = flipped ? panMax : panMin,\n newMax = flipped ? panMin : panMax,\n panningState = axis.panningState,\n spill;\n // General calculations of panning state.\n // This is related to using vertical panning. (#11315).\n if (hasVerticalPanning &&\n !axis.isXAxis && (!panningState || panningState.isDirty)) {\n axis.series.forEach(function (series) {\n var processedData = series.getProcessedData(true),\n dataExtremes = series.getExtremes(processedData.yData,\n true);\n if (!panningState) {\n panningState = {\n startMin: Number.MAX_VALUE,\n startMax: -Number.MAX_VALUE\n };\n }\n if (isNumber(dataExtremes.dataMin) &&\n isNumber(dataExtremes.dataMax)) {\n panningState.startMin = Math.min(pick(series.options.threshold, Infinity), dataExtremes.dataMin, panningState.startMin);\n panningState.startMax = Math.max(pick(series.options.threshold, -Infinity), dataExtremes.dataMax, panningState.startMax);\n }\n });\n }\n var paddedMin = Math.min(pick(panningState && panningState.startMin,\n extremes.dataMin),\n halfPointRange ?\n extremes.min :\n axis.toValue(axis.toPixels(extremes.min) -\n axis.minPixelPadding));\n var paddedMax = Math.max(pick(panningState && panningState.startMax,\n extremes.dataMax),\n halfPointRange ?\n extremes.max :\n axis.toValue(axis.toPixels(extremes.max) +\n axis.minPixelPadding));\n axis.panningState = panningState;\n // It is not necessary to calculate extremes on ordinal axis,\n // because they are already calculated, so we don't want to\n // override them.\n if (!axis.isOrdinal) {\n // If the new range spills over, either to the min or max,\n // adjust the new range.\n spill = paddedMin - newMin;\n if (spill > 0) {\n newMax += spill;\n newMin = paddedMin;\n }\n spill = newMax - paddedMax;\n if (spill > 0) {\n newMax = paddedMax;\n newMin -= spill;\n }\n // Set new extremes if they are actually new\n if (axis.series.length &&\n newMin !== extremes.min &&\n newMax !== extremes.max &&\n newMin >= paddedMin &&\n newMax <= paddedMax) {\n axis.setExtremes(newMin, newMax, false, false, { trigger: 'pan' });\n if (!chart.resetZoomButton &&\n // Show reset zoom button only when both newMin and\n // newMax values are between padded axis range.\n newMin !== paddedMin &&\n newMax !== paddedMax &&\n type.match('y')) {\n chart.showResetZoom();\n axis.displayBtn = false;\n }\n doRedraw = true;\n }\n // set new reference for next run:\n nextMousePos[mouseDown] = mousePos;\n }\n });\n objectEach(nextMousePos, function (pos, down) {\n chart[down] = pos;\n });\n if (doRedraw) {\n chart.redraw(false);\n }\n css(chart.container, { cursor: 'move' });\n });\n };\n return Chart;\n }());\n extend(Chart.prototype, {\n // Hook for adding callbacks in modules\n callbacks: [],\n /**\n * These collections (arrays) implement `Chart.addSomethig` method used in\n * chart.update() to create new object in the collection. Equivalent for\n * deleting is resolved by simple `Somethig.remove()`.\n *\n * Note: We need to define these references after initializers are bound to\n * chart's prototype.\n *\n * @private\n */\n collectionsWithInit: {\n // collectionName: [ initializingMethod, [extraArguments] ]\n xAxis: [Chart.prototype.addAxis, [true]],\n yAxis: [Chart.prototype.addAxis, [false]],\n series: [Chart.prototype.addSeries]\n },\n /**\n * These collections (arrays) implement update() methods with support for\n * one-to-one option.\n * @private\n */\n collectionsWithUpdate: [\n 'xAxis',\n 'yAxis',\n 'series'\n ],\n /**\n * These properties cause isDirtyBox to be set to true when updating. Can be\n * extended from plugins.\n * @private\n */\n propsRequireDirtyBox: [\n 'backgroundColor',\n 'borderColor',\n 'borderWidth',\n 'borderRadius',\n 'plotBackgroundColor',\n 'plotBackgroundImage',\n 'plotBorderColor',\n 'plotBorderWidth',\n 'plotShadow',\n 'shadow'\n ],\n /**\n * These properties require a full reflow of chart elements, best\n * implemented through running `Chart.setSize` internally (#8190).\n * @private\n */\n propsRequireReflow: [\n 'margin',\n 'marginTop',\n 'marginRight',\n 'marginBottom',\n 'marginLeft',\n 'spacing',\n 'spacingTop',\n 'spacingRight',\n 'spacingBottom',\n 'spacingLeft'\n ],\n /**\n * These properties cause all series to be updated when updating. Can be\n * extended from plugins.\n * @private\n */\n propsRequireUpdateSeries: [\n 'chart.inverted',\n 'chart.polar',\n 'chart.ignoreHiddenSeries',\n 'chart.type',\n 'colors',\n 'plotOptions',\n 'time',\n 'tooltip'\n ]\n });\n /* *\n *\n * Default Export\n *\n * */\n /* *\n *\n * API Declarations\n *\n * */\n /**\n * Callback for chart constructors.\n *\n * @callback Highcharts.ChartCallbackFunction\n *\n * @param {Highcharts.Chart} chart\n * Created chart.\n */\n /**\n * Format a number and return a string based on input settings.\n *\n * @callback Highcharts.NumberFormatterCallbackFunction\n *\n * @param {number} number\n * The input number to format.\n *\n * @param {number} decimals\n * The amount of decimals. A value of -1 preserves the amount in the\n * input number.\n *\n * @param {string} [decimalPoint]\n * The decimal point, defaults to the one given in the lang options, or\n * a dot.\n *\n * @param {string} [thousandsSep]\n * The thousands separator, defaults to the one given in the lang\n * options, or a space character.\n *\n * @return {string} The formatted number.\n */\n /**\n * The chart title. The title has an `update` method that allows modifying the\n * options directly or indirectly via `chart.update`.\n *\n * @interface Highcharts.TitleObject\n * @extends Highcharts.SVGElement\n */ /**\n * Modify options for the title.\n *\n * @function Highcharts.TitleObject#update\n *\n * @param {Highcharts.TitleOptions} titleOptions\n * Options to modify.\n *\n * @param {boolean} [redraw=true]\n * Whether to redraw the chart after the title is altered. If doing more\n * operations on the chart, it is a good idea to set redraw to false and\n * call {@link Chart#redraw} after.\n */\n /**\n * The chart subtitle. The subtitle has an `update` method that\n * allows modifying the options directly or indirectly via\n * `chart.update`.\n *\n * @interface Highcharts.SubtitleObject\n * @extends Highcharts.SVGElement\n */ /**\n * Modify options for the subtitle.\n *\n * @function Highcharts.SubtitleObject#update\n *\n * @param {Highcharts.SubtitleOptions} subtitleOptions\n * Options to modify.\n *\n * @param {boolean} [redraw=true]\n * Whether to redraw the chart after the subtitle is altered. If doing\n * more operations on the chart, it is a good idea to set redraw to false\n * and call {@link Chart#redraw} after.\n */\n /**\n * The chart caption. The caption has an `update` method that\n * allows modifying the options directly or indirectly via\n * `chart.update`.\n *\n * @interface Highcharts.CaptionObject\n * @extends Highcharts.SVGElement\n */ /**\n * Modify options for the caption.\n *\n * @function Highcharts.CaptionObject#update\n *\n * @param {Highcharts.CaptionOptions} captionOptions\n * Options to modify.\n *\n * @param {boolean} [redraw=true]\n * Whether to redraw the chart after the caption is altered. If doing\n * more operations on the chart, it is a good idea to set redraw to false\n * and call {@link Chart#redraw} after.\n */\n /**\n * @interface Highcharts.ChartIsInsideOptionsObject\n */ /**\n * @name Highcharts.ChartIsInsideOptionsObject#axis\n * @type {Highcharts.Axis|undefined}\n */ /**\n * @name Highcharts.ChartIsInsideOptionsObject#ignoreX\n * @type {boolean|undefined}\n */ /**\n * @name Highcharts.ChartIsInsideOptionsObject#ignoreY\n * @type {boolean|undefined}\n */ /**\n * @name Highcharts.ChartIsInsideOptionsObject#inverted\n * @type {boolean|undefined}\n */ /**\n * @name Highcharts.ChartIsInsideOptionsObject#paneCoordinates\n * @type {boolean|undefined}\n */ /**\n * @name Highcharts.ChartIsInsideOptionsObject#series\n * @type {Highcharts.Series|undefined}\n */ /**\n * @name Highcharts.ChartIsInsideOptionsObject#visiblePlotOnly\n * @type {boolean|undefined}\n */\n ''; // keeps doclets above in JS file\n\n return Chart;\n });\n _registerModule(_modules, 'Core/Legend/LegendSymbol.js', [_modules['Core/Utilities.js']], function (U) {\n /* *\n *\n * (c) 2010-2021 Torstein Honsi\n *\n * License: www.highcharts.com/license\n *\n * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!\n *\n * */\n var extend = U.extend,\n merge = U.merge,\n pick = U.pick;\n /* *\n *\n * Namespace\n *\n * */\n var LegendSymbol;\n (function (LegendSymbol) {\n /* *\n *\n * Functions\n *\n * */\n /* eslint-disable valid-jsdoc */\n /**\n * Get the series' symbol in the legend.\n *\n * This method should be overridable to create custom symbols through\n * Highcharts.seriesTypes[type].prototype.drawLegendSymbol.\n *\n * @private\n * @function Highcharts.LegendSymbolMixin.drawLineMarker\n *\n * @param {Highcharts.Legend} legend\n * The legend object.\n */\n function drawLineMarker(legend) {\n var legendItem = this.legendItem = this.legendItem || {},\n options = this.options,\n symbolWidth = legend.symbolWidth,\n symbolHeight = legend.symbolHeight,\n generalRadius = symbolHeight / 2,\n renderer = this.chart.renderer,\n legendItemGroup = legendItem.group,\n verticalCenter = legend.baseline -\n Math.round(legend.fontMetrics.b * 0.3);\n var attr = {},\n legendSymbol,\n markerOptions = options.marker,\n lineSizer = 0;\n // Draw the line\n if (!this.chart.styledMode) {\n attr = {\n 'stroke-width': Math.min(options.lineWidth || 0, 24)\n };\n if (options.dashStyle) {\n attr.dashstyle = options.dashStyle;\n }\n else if (options.linecap !== 'square') {\n attr['stroke-linecap'] = 'round';\n }\n }\n legendItem.line = renderer\n .path()\n .addClass('highcharts-graph')\n .attr(attr)\n .add(legendItemGroup);\n if (attr['stroke-linecap']) {\n lineSizer = Math.min(legendItem.line.strokeWidth(), symbolWidth) / 2;\n }\n legendItem.line\n .attr({\n d: [\n ['M', lineSizer, verticalCenter],\n ['L', symbolWidth - lineSizer, verticalCenter]\n ]\n });\n // Draw the marker\n if (markerOptions && markerOptions.enabled !== false && symbolWidth) {\n // Do not allow the marker to be larger than the symbolHeight\n var radius = Math.min(pick(markerOptions.radius,\n generalRadius),\n generalRadius);\n // Restrict symbol markers size\n if (this.symbol.indexOf('url') === 0) {\n markerOptions = merge(markerOptions, {\n width: symbolHeight,\n height: symbolHeight\n });\n radius = 0;\n }\n legendItem.symbol = legendSymbol = renderer\n .symbol(this.symbol, (symbolWidth / 2) - radius, verticalCenter - radius, 2 * radius, 2 * radius, extend({ context: 'legend' }, markerOptions))\n .addClass('highcharts-point')\n .add(legendItemGroup);\n legendSymbol.isMarker = true;\n }\n }\n LegendSymbol.drawLineMarker = drawLineMarker;\n /**\n * Get the series' symbol in the legend.\n *\n * This method should be overridable to create custom symbols through\n * Highcharts.seriesTypes[type].prototype.drawLegendSymbol.\n *\n * @private\n * @function Highcharts.LegendSymbolMixin.drawRectangle\n *\n * @param {Highcharts.Legend} legend\n * The legend object\n *\n * @param {Highcharts.Point|Highcharts.Series} item\n * The series (this) or point\n */\n function drawRectangle(legend, item) {\n var legendItem = item.legendItem || {},\n options = legend.options,\n symbolHeight = legend.symbolHeight,\n square = options.squareSymbol,\n symbolWidth = square ? symbolHeight : legend.symbolWidth;\n legendItem.symbol = this.chart.renderer\n .rect(square ? (legend.symbolWidth - symbolHeight) / 2 : 0, legend.baseline - symbolHeight + 1, // #3988\n symbolWidth, symbolHeight, pick(legend.options.symbolRadius, symbolHeight / 2))\n .addClass('highcharts-point')\n .attr({\n zIndex: 3\n })\n .add(legendItem.group);\n }\n LegendSymbol.drawRectangle = drawRectangle;\n })(LegendSymbol || (LegendSymbol = {}));\n /* *\n *\n * Default Export\n *\n * */\n\n return LegendSymbol;\n });\n _registerModule(_modules, 'Core/Series/SeriesDefaults.js', [], function () {\n /* *\n *\n * (c) 2010-2021 Torstein Honsi\n *\n * License: www.highcharts.com/license\n *\n * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!\n *\n * */\n /* *\n *\n * API Options\n *\n * */\n /**\n * General options for all series types.\n *\n * @optionparent plotOptions.series\n */\n var seriesDefaults = {\n // base series options\n /**\n * The SVG value used for the `stroke-linecap` and `stroke-linejoin`\n * of a line graph. Round means that lines are rounded in the ends and\n * bends.\n *\n * @type {Highcharts.SeriesLinecapValue}\n * @default round\n * @since 3.0.7\n * @apioption plotOptions.line.linecap\n */\n /**\n * Pixel width of the graph line.\n *\n * @see In styled mode, the line stroke-width can be set with the\n * `.highcharts-graph` class name.\n *\n * @sample {highcharts} highcharts/plotoptions/series-linewidth-general/\n * On all series\n * @sample {highcharts} highcharts/plotoptions/series-linewidth-specific/\n * On one single series\n *\n * @product highcharts highstock\n *\n * @private\n */\n lineWidth: 2,\n /**\n * For some series, there is a limit that shuts down animation\n * by default when the total number of points in the chart is too high.\n * For example, for a column chart and its derivatives, animation does\n * not run if there is more than 250 points totally. To disable this\n * cap, set `animationLimit` to `Infinity`. This option works if animation\n * is fired on individual points, not on a group of points like e.g. during\n * the initial animation.\n *\n * @sample {highcharts} highcharts/plotoptions/series-animationlimit/\n * Animation limit on updating individual points\n *\n * @type {number}\n * @apioption plotOptions.series.animationLimit\n */\n /**\n * Allow this series' points to be selected by clicking on the graphic\n * (columns, point markers, pie slices, map areas etc).\n *\n * The selected points can be handled by point select and unselect\n * events, or collectively by the [getSelectedPoints\n * ](/class-reference/Highcharts.Chart#getSelectedPoints) function.\n *\n * And alternative way of selecting points is through dragging.\n *\n * @sample {highcharts} highcharts/plotoptions/series-allowpointselect-line/\n * Line\n * @sample {highcharts} highcharts/plotoptions/series-allowpointselect-column/\n * Column\n * @sample {highcharts} highcharts/plotoptions/series-allowpointselect-pie/\n * Pie\n * @sample {highcharts} highcharts/chart/events-selection-points/\n * Select a range of points through a drag selection\n * @sample {highmaps} maps/plotoptions/series-allowpointselect/\n * Map area\n * @sample {highmaps} maps/plotoptions/mapbubble-allowpointselect/\n * Map bubble\n *\n * @since 1.2.0\n *\n * @private\n */\n allowPointSelect: false,\n /**\n * When true, each point or column edge is rounded to its nearest pixel\n * in order to render sharp on screen. In some cases, when there are a\n * lot of densely packed columns, this leads to visible difference\n * in column widths or distance between columns. In these cases,\n * setting `crisp` to `false` may look better, even though each column\n * is rendered blurry.\n *\n * @sample {highcharts} highcharts/plotoptions/column-crisp-false/\n * Crisp is false\n *\n * @since 5.0.10\n * @product highcharts highstock gantt\n *\n * @private\n */\n crisp: true,\n /**\n * If true, a checkbox is displayed next to the legend item to allow\n * selecting the series. The state of the checkbox is determined by\n * the `selected` option.\n *\n * @productdesc {highmaps}\n * Note that if a `colorAxis` is defined, the color axis is represented\n * in the legend, not the series.\n *\n * @sample {highcharts} highcharts/plotoptions/series-showcheckbox-true/\n * Show select box\n *\n * @since 1.2.0\n *\n * @private\n */\n showCheckbox: false,\n /**\n * Enable or disable the initial animation when a series is displayed.\n * The animation can also be set as a configuration object. Please\n * note that this option only applies to the initial animation of the\n * series itself. For other animations, see [chart.animation](\n * #chart.animation) and the animation parameter under the API methods.\n * The following properties are supported:\n *\n * - `defer`: The animation delay time in milliseconds.\n *\n * - `duration`: The duration of the animation in milliseconds. (Defaults to\n * `1000`)\n *\n * - `easing`: Can be a string reference to an easing function set on\n * the `Math` object or a function. See the _Custom easing function_\n * demo below. (Defaults to `easeInOutSine`)\n *\n * Due to poor performance, animation is disabled in old IE browsers\n * for several chart types.\n *\n * @sample {highcharts} highcharts/plotoptions/series-animation-disabled/\n * Animation disabled\n * @sample {highcharts} highcharts/plotoptions/series-animation-slower/\n * Slower animation\n * @sample {highcharts} highcharts/plotoptions/series-animation-easing/\n * Custom easing function\n * @sample {highstock} stock/plotoptions/animation-slower/\n * Slower animation\n * @sample {highstock} stock/plotoptions/animation-easing/\n * Custom easing function\n * @sample {highmaps} maps/plotoptions/series-animation-true/\n * Animation enabled on map series\n * @sample {highmaps} maps/plotoptions/mapbubble-animation-false/\n * Disabled on mapbubble series\n *\n * @type {boolean|Highcharts.AnimationOptionsObject}\n * @default {highcharts} true\n * @default {highstock} true\n * @default {highmaps} false\n *\n * @private\n */\n animation: {\n /** @ignore-option */\n duration: 1000\n },\n /**\n * An additional class name to apply to the series' graphical elements.\n * This option does not replace default class names of the graphical\n * element. Changes to the series' color will also be reflected in a\n * chart's legend and tooltip.\n *\n * @sample {highcharts} highcharts/css/point-series-classname\n *\n * @type {string}\n * @since 5.0.0\n * @apioption plotOptions.series.className\n */\n /**\n * Disable this option to allow series rendering in the whole plotting\n * area.\n *\n * **Note:** Clipping should be always enabled when\n * [chart.zoomType](#chart.zoomType) is set\n *\n * @sample {highcharts} highcharts/plotoptions/series-clip/\n * Disabled clipping\n *\n * @default true\n * @type {boolean}\n * @since 3.0.0\n * @apioption plotOptions.series.clip\n */\n /**\n * The main color of the series. In line type series it applies to the\n * line and the point markers unless otherwise specified. In bar type\n * series it applies to the bars unless a color is specified per point.\n * The default value is pulled from the `options.colors` array.\n *\n * In styled mode, the color can be defined by the\n * [colorIndex](#plotOptions.series.colorIndex) option. Also, the series\n * color can be set with the `.highcharts-series`,\n * `.highcharts-color-{n}`, `.highcharts-{type}-series` or\n * `.highcharts-series-{n}` class, or individual classes given by the\n * `className` option.\n *\n * @productdesc {highmaps}\n * In maps, the series color is rarely used, as most choropleth maps use\n * the color to denote the value of each point. The series color can\n * however be used in a map with multiple series holding categorized\n * data.\n *\n * @sample {highcharts} highcharts/plotoptions/series-color-general/\n * General plot option\n * @sample {highcharts} highcharts/plotoptions/series-color-specific/\n * One specific series\n * @sample {highcharts} highcharts/plotoptions/series-color-area/\n * Area color\n * @sample {highcharts} highcharts/series/infographic/\n * Pattern fill\n * @sample {highmaps} maps/demo/category-map/\n * Category map by multiple series\n *\n * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}\n * @apioption plotOptions.series.color\n */\n /**\n * Styled mode only. A specific color index to use for the series, so its\n * graphic representations are given the class name `highcharts-color-{n}`.\n *\n * @sample {highcharts} highcharts/css/colorindex/\n * Series and point color index\n *\n * @type {number}\n * @since 5.0.0\n * @apioption plotOptions.series.colorIndex\n */\n /**\n * Whether to connect a graph line across null points, or render a gap\n * between the two points on either side of the null.\n *\n * @sample {highcharts} highcharts/plotoptions/series-connectnulls-false/\n * False by default\n * @sample {highcharts} highcharts/plotoptions/series-connectnulls-true/\n * True\n *\n * @type {boolean}\n * @default false\n * @product highcharts highstock\n * @apioption plotOptions.series.connectNulls\n */\n /**\n * You can set the cursor to \"pointer\" if you have click events attached\n * to the series, to signal to the user that the points and lines can\n * be clicked.\n *\n * In styled mode, the series cursor can be set with the same classes\n * as listed under [series.color](#plotOptions.series.color).\n *\n * @sample {highcharts} highcharts/plotoptions/series-cursor-line/\n * On line graph\n * @sample {highcharts} highcharts/plotoptions/series-cursor-column/\n * On columns\n * @sample {highcharts} highcharts/plotoptions/series-cursor-scatter/\n * On scatter markers\n * @sample {highstock} stock/plotoptions/cursor/\n * Pointer on a line graph\n * @sample {highmaps} maps/plotoptions/series-allowpointselect/\n * Map area\n * @sample {highmaps} maps/plotoptions/mapbubble-allowpointselect/\n * Map bubble\n *\n * @type {string|Highcharts.CursorValue}\n * @apioption plotOptions.series.cursor\n */\n /**\n * A reserved subspace to store options and values for customized\n * functionality. Here you can add additional data for your own event\n * callbacks and formatter callbacks.\n *\n * @sample {highcharts} highcharts/point/custom/\n * Point and series with custom data\n *\n * @type {Highcharts.Dictionary<*>}\n * @apioption plotOptions.series.custom\n */\n /**\n * Name of the dash style to use for the graph, or for some series types\n * the outline of each shape.\n *\n * In styled mode, the\n * [stroke dash-array](https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/css/series-dashstyle/)\n * can be set with the same classes as listed under\n * [series.color](#plotOptions.series.color).\n *\n * @sample {highcharts} highcharts/plotoptions/series-dashstyle-all/\n * Possible values demonstrated\n * @sample {highcharts} highcharts/plotoptions/series-dashstyle/\n * Chart suitable for printing in black and white\n * @sample {highstock} highcharts/plotoptions/series-dashstyle-all/\n * Possible values demonstrated\n * @sample {highmaps} highcharts/plotoptions/series-dashstyle-all/\n * Possible values demonstrated\n * @sample {highmaps} maps/plotoptions/series-dashstyle/\n * Dotted borders on a map\n *\n * @type {Highcharts.DashStyleValue}\n * @default Solid\n * @since 2.1\n * @apioption plotOptions.series.dashStyle\n */\n /**\n * A description of the series to add to the screen reader information\n * about the series.\n *\n * @type {string}\n * @since 5.0.0\n * @requires modules/accessibility\n * @apioption plotOptions.series.description\n */\n /**\n * Options for the series data sorting.\n *\n * @type {Highcharts.DataSortingOptionsObject}\n * @since 8.0.0\n * @product highcharts highstock\n * @apioption plotOptions.series.dataSorting\n */\n /**\n * Enable or disable data sorting for the series. Use [xAxis.reversed](\n * #xAxis.reversed) to change the sorting order.\n *\n * @sample {highcharts} highcharts/datasorting/animation/\n * Data sorting in scatter-3d\n * @sample {highcharts} highcharts/datasorting/labels-animation/\n * Axis labels animation\n * @sample {highcharts} highcharts/datasorting/dependent-sorting/\n * Dependent series sorting\n * @sample {highcharts} highcharts/datasorting/independent-sorting/\n * Independent series sorting\n *\n * @type {boolean}\n * @since 8.0.0\n * @apioption plotOptions.series.dataSorting.enabled\n */\n /**\n * Whether to allow matching points by name in an update. If this option\n * is disabled, points will be matched by order.\n *\n * @sample {highcharts} highcharts/datasorting/match-by-name/\n * Enabled match by name\n *\n * @type {boolean}\n * @since 8.0.0\n * @apioption plotOptions.series.dataSorting.matchByName\n */\n /**\n * Determines what data value should be used to sort by.\n *\n * @sample {highcharts} highcharts/datasorting/sort-key/\n * Sort key as `z` value\n *\n * @type {string}\n * @since 8.0.0\n * @default y\n * @apioption plotOptions.series.dataSorting.sortKey\n */\n /**\n * Enable or disable the mouse tracking for a specific series. This\n * includes point tooltips and click events on graphs and points. For\n * large datasets it improves performance.\n *\n * @sample {highcharts} highcharts/plotoptions/series-enablemousetracking-false/\n * No mouse tracking\n * @sample {highmaps} maps/plotoptions/series-enablemousetracking-false/\n * No mouse tracking\n *\n * @type {boolean}\n * @default true\n * @apioption plotOptions.series.enableMouseTracking\n */\n /**\n * Whether to use the Y extremes of the total chart width or only the\n * zoomed area when zooming in on parts of the X axis. By default, the\n * Y axis adjusts to the min and max of the visible data. Cartesian\n * series only.\n *\n * @type {boolean}\n * @default false\n * @since 4.1.6\n * @product highcharts highstock gantt\n * @apioption plotOptions.series.getExtremesFromAll\n */\n /**\n * An array specifying which option maps to which key in the data point\n * array. This makes it convenient to work with unstructured data arrays\n * from different sources.\n *\n * @see [series.data](#series.line.data)\n *\n * @sample {highcharts|highstock} highcharts/series/data-keys/\n * An extended data array with keys\n * @sample {highcharts|highstock} highcharts/series/data-nested-keys/\n * Nested keys used to access object properties\n *\n * @type {Array}\n * @since 4.1.6\n * @apioption plotOptions.series.keys\n */\n /**\n * The line cap used for line ends and line joins on the graph.\n *\n * @sample highcharts/series-line/linecap/\n * Line cap comparison\n *\n * @type {Highcharts.SeriesLinecapValue}\n * @default round\n * @product highcharts highstock\n * @apioption plotOptions.series.linecap\n */\n /**\n * The [id](#series.id) of another series to link to. Additionally,\n * the value can be \":previous\" to link to the previous series. When\n * two series are linked, only the first one appears in the legend.\n * Toggling the visibility of this also toggles the linked series.\n *\n * If master series uses data sorting and linked series does not have\n * its own sorting definition, the linked series will be sorted in the\n * same order as the master one.\n *\n * @sample {highcharts|highstock} highcharts/demo/arearange-line/\n * Linked series\n *\n * @type {string}\n * @since 3.0\n * @product highcharts highstock gantt\n * @apioption plotOptions.series.linkedTo\n */\n /**\n * Options for the corresponding navigator series if `showInNavigator`\n * is `true` for this series. Available options are the same as any\n * series, documented at [plotOptions](#plotOptions.series) and\n * [series](#series).\n *\n * These options are merged with options in [navigator.series](\n * #navigator.series), and will take precedence if the same option is\n * defined both places.\n *\n * @see [navigator.series](#navigator.series)\n *\n * @type {Highcharts.PlotSeriesOptions}\n * @since 5.0.0\n * @product highstock\n * @apioption plotOptions.series.navigatorOptions\n */\n /**\n * The color for the parts of the graph or points that are below the\n * [threshold](#plotOptions.series.threshold). Note that `zones` takes\n * precedence over the negative color. Using `negativeColor` is\n * equivalent to applying a zone with value of 0.\n *\n * @see In styled mode, a negative color is applied by setting this option\n * to `true` combined with the `.highcharts-negative` class name.\n *\n * @sample {highcharts} highcharts/plotoptions/series-negative-color/\n * Spline, area and column\n * @sample {highcharts} highcharts/plotoptions/arearange-negativecolor/\n * Arearange\n * @sample {highcharts} highcharts/css/series-negative-color/\n * Styled mode\n * @sample {highstock} highcharts/plotoptions/series-negative-color/\n * Spline, area and column\n * @sample {highstock} highcharts/plotoptions/arearange-negativecolor/\n * Arearange\n * @sample {highmaps} highcharts/plotoptions/series-negative-color/\n * Spline, area and column\n * @sample {highmaps} highcharts/plotoptions/arearange-negativecolor/\n * Arearange\n *\n * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}\n * @since 3.0\n * @apioption plotOptions.series.negativeColor\n */\n /**\n * Same as\n * [accessibility.series.descriptionFormatter](#accessibility.series.descriptionFormatter),\n * but for an individual series. Overrides the chart wide configuration.\n *\n * @type {Function}\n * @since 5.0.12\n * @apioption plotOptions.series.pointDescriptionFormatter\n */\n /**\n * If no x values are given for the points in a series, `pointInterval`\n * defines the interval of the x values. For example, if a series\n * contains one value every decade starting from year 0, set\n * `pointInterval` to `10`. In true `datetime` axes, the `pointInterval`\n * is set in milliseconds.\n *\n * It can be also be combined with `pointIntervalUnit` to draw irregular\n * time intervals.\n *\n * If combined with `relativeXValue`, an x value can be set on each\n * point, and the `pointInterval` is added x times to the `pointStart`\n * setting.\n *\n * Please note that this options applies to the _series data_, not the\n * interval of the axis ticks, which is independent.\n *\n * @sample {highcharts} highcharts/plotoptions/series-pointstart-datetime/\n * Datetime X axis\n * @sample {highcharts} highcharts/plotoptions/series-relativexvalue/\n * Relative x value\n * @sample {highstock} stock/plotoptions/pointinterval-pointstart/\n * Using pointStart and pointInterval\n * @sample {highstock} stock/plotoptions/relativexvalue/\n * Relative x value\n *\n * @type {number}\n * @default 1\n * @product highcharts highstock gantt\n * @apioption plotOptions.series.pointInterval\n */\n /**\n * On datetime series, this allows for setting the\n * [pointInterval](#plotOptions.series.pointInterval) to irregular time\n * units, `day`, `month` and `year`. A day is usually the same as 24\n * hours, but `pointIntervalUnit` also takes the DST crossover into\n * consideration when dealing with local time. Combine this option with\n * `pointInterval` to draw weeks, quarters, 6 months, 10 years etc.\n *\n * Please note that this options applies to the _series data_, not the\n * interval of the axis ticks, which is independent.\n *\n * @sample {highcharts} highcharts/plotoptions/series-pointintervalunit/\n * One point a month\n * @sample {highstock} highcharts/plotoptions/series-pointintervalunit/\n * One point a month\n *\n * @type {string}\n * @since 4.1.0\n * @product highcharts highstock gantt\n * @validvalue [\"day\", \"month\", \"year\"]\n * @apioption plotOptions.series.pointIntervalUnit\n */\n /**\n * Possible values: `\"on\"`, `\"between\"`, `number`.\n *\n * In a column chart, when pointPlacement is `\"on\"`, the point will not\n * create any padding of the X axis. In a polar column chart this means\n * that the first column points directly north. If the pointPlacement is\n * `\"between\"`, the columns will be laid out between ticks. This is\n * useful for example for visualising an amount between two points in\n * time or in a certain sector of a polar chart.\n *\n * Since Highcharts 3.0.2, the point placement can also be numeric,\n * where 0 is on the axis value, -0.5 is between this value and the\n * previous, and 0.5 is between this value and the next. Unlike the\n * textual options, numeric point placement options won't affect axis\n * padding.\n *\n * Note that pointPlacement needs a [pointRange](\n * #plotOptions.series.pointRange) to work. For column series this is\n * computed, but for line-type series it needs to be set.\n *\n * For the `xrange` series type and gantt charts, if the Y axis is a\n * category axis, the `pointPlacement` applies to the Y axis rather than\n * the (typically datetime) X axis.\n *\n * Defaults to `undefined` in cartesian charts, `\"between\"` in polar\n * charts.\n *\n * @see [xAxis.tickmarkPlacement](#xAxis.tickmarkPlacement)\n *\n * @sample {highcharts|highstock} highcharts/plotoptions/series-pointplacement-between/\n * Between in a column chart\n * @sample {highcharts|highstock} highcharts/plotoptions/series-pointplacement-numeric/\n * Numeric placement for custom layout\n * @sample {highcharts|highstock} maps/plotoptions/heatmap-pointplacement/\n * Placement in heatmap\n *\n * @type {string|number}\n * @since 2.3.0\n * @product highcharts highstock gantt\n * @apioption plotOptions.series.pointPlacement\n */\n /**\n * If no x values are given for the points in a series, pointStart\n * defines on what value to start. For example, if a series contains one\n * yearly value starting from 1945, set pointStart to 1945.\n *\n * If combined with `relativeXValue`, an x value can be set on each\n * point. The x value from the point options is multiplied by\n * `pointInterval` and added to `pointStart` to produce a modified x\n * value.\n *\n * @sample {highcharts} highcharts/plotoptions/series-pointstart-linear/\n * Linear\n * @sample {highcharts} highcharts/plotoptions/series-pointstart-datetime/\n * Datetime\n * @sample {highcharts} highcharts/plotoptions/series-relativexvalue/\n * Relative x value\n * @sample {highstock} stock/plotoptions/pointinterval-pointstart/\n * Using pointStart and pointInterval\n * @sample {highstock} stock/plotoptions/relativexvalue/\n * Relative x value\n *\n * @type {number}\n * @default 0\n * @product highcharts highstock gantt\n * @apioption plotOptions.series.pointStart\n */\n /**\n * When true, X values in the data set are relative to the current\n * `pointStart`, `pointInterval` and `pointIntervalUnit` settings. This\n * allows compression of the data for datasets with irregular X values.\n *\n * The real X values are computed on the formula `f(x) = ax + b`, where\n * `a` is the `pointInterval` (optionally with a time unit given by\n * `pointIntervalUnit`), and `b` is the `pointStart`.\n *\n * @sample {highcharts} highcharts/plotoptions/series-relativexvalue/\n * Relative X value\n * @sample {highstock} stock/plotoptions/relativexvalue/\n * Relative X value\n *\n * @type {boolean}\n * @default false\n * @product highcharts highstock\n * @apioption plotOptions.series.relativeXValue\n */\n /**\n * Whether to select the series initially. If `showCheckbox` is true,\n * the checkbox next to the series name in the legend will be checked\n * for a selected series.\n *\n * @sample {highcharts} highcharts/plotoptions/series-selected/\n * One out of two series selected\n *\n * @type {boolean}\n * @default false\n * @since 1.2.0\n * @apioption plotOptions.series.selected\n */\n /**\n * Whether to apply a drop shadow to the graph line. Since 2.3 the\n * shadow can be an object configuration containing `color`, `offsetX`,\n * `offsetY`, `opacity` and `width`.\n *\n * @sample {highcharts} highcharts/plotoptions/series-shadow/\n * Shadow enabled\n *\n * @type {boolean|Highcharts.ShadowOptionsObject}\n * @default false\n * @apioption plotOptions.series.shadow\n */\n /**\n * Whether to display this particular series or series type in the\n * legend. Standalone series are shown in legend by default, and linked\n * series are not. Since v7.2.0 it is possible to show series that use\n * colorAxis by setting this option to `true`.\n *\n * @sample {highcharts} highcharts/plotoptions/series-showinlegend/\n * One series in the legend, one hidden\n *\n * @type {boolean}\n * @apioption plotOptions.series.showInLegend\n */\n /**\n * Whether or not to show the series in the navigator. Takes precedence\n * over [navigator.baseSeries](#navigator.baseSeries) if defined.\n *\n * @type {boolean}\n * @since 5.0.0\n * @product highstock\n * @apioption plotOptions.series.showInNavigator\n */\n /**\n * If set to `true`, the accessibility module will skip past the points\n * in this series for keyboard navigation.\n *\n * @type {boolean}\n * @since 5.0.12\n * @apioption plotOptions.series.skipKeyboardNavigation\n */\n /**\n * Whether to stack the values of each series on top of each other.\n * Possible values are `undefined` to disable, `\"normal\"` to stack by\n * value or `\"percent\"`.\n *\n * When stacking is enabled, data must be sorted\n * in ascending X order.\n *\n * Some stacking options are related to specific series types. In the\n * streamgraph series type, the stacking option is set to `\"stream\"`.\n * The second one is `\"overlap\"`, which only applies to waterfall\n * series.\n *\n * @see [yAxis.reversedStacks](#yAxis.reversedStacks)\n *\n * @sample {highcharts} highcharts/plotoptions/series-stacking-line/\n * Line\n * @sample {highcharts} highcharts/plotoptions/series-stacking-column/\n * Column\n * @sample {highcharts} highcharts/plotoptions/series-stacking-bar/\n * Bar\n * @sample {highcharts} highcharts/plotoptions/series-stacking-area/\n * Area\n * @sample {highcharts} highcharts/plotoptions/series-stacking-percent-line/\n * Line\n * @sample {highcharts} highcharts/plotoptions/series-stacking-percent-column/\n * Column\n * @sample {highcharts} highcharts/plotoptions/series-stacking-percent-bar/\n * Bar\n * @sample {highcharts} highcharts/plotoptions/series-stacking-percent-area/\n * Area\n * @sample {highcharts} highcharts/plotoptions/series-waterfall-with-normal-stacking\n * Waterfall with normal stacking\n * @sample {highcharts} highcharts/plotoptions/series-waterfall-with-overlap-stacking\n * Waterfall with overlap stacking\n * @sample {highstock} stock/plotoptions/stacking/\n * Area\n *\n * @type {string}\n * @product highcharts highstock\n * @validvalue [\"normal\", \"overlap\", \"percent\", \"stream\"]\n * @apioption plotOptions.series.stacking\n */\n /**\n * Whether to apply steps to the line. Possible values are `left`,\n * `center` and `right`.\n *\n * @sample {highcharts} highcharts/plotoptions/line-step/\n * Different step line options\n * @sample {highcharts} highcharts/plotoptions/area-step/\n * Stepped, stacked area\n * @sample {highstock} stock/plotoptions/line-step/\n * Step line\n *\n * @type {string}\n * @since 1.2.5\n * @product highcharts highstock\n * @validvalue [\"left\", \"center\", \"right\"]\n * @apioption plotOptions.series.step\n */\n /**\n * The threshold, also called zero level or base level. For line type\n * series this is only used in conjunction with\n * [negativeColor](#plotOptions.series.negativeColor).\n *\n * @see [softThreshold](#plotOptions.series.softThreshold).\n *\n * @type {number|null}\n * @default 0\n * @since 3.0\n * @product highcharts highstock\n * @apioption plotOptions.series.threshold\n */\n /**\n * Set the initial visibility of the series.\n *\n * @sample {highcharts} highcharts/plotoptions/series-visible/\n * Two series, one hidden and one visible\n * @sample {highstock} stock/plotoptions/series-visibility/\n * Hidden series\n *\n * @type {boolean}\n * @default true\n * @apioption plotOptions.series.visible\n */\n /**\n * Defines the Axis on which the zones are applied.\n *\n * @see [zones](#plotOptions.series.zones)\n *\n * @sample {highcharts} highcharts/series/color-zones-zoneaxis-x/\n * Zones on the X-Axis\n * @sample {highstock} highcharts/series/color-zones-zoneaxis-x/\n * Zones on the X-Axis\n *\n * @type {string}\n * @default y\n * @since 4.1.0\n * @product highcharts highstock\n * @apioption plotOptions.series.zoneAxis\n */\n /**\n * General event handlers for the series items. These event hooks can\n * also be attached to the series at run time using the\n * `Highcharts.addEvent` function.\n *\n * @declare Highcharts.SeriesEventsOptionsObject\n *\n * @private\n */\n events: {},\n /**\n * Fires after the series has finished its initial animation, or in case\n * animation is disabled, immediately as the series is displayed.\n *\n * @sample {highcharts} highcharts/plotoptions/series-events-afteranimate/\n * Show label after animate\n * @sample {highstock} highcharts/plotoptions/series-events-afteranimate/\n * Show label after animate\n *\n * @type {Highcharts.SeriesAfterAnimateCallbackFunction}\n * @since 4.0\n * @product highcharts highstock gantt\n * @context Highcharts.Series\n * @apioption plotOptions.series.events.afterAnimate\n */\n /**\n * Fires when the checkbox next to the series' name in the legend is\n * clicked. One parameter, `event`, is passed to the function. The state\n * of the checkbox is found by `event.checked`. The checked item is\n * found by `event.item`. Return `false` to prevent the default action\n * which is to toggle the select state of the series.\n *\n * @sample {highcharts} highcharts/plotoptions/series-events-checkboxclick/\n * Alert checkbox status\n *\n * @type {Highcharts.SeriesCheckboxClickCallbackFunction}\n * @since 1.2.0\n * @context Highcharts.Series\n * @apioption plotOptions.series.events.checkboxClick\n */\n /**\n * Fires when the series is clicked. One parameter, `event`, is passed\n * to the function, containing common event information. Additionally,\n * `event.point` holds a pointer to the nearest point on the graph.\n *\n * @sample {highcharts} highcharts/plotoptions/series-events-click/\n * Alert click info\n * @sample {highstock} stock/plotoptions/series-events-click/\n * Alert click info\n * @sample {highmaps} maps/plotoptions/series-events-click/\n * Display click info in subtitle\n *\n * @type {Highcharts.SeriesClickCallbackFunction}\n * @context Highcharts.Series\n * @apioption plotOptions.series.events.click\n */\n /**\n * Fires when the series is hidden after chart generation time, either\n * by clicking the legend item or by calling `.hide()`.\n *\n * @sample {highcharts} highcharts/plotoptions/series-events-hide/\n * Alert when the series is hidden by clicking the legend item\n *\n * @type {Highcharts.SeriesHideCallbackFunction}\n * @since 1.2.0\n * @context Highcharts.Series\n * @apioption plotOptions.series.events.hide\n */\n /**\n * Fires when the legend item belonging to the series is clicked. One\n * parameter, `event`, is passed to the function. The default action\n * is to toggle the visibility of the series. This can be prevented\n * by returning `false` or calling `event.preventDefault()`.\n *\n * @sample {highcharts} highcharts/plotoptions/series-events-legenditemclick/\n * Confirm hiding and showing\n *\n * @type {Highcharts.SeriesLegendItemClickCallbackFunction}\n * @context Highcharts.Series\n * @apioption plotOptions.series.events.legendItemClick\n */\n /**\n * Fires when the mouse leaves the graph. One parameter, `event`, is\n * passed to the function, containing common event information. If the\n * [stickyTracking](#plotOptions.series) option is true, `mouseOut`\n * doesn't happen before the mouse enters another graph or leaves the\n * plot area.\n *\n * @sample {highcharts} highcharts/plotoptions/series-events-mouseover-sticky/\n * With sticky tracking by default\n * @sample {highcharts} highcharts/plotoptions/series-events-mouseover-no-sticky/\n * Without sticky tracking\n *\n * @type {Highcharts.SeriesMouseOutCallbackFunction}\n * @context Highcharts.Series\n * @apioption plotOptions.series.events.mouseOut\n */\n /**\n * Fires when the mouse enters the graph. One parameter, `event`, is\n * passed to the function, containing common event information.\n *\n * @sample {highcharts} highcharts/plotoptions/series-events-mouseover-sticky/\n * With sticky tracking by default\n * @sample {highcharts} highcharts/plotoptions/series-events-mouseover-no-sticky/\n * Without sticky tracking\n *\n * @type {Highcharts.SeriesMouseOverCallbackFunction}\n * @context Highcharts.Series\n * @apioption plotOptions.series.events.mouseOver\n */\n /**\n * Fires when the series is shown after chart generation time, either\n * by clicking the legend item or by calling `.show()`.\n *\n * @sample {highcharts} highcharts/plotoptions/series-events-show/\n * Alert when the series is shown by clicking the legend item.\n *\n * @type {Highcharts.SeriesShowCallbackFunction}\n * @since 1.2.0\n * @context Highcharts.Series\n * @apioption plotOptions.series.events.show\n */\n /**\n * Options for the point markers of line and scatter-like series. Properties\n * like `fillColor`, `lineColor` and `lineWidth` define the visual\n * appearance of the markers. The `symbol` option defines the shape. Other\n * series types, like column series, don't have markers, but have visual\n * options on the series level instead.\n *\n * In styled mode, the markers can be styled with the `.highcharts-point`,\n * `.highcharts-point-hover` and `.highcharts-point-select` class names.\n *\n * @declare Highcharts.PointMarkerOptionsObject\n *\n * @sample {highmaps} maps/demo/mappoint-mapmarker\n * Using the mapmarker symbol for points\n *\n * @private\n */\n marker: {\n /**\n * Enable or disable the point marker. If `undefined`, the markers\n * are hidden when the data is dense, and shown for more widespread\n * data points.\n *\n * @sample {highcharts} highcharts/plotoptions/series-marker-enabled/\n * Disabled markers\n * @sample {highcharts} highcharts/plotoptions/series-marker-enabled-false/\n * Disabled in normal state but enabled on hover\n * @sample {highstock} stock/plotoptions/series-marker/\n * Enabled markers\n *\n * @type {boolean}\n * @default {highcharts} undefined\n * @default {highstock} false\n * @apioption plotOptions.series.marker.enabled\n */\n /**\n * The threshold for how dense the point markers should be before\n * they are hidden, given that `enabled` is not defined. The number\n * indicates the horizontal distance between the two closest points\n * in the series, as multiples of the `marker.radius`. In other\n * words, the default value of 2 means points are hidden if\n * overlapping horizontally.\n *\n * @sample highcharts/plotoptions/series-marker-enabledthreshold\n * A higher threshold\n *\n * @since 6.0.5\n */\n enabledThreshold: 2,\n /**\n * The fill color of the point marker. When `undefined`, the series'\n * or point's color is used.\n *\n * @sample {highcharts} highcharts/plotoptions/series-marker-fillcolor/\n * White fill\n *\n * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}\n * @apioption plotOptions.series.marker.fillColor\n */\n /**\n * Image markers only. Set the image width explicitly. When using\n * this option, a `width` must also be set.\n *\n * @sample {highcharts} highcharts/plotoptions/series-marker-width-height/\n * Fixed width and height\n * @sample {highstock} highcharts/plotoptions/series-marker-width-height/\n * Fixed width and height\n *\n * @type {number}\n * @since 4.0.4\n * @apioption plotOptions.series.marker.height\n */\n /**\n * The color of the point marker's outline. When `undefined`, the\n * series' or point's color is used.\n *\n * @sample {highcharts} highcharts/plotoptions/series-marker-fillcolor/\n * Inherit from series color (undefined)\n *\n * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}\n */\n lineColor: \"#ffffff\" /* Palette.backgroundColor */,\n /**\n * The width of the point marker's outline.\n *\n * @sample {highcharts} highcharts/plotoptions/series-marker-fillcolor/\n * 2px blue marker\n */\n lineWidth: 0,\n /**\n * The radius of the point marker.\n *\n * @sample {highcharts} highcharts/plotoptions/series-marker-radius/\n * Bigger markers\n *\n * @default {highstock} 2\n * @default {highcharts} 4\n *\n */\n radius: 4,\n /**\n * A predefined shape or symbol for the marker. When undefined, the\n * symbol is pulled from options.symbols. Other possible values are\n * `'circle'`, `'square'`,`'diamond'`, `'triangle'` and\n * `'triangle-down'`.\n *\n * Additionally, the URL to a graphic can be given on this form:\n * `'url(graphic.png)'`. Note that for the image to be applied to\n * exported charts, its URL needs to be accessible by the export\n * server.\n *\n * Custom callbacks for symbol path generation can also be added to\n * `Highcharts.SVGRenderer.prototype.symbols`. The callback is then\n * used by its method name, as shown in the demo.\n *\n * @sample {highcharts} highcharts/plotoptions/series-marker-symbol/\n * Predefined, graphic and custom markers\n * @sample {highstock} highcharts/plotoptions/series-marker-symbol/\n * Predefined, graphic and custom markers\n * @sample {highmaps} maps/demo/mappoint-mapmarker\n * Using the mapmarker symbol for points\n *\n * @type {string}\n * @apioption plotOptions.series.marker.symbol\n */\n /**\n * Image markers only. Set the image width explicitly. When using\n * this option, a `height` must also be set.\n *\n * @sample {highcharts} highcharts/plotoptions/series-marker-width-height/\n * Fixed width and height\n * @sample {highstock} highcharts/plotoptions/series-marker-width-height/\n * Fixed width and height\n *\n * @type {number}\n * @since 4.0.4\n * @apioption plotOptions.series.marker.width\n */\n /**\n * States for a single point marker.\n *\n * @declare Highcharts.PointStatesOptionsObject\n */\n states: {\n /**\n * The normal state of a single point marker. Currently only\n * used for setting animation when returning to normal state\n * from hover.\n *\n * @declare Highcharts.PointStatesNormalOptionsObject\n */\n normal: {\n /**\n * Animation when returning to normal state after hovering.\n *\n * @type {boolean|Partial}\n */\n animation: true\n },\n /**\n * The hover state for a single point marker.\n *\n * @declare Highcharts.PointStatesHoverOptionsObject\n */\n hover: {\n /**\n * Animation when hovering over the marker.\n *\n * @type {boolean|Partial}\n */\n animation: {\n /** @internal */\n duration: 50\n },\n /**\n * Enable or disable the point marker.\n *\n * @sample {highcharts} highcharts/plotoptions/series-marker-states-hover-enabled/\n * Disabled hover state\n */\n enabled: true,\n /**\n * The fill color of the marker in hover state. When\n * `undefined`, the series' or point's fillColor for normal\n * state is used.\n *\n * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}\n * @apioption plotOptions.series.marker.states.hover.fillColor\n */\n /**\n * The color of the point marker's outline. When\n * `undefined`, the series' or point's lineColor for normal\n * state is used.\n *\n * @sample {highcharts} highcharts/plotoptions/series-marker-states-hover-linecolor/\n * White fill color, black line color\n *\n * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}\n * @apioption plotOptions.series.marker.states.hover.lineColor\n */\n /**\n * The width of the point marker's outline. When\n * `undefined`, the series' or point's lineWidth for normal\n * state is used.\n *\n * @sample {highcharts} highcharts/plotoptions/series-marker-states-hover-linewidth/\n * 3px line width\n *\n * @type {number}\n * @apioption plotOptions.series.marker.states.hover.lineWidth\n */\n /**\n * The radius of the point marker. In hover state, it\n * defaults to the normal state's radius + 2 as per the\n * [radiusPlus](#plotOptions.series.marker.states.hover.radiusPlus)\n * option.\n *\n * @sample {highcharts} highcharts/plotoptions/series-marker-states-hover-radius/\n * 10px radius\n *\n * @type {number}\n * @apioption plotOptions.series.marker.states.hover.radius\n */\n /**\n * The number of pixels to increase the radius of the\n * hovered point.\n *\n * @sample {highcharts} highcharts/plotoptions/series-states-hover-linewidthplus/\n * 5 pixels greater radius on hover\n * @sample {highstock} highcharts/plotoptions/series-states-hover-linewidthplus/\n * 5 pixels greater radius on hover\n *\n * @since 4.0.3\n */\n radiusPlus: 2,\n /**\n * The additional line width for a hovered point.\n *\n * @sample {highcharts} highcharts/plotoptions/series-states-hover-linewidthplus/\n * 2 pixels wider on hover\n * @sample {highstock} highcharts/plotoptions/series-states-hover-linewidthplus/\n * 2 pixels wider on hover\n *\n * @since 4.0.3\n */\n lineWidthPlus: 1\n },\n /**\n * The appearance of the point marker when selected. In order to\n * allow a point to be selected, set the\n * `series.allowPointSelect` option to true.\n *\n * @declare Highcharts.PointStatesSelectOptionsObject\n */\n select: {\n /**\n * Enable or disable visible feedback for selection.\n *\n * @sample {highcharts} highcharts/plotoptions/series-marker-states-select-enabled/\n * Disabled select state\n *\n * @type {boolean}\n * @default true\n * @apioption plotOptions.series.marker.states.select.enabled\n */\n /**\n * The radius of the point marker. In hover state, it\n * defaults to the normal state's radius + 2.\n *\n * @sample {highcharts} highcharts/plotoptions/series-marker-states-select-radius/\n * 10px radius for selected points\n *\n * @type {number}\n * @apioption plotOptions.series.marker.states.select.radius\n */\n /**\n * The fill color of the point marker.\n *\n * @sample {highcharts} highcharts/plotoptions/series-marker-states-select-fillcolor/\n * Solid red discs for selected points\n *\n * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}\n */\n fillColor: \"#cccccc\" /* Palette.neutralColor20 */,\n /**\n * The color of the point marker's outline. When\n * `undefined`, the series' or point's color is used.\n *\n * @sample {highcharts} highcharts/plotoptions/series-marker-states-select-linecolor/\n * Red line color for selected points\n *\n * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}\n */\n lineColor: \"#000000\" /* Palette.neutralColor100 */,\n /**\n * The width of the point marker's outline.\n *\n * @sample {highcharts} highcharts/plotoptions/series-marker-states-select-linewidth/\n * 3px line width for selected points\n */\n lineWidth: 2\n }\n }\n },\n /**\n * Properties for each single point.\n *\n * @declare Highcharts.PlotSeriesPointOptions\n *\n * @private\n */\n point: {\n /**\n * Fires when a point is clicked. One parameter, `event`, is passed\n * to the function, containing common event information.\n *\n * If the `series.allowPointSelect` option is true, the default\n * action for the point's click event is to toggle the point's\n * select state. Returning `false` cancels this action.\n *\n * @sample {highcharts} highcharts/plotoptions/series-point-events-click/\n * Click marker to alert values\n * @sample {highcharts} highcharts/plotoptions/series-point-events-click-column/\n * Click column\n * @sample {highcharts} highcharts/plotoptions/series-point-events-click-url/\n * Go to URL\n * @sample {highmaps} maps/plotoptions/series-point-events-click/\n * Click marker to display values\n * @sample {highmaps} maps/plotoptions/series-point-events-click-url/\n * Go to URL\n *\n * @type {Highcharts.PointClickCallbackFunction}\n * @context Highcharts.Point\n * @apioption plotOptions.series.point.events.click\n */\n /**\n * Fires when the mouse leaves the area close to the point. One\n * parameter, `event`, is passed to the function, containing common\n * event information.\n *\n * @sample {highcharts} highcharts/plotoptions/series-point-events-mouseover/\n * Show values in the chart's corner on mouse over\n *\n * @type {Highcharts.PointMouseOutCallbackFunction}\n * @context Highcharts.Point\n * @apioption plotOptions.series.point.events.mouseOut\n */\n /**\n * Fires when the mouse enters the area close to the point. One\n * parameter, `event`, is passed to the function, containing common\n * event information.\n *\n * Returning `false` cancels the default behavior, which is to show a\n * tooltip for the point.\n *\n * @sample {highcharts} highcharts/plotoptions/series-point-events-mouseover/\n * Show values in the chart's corner on mouse over\n *\n * @type {Highcharts.PointMouseOverCallbackFunction}\n * @context Highcharts.Point\n * @apioption plotOptions.series.point.events.mouseOver\n */\n /**\n * Fires when the point is removed using the `.remove()` method. One\n * parameter, `event`, is passed to the function. Returning `false`\n * cancels the operation.\n *\n * @sample {highcharts} highcharts/plotoptions/series-point-events-remove/\n * Remove point and confirm\n *\n * @type {Highcharts.PointRemoveCallbackFunction}\n * @since 1.2.0\n * @context Highcharts.Point\n * @apioption plotOptions.series.point.events.remove\n */\n /**\n * Fires when the point is selected either programmatically or\n * following a click on the point. One parameter, `event`, is passed\n * to the function. Returning `false` cancels the operation.\n *\n * @sample {highcharts} highcharts/plotoptions/series-point-events-select/\n * Report the last selected point\n * @sample {highmaps} maps/plotoptions/series-allowpointselect/\n * Report select and unselect\n *\n * @type {Highcharts.PointSelectCallbackFunction}\n * @since 1.2.0\n * @context Highcharts.Point\n * @apioption plotOptions.series.point.events.select\n */\n /**\n * Fires when the point is unselected either programmatically or\n * following a click on the point. One parameter, `event`, is passed\n * to the function.\n * Returning `false` cancels the operation.\n *\n * @sample {highcharts} highcharts/plotoptions/series-point-events-unselect/\n * Report the last unselected point\n * @sample {highmaps} maps/plotoptions/series-allowpointselect/\n * Report select and unselect\n *\n * @type {Highcharts.PointUnselectCallbackFunction}\n * @since 1.2.0\n * @context Highcharts.Point\n * @apioption plotOptions.series.point.events.unselect\n */\n /**\n * Fires when the point is updated programmatically through the\n * `.update()` method. One parameter, `event`, is passed to the\n * function. The new point options can be accessed through\n * `event.options`. Returning `false` cancels the operation.\n *\n * @sample {highcharts} highcharts/plotoptions/series-point-events-update/\n * Confirm point updating\n *\n * @type {Highcharts.PointUpdateCallbackFunction}\n * @since 1.2.0\n * @context Highcharts.Point\n * @apioption plotOptions.series.point.events.update\n */\n /**\n * Events for each single point.\n *\n * @declare Highcharts.PointEventsOptionsObject\n */\n events: {}\n },\n /**\n * Options for the series data labels, appearing next to each data\n * point.\n *\n * Since v6.2.0, multiple data labels can be applied to each single\n * point by defining them as an array of configs.\n *\n * In styled mode, the data labels can be styled with the\n * `.highcharts-data-label-box` and `.highcharts-data-label` class names\n * ([see example](https://www.highcharts.com/samples/highcharts/css/series-datalabels)).\n *\n * @sample {highcharts} highcharts/plotoptions/series-datalabels-enabled\n * Data labels enabled\n * @sample {highcharts} highcharts/plotoptions/series-datalabels-multiple\n * Multiple data labels on a bar series\n * @sample {highcharts} highcharts/css/series-datalabels\n * Styled mode example\n * @sample {highmaps} maps/demo/color-axis\n * Choropleth map with data labels\n * @sample {highmaps} maps/demo/mappoint-datalabels-mapmarker\n * Using data labels as map markers\n *\n * @type {*|Array<*>}\n * @product highcharts highstock highmaps gantt\n *\n * @private\n */\n dataLabels: {\n /**\n * Enable or disable the initial animation when a series is displayed\n * for the `dataLabels`. The animation can also be set as a\n * configuration object. Please note that this option only applies to\n * the initial animation.\n *\n * For other animations, see [chart.animation](#chart.animation) and the\n * animation parameter under the API methods. The following properties\n * are supported:\n *\n * - `defer`: The animation delay time in milliseconds.\n *\n * @sample {highcharts} highcharts/plotoptions/animation-defer/\n * Animation defer settings\n *\n * @type {boolean|Partial}\n * @since 8.2.0\n * @apioption plotOptions.series.dataLabels.animation\n */\n animation: {},\n /**\n * The animation delay time in milliseconds. Set to `0` to render the\n * data labels immediately. As `undefined` inherits defer time from the\n * [series.animation.defer](#plotOptions.series.animation.defer).\n *\n * @type {number}\n * @since 8.2.0\n * @apioption plotOptions.series.dataLabels.animation.defer\n */\n /**\n * The alignment of the data label compared to the point. If `right`,\n * the right side of the label should be touching the point. For points\n * with an extent, like columns, the alignments also dictates how to\n * align it inside the box, as given with the\n * [inside](#plotOptions.column.dataLabels.inside) option. Can be one of\n * `left`, `center` or `right`.\n *\n * @sample {highcharts}\n * highcharts/plotoptions/series-datalabels-align-left/ Left\n * aligned\n * @sample {highcharts}\n * highcharts/plotoptions/bar-datalabels-align-inside-bar/ Data\n * labels inside the bar\n *\n * @type {Highcharts.AlignValue|null}\n */\n align: 'center',\n /**\n * Whether to allow data labels to overlap. To make the labels less\n * sensitive for overlapping, the\n * [dataLabels.padding](#plotOptions.series.dataLabels.padding)\n * can be set to 0.\n *\n * @sample {highcharts} highcharts/plotoptions/series-datalabels-allowoverlap-false/\n * Don't allow overlap\n *\n * @type {boolean}\n * @default false\n * @since 4.1.0\n * @apioption plotOptions.series.dataLabels.allowOverlap\n */\n /**\n * The background color or gradient for the data label. Setting it to\n * `auto` will use the point's color.\n *\n * @sample {highcharts} highcharts/plotoptions/series-datalabels-box/\n * Data labels box options\n * @sample {highmaps} maps/plotoptions/series-datalabels-box/\n * Data labels box options\n * @sample {highmaps} maps/demo/mappoint-datalabels-mapmarker\n * Data labels as map markers\n *\n * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}\n * @since 2.2.1\n * @apioption plotOptions.series.dataLabels.backgroundColor\n */\n /**\n * The border color for the data label. Setting it to `auto` will use\n * the point's color. Defaults to `undefined`.\n *\n * @sample {highcharts} highcharts/plotoptions/series-datalabels-box/\n * Data labels box options\n *\n * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}\n * @since 2.2.1\n * @apioption plotOptions.series.dataLabels.borderColor\n */\n /**\n * The border radius in pixels for the data label.\n *\n * @sample {highcharts} highcharts/plotoptions/series-datalabels-box/\n * Data labels box options\n * @sample {highmaps} maps/plotoptions/series-datalabels-box/\n * Data labels box options\n *\n * @type {number}\n * @default 0\n * @since 2.2.1\n * @apioption plotOptions.series.dataLabels.borderRadius\n */\n /**\n * The border width in pixels for the data label.\n *\n * @sample {highcharts} highcharts/plotoptions/series-datalabels-box/\n * Data labels box options\n *\n * @type {number}\n * @default 0\n * @since 2.2.1\n * @apioption plotOptions.series.dataLabels.borderWidth\n */\n borderWidth: 0,\n /**\n * A class name for the data label. Particularly in styled mode,\n * this can be used to give each series' or point's data label\n * unique styling. In addition to this option, a default color class\n * name is added so that we can give the labels a contrast text\n * shadow.\n *\n * @sample {highcharts} highcharts/css/data-label-contrast/\n * Contrast text shadow\n * @sample {highcharts} highcharts/css/series-datalabels/\n * Styling by CSS\n *\n * @type {string}\n * @since 5.0.0\n * @apioption plotOptions.series.dataLabels.className\n */\n /**\n * This options is deprecated.\n * Use [style.color](#plotOptions.series.dataLabels.style) instead.\n *\n * The text color for the data labels. Defaults to `undefined`. For\n * certain series types, like column or map, the data labels can be\n * drawn inside the points. In this case the data label will be\n * drawn with maximum contrast by default. Additionally, it will be\n * given a `text-outline` style with the opposite color, to further\n * increase the contrast. This can be overridden by setting the\n * `text-outline` style to `none` in the `dataLabels.style` option.\n *\n * @sample {highcharts} highcharts/plotoptions/series-datalabels-color/\n * Red data labels\n * @sample {highmaps} maps/demo/color-axis/\n * White data labels\n *\n * @see [style.color](#plotOptions.series.dataLabels.style)\n *\n * @type {Highcharts.ColorType}\n * @deprecated 10.3\n * @apioption plotOptions.series.dataLabels.color\n */\n /**\n * Whether to hide data labels that are outside the plot area. By\n * default, the data label is moved inside the plot area according\n * to the\n * [overflow](#plotOptions.series.dataLabels.overflow)\n * option.\n *\n * @type {boolean}\n * @default true\n * @since 2.3.3\n * @apioption plotOptions.series.dataLabels.crop\n */\n /**\n * Whether to defer displaying the data labels until the initial\n * series animation has finished. Setting to `false` renders the\n * data label immediately. If set to `true` inherits the defer\n * time set in [plotOptions.series.animation](#plotOptions.series.animation).\n * If set to a number, a defer time is specified in milliseconds.\n *\n * @sample highcharts/plotoptions/animation-defer\n * Set defer time\n *\n * @since 4.0.0\n * @type {boolean|number}\n * @product highcharts highstock gantt\n */\n defer: true,\n /**\n * Enable or disable the data labels.\n *\n * @sample {highcharts} highcharts/plotoptions/series-datalabels-enabled/\n * Data labels enabled\n * @sample {highmaps} maps/demo/color-axis/\n * Data labels enabled\n *\n * @type {boolean}\n * @default false\n * @apioption plotOptions.series.dataLabels.enabled\n */\n /**\n * A declarative filter to control of which data labels to display.\n * The declarative filter is designed for use when callback\n * functions are not available, like when the chart options require\n * a pure JSON structure or for use with graphical editors. For\n * programmatic control, use the `formatter` instead, and return\n * `undefined` to disable a single data label.\n *\n * @example\n * filter: {\n * property: 'percentage',\n * operator: '>',\n * value: 4\n * }\n *\n * @sample {highcharts} highcharts/demo/pie-monochrome\n * Data labels filtered by percentage\n *\n * @declare Highcharts.DataLabelsFilterOptionsObject\n * @since 6.0.3\n * @apioption plotOptions.series.dataLabels.filter\n */\n /**\n * The operator to compare by. Can be one of `>`, `<`, `>=`, `<=`,\n * `==`, and `===`.\n *\n * @type {string}\n * @validvalue [\">\", \"<\", \">=\", \"<=\", \"==\", \"===\"]\n * @apioption plotOptions.series.dataLabels.filter.operator\n */\n /**\n * The point property to filter by. Point options are passed\n * directly to properties, additionally there are `y` value,\n * `percentage` and others listed under {@link Highcharts.Point}\n * members.\n *\n * @type {string}\n * @apioption plotOptions.series.dataLabels.filter.property\n */\n /**\n * The value to compare against.\n *\n * @type {number}\n * @apioption plotOptions.series.dataLabels.filter.value\n */\n /**\n * A\n * [format string](https://www.highcharts.com/docs/chart-concepts/labels-and-string-formatting)\n * for the data label. Available variables are the same as for\n * `formatter`.\n *\n * @sample {highcharts} highcharts/plotoptions/series-datalabels-format/\n * Add a unit\n * @sample {highmaps} maps/plotoptions/series-datalabels-format/\n * Formatted value in the data label\n *\n * @type {string}\n * @default y\n * @default point.value\n * @since 3.0\n * @apioption plotOptions.series.dataLabels.format\n */\n // eslint-disable-next-line valid-jsdoc\n /**\n * Callback JavaScript function to format the data label. Note that if a\n * `format` is defined, the format takes precedence and the formatter is\n * ignored.\n *\n * @sample {highmaps} maps/plotoptions/series-datalabels-format/\n * Formatted value\n *\n * @type {Highcharts.DataLabelsFormatterCallbackFunction}\n */\n formatter: function () {\n var numberFormatter = this.series.chart.numberFormatter;\n return typeof this.y !== 'number' ?\n '' : numberFormatter(this.y, -1);\n },\n /**\n * For points with an extent, like columns or map areas, whether to\n * align the data label inside the box or to the actual value point.\n * Defaults to `false` in most cases, `true` in stacked columns.\n *\n * @type {boolean}\n * @since 3.0\n * @apioption plotOptions.series.dataLabels.inside\n */\n /**\n * Format for points with the value of null. Works analogously to\n * [format](#plotOptions.series.dataLabels.format). `nullFormat` can\n * be applied only to series which support displaying null points\n * i.e `heatmap` or `tilemap`. Does not work with series that don't\n * display null points, like `line`, `column`, `bar` or `pie`.\n *\n * @sample {highcharts} highcharts/plotoptions/series-datalabels-nullformat/\n * Format data label for null points in heat map\n *\n * @type {boolean|string}\n * @since 7.1.0\n * @apioption plotOptions.series.dataLabels.nullFormat\n */\n /**\n * Callback JavaScript function that defines formatting for points\n * with the value of null. Works analogously to\n * [formatter](#plotOptions.series.dataLabels.formatter).\n * `nullFormatter` can be applied only to series which support\n * displaying null points i.e `heatmap` or `tilemap`. Does not work\n * with series that don't display null points, like `line`, `column`,\n * `bar` or `pie`.\n *\n * @sample {highcharts} highcharts/plotoptions/series-datalabels-nullformat/\n * Format data label for null points in heat map\n *\n * @type {Highcharts.DataLabelsFormatterCallbackFunction}\n * @since 7.1.0\n * @apioption plotOptions.series.dataLabels.nullFormatter\n */\n /**\n * How to handle data labels that flow outside the plot area. The\n * default is `\"justify\"`, which aligns them inside the plot area.\n * For columns and bars, this means it will be moved inside the bar.\n * To display data labels outside the plot area, set `crop` to\n * `false` and `overflow` to `\"allow\"`.\n *\n * @type {Highcharts.DataLabelsOverflowValue}\n * @default justify\n * @since 3.0.6\n * @apioption plotOptions.series.dataLabels.overflow\n */\n /**\n * When either the `borderWidth` or the `backgroundColor` is set,\n * this is the padding within the box.\n *\n * @sample {highcharts} highcharts/plotoptions/series-datalabels-box/\n * Data labels box options\n * @sample {highmaps} maps/plotoptions/series-datalabels-box/\n * Data labels box options\n *\n * @since 2.2.1\n */\n padding: 5,\n /**\n * Aligns data labels relative to points. If `center` alignment is\n * not possible, it defaults to `right`.\n *\n * @type {Highcharts.AlignValue}\n * @default center\n * @apioption plotOptions.series.dataLabels.position\n */\n /**\n * Text rotation in degrees. Note that due to a more complex\n * structure, backgrounds, borders and padding will be lost on a\n * rotated data label.\n *\n * @sample {highcharts} highcharts/plotoptions/series-datalabels-rotation/\n * Vertical labels\n *\n * @type {number}\n * @default 0\n * @apioption plotOptions.series.dataLabels.rotation\n */\n /**\n * The shadow of the box. Works best with `borderWidth` or\n * `backgroundColor`. Since 2.3 the shadow can be an object\n * configuration containing `color`, `offsetX`, `offsetY`, `opacity`\n * and `width`.\n *\n * @sample {highcharts} highcharts/plotoptions/series-datalabels-box/\n * Data labels box options\n *\n * @type {boolean|Highcharts.ShadowOptionsObject}\n * @default false\n * @since 2.2.1\n * @apioption plotOptions.series.dataLabels.shadow\n */\n /**\n * The name of a symbol to use for the border around the label.\n * Symbols are predefined functions on the Renderer object.\n *\n * @sample {highcharts} highcharts/plotoptions/series-datalabels-shape/\n * A callout for annotations\n *\n * @type {string}\n * @default square\n * @since 4.1.2\n * @apioption plotOptions.series.dataLabels.shape\n */\n /**\n * Styles for the label. The default `color` setting is\n * `\"contrast\"`, which is a pseudo color that Highcharts picks up\n * and applies the maximum contrast to the underlying point item,\n * for example the bar in a bar chart.\n *\n * The `textOutline` is a pseudo property that applies an outline of\n * the given width with the given color, which by default is the\n * maximum contrast to the text. So a bright text color will result\n * in a black text outline for maximum readability on a mixed\n * background. In some cases, especially with grayscale text, the\n * text outline doesn't work well, in which cases it can be disabled\n * by setting it to `\"none\"`. When `useHTML` is true, the\n * `textOutline` will not be picked up. In this, case, the same\n * effect can be acheived through the `text-shadow` CSS property.\n *\n * For some series types, where each point has an extent, like for\n * example tree maps, the data label may overflow the point. There\n * are two strategies for handling overflow. By default, the text\n * will wrap to multiple lines. The other strategy is to set\n * `style.textOverflow` to `ellipsis`, which will keep the text on\n * one line plus it will break inside long words.\n *\n * @sample {highcharts} highcharts/plotoptions/series-datalabels-style/\n * Bold labels\n * @sample {highcharts} highcharts/plotoptions/pie-datalabels-overflow/\n * Long labels truncated with an ellipsis in a pie\n * @sample {highcharts} highcharts/plotoptions/pie-datalabels-overflow-wrap/\n * Long labels are wrapped in a pie\n * @sample {highmaps} maps/demo/color-axis/\n * Bold labels\n *\n * @type {Highcharts.CSSObject}\n * @since 4.1.0\n * @apioption plotOptions.series.dataLabels.style\n */\n style: {\n /** @internal */\n fontSize: '11px',\n /** @internal */\n fontWeight: 'bold',\n /** @internal */\n color: 'contrast',\n /** @internal */\n textOutline: '1px contrast'\n },\n /**\n * Options for a label text which should follow marker's shape.\n * Border and background are disabled for a label that follows a\n * path.\n *\n * **Note:** Only SVG-based renderer supports this option. Setting\n * `useHTML` to true will disable this option.\n *\n * @declare Highcharts.DataLabelsTextPathOptionsObject\n * @since 7.1.0\n * @apioption plotOptions.series.dataLabels.textPath\n */\n /**\n * Presentation attributes for the text path.\n *\n * @type {Highcharts.SVGAttributes}\n * @since 7.1.0\n * @apioption plotOptions.series.dataLabels.textPath.attributes\n */\n /**\n * Enable or disable `textPath` option for link's or marker's data\n * labels.\n *\n * @type {boolean}\n * @since 7.1.0\n * @apioption plotOptions.series.dataLabels.textPath.enabled\n */\n /**\n * Whether to\n * [use HTML](https://www.highcharts.com/docs/chart-concepts/labels-and-string-formatting#html)\n * to render the labels.\n *\n * @type {boolean}\n * @default false\n * @apioption plotOptions.series.dataLabels.useHTML\n */\n /**\n * The vertical alignment of a data label. Can be one of `top`,\n * `middle` or `bottom`. The default value depends on the data, for\n * instance in a column chart, the label is above positive values\n * and below negative values.\n *\n * @type {Highcharts.VerticalAlignValue|null}\n * @since 2.3.3\n */\n verticalAlign: 'bottom',\n /**\n * The x position offset of the label relative to the point in\n * pixels.\n *\n * @sample {highcharts} highcharts/plotoptions/series-datalabels-rotation/\n * Vertical and positioned\n * @sample {highcharts} highcharts/plotoptions/bar-datalabels-align-inside-bar/\n * Data labels inside the bar\n */\n x: 0,\n /**\n * The z index of the data labels. Use a `zIndex` of 6 to display it above\n * the series, or use a `zIndex` of 2 to display it behind the series.\n *\n * @type {number}\n * @default 6\n * @since 2.3.5\n * @apioption plotOptions.series.dataLabels.zIndex\n */\n /**\n * The y position offset of the label relative to the point in\n * pixels.\n *\n * @sample {highcharts} highcharts/plotoptions/series-datalabels-rotation/\n * Vertical and positioned\n */\n y: 0\n },\n /**\n * When the series contains less points than the crop threshold, all\n * points are drawn, even if the points fall outside the visible plot\n * area at the current zoom. The advantage of drawing all points\n * (including markers and columns), is that animation is performed on\n * updates. On the other hand, when the series contains more points than\n * the crop threshold, the series data is cropped to only contain points\n * that fall within the plot area. The advantage of cropping away\n * invisible points is to increase performance on large series.\n *\n * @since 2.2\n * @product highcharts highstock\n *\n * @private\n */\n cropThreshold: 300,\n /**\n * Opacity of a series parts: line, fill (e.g. area) and dataLabels.\n *\n * @see [states.inactive.opacity](#plotOptions.series.states.inactive.opacity)\n *\n * @since 7.1.0\n *\n * @private\n */\n opacity: 1,\n /**\n * The width of each point on the x axis. For example in a column chart\n * with one value each day, the pointRange would be 1 day (= 24 * 3600\n * * 1000 milliseconds). This is normally computed automatically, but\n * this option can be used to override the automatic value.\n *\n * @product highstock\n *\n * @private\n */\n pointRange: 0,\n /**\n * When this is true, the series will not cause the Y axis to cross\n * the zero plane (or [threshold](#plotOptions.series.threshold) option)\n * unless the data actually crosses the plane.\n *\n * For example, if `softThreshold` is `false`, a series of 0, 1, 2,\n * 3 will make the Y axis show negative values according to the\n * `minPadding` option. If `softThreshold` is `true`, the Y axis starts\n * at 0.\n *\n * @since 4.1.9\n * @product highcharts highstock\n *\n * @private\n */\n softThreshold: true,\n /**\n * @declare Highcharts.SeriesStatesOptionsObject\n *\n * @private\n */\n states: {\n /**\n * The normal state of a series, or for point items in column, pie\n * and similar series. Currently only used for setting animation\n * when returning to normal state from hover.\n *\n * @declare Highcharts.SeriesStatesNormalOptionsObject\n */\n normal: {\n /**\n * Animation when returning to normal state after hovering.\n *\n * @type {boolean|Partial}\n */\n animation: true\n },\n /**\n * Options for the hovered series. These settings override the\n * normal state options when a series is moused over or touched.\n *\n * @declare Highcharts.SeriesStatesHoverOptionsObject\n */\n hover: {\n /**\n * Enable separate styles for the hovered series to visualize\n * that the user hovers either the series itself or the legend.\n *\n * @sample {highcharts} highcharts/plotoptions/series-states-hover-enabled/\n * Line\n * @sample {highcharts} highcharts/plotoptions/series-states-hover-enabled-column/\n * Column\n * @sample {highcharts} highcharts/plotoptions/series-states-hover-enabled-pie/\n * Pie\n *\n * @type {boolean}\n * @default true\n * @since 1.2\n * @apioption plotOptions.series.states.hover.enabled\n */\n /**\n * Animation setting for hovering the graph in line-type series.\n *\n * @type {boolean|Partial}\n * @since 5.0.8\n * @product highcharts highstock\n */\n animation: {\n /**\n * The duration of the hover animation in milliseconds. By\n * default the hover state animates quickly in, and slowly\n * back to normal.\n *\n * @internal\n */\n duration: 50\n },\n /**\n * Pixel width of the graph line. By default this property is\n * undefined, and the `lineWidthPlus` property dictates how much\n * to increase the linewidth from normal state.\n *\n * @sample {highcharts} highcharts/plotoptions/series-states-hover-linewidth/\n * 5px line on hover\n *\n * @type {number}\n * @product highcharts highstock\n * @apioption plotOptions.series.states.hover.lineWidth\n */\n /**\n * The additional line width for the graph of a hovered series.\n *\n * @sample {highcharts} highcharts/plotoptions/series-states-hover-linewidthplus/\n * 5 pixels wider\n * @sample {highstock} highcharts/plotoptions/series-states-hover-linewidthplus/\n * 5 pixels wider\n *\n * @since 4.0.3\n * @product highcharts highstock\n */\n lineWidthPlus: 1,\n /**\n * In Highcharts 1.0, the appearance of all markers belonging\n * to the hovered series. For settings on the hover state of the\n * individual point, see\n * [marker.states.hover](#plotOptions.series.marker.states.hover).\n *\n * @deprecated\n *\n * @extends plotOptions.series.marker\n * @excluding states, symbol\n * @product highcharts highstock\n */\n marker: {\n // lineWidth: base + 1,\n // radius: base + 1\n },\n /**\n * Options for the halo appearing around the hovered point in\n * line-type series as well as outside the hovered slice in pie\n * charts. By default the halo is filled by the current point or\n * series color with an opacity of 0.25\\. The halo can be\n * disabled by setting the `halo` option to `null`.\n *\n * In styled mode, the halo is styled with the\n * `.highcharts-halo` class, with colors inherited from\n * `.highcharts-color-{n}`.\n *\n * @sample {highcharts} highcharts/plotoptions/halo/\n * Halo options\n * @sample {highstock} highcharts/plotoptions/halo/\n * Halo options\n *\n * @declare Highcharts.SeriesStatesHoverHaloOptionsObject\n * @type {null|*}\n * @since 4.0\n * @product highcharts highstock\n */\n halo: {\n /**\n * A collection of SVG attributes to override the appearance\n * of the halo, for example `fill`, `stroke` and\n * `stroke-width`.\n *\n * @type {Highcharts.SVGAttributes}\n * @since 4.0\n * @product highcharts highstock\n * @apioption plotOptions.series.states.hover.halo.attributes\n */\n /**\n * The pixel size of the halo. For point markers this is the\n * radius of the halo. For pie slices it is the width of the\n * halo outside the slice. For bubbles it defaults to 5 and\n * is the width of the halo outside the bubble.\n *\n * @since 4.0\n * @product highcharts highstock\n */\n size: 10,\n /**\n * Opacity for the halo unless a specific fill is overridden\n * using the `attributes` setting. Note that Highcharts is\n * only able to apply opacity to colors of hex or rgb(a)\n * formats.\n *\n * @since 4.0\n * @product highcharts highstock\n */\n opacity: 0.25\n }\n },\n /**\n * Specific options for point in selected states, after being\n * selected by\n * [allowPointSelect](#plotOptions.series.allowPointSelect)\n * or programmatically.\n *\n * @sample maps/plotoptions/series-allowpointselect/\n * Allow point select demo\n *\n * @declare Highcharts.SeriesStatesSelectOptionsObject\n * @extends plotOptions.series.states.hover\n * @excluding brightness\n */\n select: {\n animation: {\n /** @internal */\n duration: 0\n }\n },\n /**\n * The opposite state of a hover for series.\n *\n * @sample highcharts/plotoptions/series-states-inactive-disabled\n * Disabled inactive state\n *\n * @declare Highcharts.SeriesStatesInactiveOptionsObject\n */\n inactive: {\n /**\n * Enable or disable the inactive state for a series\n *\n * @sample highcharts/plotoptions/series-states-inactive-disabled\n * Disabled inactive state\n *\n * @type {boolean}\n * @default true\n * @apioption plotOptions.series.states.inactive.enabled\n */\n /**\n * The animation for entering the inactive state.\n *\n * @type {boolean|Partial}\n */\n animation: {\n /** @internal */\n duration: 50\n },\n /**\n * Opacity of series elements (dataLabels, line, area).\n *\n * @type {number}\n */\n opacity: 0.2\n }\n },\n /**\n * Sticky tracking of mouse events. When true, the `mouseOut` event on a\n * series isn't triggered until the mouse moves over another series, or\n * out of the plot area. When false, the `mouseOut` event on a series is\n * triggered when the mouse leaves the area around the series' graph or\n * markers. This also implies the tooltip when not shared. When\n * `stickyTracking` is false and `tooltip.shared` is false, the tooltip\n * will be hidden when moving the mouse between series. Defaults to true\n * for line and area type series, but to false for columns, pies etc.\n *\n * **Note:** The boost module will force this option because of\n * technical limitations.\n *\n * @sample {highcharts} highcharts/plotoptions/series-stickytracking-true/\n * True by default\n * @sample {highcharts} highcharts/plotoptions/series-stickytracking-false/\n * False\n *\n * @default {highcharts} true\n * @default {highstock} true\n * @default {highmaps} false\n * @since 2.0\n *\n * @private\n */\n stickyTracking: true,\n /**\n * A configuration object for the tooltip rendering of each single\n * series. Properties are inherited from [tooltip](#tooltip), but only\n * the following properties can be defined on a series level.\n *\n * @declare Highcharts.SeriesTooltipOptionsObject\n * @since 2.3\n * @extends tooltip\n * @excluding animation, backgroundColor, borderColor, borderRadius,\n * borderWidth, className, crosshairs, enabled, formatter,\n * headerShape, hideDelay, outside, padding, positioner,\n * shadow, shape, shared, snap, split, stickOnContact,\n * style, useHTML\n * @apioption plotOptions.series.tooltip\n */\n /**\n * When a series contains a data array that is longer than this, only\n * one dimensional arrays of numbers, or two dimensional arrays with\n * x and y values are allowed. Also, only the first point is tested,\n * and the rest are assumed to be the same format. This saves expensive\n * data checking and indexing in long series. Set it to `0` disable.\n *\n * Note:\n * In boost mode turbo threshold is forced. Only array of numbers or\n * two dimensional arrays are allowed.\n *\n * @since 2.2\n * @product highcharts highstock gantt\n *\n * @private\n */\n turboThreshold: 1000,\n /**\n * An array defining zones within a series. Zones can be applied to the\n * X axis, Y axis or Z axis for bubbles, according to the `zoneAxis`\n * option. The zone definitions have to be in ascending order regarding\n * to the value.\n *\n * In styled mode, the color zones are styled with the\n * `.highcharts-zone-{n}` class, or custom classed from the `className`\n * option\n * ([view live demo](https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/css/color-zones/)).\n *\n * @see [zoneAxis](#plotOptions.series.zoneAxis)\n *\n * @sample {highcharts} highcharts/series/color-zones-simple/\n * Color zones\n * @sample {highstock} highcharts/series/color-zones-simple/\n * Color zones\n *\n * @declare Highcharts.SeriesZonesOptionsObject\n * @type {Array<*>}\n * @since 4.1.0\n * @product highcharts highstock\n * @apioption plotOptions.series.zones\n */\n /**\n * Styled mode only. A custom class name for the zone.\n *\n * @sample highcharts/css/color-zones/\n * Zones styled by class name\n *\n * @type {string}\n * @since 5.0.0\n * @apioption plotOptions.series.zones.className\n */\n /**\n * Defines the color of the series.\n *\n * @see [series color](#plotOptions.series.color)\n *\n * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}\n * @since 4.1.0\n * @product highcharts highstock\n * @apioption plotOptions.series.zones.color\n */\n /**\n * A name for the dash style to use for the graph.\n *\n * @see [plotOptions.series.dashStyle](#plotOptions.series.dashStyle)\n *\n * @sample {highcharts|highstock} highcharts/series/color-zones-dashstyle-dot/\n * Dashed line indicates prognosis\n *\n * @type {Highcharts.DashStyleValue}\n * @since 4.1.0\n * @product highcharts highstock\n * @apioption plotOptions.series.zones.dashStyle\n */\n /**\n * Defines the fill color for the series (in area type series)\n *\n * @see [fillColor](#plotOptions.area.fillColor)\n *\n * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}\n * @since 4.1.0\n * @product highcharts highstock\n * @apioption plotOptions.series.zones.fillColor\n */\n /**\n * The value up to where the zone extends, if undefined the zones\n * stretches to the last value in the series.\n *\n * @type {number}\n * @since 4.1.0\n * @product highcharts highstock\n * @apioption plotOptions.series.zones.value\n */\n /**\n * When using dual or multiple color axes, this number defines which\n * colorAxis the particular series is connected to. It refers to\n * either the\n * {@link #colorAxis.id|axis id}\n * or the index of the axis in the colorAxis array, with 0 being the\n * first. Set this option to false to prevent a series from connecting\n * to the default color axis.\n *\n * Since v7.2.0 the option can also be an axis id or an axis index\n * instead of a boolean flag.\n *\n * @sample highcharts/coloraxis/coloraxis-with-pie/\n * Color axis with pie series\n * @sample highcharts/coloraxis/multiple-coloraxis/\n * Multiple color axis\n *\n * @type {number|string|boolean}\n * @default 0\n * @product highcharts highstock highmaps\n * @apioption plotOptions.series.colorAxis\n */\n /**\n * Determines what data value should be used to calculate point color\n * if `colorAxis` is used. Requires to set `min` and `max` if some\n * custom point property is used or if approximation for data grouping\n * is set to `'sum'`.\n *\n * @sample highcharts/coloraxis/custom-color-key/\n * Custom color key\n * @sample highcharts/coloraxis/color-key-with-stops/\n * Custom colorKey with color axis stops\n * @sample highcharts/coloraxis/changed-default-color-key/\n * Changed default color key\n *\n * @type {string}\n * @default y\n * @since 7.2.0\n * @product highcharts highstock highmaps\n * @apioption plotOptions.series.colorKey\n */\n /**\n * Determines whether the series should look for the nearest point\n * in both dimensions or just the x-dimension when hovering the series.\n * Defaults to `'xy'` for scatter series and `'x'` for most other\n * series. If the data has duplicate x-values, it is recommended to\n * set this to `'xy'` to allow hovering over all points.\n *\n * Applies only to series types using nearest neighbor search (not\n * direct hover) for tooltip.\n *\n * @sample {highcharts} highcharts/series/findnearestpointby/\n * Different hover behaviors\n * @sample {highstock} highcharts/series/findnearestpointby/\n * Different hover behaviors\n * @sample {highmaps} highcharts/series/findnearestpointby/\n * Different hover behaviors\n *\n * @since 5.0.10\n * @validvalue [\"x\", \"xy\"]\n *\n * @private\n */\n findNearestPointBy: 'x'\n };\n /* *\n *\n * Default Export\n *\n * */\n\n return seriesDefaults;\n });\n _registerModule(_modules, 'Core/Series/Series.js', [_modules['Core/Animation/AnimationUtilities.js'], _modules['Core/Defaults.js'], _modules['Core/Foundation.js'], _modules['Core/Globals.js'], _modules['Core/Legend/LegendSymbol.js'], _modules['Core/Series/Point.js'], _modules['Core/Series/SeriesDefaults.js'], _modules['Core/Series/SeriesRegistry.js'], _modules['Core/Renderer/SVG/SVGElement.js'], _modules['Core/Utilities.js']], function (A, D, F, H, LegendSymbol, Point, SeriesDefaults, SeriesRegistry, SVGElement, U) {\n /* *\n *\n * (c) 2010-2021 Torstein Honsi\n *\n * License: www.highcharts.com/license\n *\n * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!\n *\n * */\n var animObject = A.animObject,\n setAnimation = A.setAnimation;\n var defaultOptions = D.defaultOptions;\n var registerEventOptions = F.registerEventOptions;\n var hasTouch = H.hasTouch,\n svg = H.svg,\n win = H.win;\n var seriesTypes = SeriesRegistry.seriesTypes;\n var addEvent = U.addEvent,\n arrayMax = U.arrayMax,\n arrayMin = U.arrayMin,\n clamp = U.clamp,\n cleanRecursively = U.cleanRecursively,\n correctFloat = U.correctFloat,\n defined = U.defined,\n erase = U.erase,\n error = U.error,\n extend = U.extend,\n find = U.find,\n fireEvent = U.fireEvent,\n getNestedProperty = U.getNestedProperty,\n isArray = U.isArray,\n isNumber = U.isNumber,\n isString = U.isString,\n merge = U.merge,\n objectEach = U.objectEach,\n pick = U.pick,\n removeEvent = U.removeEvent,\n splat = U.splat,\n syncTimeout = U.syncTimeout;\n /* *\n *\n * Class\n *\n * */\n /**\n * This is the base series prototype that all other series types inherit from.\n * A new series is initialized either through the\n * [series](https://api.highcharts.com/highcharts/series)\n * option structure, or after the chart is initialized, through\n * {@link Highcharts.Chart#addSeries}.\n *\n * The object can be accessed in a number of ways. All series and point event\n * handlers give a reference to the `series` object. The chart object has a\n * {@link Highcharts.Chart#series|series} property that is a collection of all\n * the chart's series. The point objects and axis objects also have the same\n * reference.\n *\n * Another way to reference the series programmatically is by `id`. Add an id\n * in the series configuration options, and get the series object by\n * {@link Highcharts.Chart#get}.\n *\n * Configuration options for the series are given in three levels. Options for\n * all series in a chart are given in the\n * [plotOptions.series](https://api.highcharts.com/highcharts/plotOptions.series)\n * object. Then options for all series of a specific type\n * are given in the plotOptions of that type, for example `plotOptions.line`.\n * Next, options for one single series are given in the series array, or as\n * arguments to `chart.addSeries`.\n *\n * The data in the series is stored in various arrays.\n *\n * - First, `series.options.data` contains all the original config options for\n * each point whether added by options or methods like `series.addPoint`.\n *\n * - Next, `series.data` contains those values converted to points, but in case\n * the series data length exceeds the `cropThreshold`, or if the data is\n * grouped, `series.data` doesn't contain all the points. It only contains the\n * points that have been created on demand.\n *\n * - Then there's `series.points` that contains all currently visible point\n * objects. In case of cropping, the cropped-away points are not part of this\n * array. The `series.points` array starts at `series.cropStart` compared to\n * `series.data` and `series.options.data`. If however the series data is\n * grouped, these can't be correlated one to one.\n *\n * - `series.xData` and `series.processedXData` contain clean x values,\n * equivalent to `series.data` and `series.points`.\n *\n * - `series.yData` and `series.processedYData` contain clean y values,\n * equivalent to `series.data` and `series.points`.\n *\n * @class\n * @name Highcharts.Series\n *\n * @param {Highcharts.Chart} chart\n * The chart instance.\n *\n * @param {Highcharts.SeriesOptionsType|object} options\n * The series options.\n */\n var Series = /** @class */ (function () {\n function Series() {\n /* *\n *\n * Static Properties\n *\n * */\n this._i = void 0;\n this.chart = void 0;\n this.data = void 0;\n this.eventOptions = void 0;\n this.eventsToUnbind = void 0;\n this.index = void 0;\n this.linkedSeries = void 0;\n this.options = void 0;\n this.points = void 0;\n this.processedXData = void 0;\n this.processedYData = void 0;\n this.tooltipOptions = void 0;\n this.userOptions = void 0;\n this.xAxis = void 0;\n this.yAxis = void 0;\n this.zones = void 0;\n /** eslint-enable valid-jsdoc */\n }\n /* *\n *\n * Functions\n *\n * */\n /* eslint-disable valid-jsdoc */\n Series.prototype.init = function (chart, userOptions) {\n fireEvent(this, 'init', { options: userOptions });\n var series = this,\n chartSeries = chart.series;\n // The 'eventsToUnbind' property moved from prototype into the\n // Series init to avoid reference to the same array between\n // the different series and charts. #12959, #13937\n this.eventsToUnbind = [];\n /**\n * Read only. The chart that the series belongs to.\n *\n * @name Highcharts.Series#chart\n * @type {Highcharts.Chart}\n */\n series.chart = chart;\n /**\n * Read only. The series' type, like \"line\", \"area\", \"column\" etc.\n * The type in the series options anc can be altered using\n * {@link Series#update}.\n *\n * @name Highcharts.Series#type\n * @type {string}\n */\n /**\n * Read only. The series' current options. To update, use\n * {@link Series#update}.\n *\n * @name Highcharts.Series#options\n * @type {Highcharts.SeriesOptionsType}\n */\n series.options = series.setOptions(userOptions);\n var options = series.options;\n series.linkedSeries = [];\n // bind the axes\n series.bindAxes();\n extend(series, {\n /**\n * The series name as given in the options. Defaults to\n * \"Series {n}\".\n *\n * @name Highcharts.Series#name\n * @type {string}\n */\n name: options.name,\n state: '',\n /**\n * Read only. The series' visibility state as set by {@link\n * Series#show}, {@link Series#hide}, or in the initial\n * configuration.\n *\n * @name Highcharts.Series#visible\n * @type {boolean}\n */\n visible: options.visible !== false,\n /**\n * Read only. The series' selected state as set by {@link\n * Highcharts.Series#select}.\n *\n * @name Highcharts.Series#selected\n * @type {boolean}\n */\n selected: options.selected === true // false by default\n });\n registerEventOptions(this, options);\n var events = options.events;\n if ((events && events.click) ||\n (options.point &&\n options.point.events &&\n options.point.events.click) ||\n options.allowPointSelect) {\n chart.runTrackerClick = true;\n }\n series.getColor();\n series.getSymbol();\n // Initialize the parallel data arrays\n series.parallelArrays.forEach(function (key) {\n if (!series[key + 'Data']) {\n series[key + 'Data'] = [];\n }\n });\n // Mark cartesian\n if (series.isCartesian) {\n chart.hasCartesianSeries = true;\n }\n // Get the index and register the series in the chart. The index is\n // one more than the current latest series index (#5960).\n var lastSeries;\n if (chartSeries.length) {\n lastSeries = chartSeries[chartSeries.length - 1];\n }\n series._i = pick(lastSeries && lastSeries._i, -1) + 1;\n series.opacity = series.options.opacity;\n // Insert the series and re-order all series above the insertion\n // point.\n chart.orderSeries(this.insert(chartSeries));\n // Set options for series with sorting and set data later.\n if (options.dataSorting && options.dataSorting.enabled) {\n series.setDataSortingOptions();\n }\n else if (!series.points && !series.data) {\n series.setData(options.data, false);\n }\n fireEvent(this, 'afterInit');\n };\n /**\n * Check whether the series item is itself or inherits from a certain\n * series type.\n *\n * @function Highcharts.Series#is\n * @param {string} type The type of series to check for, can be either\n * featured or custom series types. For example `column`, `pie`,\n * `ohlc` etc.\n *\n * @return {boolean}\n * True if this item is or inherits from the given type.\n */\n Series.prototype.is = function (type) {\n return seriesTypes[type] && this instanceof seriesTypes[type];\n };\n /**\n * Insert the series in a collection with other series, either the chart\n * series or yAxis series, in the correct order according to the index\n * option. Used internally when adding series.\n *\n * @private\n * @function Highcharts.Series#insert\n * @param {Array} collection\n * A collection of series, like `chart.series` or `xAxis.series`.\n * @return {number}\n * The index of the series in the collection.\n */\n Series.prototype.insert = function (collection) {\n var indexOption = this.options.index;\n var i;\n // Insert by index option\n if (isNumber(indexOption)) {\n i = collection.length;\n while (i--) {\n // Loop down until the interted element has higher index\n if (indexOption >=\n pick(collection[i].options.index, collection[i]._i)) {\n collection.splice(i + 1, 0, this);\n break;\n }\n }\n if (i === -1) {\n collection.unshift(this);\n }\n i = i + 1;\n // Or just push it to the end\n }\n else {\n collection.push(this);\n }\n return pick(i, collection.length - 1);\n };\n /**\n * Set the xAxis and yAxis properties of cartesian series, and register\n * the series in the `axis.series` array.\n *\n * @private\n * @function Highcharts.Series#bindAxes\n */\n Series.prototype.bindAxes = function () {\n var series = this,\n seriesOptions = series.options,\n chart = series.chart;\n var axisOptions;\n fireEvent(this, 'bindAxes', null, function () {\n // repeat for xAxis and yAxis\n (series.axisTypes || []).forEach(function (AXIS) {\n var index = 0;\n // loop through the chart's axis objects\n chart[AXIS].forEach(function (axis) {\n axisOptions = axis.options;\n // apply if the series xAxis or yAxis option mathches\n // the number of the axis, or if undefined, use the\n // first axis\n if ((seriesOptions[AXIS] === index &&\n !axisOptions.isInternal) ||\n (typeof seriesOptions[AXIS] !==\n 'undefined' &&\n seriesOptions[AXIS] === axisOptions.id) ||\n (typeof seriesOptions[AXIS] ===\n 'undefined' &&\n axisOptions.index === 0)) {\n // register this series in the axis.series lookup\n series.insert(axis.series);\n // set this series.xAxis or series.yAxis reference\n /**\n * Read only. The unique xAxis object associated\n * with the series.\n *\n * @name Highcharts.Series#xAxis\n * @type {Highcharts.Axis}\n */\n /**\n * Read only. The unique yAxis object associated\n * with the series.\n *\n * @name Highcharts.Series#yAxis\n * @type {Highcharts.Axis}\n */\n series[AXIS] = axis;\n // mark dirty for redraw\n axis.isDirty = true;\n }\n if (!axisOptions.isInternal) {\n index++;\n }\n });\n // The series needs an X and an Y axis\n if (!series[AXIS] &&\n series.optionalAxis !== AXIS) {\n error(18, true, chart);\n }\n });\n });\n fireEvent(this, 'afterBindAxes');\n };\n /**\n * For simple series types like line and column, the data values are\n * held in arrays like xData and yData for quick lookup to find extremes\n * and more. For multidimensional series like bubble and map, this can\n * be extended with arrays like zData and valueData by adding to the\n * `series.parallelArrays` array.\n *\n * @private\n * @function Highcharts.Series#updateParallelArrays\n */\n Series.prototype.updateParallelArrays = function (point, i) {\n var series = point.series,\n args = arguments,\n fn = isNumber(i) ?\n // Insert the value in the given position\n function (key) {\n var val = key === 'y' && series.toYData ?\n series.toYData(point) :\n point[key];\n series[key + 'Data'][i] = val;\n } :\n // Apply the method specified in i with the following\n // arguments as arguments\n function (key) {\n Array.prototype[i].apply(series[key + 'Data'], Array.prototype.slice.call(args, 2));\n };\n series.parallelArrays.forEach(fn);\n };\n /**\n * Define hasData functions for series. These return true if there\n * are data points on this series within the plot area.\n *\n * @private\n * @function Highcharts.Series#hasData\n */\n Series.prototype.hasData = function () {\n return ((this.visible &&\n typeof this.dataMax !== 'undefined' &&\n typeof this.dataMin !== 'undefined') || ( // #3703\n this.visible &&\n this.yData &&\n this.yData.length > 0) // #9758\n );\n };\n /**\n * Return an auto incremented x value based on the pointStart and\n * pointInterval options. This is only used if an x value is not given\n * for the point that calls autoIncrement.\n *\n * @private\n * @function Highcharts.Series#autoIncrement\n */\n Series.prototype.autoIncrement = function (x) {\n var options = this.options,\n pointIntervalUnit = options.pointIntervalUnit,\n relativeXValue = options.relativeXValue,\n time = this.chart.time;\n var xIncrement = this.xIncrement,\n date,\n pointInterval;\n xIncrement = pick(xIncrement, options.pointStart, 0);\n this.pointInterval = pointInterval = pick(this.pointInterval, options.pointInterval, 1);\n if (relativeXValue && isNumber(x)) {\n pointInterval *= x;\n }\n // Added code for pointInterval strings\n if (pointIntervalUnit) {\n date = new time.Date(xIncrement);\n if (pointIntervalUnit === 'day') {\n time.set('Date', date, time.get('Date', date) + pointInterval);\n }\n else if (pointIntervalUnit === 'month') {\n time.set('Month', date, time.get('Month', date) + pointInterval);\n }\n else if (pointIntervalUnit === 'year') {\n time.set('FullYear', date, time.get('FullYear', date) + pointInterval);\n }\n pointInterval = date.getTime() - xIncrement;\n }\n if (relativeXValue && isNumber(x)) {\n return xIncrement + pointInterval;\n }\n this.xIncrement = xIncrement + pointInterval;\n return xIncrement;\n };\n /**\n * Internal function to set properties for series if data sorting is\n * enabled.\n *\n * @private\n * @function Highcharts.Series#setDataSortingOptions\n */\n Series.prototype.setDataSortingOptions = function () {\n var options = this.options;\n extend(this, {\n requireSorting: false,\n sorted: false,\n enabledDataSorting: true,\n allowDG: false\n });\n // To allow unsorted data for column series.\n if (!defined(options.pointRange)) {\n options.pointRange = 1;\n }\n };\n /**\n * Set the series options by merging from the options tree. Called\n * internally on initializing and updating series. This function will\n * not redraw the series. For API usage, use {@link Series#update}.\n * @private\n * @function Highcharts.Series#setOptions\n * @param {Highcharts.SeriesOptionsType} itemOptions\n * The series options.\n * @emits Highcharts.Series#event:afterSetOptions\n */\n Series.prototype.setOptions = function (itemOptions) {\n var chart = this.chart,\n chartOptions = chart.options,\n plotOptions = chartOptions.plotOptions,\n userOptions = chart.userOptions || {},\n seriesUserOptions = merge(itemOptions),\n styledMode = chart.styledMode,\n e = {\n plotOptions: plotOptions,\n userOptions: seriesUserOptions\n };\n var zone;\n fireEvent(this, 'setOptions', e);\n // These may be modified by the event\n var typeOptions = e.plotOptions[this.type],\n userPlotOptions = (userOptions.plotOptions || {});\n // use copy to prevent undetected changes (#9762)\n /**\n * Contains series options by the user without defaults.\n * @name Highcharts.Series#userOptions\n * @type {Highcharts.SeriesOptionsType}\n */\n this.userOptions = e.userOptions;\n var options = merge(typeOptions,\n plotOptions.series, \n // #3881, chart instance plotOptions[type] should trump\n // plotOptions.series\n userOptions.plotOptions &&\n userOptions.plotOptions[this.type],\n seriesUserOptions);\n // The tooltip options are merged between global and series specific\n // options. Importance order asscendingly:\n // globals: (1)tooltip, (2)plotOptions.series,\n // (3)plotOptions[this.type]\n // init userOptions with possible later updates: 4-6 like 1-3 and\n // (7)this series options\n this.tooltipOptions = merge(defaultOptions.tooltip, // 1\n defaultOptions.plotOptions.series &&\n defaultOptions.plotOptions.series.tooltip, // 2\n defaultOptions.plotOptions[this.type].tooltip, // 3\n chartOptions.tooltip.userOptions, // 4\n plotOptions.series &&\n plotOptions.series.tooltip, // 5\n plotOptions[this.type].tooltip, // 6\n seriesUserOptions.tooltip // 7\n );\n // When shared tooltip, stickyTracking is true by default,\n // unless user says otherwise.\n this.stickyTracking = pick(seriesUserOptions.stickyTracking, userPlotOptions[this.type] &&\n userPlotOptions[this.type].stickyTracking, userPlotOptions.series && userPlotOptions.series.stickyTracking, (this.tooltipOptions.shared && !this.noSharedTooltip ?\n true :\n options.stickyTracking));\n // Delete marker object if not allowed (#1125)\n if (typeOptions.marker === null) {\n delete options.marker;\n }\n // Handle color zones\n this.zoneAxis = options.zoneAxis;\n var zones = this.zones = (options.zones || []).slice();\n if ((options.negativeColor || options.negativeFillColor) &&\n !options.zones) {\n zone = {\n value: options[this.zoneAxis + 'Threshold'] ||\n options.threshold ||\n 0,\n className: 'highcharts-negative'\n };\n if (!styledMode) {\n zone.color = options.negativeColor;\n zone.fillColor = options.negativeFillColor;\n }\n zones.push(zone);\n }\n if (zones.length) { // Push one extra zone for the rest\n if (defined(zones[zones.length - 1].value)) {\n zones.push(styledMode ? {} : {\n color: this.color,\n fillColor: this.fillColor\n });\n }\n }\n fireEvent(this, 'afterSetOptions', { options: options });\n return options;\n };\n /**\n * Return series name in \"Series {Number}\" format or the one defined by\n * a user. This method can be simply overridden as series name format\n * can vary (e.g. technical indicators).\n *\n * @function Highcharts.Series#getName\n *\n * @return {string}\n * The series name.\n */\n Series.prototype.getName = function () {\n // #4119\n return pick(this.options.name, 'Series ' + (this.index + 1));\n };\n /**\n * @private\n * @function Highcharts.Series#getCyclic\n */\n Series.prototype.getCyclic = function (prop, value, defaults) {\n var chart = this.chart, userOptions = this.userOptions, indexName = prop + 'Index', counterName = prop + 'Counter', len = defaults ? defaults.length : pick(chart.options.chart[prop + 'Count'], chart[prop + 'Count']);\n var i,\n setting;\n if (!value) {\n // Pick up either the colorIndex option, or the _colorIndex\n // after Series.update()\n setting = pick(userOptions[indexName], userOptions['_' + indexName]);\n if (defined(setting)) { // after Series.update()\n i = setting;\n }\n else {\n // #6138\n if (!chart.series.length) {\n chart[counterName] = 0;\n }\n userOptions['_' + indexName] = i =\n chart[counterName] % len;\n chart[counterName] += 1;\n }\n if (defaults) {\n value = defaults[i];\n }\n }\n // Set the colorIndex\n if (typeof i !== 'undefined') {\n this[indexName] = i;\n }\n this[prop] = value;\n };\n /**\n * Get the series' color based on either the options or pulled from\n * global options.\n *\n * @private\n * @function Highcharts.Series#getColor\n */\n Series.prototype.getColor = function () {\n if (this.chart.styledMode) {\n this.getCyclic('color');\n }\n else if (this.options.colorByPoint) {\n this.color = \"#cccccc\" /* Palette.neutralColor20 */;\n }\n else {\n this.getCyclic('color', this.options.color ||\n defaultOptions.plotOptions[this.type].color, this.chart.options.colors);\n }\n };\n /**\n * Get all points' instances created for this series.\n *\n * @private\n * @function Highcharts.Series#getPointsCollection\n */\n Series.prototype.getPointsCollection = function () {\n return (this.hasGroupedData ? this.points : this.data) || [];\n };\n /**\n * Get the series' symbol based on either the options or pulled from\n * global options.\n *\n * @private\n * @function Highcharts.Series#getSymbol\n */\n Series.prototype.getSymbol = function () {\n var seriesMarkerOption = this.options.marker;\n this.getCyclic('symbol', seriesMarkerOption.symbol, this.chart.options.symbols);\n };\n /**\n * Finds the index of an existing point that matches the given point\n * options.\n *\n * @private\n * @function Highcharts.Series#findPointIndex\n * @param {Highcharts.PointOptionsObject} optionsObject\n * The options of the point.\n * @param {number} fromIndex\n * The index to start searching from, used for optimizing series with\n * required sorting.\n * @return {number|undefined}\n * Returns the index of a matching point, or undefined if no match is found.\n */\n Series.prototype.findPointIndex = function (optionsObject, fromIndex) {\n var id = optionsObject.id,\n x = optionsObject.x,\n oldData = this.points,\n dataSorting = this.options.dataSorting;\n var matchingPoint,\n matchedById,\n pointIndex;\n if (id) {\n var item = this.chart.get(id);\n if (item instanceof Point) {\n matchingPoint = item;\n }\n }\n else if (this.linkedParent ||\n this.enabledDataSorting ||\n this.options.relativeXValue) {\n var matcher = function (oldPoint) { return !oldPoint.touched &&\n oldPoint.index === optionsObject.index; };\n if (dataSorting && dataSorting.matchByName) {\n matcher = function (oldPoint) { return !oldPoint.touched &&\n oldPoint.name === optionsObject.name; };\n }\n else if (this.options.relativeXValue) {\n matcher = function (oldPoint) { return !oldPoint.touched &&\n oldPoint.options.x === optionsObject.x; };\n }\n matchingPoint = find(oldData, matcher);\n // Add unmatched point as a new point\n if (!matchingPoint) {\n return void 0;\n }\n }\n if (matchingPoint) {\n pointIndex = matchingPoint && matchingPoint.index;\n if (typeof pointIndex !== 'undefined') {\n matchedById = true;\n }\n }\n // Search for the same X in the existing data set\n if (typeof pointIndex === 'undefined' && isNumber(x)) {\n pointIndex = this.xData.indexOf(x, fromIndex);\n }\n // Reduce pointIndex if data is cropped\n if (pointIndex !== -1 &&\n typeof pointIndex !== 'undefined' &&\n this.cropped) {\n pointIndex = (pointIndex >= this.cropStart) ?\n pointIndex - this.cropStart : pointIndex;\n }\n if (!matchedById &&\n isNumber(pointIndex) &&\n oldData[pointIndex] && oldData[pointIndex].touched) {\n pointIndex = void 0;\n }\n return pointIndex;\n };\n /**\n * Internal function called from setData. If the point count is the same\n * as it was, or if there are overlapping X values, just run\n * Point.update which is cheaper, allows animation, and keeps references\n * to points. This also allows adding or removing points if the X-es\n * don't match.\n *\n * @private\n * @function Highcharts.Series#updateData\n */\n Series.prototype.updateData = function (data, animation) {\n var options = this.options,\n dataSorting = options.dataSorting,\n oldData = this.points,\n pointsToAdd = [],\n requireSorting = this.requireSorting,\n equalLength = data.length === oldData.length;\n var hasUpdatedByKey,\n i,\n point,\n lastIndex,\n succeeded = true;\n this.xIncrement = null;\n // Iterate the new data\n data.forEach(function (pointOptions, i) {\n var optionsObject = (defined(pointOptions) &&\n this.pointClass.prototype.optionsToObject.call({ series: this },\n pointOptions)) || {};\n var pointIndex;\n // Get the x of the new data point\n var x = optionsObject.x,\n id = optionsObject.id;\n if (id || isNumber(x)) {\n pointIndex = this.findPointIndex(optionsObject, lastIndex);\n // Matching X not found\n // or used already due to ununique x values (#8995),\n // add point (but later)\n if (pointIndex === -1 ||\n typeof pointIndex === 'undefined') {\n pointsToAdd.push(pointOptions);\n // Matching X found, update\n }\n else if (oldData[pointIndex] &&\n pointOptions !== options.data[pointIndex]) {\n oldData[pointIndex].update(pointOptions, false, null, false);\n // Mark it touched, below we will remove all points that\n // are not touched.\n oldData[pointIndex].touched = true;\n // Speed optimize by only searching after last known\n // index. Performs ~20% bettor on large data sets.\n if (requireSorting) {\n lastIndex = pointIndex + 1;\n }\n // Point exists, no changes, don't remove it\n }\n else if (oldData[pointIndex]) {\n oldData[pointIndex].touched = true;\n }\n // If the length is equal and some of the nodes had a\n // match in the same position, we don't want to remove\n // non-matches.\n if (!equalLength ||\n i !== pointIndex ||\n (dataSorting && dataSorting.enabled) ||\n this.hasDerivedData) {\n hasUpdatedByKey = true;\n }\n }\n else {\n // Gather all points that are not matched\n pointsToAdd.push(pointOptions);\n }\n }, this);\n // Remove points that don't exist in the updated data set\n if (hasUpdatedByKey) {\n i = oldData.length;\n while (i--) {\n point = oldData[i];\n if (point && !point.touched && point.remove) {\n point.remove(false, animation);\n }\n }\n // If we did not find keys (ids or x-values), and the length is the\n // same, update one-to-one\n }\n else if (equalLength && (!dataSorting || !dataSorting.enabled)) {\n data.forEach(function (point, i) {\n // .update doesn't exist on a linked, hidden series (#3709)\n // (#10187)\n if (point !== oldData[i].y && (oldData[i].update)) {\n oldData[i].update(point, false, null, false);\n }\n });\n // Don't add new points since those configs are used above\n pointsToAdd.length = 0;\n // Did not succeed in updating data\n }\n else {\n succeeded = false;\n }\n oldData.forEach(function (point) {\n if (point) {\n point.touched = false;\n }\n });\n if (!succeeded) {\n return false;\n }\n // Add new points\n pointsToAdd.forEach(function (point) {\n this.addPoint(point, false, null, null, false);\n }, this);\n if (this.xIncrement === null &&\n this.xData &&\n this.xData.length) {\n this.xIncrement = arrayMax(this.xData);\n this.autoIncrement();\n }\n return true;\n };\n /**\n * Apply a new set of data to the series and optionally redraw it. The\n * new data array is passed by reference (except in case of\n * `updatePoints`), and may later be mutated when updating the chart\n * data.\n *\n * Note the difference in behaviour when setting the same amount of\n * points, or a different amount of points, as handled by the\n * `updatePoints` parameter.\n *\n * @sample highcharts/members/series-setdata/\n * Set new data from a button\n * @sample highcharts/members/series-setdata-pie/\n * Set data in a pie\n * @sample stock/members/series-setdata/\n * Set new data in Highcharts Stock\n * @sample maps/members/series-setdata/\n * Set new data in Highmaps\n *\n * @function Highcharts.Series#setData\n *\n * @param {Array} data\n * Takes an array of data in the same format as described under\n * `series.{type}.data` for the given series type, for example a\n * line series would take data in the form described under\n * [series.line.data](https://api.highcharts.com/highcharts/series.line.data).\n *\n * @param {boolean} [redraw=true]\n * Whether to redraw the chart after the series is altered. If\n * doing more operations on the chart, it is a good idea to set\n * redraw to false and call {@link Chart#redraw} after.\n *\n * @param {boolean|Partial} [animation]\n * When the updated data is the same length as the existing data,\n * points will be updated by default, and animation visualizes\n * how the points are changed. Set false to disable animation, or\n * a configuration object to set duration or easing.\n *\n * @param {boolean} [updatePoints=true]\n * When this is true, points will be updated instead of replaced\n * whenever possible. This occurs a) when the updated data is the\n * same length as the existing data, b) when points are matched\n * by their id's, or c) when points can be matched by X values.\n * This allows updating with animation and performs better. In\n * this case, the original array is not passed by reference. Set\n * `false` to prevent.\n */\n Series.prototype.setData = function (data, redraw, animation, updatePoints) {\n if (redraw === void 0) { redraw = true; }\n var series = this,\n oldData = series.points,\n oldDataLength = (oldData && oldData.length) || 0,\n options = series.options,\n chart = series.chart,\n dataSorting = options.dataSorting,\n xAxis = series.xAxis,\n turboThreshold = options.turboThreshold,\n xData = this.xData,\n yData = this.yData,\n pointArrayMap = series.pointArrayMap,\n valueCount = pointArrayMap && pointArrayMap.length,\n keys = options.keys;\n var i,\n pt,\n updatedData,\n indexOfX = 0,\n indexOfY = 1,\n firstPoint = null,\n copiedData;\n if (!chart.options.chart.allowMutatingData) { // #4259\n // Remove old reference\n if (options.data) {\n delete series.options.data;\n }\n if (series.userOptions.data) {\n delete series.userOptions.data;\n }\n copiedData = merge(true, data);\n }\n data = copiedData || data || [];\n var dataLength = data.length;\n if (dataSorting && dataSorting.enabled) {\n data = this.sortData(data);\n }\n // First try to run Point.update which is cheaper, allows animation,\n // and keeps references to points.\n if (chart.options.chart.allowMutatingData &&\n updatePoints !== false &&\n dataLength &&\n oldDataLength &&\n !series.cropped &&\n !series.hasGroupedData &&\n series.visible &&\n // Soft updating has no benefit in boost, and causes JS error\n // (#8355)\n !series.boosted) {\n updatedData = this.updateData(data, animation);\n }\n if (!updatedData) {\n // Reset properties\n series.xIncrement = null;\n series.colorCounter = 0; // for series with colorByPoint (#1547)\n // Update parallel arrays\n this.parallelArrays.forEach(function (key) {\n series[key + 'Data'].length = 0;\n });\n // In turbo mode, only one- or twodimensional arrays of numbers\n // are allowed. The first value is tested, and we assume that\n // all the rest are defined the same way. Although the 'for'\n // loops are similar, they are repeated inside each if-else\n // conditional for max performance.\n if (turboThreshold && dataLength > turboThreshold) {\n firstPoint = series.getFirstValidPoint(data);\n if (isNumber(firstPoint)) { // assume all points are numbers\n for (i = 0; i < dataLength; i++) {\n xData[i] = this.autoIncrement();\n yData[i] = data[i];\n }\n // Assume all points are arrays when first point is\n }\n else if (isArray(firstPoint)) {\n if (valueCount) { // [x, low, high] or [x, o, h, l, c]\n if (firstPoint.length === valueCount) {\n for (i = 0; i < dataLength; i++) {\n xData[i] = this.autoIncrement();\n yData[i] = data[i];\n }\n }\n else {\n for (i = 0; i < dataLength; i++) {\n pt = data[i];\n xData[i] = pt[0];\n yData[i] =\n pt.slice(1, valueCount + 1);\n }\n }\n }\n else { // [x, y]\n if (keys) {\n indexOfX = keys.indexOf('x');\n indexOfY = keys.indexOf('y');\n indexOfX = indexOfX >= 0 ? indexOfX : 0;\n indexOfY = indexOfY >= 0 ? indexOfY : 1;\n }\n if (firstPoint.length === 1) {\n indexOfY = 0;\n }\n if (indexOfX === indexOfY) {\n for (i = 0; i < dataLength; i++) {\n xData[i] = this.autoIncrement();\n yData[i] = data[i][indexOfY];\n }\n }\n else {\n for (i = 0; i < dataLength; i++) {\n pt = data[i];\n xData[i] = pt[indexOfX];\n yData[i] = pt[indexOfY];\n }\n }\n }\n }\n else {\n // Highcharts expects configs to be numbers or arrays in\n // turbo mode\n error(12, false, chart);\n }\n }\n else {\n for (i = 0; i < dataLength; i++) {\n // stray commas in oldIE:\n if (typeof data[i] !== 'undefined') {\n pt = { series: series };\n series.pointClass.prototype.applyOptions.apply(pt, [data[i]]);\n series.updateParallelArrays(pt, i);\n }\n }\n }\n // Forgetting to cast strings to numbers is a common caveat when\n // handling CSV or JSON\n if (yData && isString(yData[0])) {\n error(14, true, chart);\n }\n series.data = [];\n series.options.data = series.userOptions.data = data;\n // destroy old points\n i = oldDataLength;\n while (i--) {\n if (oldData[i] && (oldData[i].destroy)) {\n oldData[i].destroy();\n }\n }\n // reset minRange (#878)\n if (xAxis) {\n xAxis.minRange = xAxis.userMinRange;\n }\n // redraw\n series.isDirty = chart.isDirtyBox = true;\n series.isDirtyData = !!oldData;\n animation = false;\n }\n // Typically for pie series, points need to be processed and\n // generated prior to rendering the legend\n if (options.legendType === 'point') {\n this.processData();\n this.generatePoints();\n }\n if (redraw) {\n chart.redraw(animation);\n }\n };\n /**\n * Internal function to sort series data\n *\n * @private\n * @function Highcharts.Series#sortData\n * @param {Array} data\n * Force data grouping.\n */\n Series.prototype.sortData = function (data) {\n var series = this,\n options = series.options,\n dataSorting = options.dataSorting,\n sortKey = dataSorting.sortKey || 'y',\n getPointOptionsObject = function (series,\n pointOptions) {\n return (defined(pointOptions) &&\n series.pointClass.prototype.optionsToObject.call({\n series: series\n },\n pointOptions)) || {};\n };\n data.forEach(function (pointOptions, i) {\n data[i] = getPointOptionsObject(series, pointOptions);\n data[i].index = i;\n }, this);\n // Sorting\n var sortedData = data.concat().sort(function (a,\n b) {\n var aValue = getNestedProperty(sortKey,\n a);\n var bValue = getNestedProperty(sortKey,\n b);\n return bValue < aValue ? -1 : bValue > aValue ? 1 : 0;\n });\n // Set x value depending on the position in the array\n sortedData.forEach(function (point, i) {\n point.x = i;\n }, this);\n // Set the same x for linked series points if they don't have their\n // own sorting\n if (series.linkedSeries) {\n series.linkedSeries.forEach(function (linkedSeries) {\n var options = linkedSeries.options,\n seriesData = options.data;\n if ((!options.dataSorting ||\n !options.dataSorting.enabled) &&\n seriesData) {\n seriesData.forEach(function (pointOptions, i) {\n seriesData[i] = getPointOptionsObject(linkedSeries, pointOptions);\n if (data[i]) {\n seriesData[i].x = data[i].x;\n seriesData[i].index = i;\n }\n });\n linkedSeries.setData(seriesData, false);\n }\n });\n }\n return data;\n };\n /**\n * Internal function to process the data by cropping away unused data\n * points if the series is longer than the crop threshold. This saves\n * computing time for large series.\n *\n * @private\n * @function Highcharts.Series#getProcessedData\n * @param {boolean} [forceExtremesFromAll]\n * Force getting extremes of a total series data range.\n */\n Series.prototype.getProcessedData = function (forceExtremesFromAll) {\n var series = this,\n xAxis = series.xAxis,\n options = series.options,\n cropThreshold = options.cropThreshold,\n getExtremesFromAll = forceExtremesFromAll ||\n series.getExtremesFromAll ||\n options.getExtremesFromAll, // #4599\n isCartesian = series.isCartesian,\n val2lin = xAxis && xAxis.val2lin,\n isLog = !!(xAxis && xAxis.logarithmic);\n var croppedData,\n cropped,\n cropStart = 0,\n distance,\n closestPointRange,\n i, // loop variable\n xExtremes,\n min,\n max, \n // copied during slice operation:\n processedXData = series.xData,\n processedYData = series.yData,\n throwOnUnsorted = series.requireSorting,\n updatingNames = false;\n var dataLength = processedXData.length;\n if (xAxis) {\n // corrected for log axis (#3053)\n xExtremes = xAxis.getExtremes();\n min = xExtremes.min;\n max = xExtremes.max;\n updatingNames = !!(xAxis.categories && !xAxis.names.length);\n }\n // optionally filter out points outside the plot area\n if (isCartesian &&\n series.sorted &&\n !getExtremesFromAll &&\n (!cropThreshold ||\n dataLength > cropThreshold ||\n series.forceCrop)) {\n // it's outside current extremes\n if (processedXData[dataLength - 1] < min ||\n processedXData[0] > max) {\n processedXData = [];\n processedYData = [];\n // only crop if it's actually spilling out\n }\n else if (series.yData && (processedXData[0] < min ||\n processedXData[dataLength - 1] > max)) {\n croppedData = this.cropData(series.xData, series.yData, min, max);\n processedXData = croppedData.xData;\n processedYData = croppedData.yData;\n cropStart = croppedData.start;\n cropped = true;\n }\n }\n // Find the closest distance between processed points\n i = processedXData.length || 1;\n while (--i) {\n distance = (isLog ?\n (val2lin(processedXData[i]) -\n val2lin(processedXData[i - 1])) :\n (processedXData[i] -\n processedXData[i - 1]));\n if (distance > 0 &&\n (typeof closestPointRange === 'undefined' ||\n distance < closestPointRange)) {\n closestPointRange = distance;\n // Unsorted data is not supported by the line tooltip, as well\n // as data grouping and navigation in Stock charts (#725) and\n // width calculation of columns (#1900).\n // Avoid warning during the premature processing pass in\n // updateNames (#16104).\n }\n else if (distance < 0 && throwOnUnsorted && !updatingNames) {\n error(15, false, series.chart);\n throwOnUnsorted = false; // Only once\n }\n }\n return {\n xData: processedXData,\n yData: processedYData,\n cropped: cropped,\n cropStart: cropStart,\n closestPointRange: closestPointRange\n };\n };\n /**\n * Internal function to apply processed data.\n * In Highcharts Stock, this function is extended to provide data grouping.\n *\n * @private\n * @function Highcharts.Series#processData\n * @param {boolean} [force]\n * Force data grouping.\n */\n Series.prototype.processData = function (force) {\n var series = this,\n xAxis = series.xAxis;\n // If the series data or axes haven't changed, don't go through\n // this. Return false to pass the message on to override methods\n // like in data grouping.\n if (series.isCartesian &&\n !series.isDirty &&\n !xAxis.isDirty &&\n !series.yAxis.isDirty &&\n !force) {\n return false;\n }\n var processedData = series.getProcessedData();\n // Record the properties\n series.cropped = processedData.cropped; // undefined or true\n series.cropStart = processedData.cropStart;\n series.processedXData = processedData.xData;\n series.processedYData = processedData.yData;\n series.closestPointRange = (series.basePointRange = processedData.closestPointRange);\n fireEvent(series, 'afterProcessData');\n };\n /**\n * Iterate over xData and crop values between min and max. Returns\n * object containing crop start/end cropped xData with corresponding\n * part of yData, dataMin and dataMax within the cropped range.\n *\n * @private\n * @function Highcharts.Series#cropData\n */\n Series.prototype.cropData = function (xData, yData, min, max, cropShoulder) {\n var dataLength = xData.length;\n var i,\n j,\n cropStart = 0,\n cropEnd = dataLength;\n // line-type series need one point outside\n cropShoulder = pick(cropShoulder, this.cropShoulder);\n // iterate up to find slice start\n for (i = 0; i < dataLength; i++) {\n if (xData[i] >= min) {\n cropStart = Math.max(0, i - cropShoulder);\n break;\n }\n }\n // proceed to find slice end\n for (j = i; j < dataLength; j++) {\n if (xData[j] > max) {\n cropEnd = j + cropShoulder;\n break;\n }\n }\n return {\n xData: xData.slice(cropStart, cropEnd),\n yData: yData.slice(cropStart, cropEnd),\n start: cropStart,\n end: cropEnd\n };\n };\n /**\n * Generate the data point after the data has been processed by cropping\n * away unused points and optionally grouped in Highcharts Stock.\n *\n * @private\n * @function Highcharts.Series#generatePoints\n */\n Series.prototype.generatePoints = function () {\n var series = this,\n options = series.options,\n dataOptions = (series.processedData || options.data),\n processedXData = series.processedXData,\n processedYData = series.processedYData,\n PointClass = series.pointClass,\n processedDataLength = processedXData.length,\n cropStart = series.cropStart || 0,\n hasGroupedData = series.hasGroupedData,\n keys = options.keys,\n points = [],\n groupCropStartIndex = (options.dataGrouping &&\n options.dataGrouping.groupAll ?\n cropStart :\n 0);\n var dataLength,\n cursor,\n point,\n i,\n data = series.data;\n if (!data && !hasGroupedData) {\n var arr = [];\n arr.length = dataOptions.length;\n data = series.data = arr;\n }\n if (keys && hasGroupedData) {\n // grouped data has already applied keys (#6590)\n series.options.keys = false;\n }\n for (i = 0; i < processedDataLength; i++) {\n cursor = cropStart + i;\n if (!hasGroupedData) {\n point = data[cursor];\n // #970:\n if (!point &&\n typeof dataOptions[cursor] !== 'undefined') {\n data[cursor] = point = (new PointClass()).init(series, dataOptions[cursor], processedXData[i]);\n }\n }\n else {\n // splat the y data in case of ohlc data array\n point = (new PointClass()).init(series, [processedXData[i]].concat(splat(processedYData[i])));\n point.dataGroup = series.groupMap[groupCropStartIndex + i];\n if (point.dataGroup.options) {\n point.options = point.dataGroup.options;\n extend(point, point.dataGroup.options);\n // Collision of props and options (#9770)\n delete point.dataLabels;\n }\n }\n if (point) { // #6279\n /**\n * Contains the point's index in the `Series.points` array.\n *\n * @name Highcharts.Point#index\n * @type {number}\n * @readonly\n */\n // For faster access in Point.update\n point.index = hasGroupedData ?\n (groupCropStartIndex + i) : cursor;\n points[i] = point;\n }\n }\n // restore keys options (#6590)\n series.options.keys = keys;\n // Hide cropped-away points - this only runs when the number of\n // points is above cropThreshold, or when swithching view from\n // non-grouped data to grouped data (#637)\n if (data &&\n (processedDataLength !== (dataLength = data.length) ||\n hasGroupedData)) {\n for (i = 0; i < dataLength; i++) {\n // when has grouped data, clear all points\n if (i === cropStart && !hasGroupedData) {\n i += processedDataLength;\n }\n if (data[i]) {\n data[i].destroyElements();\n data[i].plotX = void 0; // #1003\n }\n }\n }\n /**\n * Read only. An array containing those values converted to points.\n * In case the series data length exceeds the `cropThreshold`, or if\n * the data is grouped, `series.data` doesn't contain all the\n * points. Also, in case a series is hidden, the `data` array may be\n * empty. To access raw values, `series.options.data` will always be\n * up to date. `Series.data` only contains the points that have been\n * created on demand. To modify the data, use\n * {@link Highcharts.Series#setData} or\n * {@link Highcharts.Point#update}.\n *\n * @see Series.points\n *\n * @name Highcharts.Series#data\n * @type {Array}\n */\n series.data = data;\n /**\n * An array containing all currently visible point objects. In case\n * of cropping, the cropped-away points are not part of this array.\n * The `series.points` array starts at `series.cropStart` compared\n * to `series.data` and `series.options.data`. If however the series\n * data is grouped, these can't be correlated one to one. To modify\n * the data, use {@link Highcharts.Series#setData} or\n * {@link Highcharts.Point#update}.\n *\n * @name Highcharts.Series#points\n * @type {Array}\n */\n series.points = points;\n fireEvent(this, 'afterGeneratePoints');\n };\n /**\n * Get current X extremes for the visible data.\n *\n * @private\n * @function Highcharts.Series#getXExtremes\n * @param {Array} xData\n * The data to inspect. Defaults to the current data within the visible\n * range.\n */\n Series.prototype.getXExtremes = function (xData) {\n return {\n min: arrayMin(xData),\n max: arrayMax(xData)\n };\n };\n /**\n * Calculate Y extremes for the visible data. The result is returned\n * as an object with `dataMin` and `dataMax` properties.\n *\n * @private\n * @function Highcharts.Series#getExtremes\n * @param {Array} [yData]\n * The data to inspect. Defaults to the current data within the visible\n * range.\n * @param {boolean} [forceExtremesFromAll]\n * Force getting extremes of a total series data range.\n */\n Series.prototype.getExtremes = function (yData, forceExtremesFromAll) {\n var xAxis = this.xAxis,\n yAxis = this.yAxis,\n xData = this.processedXData || this.xData,\n activeYData = [], \n // Handle X outside the viewed area. This does not work with\n // non-sorted data like scatter (#7639).\n shoulder = this.requireSorting ? this.cropShoulder : 0,\n positiveValuesOnly = yAxis ? yAxis.positiveValuesOnly : false;\n // #2117, need to compensate for log X axis\n var xExtremes,\n validValue,\n withinRange,\n x,\n y,\n i,\n j,\n xMin = 0,\n xMax = 0,\n activeCounter = 0;\n yData = yData || this.stackedYData || this.processedYData || [];\n var yDataLength = yData.length;\n if (xAxis) {\n xExtremes = xAxis.getExtremes();\n xMin = xExtremes.min;\n xMax = xExtremes.max;\n }\n for (i = 0; i < yDataLength; i++) {\n x = xData[i];\n y = yData[i];\n // For points within the visible range, including the first\n // point outside the visible range (#7061), consider y extremes.\n validValue = ((isNumber(y) || isArray(y)) &&\n ((y.length || y > 0) || !positiveValuesOnly));\n withinRange = (forceExtremesFromAll ||\n this.getExtremesFromAll ||\n this.options.getExtremesFromAll ||\n this.cropped ||\n !xAxis || // for colorAxis support\n ((xData[i + shoulder] || x) >= xMin &&\n (xData[i - shoulder] || x) <= xMax));\n if (validValue && withinRange) {\n j = y.length;\n if (j) { // array, like ohlc or range data\n while (j--) {\n if (isNumber(y[j])) { // #7380, #11513\n activeYData[activeCounter++] = y[j];\n }\n }\n }\n else {\n activeYData[activeCounter++] = y;\n }\n }\n }\n var dataExtremes = {\n activeYData: activeYData,\n dataMin: arrayMin(activeYData),\n dataMax: arrayMax(activeYData)\n };\n fireEvent(this, 'afterGetExtremes', { dataExtremes: dataExtremes });\n return dataExtremes;\n };\n /**\n * Set the current data extremes as `dataMin` and `dataMax` on the\n * Series item. Use this only when the series properties should be\n * updated.\n *\n * @private\n * @function Highcharts.Series#applyExtremes\n */\n Series.prototype.applyExtremes = function () {\n var dataExtremes = this.getExtremes();\n /**\n * Contains the minimum value of the series' data point. Some series\n * types like `networkgraph` do not support this property as they\n * lack a `y`-value.\n * @name Highcharts.Series#dataMin\n * @type {number|undefined}\n * @readonly\n */\n this.dataMin = dataExtremes.dataMin;\n /**\n * Contains the maximum value of the series' data point. Some series\n * types like `networkgraph` do not support this property as they\n * lack a `y`-value.\n * @name Highcharts.Series#dataMax\n * @type {number|undefined}\n * @readonly\n */\n this.dataMax = dataExtremes.dataMax;\n return dataExtremes;\n };\n /**\n * Find and return the first non null point in the data\n *\n * @private\n * @function Highcharts.Series.getFirstValidPoint\n * @param {Array} data\n * Array of options for points\n */\n Series.prototype.getFirstValidPoint = function (data) {\n var dataLength = data.length;\n var i = 0,\n firstPoint = null;\n while (firstPoint === null && i < dataLength) {\n firstPoint = data[i];\n i++;\n }\n return firstPoint;\n };\n /**\n * Translate data points from raw data values to chart specific\n * positioning data needed later in the `drawPoints` and `drawGraph`\n * functions. This function can be overridden in plugins and custom\n * series type implementations.\n *\n * @function Highcharts.Series#translate\n *\n * @emits Highcharts.Series#events:translate\n */\n Series.prototype.translate = function () {\n if (!this.processedXData) { // hidden series\n this.processData();\n }\n this.generatePoints();\n var series = this,\n options = series.options,\n stacking = options.stacking,\n xAxis = series.xAxis,\n categories = xAxis.categories,\n enabledDataSorting = series.enabledDataSorting,\n yAxis = series.yAxis,\n points = series.points,\n dataLength = points.length,\n pointPlacement = series.pointPlacementToXValue(), // #7860\n dynamicallyPlaced = Boolean(pointPlacement),\n threshold = options.threshold,\n stackThreshold = options.startFromThreshold ? threshold : 0,\n zoneAxis = this.zoneAxis || 'y';\n var i,\n plotX,\n lastPlotX,\n stackIndicator,\n closestPointRangePx = Number.MAX_VALUE;\n /**\n * Plotted coordinates need to be within a limited range. Drawing\n * too far outside the viewport causes various rendering issues\n * (#3201, #3923, #7555).\n * @private\n */\n function limitedRange(val) {\n return clamp(val, -1e5, 1e5);\n }\n // Translate each point\n for (i = 0; i < dataLength; i++) {\n var point = points[i],\n xValue = point.x;\n var pointStack = void 0,\n stackValues = void 0,\n yValue = point.y,\n yBottom = point.low;\n var stack = stacking && yAxis.stacking && yAxis.stacking.stacks[(series.negStacks &&\n yValue <\n (stackThreshold ? 0 : threshold) ?\n '-' :\n '') + series.stackKey];\n if (yAxis.positiveValuesOnly &&\n !yAxis.validatePositiveValue(yValue) ||\n xAxis.positiveValuesOnly &&\n !xAxis.validatePositiveValue(xValue)) {\n point.isNull = true;\n }\n /**\n * The translated X value for the point in terms of pixels. Relative\n * to the X axis position if the series has one, otherwise relative\n * to the plot area. Depending on the series type this value might\n * not be defined.\n * @name Highcharts.Point#plotX\n * @type {number|undefined}\n */\n point.plotX = plotX = correctFloat(// #5236\n // Get the plotX translation\n limitedRange(xAxis.translate(// #3923\n xValue, 0, 0, 0, 1, pointPlacement, this.type === 'flags')) // #3923\n );\n // Calculate the bottom y value for stacked series\n if (stacking &&\n series.visible &&\n stack &&\n stack[xValue]) {\n stackIndicator = series.getStackIndicator(stackIndicator, xValue, series.index);\n if (!point.isNull && stackIndicator.key) {\n pointStack = stack[xValue];\n stackValues = pointStack.points[stackIndicator.key];\n }\n if (pointStack && isArray(stackValues)) {\n yBottom = stackValues[0];\n yValue = stackValues[1];\n if (yBottom === stackThreshold &&\n stackIndicator.key === stack[xValue].base) {\n yBottom = pick(isNumber(threshold) ? threshold : yAxis.min);\n }\n // #1200, #1232\n if (yAxis.positiveValuesOnly &&\n defined(yBottom) &&\n yBottom <= 0) {\n yBottom = void 0;\n }\n point.total = point.stackTotal = pick(pointStack.total);\n point.percentage = defined(point.y) && pointStack.total ?\n (point.y / pointStack.total * 100) : void 0;\n point.stackY = yValue;\n // Place the stack label\n // in case of variwide series (where widths of points are\n // different in most cases), stack labels are positioned\n // wrongly, so the call of the setOffset is omited here and\n // labels are correctly positioned later, at the end of the\n // variwide's translate function (#10962)\n if (!series.irregularWidths) {\n pointStack.setOffset(series.pointXOffset || 0, series.barW || 0, void 0, void 0, void 0, series.xAxis);\n }\n }\n }\n // Set translated yBottom or remove it\n point.yBottom = defined(yBottom) ?\n limitedRange(yAxis.translate(yBottom, 0, 1, 0, 1)) :\n void 0;\n // General hook, used for Highcharts Stock compare and cumulative\n if (series.dataModify) {\n yValue = series.dataModify.modifyValue(yValue, i);\n }\n // Set the the plotY value, reset it for redraws\n // #3201\n point.plotY = void 0;\n if (isNumber(yValue)) {\n var translated = yAxis.translate(yValue,\n false,\n true,\n false,\n true);\n if (typeof translated !== 'undefined') {\n /**\n * The translated Y value for the point in terms of pixels.\n * Relative to the Y axis position if the series has one,\n * otherwise relative to the plot area. Depending on the\n * series type this value might not be defined.\n * @name Highcharts.Point#plotY\n * @type {number|undefined}\n */\n point.plotY = limitedRange(translated);\n }\n }\n point.isInside = this.isPointInside(point);\n // Set client related positions for mouse tracking\n point.clientX = dynamicallyPlaced ?\n correctFloat(xAxis.translate(xValue, 0, 0, 0, 1, pointPlacement)) :\n plotX; // #1514, #5383, #5518\n // Negative points. For bubble charts, this means negative z\n // values (#9728)\n point.negative = point[zoneAxis] < (options[zoneAxis + 'Threshold'] ||\n threshold ||\n 0);\n // some API data\n point.category = pick(categories && categories[point.x], point.x);\n // Determine auto enabling of markers (#3635, #5099)\n if (!point.isNull && point.visible !== false) {\n if (typeof lastPlotX !== 'undefined') {\n closestPointRangePx = Math.min(closestPointRangePx, Math.abs(plotX - lastPlotX));\n }\n lastPlotX = plotX;\n }\n // Find point zone\n point.zone = this.zones.length ? point.getZone() : void 0;\n // Animate new points with data sorting\n if (!point.graphic && series.group && enabledDataSorting) {\n point.isNew = true;\n }\n }\n series.closestPointRangePx = closestPointRangePx;\n fireEvent(this, 'afterTranslate');\n };\n /**\n * Return the series points with null points filtered out.\n *\n * @function Highcharts.Series#getValidPoints\n *\n * @param {Array} [points]\n * The points to inspect, defaults to {@link Series.points}.\n *\n * @param {boolean} [insideOnly=false]\n * Whether to inspect only the points that are inside the visible view.\n *\n * @param {boolean} [allowNull=false]\n * Whether to allow null points to pass as valid points.\n *\n * @return {Array}\n * The valid points.\n */\n Series.prototype.getValidPoints = function (points, insideOnly, allowNull) {\n var chart = this.chart;\n // #3916, #5029, #5085\n return (points || this.points || []).filter(function (point) {\n if (insideOnly && !chart.isInsidePlot(point.plotX, point.plotY, { inverted: chart.inverted })) {\n return false;\n }\n return point.visible !== false &&\n (allowNull || !point.isNull);\n });\n };\n /**\n * Get the clipping for the series. Could be called for a series to\n * initiate animating the clip or to set the final clip (only width\n * and x).\n *\n * @private\n * @function Highcharts.Series#getClip\n */\n Series.prototype.getClipBox = function () {\n var _a = this,\n chart = _a.chart,\n xAxis = _a.xAxis,\n yAxis = _a.yAxis;\n // If no axes on the series, use global clipBox\n var seriesBox = merge(chart.clipBox);\n // Otherwise, use clipBox.width which is corrected for plotBorderWidth\n // and clipOffset\n if (xAxis && xAxis.len !== chart.plotSizeX) {\n seriesBox.width = xAxis.len;\n }\n if (yAxis && yAxis.len !== chart.plotSizeY) {\n seriesBox.height = yAxis.len;\n }\n return seriesBox;\n };\n /**\n * Get the shared clip key, creating it if it doesn't exist.\n *\n * @private\n * @function Highcharts.Series#getSharedClipKey\n */\n Series.prototype.getSharedClipKey = function () {\n this.sharedClipKey = (this.options.xAxis || 0) + ',' +\n (this.options.yAxis || 0);\n return this.sharedClipKey;\n };\n /**\n * Set the clipping for the series. For animated series the clip is later\n * modified.\n *\n * @private\n * @function Highcharts.Series#setClip\n */\n Series.prototype.setClip = function () {\n var _a = this,\n chart = _a.chart,\n group = _a.group,\n markerGroup = _a.markerGroup,\n sharedClips = chart.sharedClips,\n renderer = chart.renderer,\n clipBox = this.getClipBox(),\n sharedClipKey = this.getSharedClipKey(); // #4526\n var clipRect = sharedClips[sharedClipKey];\n // If a clipping rectangle for the same set of axes does not exist,\n // create it\n if (!clipRect) {\n sharedClips[sharedClipKey] = clipRect = renderer.clipRect(clipBox);\n // When setting chart size, or when the series is rendered again before\n // starting animating, in compliance to a responsive rule\n }\n else {\n clipRect.animate(clipBox);\n }\n if (group) {\n // When clip is false, reset to no clip after animation\n group.clip(this.options.clip === false ? void 0 : clipRect);\n }\n // Unclip temporary animation clip\n if (markerGroup) {\n markerGroup.clip();\n }\n };\n /**\n * Animate in the series. Called internally twice. First with the `init`\n * parameter set to true, which sets up the initial state of the\n * animation. Then when ready, it is called with the `init` parameter\n * undefined, in order to perform the actual animation.\n *\n * @function Highcharts.Series#animate\n *\n * @param {boolean} [init]\n * Initialize the animation.\n */\n Series.prototype.animate = function (init) {\n var _a = this, chart = _a.chart, group = _a.group, markerGroup = _a.markerGroup, inverted = chart.inverted, animation = animObject(this.options.animation), \n // The key for temporary animation clips\n animationClipKey = [\n this.getSharedClipKey(),\n animation.duration,\n animation.easing,\n animation.defer\n ].join(',');\n var animationClipRect = chart.sharedClips[animationClipKey],\n markerAnimationClipRect = chart.sharedClips[animationClipKey + 'm'];\n // Initialize the animation. Set up the clipping rectangle.\n if (init && group) {\n var clipBox = this.getClipBox();\n // Create temporary animation clips\n if (!animationClipRect) {\n clipBox.width = 0;\n if (inverted) {\n clipBox.x = chart.plotHeight;\n }\n animationClipRect = chart.renderer.clipRect(clipBox);\n chart.sharedClips[animationClipKey] = animationClipRect;\n // The marker clip box. The number 99 is a safe margin to avoid\n // markers being clipped during animation.\n var markerClipBox = {\n x: inverted ? -99 : -99,\n y: inverted ? -99 : -99,\n width: inverted ? chart.plotWidth + 199 : 99,\n height: inverted ? 99 : chart.plotHeight + 199\n };\n markerAnimationClipRect = chart.renderer.clipRect(markerClipBox);\n chart.sharedClips[animationClipKey + 'm'] = markerAnimationClipRect;\n }\n else {\n // When height changes during animation, typically due to\n // responsive settings\n animationClipRect.attr('height', clipBox.height);\n }\n group.clip(animationClipRect);\n if (markerGroup) {\n markerGroup.clip(markerAnimationClipRect);\n }\n // Run the animation\n }\n else if (animationClipRect &&\n // Only first series in this pane\n !animationClipRect.hasClass('highcharts-animating')) {\n var finalBox = this.getClipBox(),\n step_1 = animation.step;\n // Only do this when there are actually markers\n if (markerGroup && markerGroup.element.childNodes.length) {\n // To provide as smooth animation as possible, update the marker\n // group clipping in steps of the main group animation\n animation.step = function (val, fx) {\n if (step_1) {\n step_1.apply(fx, arguments);\n }\n if (fx.prop === 'width' &&\n markerAnimationClipRect &&\n markerAnimationClipRect.element) {\n markerAnimationClipRect.attr(inverted ? 'height' : 'width', val + 99);\n }\n };\n }\n animationClipRect\n .addClass('highcharts-animating')\n .animate(finalBox, animation);\n }\n };\n /**\n * This runs after animation to land on the final plot clipping.\n *\n * @private\n * @function Highcharts.Series#afterAnimate\n *\n * @emits Highcharts.Series#event:afterAnimate\n */\n Series.prototype.afterAnimate = function () {\n var _this = this;\n this.setClip();\n // Destroy temporary clip rectangles that are no longer in use\n objectEach(this.chart.sharedClips, function (clip, key, sharedClips) {\n if (clip && !_this.chart.container.querySelector(\"[clip-path=\\\"url(#\".concat(clip.id, \")\\\"]\"))) {\n clip.destroy();\n delete sharedClips[key];\n }\n });\n this.finishedAnimating = true;\n fireEvent(this, 'afterAnimate');\n };\n /**\n * Draw the markers for line-like series types, and columns or other\n * graphical representation for {@link Point} objects for other series\n * types. The resulting element is typically stored as\n * {@link Point.graphic}, and is created on the first call and updated\n * and moved on subsequent calls.\n *\n * @function Highcharts.Series#drawPoints\n */\n Series.prototype.drawPoints = function (points) {\n if (points === void 0) { points = this.points; }\n var series = this,\n chart = series.chart,\n styledMode = chart.styledMode,\n colorAxis = series.colorAxis,\n options = series.options,\n seriesMarkerOptions = options.marker,\n markerGroup = series[series.specialGroup || 'markerGroup'],\n xAxis = series.xAxis,\n globallyEnabled = pick(seriesMarkerOptions.enabled, !xAxis || xAxis.isRadial ? true : null, \n // Use larger or equal as radius is null in bubbles (#6321)\n series.closestPointRangePx >= (seriesMarkerOptions.enabledThreshold *\n seriesMarkerOptions.radius));\n var i,\n point,\n graphic,\n verb,\n pointMarkerOptions,\n hasPointMarker,\n markerAttribs;\n if (seriesMarkerOptions.enabled !== false ||\n series._hasPointMarkers) {\n for (i = 0; i < points.length; i++) {\n point = points[i];\n graphic = point.graphic;\n verb = graphic ? 'animate' : 'attr';\n pointMarkerOptions = point.marker || {};\n hasPointMarker = !!point.marker;\n var shouldDrawMarker = ((globallyEnabled &&\n typeof pointMarkerOptions.enabled === 'undefined') || pointMarkerOptions.enabled) && !point.isNull && point.visible !== false;\n // only draw the point if y is defined\n if (shouldDrawMarker) {\n // Shortcuts\n var symbol = pick(pointMarkerOptions.symbol,\n series.symbol, 'rect');\n markerAttribs = series.markerAttribs(point, (point.selected && 'select'));\n // Set starting position for point sliding animation.\n if (series.enabledDataSorting) {\n point.startXPos = xAxis.reversed ?\n -(markerAttribs.width || 0) :\n xAxis.width;\n }\n var isInside = point.isInside !== false;\n if (!graphic &&\n isInside &&\n ((markerAttribs.width || 0) > 0 || point.hasImage)) {\n /**\n * SVG graphic representing the point in the chart. In\n * some cases it may be a hidden graphic to improve\n * accessibility.\n *\n * Typically this is a simple shape, like a `rect`\n * for column charts or `path` for line markers, but\n * for some complex series types like boxplot or 3D\n * charts, the graphic may be a `g` element\n * containing other shapes. The graphic is generated\n * the first time {@link Series#drawPoints} runs,\n * and updated and moved on subsequent runs.\n *\n * @see Highcharts.Point#graphics\n *\n * @name Highcharts.Point#graphic\n * @type {Highcharts.SVGElement|undefined}\n */\n point.graphic = graphic = chart.renderer\n .symbol(symbol, markerAttribs.x, markerAttribs.y, markerAttribs.width, markerAttribs.height, hasPointMarker ?\n pointMarkerOptions :\n seriesMarkerOptions)\n .add(markerGroup);\n // Sliding animation for new points\n if (series.enabledDataSorting &&\n chart.hasRendered) {\n graphic.attr({\n x: point.startXPos\n });\n verb = 'animate';\n }\n }\n if (graphic && verb === 'animate') { // update\n // Since the marker group isn't clipped, each\n // individual marker must be toggled\n graphic[isInside ? 'show' : 'hide'](isInside)\n .animate(markerAttribs);\n }\n // Presentational attributes\n if (graphic) {\n var pointAttr = series.pointAttribs(point, ((styledMode || !point.selected) ?\n void 0 :\n 'select'));\n if (!styledMode) {\n graphic[verb](pointAttr);\n }\n else if (colorAxis) { // #14114\n graphic['css']({\n fill: pointAttr.fill\n });\n }\n }\n if (graphic) {\n graphic.addClass(point.getClassName(), true);\n }\n }\n else if (graphic) {\n point.graphic = graphic.destroy(); // #1269\n }\n }\n }\n };\n /**\n * Get non-presentational attributes for a point. Used internally for\n * both styled mode and classic. Can be overridden for different series\n * types.\n *\n * @see Series#pointAttribs\n *\n * @function Highcharts.Series#markerAttribs\n *\n * @param {Highcharts.Point} point\n * The Point to inspect.\n *\n * @param {string} [state]\n * The state, can be either `hover`, `select` or undefined.\n *\n * @return {Highcharts.SVGAttributes}\n * A hash containing those attributes that are not settable from CSS.\n */\n Series.prototype.markerAttribs = function (point, state) {\n var seriesOptions = this.options,\n seriesMarkerOptions = seriesOptions.marker,\n pointMarkerOptions = point.marker || {},\n symbol = (pointMarkerOptions.symbol ||\n seriesMarkerOptions.symbol),\n attribs = {};\n var seriesStateOptions,\n pointStateOptions,\n radius = pick(pointMarkerOptions.radius,\n seriesMarkerOptions && seriesMarkerOptions.radius);\n // Handle hover and select states\n if (state) {\n seriesStateOptions = seriesMarkerOptions.states[state];\n pointStateOptions = pointMarkerOptions.states &&\n pointMarkerOptions.states[state];\n radius = pick(pointStateOptions && pointStateOptions.radius, seriesStateOptions && seriesStateOptions.radius, radius && radius + (seriesStateOptions && seriesStateOptions.radiusPlus ||\n 0));\n }\n point.hasImage = symbol && symbol.indexOf('url') === 0;\n if (point.hasImage) {\n radius = 0; // and subsequently width and height is not set\n }\n var pos = point.pos();\n if (isNumber(radius) && pos) {\n attribs.x = pos[0] - radius;\n attribs.y = pos[1] - radius;\n if (seriesOptions.crisp) {\n // Math.floor for #1843:\n attribs.x = Math.floor(attribs.x);\n }\n }\n if (radius) {\n attribs.width = attribs.height = 2 * radius;\n }\n return attribs;\n };\n /**\n * Internal function to get presentational attributes for each point.\n * Unlike {@link Series#markerAttribs}, this function should return\n * those attributes that can also be set in CSS. In styled mode,\n * `pointAttribs` won't be called.\n *\n * @private\n * @function Highcharts.Series#pointAttribs\n *\n * @param {Highcharts.Point} [point]\n * The point instance to inspect.\n *\n * @param {string} [state]\n * The point state, can be either `hover`, `select` or 'normal'. If\n * undefined, normal state is assumed.\n *\n * @return {Highcharts.SVGAttributes}\n * The presentational attributes to be set on the point.\n */\n Series.prototype.pointAttribs = function (point, state) {\n var seriesMarkerOptions = this.options.marker,\n pointOptions = point && point.options,\n pointMarkerOptions = ((pointOptions && pointOptions.marker) || {}),\n pointColorOption = pointOptions && pointOptions.color,\n pointColor = point && point.color,\n zoneColor = point && point.zone && point.zone.color;\n var seriesStateOptions,\n pointStateOptions,\n color = this.color,\n fill,\n stroke,\n strokeWidth = pick(pointMarkerOptions.lineWidth,\n seriesMarkerOptions.lineWidth),\n opacity = 1;\n color = (pointColorOption ||\n zoneColor ||\n pointColor ||\n color);\n fill = (pointMarkerOptions.fillColor ||\n seriesMarkerOptions.fillColor ||\n color);\n stroke = (pointMarkerOptions.lineColor ||\n seriesMarkerOptions.lineColor ||\n color);\n // Handle hover and select states\n state = state || 'normal';\n if (state) {\n seriesStateOptions = (seriesMarkerOptions.states[state] || {});\n pointStateOptions = (pointMarkerOptions.states &&\n pointMarkerOptions.states[state]) || {};\n strokeWidth = pick(pointStateOptions.lineWidth, seriesStateOptions.lineWidth, strokeWidth + pick(pointStateOptions.lineWidthPlus, seriesStateOptions.lineWidthPlus, 0));\n fill = (pointStateOptions.fillColor ||\n seriesStateOptions.fillColor ||\n fill);\n stroke = (pointStateOptions.lineColor ||\n seriesStateOptions.lineColor ||\n stroke);\n opacity = pick(pointStateOptions.opacity, seriesStateOptions.opacity, opacity);\n }\n return {\n 'stroke': stroke,\n 'stroke-width': strokeWidth,\n 'fill': fill,\n 'opacity': opacity\n };\n };\n /**\n * Clear DOM objects and free up memory.\n *\n * @private\n * @function Highcharts.Series#destroy\n *\n * @emits Highcharts.Series#event:destroy\n */\n Series.prototype.destroy = function (keepEventsForUpdate) {\n var series = this,\n chart = series.chart,\n issue134 = /AppleWebKit\\/533/.test(win.navigator.userAgent),\n data = series.data || [];\n var destroy,\n i,\n point,\n axis;\n // add event hook\n fireEvent(series, 'destroy', { keepEventsForUpdate: keepEventsForUpdate });\n // remove events\n this.removeEvents(keepEventsForUpdate);\n // erase from axes\n (series.axisTypes || []).forEach(function (AXIS) {\n axis = series[AXIS];\n if (axis && axis.series) {\n erase(axis.series, series);\n axis.isDirty = axis.forceRedraw = true;\n }\n });\n // remove legend items\n if (series.legendItem) {\n series.chart.legend.destroyItem(series);\n }\n // destroy all points with their elements\n i = data.length;\n while (i--) {\n point = data[i];\n if (point && point.destroy) {\n point.destroy();\n }\n }\n if (series.clips) {\n series.clips.forEach(function (clip) { return clip.destroy(); });\n }\n // Clear the animation timeout if we are destroying the series\n // during initial animation\n U.clearTimeout(series.animationTimeout);\n // Destroy all SVGElements associated to the series\n objectEach(series, function (val, prop) {\n // Survive provides a hook for not destroying\n if (val instanceof SVGElement && !val.survive) {\n // issue 134 workaround\n destroy = issue134 && prop === 'group' ?\n 'hide' :\n 'destroy';\n val[destroy]();\n }\n });\n // remove from hoverSeries\n if (chart.hoverSeries === series) {\n chart.hoverSeries = void 0;\n }\n erase(chart.series, series);\n chart.orderSeries();\n // clear all members\n objectEach(series, function (val, prop) {\n if (!keepEventsForUpdate || prop !== 'hcEvents') {\n delete series[prop];\n }\n });\n };\n /**\n * Clip the graphs into zones for colors and styling.\n *\n * @private\n * @function Highcharts.Series#applyZones\n */\n Series.prototype.applyZones = function () {\n var series = this,\n chart = this.chart,\n renderer = chart.renderer,\n zones = this.zones,\n clips = (this.clips || []),\n graph = this.graph,\n area = this.area,\n plotSizeMax = Math.max(chart.plotWidth,\n chart.plotHeight),\n axis = this[(this.zoneAxis || 'y') + 'Axis'],\n inverted = chart.inverted;\n var translatedFrom,\n translatedTo,\n clipAttr,\n extremes,\n reversed,\n horiz,\n pxRange,\n pxPosMin,\n pxPosMax,\n zoneArea,\n zoneGraph,\n ignoreZones = false;\n if (zones.length &&\n (graph || area) &&\n axis &&\n typeof axis.min !== 'undefined') {\n reversed = axis.reversed;\n horiz = axis.horiz;\n // The use of the Color Threshold assumes there are no gaps\n // so it is safe to hide the original graph and area\n // unless it is not waterfall series, then use showLine property\n // to set lines between columns to be visible (#7862)\n if (graph && !this.showLine) {\n graph.hide();\n }\n if (area) {\n area.hide();\n }\n // Create the clips\n extremes = axis.getExtremes();\n zones.forEach(function (threshold, i) {\n translatedFrom = reversed ?\n (horiz ? chart.plotWidth : 0) :\n (horiz ? 0 : (axis.toPixels(extremes.min) || 0));\n translatedFrom = clamp(pick(translatedTo, translatedFrom), 0, plotSizeMax);\n translatedTo = clamp(Math.round(axis.toPixels(pick(threshold.value, extremes.max), true) || 0), 0, plotSizeMax);\n if (ignoreZones) {\n translatedFrom = translatedTo =\n axis.toPixels(extremes.max);\n }\n pxRange = Math.abs(translatedFrom - translatedTo);\n pxPosMin = Math.min(translatedFrom, translatedTo);\n pxPosMax = Math.max(translatedFrom, translatedTo);\n if (axis.isXAxis) {\n clipAttr = {\n x: inverted ? pxPosMax : pxPosMin,\n y: 0,\n width: pxRange,\n height: plotSizeMax\n };\n if (!horiz) {\n clipAttr.x = chart.plotHeight - clipAttr.x;\n }\n }\n else {\n clipAttr = {\n x: 0,\n y: inverted ? pxPosMax : pxPosMin,\n width: plotSizeMax,\n height: pxRange\n };\n if (horiz) {\n clipAttr.y = chart.plotWidth - clipAttr.y;\n }\n }\n // VML SUPPPORT\n if (inverted && renderer.isVML) {\n if (axis.isXAxis) {\n clipAttr = {\n x: 0,\n y: reversed ? pxPosMin : pxPosMax,\n height: clipAttr.width,\n width: chart.chartWidth\n };\n }\n else {\n clipAttr = {\n x: (clipAttr.y -\n chart.plotLeft -\n chart.spacingBox.x),\n y: 0,\n width: clipAttr.height,\n height: chart.chartHeight\n };\n }\n }\n // END OF VML SUPPORT\n if (clips[i]) {\n clips[i].animate(clipAttr);\n }\n else {\n clips[i] = renderer.clipRect(clipAttr);\n }\n // when no data, graph zone is not applied and after setData\n // clip was ignored. As a result, it should be applied each\n // time.\n zoneArea = series['zone-area-' + i];\n zoneGraph = series['zone-graph-' + i];\n if (graph && zoneGraph) {\n zoneGraph.clip(clips[i]);\n }\n if (area && zoneArea) {\n zoneArea.clip(clips[i]);\n }\n // if this zone extends out of the axis, ignore the others\n ignoreZones = threshold.value > extremes.max;\n // Clear translatedTo for indicators\n if (series.resetZones && translatedTo === 0) {\n translatedTo = void 0;\n }\n });\n this.clips = clips;\n }\n else if (series.visible) {\n // If zones were removed, restore graph and area\n if (graph) {\n graph.show();\n }\n if (area) {\n area.show();\n }\n }\n };\n /**\n * General abstraction for creating plot groups like series.group,\n * series.dataLabelsGroup and series.markerGroup. On subsequent calls,\n * the group will only be adjusted to the updated plot size.\n *\n * @private\n * @function Highcharts.Series#plotGroup\n */\n Series.prototype.plotGroup = function (prop, name, visibility, zIndex, parent) {\n var group = this[prop];\n var isNew = !group,\n attrs = {\n visibility: visibility,\n zIndex: zIndex || 0.1 // IE8 and pointer logic use this\n };\n // Avoid setting undefined opacity, or in styled mode\n if (typeof this.opacity !== 'undefined' &&\n !this.chart.styledMode && this.state !== 'inactive' // #13719\n ) {\n attrs.opacity = this.opacity;\n }\n // Generate it on first call\n if (isNew) {\n this[prop] = group = this.chart.renderer\n .g()\n .add(parent);\n }\n // Add the class names, and replace existing ones as response to\n // Series.update (#6660)\n group.addClass(('highcharts-' + name +\n ' highcharts-series-' + this.index +\n ' highcharts-' + this.type + '-series ' +\n (defined(this.colorIndex) ?\n 'highcharts-color-' + this.colorIndex + ' ' :\n '') +\n (this.options.className || '') +\n (group.hasClass('highcharts-tracker') ?\n ' highcharts-tracker' :\n '')), true);\n // Place it on first and subsequent (redraw) calls\n group.attr(attrs)[isNew ? 'attr' : 'animate'](this.getPlotBox(name));\n return group;\n };\n /**\n * Get the translation and scale for the plot area of this series.\n *\n * @function Highcharts.Series#getPlotBox\n */\n Series.prototype.getPlotBox = function (name) {\n var horAxis = this.xAxis,\n vertAxis = this.yAxis;\n var chart = this.chart,\n inverted = (chart.inverted &&\n !chart.polar &&\n horAxis &&\n this.invertible !== false &&\n name === 'series');\n // Swap axes for inverted (#2339)\n if (chart.inverted) {\n horAxis = vertAxis;\n vertAxis = this.xAxis;\n }\n return {\n translateX: horAxis ? horAxis.left : chart.plotLeft,\n translateY: vertAxis ? vertAxis.top : chart.plotTop,\n rotation: inverted ? 90 : 0,\n rotationOriginX: inverted ?\n (horAxis.len - vertAxis.len) / 2 :\n 0,\n rotationOriginY: inverted ?\n (horAxis.len + vertAxis.len) / 2 :\n 0,\n scaleX: inverted ? -1 : 1,\n scaleY: 1\n };\n };\n /**\n * Removes the event handlers attached previously with addEvents.\n * @private\n * @function Highcharts.Series#removeEvents\n */\n Series.prototype.removeEvents = function (keepEventsForUpdate) {\n var series = this;\n if (!keepEventsForUpdate) {\n // remove all events\n removeEvent(series);\n }\n if (series.eventsToUnbind.length) {\n // remove only internal events for proper update\n // #12355 - solves problem with multiple destroy events\n series.eventsToUnbind.forEach(function (unbind) {\n unbind();\n });\n series.eventsToUnbind.length = 0;\n }\n };\n /**\n * Render the graph and markers. Called internally when first rendering\n * and later when redrawing the chart. This function can be extended in\n * plugins, but normally shouldn't be called directly.\n *\n * @function Highcharts.Series#render\n *\n * @emits Highcharts.Series#event:afterRender\n */\n Series.prototype.render = function () {\n var series = this,\n chart = series.chart,\n options = series.options,\n animOptions = animObject(options.animation),\n visibility = series.visible ?\n 'inherit' : 'hidden', // #2597\n zIndex = options.zIndex,\n hasRendered = series.hasRendered,\n chartSeriesGroup = chart.seriesGroup,\n inverted = chart.inverted;\n // Animation doesn't work in IE8 quirks when the group div is\n // hidden, and looks bad in other oldIE\n var animDuration = (!series.finishedAnimating && chart.renderer.isSVG) ?\n animOptions.duration : 0;\n fireEvent(this, 'render');\n // the group\n var group = series.plotGroup('group', 'series', visibility, zIndex, chartSeriesGroup);\n series.markerGroup = series.plotGroup('markerGroup', 'markers', visibility, zIndex, chartSeriesGroup);\n // Initial clipping, applies to columns etc. (#3839).\n if (options.clip !== false) {\n series.setClip();\n }\n // Initialize the animation\n if (series.animate && animDuration) {\n series.animate(true);\n }\n // Draw the graph if any\n if (series.drawGraph) {\n series.drawGraph();\n series.applyZones();\n }\n // Draw the points\n if (series.visible) {\n series.drawPoints();\n }\n // Draw the data labels\n if (series.drawDataLabels) {\n series.drawDataLabels();\n }\n // In pie charts, slices are added to the DOM, but actual rendering\n // is postponed until labels reserved their space\n if (series.redrawPoints) {\n series.redrawPoints();\n }\n // draw the mouse tracking area\n if (series.drawTracker &&\n series.options.enableMouseTracking !== false) {\n series.drawTracker();\n }\n // Run the animation\n if (series.animate && animDuration) {\n series.animate();\n }\n // Call the afterAnimate function on animation complete (but don't\n // overwrite the animation.complete option which should be available\n // to the user).\n if (!hasRendered) {\n // Additional time if defer is defined before afterAnimate\n // will be triggered\n if (animDuration && animOptions.defer) {\n animDuration += animOptions.defer;\n }\n series.animationTimeout = syncTimeout(function () {\n series.afterAnimate();\n }, animDuration || 0);\n }\n // Means data is in accordance with what you see\n series.isDirty = false;\n // (See #322) series.isDirty = series.isDirtyData = false; // means\n // data is in accordance with what you see\n series.hasRendered = true;\n fireEvent(series, 'afterRender');\n };\n /**\n * Redraw the series. This function is called internally from\n * `chart.redraw` and normally shouldn't be called directly.\n * @private\n * @function Highcharts.Series#redraw\n */\n Series.prototype.redraw = function () {\n // Cache it here as it is set to false in render, but used after\n var wasDirty = this.isDirty || this.isDirtyData;\n this.translate();\n this.render();\n if (wasDirty) { // #3868, #3945\n delete this.kdTree;\n }\n };\n /**\n * Find the nearest point from a pointer event. This applies to series that\n * use k-d-trees to get the nearest point. Native pointer events must be\n * normalized using `Pointer.normalize`, that adds `chartX` and `chartY`\n * properties.\n *\n * @sample highcharts/demo/synchronized-charts\n * Synchronized charts with tooltips\n *\n * @function Highcharts.Series#searchPoint\n *\n * @param {Highcharts.PointerEvent} e\n * The normalized pointer event\n * @param {boolean} [compareX=false]\n * Search only by the X value, not Y\n *\n * @return {Point|undefined}\n * The closest point to the pointer event\n */\n Series.prototype.searchPoint = function (e, compareX) {\n var series = this,\n xAxis = series.xAxis,\n yAxis = series.yAxis,\n inverted = series.chart.inverted;\n return this.searchKDTree({\n clientX: inverted ?\n xAxis.len - e.chartY + xAxis.pos :\n e.chartX - xAxis.pos,\n plotY: inverted ?\n yAxis.len - e.chartX + yAxis.pos :\n e.chartY - yAxis.pos\n }, compareX, e);\n };\n /**\n * Build the k-d-tree that is used by mouse and touch interaction to get\n * the closest point. Line-like series typically have a one-dimensional\n * tree where points are searched along the X axis, while scatter-like\n * series typically search in two dimensions, X and Y.\n *\n * @private\n * @function Highcharts.Series#buildKDTree\n */\n Series.prototype.buildKDTree = function (e) {\n // Prevent multiple k-d-trees from being built simultaneously\n // (#6235)\n this.buildingKdTree = true;\n var series = this,\n dimensions = series.options.findNearestPointBy\n .indexOf('y') > -1 ? 2 : 1;\n /**\n * Internal function\n * @private\n */\n function _kdtree(points, depth, dimensions) {\n var length = points && points.length;\n var axis,\n median;\n if (length) {\n // alternate between the axis\n axis = series.kdAxisArray[depth % dimensions];\n // sort point array\n points.sort(function (a, b) {\n return a[axis] - b[axis];\n });\n median = Math.floor(length / 2);\n // build and return nod\n return {\n point: points[median],\n left: _kdtree(points.slice(0, median), depth + 1, dimensions),\n right: _kdtree(points.slice(median + 1), depth + 1, dimensions)\n };\n }\n }\n /**\n * Start the recursive build process with a clone of the points\n * array and null points filtered out. (#3873)\n * @private\n */\n function startRecursive() {\n series.kdTree = _kdtree(series.getValidPoints(null, \n // For line-type series restrict to plot area, but\n // column-type series not (#3916, #4511)\n !series.directTouch), dimensions, dimensions);\n series.buildingKdTree = false;\n }\n delete series.kdTree;\n // For testing tooltips, don't build async. Also if touchstart, we\n // may be dealing with click events on mobile, so don't delay\n // (#6817).\n syncTimeout(startRecursive, series.options.kdNow || (e && e.type === 'touchstart') ? 0 : 1);\n };\n /**\n * @private\n * @function Highcharts.Series#searchKDTree\n */\n Series.prototype.searchKDTree = function (point, compareX, e) {\n var series = this,\n kdX = this.kdAxisArray[0],\n kdY = this.kdAxisArray[1],\n kdComparer = compareX ? 'distX' : 'dist',\n kdDimensions = series.options.findNearestPointBy\n .indexOf('y') > -1 ? 2 : 1;\n /**\n * Set the one and two dimensional distance on the point object.\n * @private\n */\n function setDistance(p1, p2) {\n var x = (defined(p1[kdX]) &&\n defined(p2[kdX])) ?\n Math.pow(p1[kdX] - p2[kdX], 2) :\n null,\n y = (defined(p1[kdY]) &&\n defined(p2[kdY])) ?\n Math.pow(p1[kdY] - p2[kdY], 2) :\n null,\n r = (x || 0) + (y || 0);\n p2.dist = defined(r) ? Math.sqrt(r) : Number.MAX_VALUE;\n p2.distX = defined(x) ? Math.sqrt(x) : Number.MAX_VALUE;\n }\n /**\n * @private\n */\n function _search(search, tree, depth, dimensions) {\n var point = tree.point,\n axis = series.kdAxisArray[depth % dimensions];\n var nPoint1,\n nPoint2,\n ret = point;\n setDistance(search, point);\n // Pick side based on distance to splitting point\n var tdist = search[axis] - point[axis], sideA = tdist < 0 ? 'left' : 'right', sideB = tdist < 0 ? 'right' : 'left';\n // End of tree\n if (tree[sideA]) {\n nPoint1 = _search(search, tree[sideA], depth + 1, dimensions);\n ret = (nPoint1[kdComparer] <\n ret[kdComparer] ?\n nPoint1 :\n point);\n }\n if (tree[sideB]) {\n // compare distance to current best to splitting point to\n // decide whether to check side B or not\n if (Math.sqrt(tdist * tdist) < ret[kdComparer]) {\n nPoint2 = _search(search, tree[sideB], depth + 1, dimensions);\n ret = (nPoint2[kdComparer] <\n ret[kdComparer] ?\n nPoint2 :\n ret);\n }\n }\n return ret;\n }\n if (!this.kdTree && !this.buildingKdTree) {\n this.buildKDTree(e);\n }\n if (this.kdTree) {\n return _search(point, this.kdTree, kdDimensions, kdDimensions);\n }\n };\n /**\n * @private\n * @function Highcharts.Series#pointPlacementToXValue\n */\n Series.prototype.pointPlacementToXValue = function () {\n var _a = this,\n _b = _a.options,\n pointPlacement = _b.pointPlacement,\n pointRange = _b.pointRange,\n axis = _a.xAxis;\n var factor = pointPlacement;\n // Point placement is relative to each series pointRange (#5889)\n if (factor === 'between') {\n factor = axis.reversed ? -0.5 : 0.5; // #11955\n }\n return isNumber(factor) ?\n factor * (pointRange || axis.pointRange) :\n 0;\n };\n /**\n * @private\n * @function Highcharts.Series#isPointInside\n */\n Series.prototype.isPointInside = function (point) {\n var _a = this,\n chart = _a.chart,\n xAxis = _a.xAxis,\n yAxis = _a.yAxis,\n isInside = (typeof point.plotY !== 'undefined' &&\n typeof point.plotX !== 'undefined' &&\n point.plotY >= 0 &&\n point.plotY <= (yAxis ? yAxis.len : chart.plotHeight) &&\n point.plotX >= 0 &&\n point.plotX <= (xAxis ? xAxis.len : chart.plotWidth));\n return isInside;\n };\n /**\n * Draw the tracker object that sits above all data labels and markers to\n * track mouse events on the graph or points. For the line type charts\n * the tracker uses the same graphPath, but with a greater stroke width\n * for better control.\n * @private\n */\n Series.prototype.drawTracker = function () {\n var series = this,\n options = series.options,\n trackByArea = options.trackByArea,\n trackerPath = [].concat(trackByArea ?\n series.areaPath :\n series.graphPath), \n // trackerPathLength = trackerPath.length,\n chart = series.chart,\n pointer = chart.pointer,\n renderer = chart.renderer,\n snap = chart.options.tooltip.snap,\n tracker = series.tracker,\n onMouseOver = function (e) {\n if (chart.hoverSeries !== series) {\n series.onMouseOver();\n }\n }, \n /*\n * Empirical lowest possible opacities for TRACKER_FILL for an\n * element to stay invisible but clickable\n * IE6: 0.002\n * IE7: 0.002\n * IE8: 0.002\n * IE9: 0.00000000001 (unlimited)\n * IE10: 0.0001 (exporting only)\n * FF: 0.00000000001 (unlimited)\n * Chrome: 0.000001\n * Safari: 0.000001\n * Opera: 0.00000000001 (unlimited)\n */\n TRACKER_FILL = 'rgba(192,192,192,' + (svg ? 0.0001 : 0.002) + ')';\n var i;\n // Draw the tracker\n if (tracker) {\n tracker.attr({ d: trackerPath });\n }\n else if (series.graph) { // create\n series.tracker = renderer.path(trackerPath)\n .attr({\n visibility: series.visible ? 'inherit' : 'hidden',\n zIndex: 2\n })\n .addClass(trackByArea ?\n 'highcharts-tracker-area' :\n 'highcharts-tracker-line')\n .add(series.group);\n if (!chart.styledMode) {\n series.tracker.attr({\n 'stroke-linecap': 'round',\n 'stroke-linejoin': 'round',\n stroke: TRACKER_FILL,\n fill: trackByArea ? TRACKER_FILL : 'none',\n 'stroke-width': series.graph.strokeWidth() +\n (trackByArea ? 0 : 2 * snap)\n });\n }\n // The tracker is added to the series group, which is clipped, but\n // is covered by the marker group. So the marker group also needs to\n // capture events.\n [\n series.tracker,\n series.markerGroup,\n series.dataLabelsGroup\n ].forEach(function (tracker) {\n if (tracker) {\n tracker.addClass('highcharts-tracker')\n .on('mouseover', onMouseOver)\n .on('mouseout', function (e) {\n pointer.onTrackerMouseOut(e);\n });\n if (options.cursor && !chart.styledMode) {\n tracker.css({ cursor: options.cursor });\n }\n if (hasTouch) {\n tracker.on('touchstart', onMouseOver);\n }\n }\n });\n }\n fireEvent(this, 'afterDrawTracker');\n };\n /**\n * Add a point to the series after render time. The point can be added at\n * the end, or by giving it an X value, to the start or in the middle of the\n * series.\n *\n * @sample highcharts/members/series-addpoint-append/\n * Append point\n * @sample highcharts/members/series-addpoint-append-and-shift/\n * Append and shift\n * @sample highcharts/members/series-addpoint-x-and-y/\n * Both X and Y values given\n * @sample highcharts/members/series-addpoint-pie/\n * Append pie slice\n * @sample stock/members/series-addpoint/\n * Append 100 points in Highcharts Stock\n * @sample stock/members/series-addpoint-shift/\n * Append and shift in Highcharts Stock\n * @sample maps/members/series-addpoint/\n * Add a point in Highmaps\n *\n * @function Highcharts.Series#addPoint\n *\n * @param {Highcharts.PointOptionsType} options\n * The point options. If options is a single number, a point with\n * that y value is appended to the series. If it is an array, it will\n * be interpreted as x and y values respectively. If it is an\n * object, advanced options as outlined under `series.data` are\n * applied.\n *\n * @param {boolean} [redraw=true]\n * Whether to redraw the chart after the point is added. When adding\n * more than one point, it is highly recommended that the redraw\n * option be set to false, and instead {@link Chart#redraw} is\n * explicitly called after the adding of points is finished.\n * Otherwise, the chart will redraw after adding each point.\n *\n * @param {boolean} [shift=false]\n * If true, a point is shifted off the start of the series as one is\n * appended to the end.\n *\n * @param {boolean|Partial} [animation]\n * Whether to apply animation, and optionally animation\n * configuration.\n *\n * @param {boolean} [withEvent=true]\n * Used internally, whether to fire the series `addPoint` event.\n *\n * @emits Highcharts.Series#event:addPoint\n */\n Series.prototype.addPoint = function (options, redraw, shift, animation, withEvent) {\n var series = this,\n seriesOptions = series.options,\n data = series.data,\n chart = series.chart,\n xAxis = series.xAxis,\n names = xAxis && xAxis.hasNames && xAxis.names,\n dataOptions = seriesOptions.data,\n xData = series.xData;\n var isInTheMiddle,\n i;\n // Optional redraw, defaults to true\n redraw = pick(redraw, true);\n // Get options and push the point to xData, yData and series.options. In\n // series.generatePoints the Point instance will be created on demand\n // and pushed to the series.data array.\n var point = { series: series };\n series.pointClass.prototype.applyOptions.apply(point, [options]);\n var x = point.x;\n // Get the insertion point\n i = xData.length;\n if (series.requireSorting && x < xData[i - 1]) {\n isInTheMiddle = true;\n while (i && xData[i - 1] > x) {\n i--;\n }\n }\n // Insert undefined item\n series.updateParallelArrays(point, 'splice', i, 0, 0);\n // Update it\n series.updateParallelArrays(point, i);\n if (names && point.name) {\n names[x] = point.name;\n }\n dataOptions.splice(i, 0, options);\n if (isInTheMiddle ||\n // When processedData is present we need to splice an empty slot\n // into series.data, otherwise generatePoints won't pick it up.\n series.processedData) {\n series.data.splice(i, 0, null);\n series.processData();\n }\n // Generate points to be added to the legend (#1329)\n if (seriesOptions.legendType === 'point') {\n series.generatePoints();\n }\n // Shift the first point off the parallel arrays\n if (shift) {\n if (data[0] && (data[0].remove)) {\n data[0].remove(false);\n }\n else {\n data.shift();\n series.updateParallelArrays(point, 'shift');\n dataOptions.shift();\n }\n }\n // Fire event\n if (withEvent !== false) {\n fireEvent(series, 'addPoint', { point: point });\n }\n // redraw\n series.isDirty = true;\n series.isDirtyData = true;\n if (redraw) {\n chart.redraw(animation); // Animation is set anyway on redraw, #5665\n }\n };\n /**\n * Remove a point from the series. Unlike the\n * {@link Highcharts.Point#remove} method, this can also be done on a point\n * that is not instanciated because it is outside the view or subject to\n * Highcharts Stock data grouping.\n *\n * @sample highcharts/members/series-removepoint/\n * Remove cropped point\n *\n * @function Highcharts.Series#removePoint\n *\n * @param {number} i\n * The index of the point in the {@link Highcharts.Series.data|data}\n * array.\n *\n * @param {boolean} [redraw=true]\n * Whether to redraw the chart after the point is added. When\n * removing more than one point, it is highly recommended that the\n * `redraw` option be set to `false`, and instead {@link\n * Highcharts.Chart#redraw} is explicitly called after the adding of\n * points is finished.\n *\n * @param {boolean|Partial} [animation]\n * Whether and optionally how the series should be animated.\n *\n * @emits Highcharts.Point#event:remove\n */\n Series.prototype.removePoint = function (i, redraw, animation) {\n var series = this,\n data = series.data,\n point = data[i],\n points = series.points,\n chart = series.chart,\n remove = function () {\n if (points && points.length === data.length) { // #4935\n points.splice(i, 1);\n }\n data.splice(i, 1);\n series.options.data.splice(i, 1);\n series.updateParallelArrays(point || { series: series }, 'splice', i, 1);\n if (point) {\n point.destroy();\n }\n // redraw\n series.isDirty = true;\n series.isDirtyData = true;\n if (redraw) {\n chart.redraw();\n }\n };\n setAnimation(animation, chart);\n redraw = pick(redraw, true);\n // Fire the event with a default handler of removing the point\n if (point) {\n point.firePointEvent('remove', null, remove);\n }\n else {\n remove();\n }\n };\n /**\n * Remove a series and optionally redraw the chart.\n *\n * @sample highcharts/members/series-remove/\n * Remove first series from a button\n *\n * @function Highcharts.Series#remove\n *\n * @param {boolean} [redraw=true]\n * Whether to redraw the chart or wait for an explicit call to\n * {@link Highcharts.Chart#redraw}.\n *\n * @param {boolean|Partial} [animation]\n * Whether to apply animation, and optionally animation\n * configuration.\n *\n * @param {boolean} [withEvent=true]\n * Used internally, whether to fire the series `remove` event.\n *\n * @emits Highcharts.Series#event:remove\n */\n Series.prototype.remove = function (redraw, animation, withEvent, keepEvents) {\n var series = this,\n chart = series.chart;\n /**\n * @private\n */\n function remove() {\n // Destroy elements\n series.destroy(keepEvents);\n // Redraw\n chart.isDirtyLegend = chart.isDirtyBox = true;\n chart.linkSeries();\n if (pick(redraw, true)) {\n chart.redraw(animation);\n }\n }\n // Fire the event with a default handler of removing the point\n if (withEvent !== false) {\n fireEvent(series, 'remove', null, remove);\n }\n else {\n remove();\n }\n };\n /**\n * Update the series with a new set of options. For a clean and precise\n * handling of new options, all methods and elements from the series are\n * removed, and it is initialized from scratch. Therefore, this method is\n * more performance expensive than some other utility methods like {@link\n * Series#setData} or {@link Series#setVisible}.\n *\n * Note that `Series.update` may mutate the passed `data` options.\n *\n * @sample highcharts/members/series-update/\n * Updating series options\n * @sample maps/members/series-update/\n * Update series options in Highmaps\n *\n * @function Highcharts.Series#update\n *\n * @param {Highcharts.SeriesOptionsType} options\n * New options that will be merged with the series' existing options.\n *\n * @param {boolean} [redraw=true]\n * Whether to redraw the chart after the series is altered. If doing\n * more operations on the chart, it is a good idea to set redraw to\n * false and call {@link Chart#redraw} after.\n *\n * @emits Highcharts.Series#event:update\n * @emits Highcharts.Series#event:afterUpdate\n */\n Series.prototype.update = function (options, redraw) {\n options = cleanRecursively(options, this.userOptions);\n fireEvent(this, 'update', { options: options });\n var series = this,\n chart = series.chart, \n // must use user options when changing type because series.options\n // is merged in with type specific plotOptions\n oldOptions = series.userOptions,\n initialType = series.initialType || series.type,\n plotOptions = chart.options.plotOptions,\n initialSeriesProto = seriesTypes[initialType].prototype,\n groups = [\n 'group',\n 'markerGroup',\n 'dataLabelsGroup',\n 'transformGroup',\n 'shadowGroup'\n ], \n // Animation must be enabled when calling update before the initial\n // animation has first run. This happens when calling update\n // directly after chart initialization, or when applying responsive\n // rules (#6912).\n animation = series.finishedAnimating && { animation: false },\n kinds = {};\n var seriesOptions,\n n,\n preserve = [\n 'eventOptions',\n 'navigatorSeries',\n 'baseSeries'\n ],\n newType = (options.type ||\n oldOptions.type ||\n chart.options.chart.type);\n var keepPoints = !(\n // Indicators, histograms etc recalculate the data. It should be\n // possible to omit this.\n this.hasDerivedData ||\n // New type requires new point classes\n (newType && newType !== this.type) ||\n // New options affecting how the data points are built\n typeof options.pointStart !== 'undefined' ||\n typeof options.pointInterval !== 'undefined' ||\n typeof options.relativeXValue !== 'undefined' ||\n options.joinBy ||\n options.mapData || // #11636\n // Changes to data grouping requires new points in new group\n series.hasOptionChanged('dataGrouping') ||\n series.hasOptionChanged('pointStart') ||\n series.hasOptionChanged('pointInterval') ||\n series.hasOptionChanged('pointIntervalUnit') ||\n series.hasOptionChanged('keys'));\n newType = newType || initialType;\n if (keepPoints) {\n preserve.push('data', 'isDirtyData', 'points', 'processedData', // #17057\n 'processedXData', 'processedYData', 'xIncrement', 'cropped', '_hasPointMarkers', '_hasPointLabels', 'clips', // #15420\n // Networkgraph (#14397)\n 'nodes', 'layout', \n // Treemap\n 'level', \n // Map specific, consider moving it to series-specific preserve-\n // properties (#10617)\n 'mapMap', 'mapData', 'minY', 'maxY', 'minX', 'maxX');\n if (options.visible !== false) {\n preserve.push('area', 'graph');\n }\n series.parallelArrays.forEach(function (key) {\n preserve.push(key + 'Data');\n });\n if (options.data) {\n // setData uses dataSorting options so we need to update them\n // earlier\n if (options.dataSorting) {\n extend(series.options.dataSorting, options.dataSorting);\n }\n this.setData(options.data, false);\n }\n }\n // Do the merge, with some forced options\n options = merge(oldOptions, animation, {\n // When oldOptions.index is null it should't be cleared.\n // Otherwise navigator series will have wrong indexes (#10193).\n index: typeof oldOptions.index === 'undefined' ?\n series.index : oldOptions.index,\n pointStart: pick(\n // when updating from blank (#7933)\n (plotOptions &&\n plotOptions.series &&\n plotOptions.series.pointStart), oldOptions.pointStart, \n // when updating after addPoint\n series.xData[0])\n }, (!keepPoints && { data: series.options.data }), options);\n // Merge does not merge arrays, but replaces them. Since points were\n // updated, `series.options.data` has correct merged options, use it:\n if (keepPoints && options.data) {\n options.data = series.options.data;\n }\n // Make sure preserved properties are not destroyed (#3094)\n preserve = groups.concat(preserve);\n preserve.forEach(function (prop) {\n preserve[prop] = series[prop];\n delete series[prop];\n });\n var casting = false;\n if (seriesTypes[newType]) {\n casting = newType !== series.type;\n // Destroy the series and delete all properties, it will be\n // reinserted within the `init` call below\n series.remove(false, false, false, true);\n if (casting) {\n // Modern browsers including IE11\n if (Object.setPrototypeOf) {\n Object.setPrototypeOf(series, seriesTypes[newType].prototype);\n // Legacy (IE < 11)\n }\n else {\n var ownEvents = Object.hasOwnProperty.call(series, 'hcEvents') && series.hcEvents;\n for (n in initialSeriesProto) { // eslint-disable-line guard-for-in\n series[n] = void 0;\n }\n // Reinsert all methods and properties from the new type\n // prototype (#2270, #3719).\n extend(series, seriesTypes[newType].prototype);\n // The events are tied to the prototype chain, don't copy if\n // they're not the series' own\n if (ownEvents) {\n series.hcEvents = ownEvents;\n }\n else {\n delete series.hcEvents;\n }\n }\n }\n }\n else {\n error(17, true, chart, { missingModuleFor: newType });\n }\n // Re-register groups (#3094) and other preserved properties\n preserve.forEach(function (prop) {\n series[prop] = preserve[prop];\n });\n series.init(chart, options);\n // Remove particular elements of the points. Check `series.options`\n // because we need to consider the options being set on plotOptions as\n // well.\n if (keepPoints && this.points) {\n seriesOptions = series.options;\n // What kind of elements to destroy\n if (seriesOptions.visible === false) {\n kinds.graphic = 1;\n kinds.dataLabel = 1;\n }\n else if (!series._hasPointLabels) {\n var marker = seriesOptions.marker,\n dataLabels = seriesOptions.dataLabels,\n oldMarker = oldOptions.marker || {};\n // If the marker got disabled or changed its symbol, width or\n // height - destroy\n if (marker && (marker.enabled === false ||\n oldMarker.symbol !== marker.symbol || // #10870, #15946\n oldMarker.height !== marker.height || // #16274\n oldMarker.width !== marker.width // #16274\n )) {\n kinds.graphic = 1;\n }\n if (dataLabels &&\n dataLabels.enabled === false) {\n kinds.dataLabel = 1;\n }\n }\n for (var _a = 0, _b = this.points; _a < _b.length; _a++) {\n var point = _b[_a];\n if (point && point.series) {\n point.resolveColor();\n // Destroy elements in order to recreate based on updated\n // series options.\n if (Object.keys(kinds).length) {\n point.destroyElements(kinds);\n }\n if (seriesOptions.showInLegend === false &&\n point.legendItem) {\n chart.legend.destroyItem(point);\n }\n }\n }\n }\n series.initialType = initialType;\n chart.linkSeries(); // Links are lost in series.remove (#3028)\n // #15383: Fire updatedData if the type has changed to keep linked\n // series such as indicators updated\n if (casting && series.linkedSeries.length) {\n series.isDirtyData = true;\n }\n fireEvent(this, 'afterUpdate');\n if (pick(redraw, true)) {\n chart.redraw(keepPoints ? void 0 : false);\n }\n };\n /**\n * Used from within series.update\n * @private\n */\n Series.prototype.setName = function (name) {\n this.name = this.options.name = this.userOptions.name = name;\n this.chart.isDirtyLegend = true;\n };\n /**\n * Check if the option has changed.\n * @private\n */\n Series.prototype.hasOptionChanged = function (optionName) {\n var chart = this.chart,\n option = this.options[optionName],\n plotOptions = chart.options.plotOptions,\n oldOption = this.userOptions[optionName];\n if (oldOption) {\n return option !== oldOption;\n }\n return option !==\n pick(plotOptions &&\n plotOptions[this.type] &&\n plotOptions[this.type][optionName], plotOptions &&\n plotOptions.series &&\n plotOptions.series[optionName], option);\n };\n /**\n * Runs on mouse over the series graphical items.\n *\n * @function Highcharts.Series#onMouseOver\n * @emits Highcharts.Series#event:mouseOver\n */\n Series.prototype.onMouseOver = function () {\n var series = this,\n chart = series.chart,\n hoverSeries = chart.hoverSeries,\n pointer = chart.pointer;\n pointer.setHoverChartIndex();\n // set normal state to previous series\n if (hoverSeries && hoverSeries !== series) {\n hoverSeries.onMouseOut();\n }\n // trigger the event, but to save processing time,\n // only if defined\n if (series.options.events.mouseOver) {\n fireEvent(series, 'mouseOver');\n }\n // hover this\n series.setState('hover');\n /**\n * Contains the original hovered series.\n *\n * @name Highcharts.Chart#hoverSeries\n * @type {Highcharts.Series|null}\n */\n chart.hoverSeries = series;\n };\n /**\n * Runs on mouse out of the series graphical items.\n *\n * @function Highcharts.Series#onMouseOut\n *\n * @emits Highcharts.Series#event:mouseOut\n */\n Series.prototype.onMouseOut = function () {\n // trigger the event only if listeners exist\n var series = this,\n options = series.options,\n chart = series.chart,\n tooltip = chart.tooltip,\n hoverPoint = chart.hoverPoint;\n // #182, set to null before the mouseOut event fires\n chart.hoverSeries = null;\n // trigger mouse out on the point, which must be in this series\n if (hoverPoint) {\n hoverPoint.onMouseOut();\n }\n // fire the mouse out event\n if (series && options.events.mouseOut) {\n fireEvent(series, 'mouseOut');\n }\n // hide the tooltip\n if (tooltip &&\n !series.stickyTracking &&\n (!tooltip.shared || series.noSharedTooltip)) {\n tooltip.hide();\n }\n // Reset all inactive states\n chart.series.forEach(function (s) {\n s.setState('', true);\n });\n };\n /**\n * Set the state of the series. Called internally on mouse interaction\n * operations, but it can also be called directly to visually\n * highlight a series.\n *\n * @function Highcharts.Series#setState\n *\n * @param {Highcharts.SeriesStateValue|\"\"} [state]\n * The new state, can be either `'hover'`, `'inactive'`, `'select'`,\n * or `''` (an empty string), `'normal'` or `undefined` to set to\n * normal state.\n * @param {boolean} [inherit]\n * Determines if state should be inherited by points too.\n */\n Series.prototype.setState = function (state, inherit) {\n var series = this,\n options = series.options,\n graph = series.graph,\n inactiveOtherPoints = options.inactiveOtherPoints,\n stateOptions = options.states, \n // By default a quick animation to hover/inactive,\n // slower to un-hover\n stateAnimation = pick((stateOptions[state || 'normal'] &&\n stateOptions[state || 'normal'].animation),\n series.chart.options.chart.animation);\n var attribs,\n lineWidth = options.lineWidth,\n i = 0,\n opacity = options.opacity;\n state = state || '';\n if (series.state !== state) {\n // Toggle class names\n [\n series.group,\n series.markerGroup,\n series.dataLabelsGroup\n ].forEach(function (group) {\n if (group) {\n // Old state\n if (series.state) {\n group.removeClass('highcharts-series-' + series.state);\n }\n // New state\n if (state) {\n group.addClass('highcharts-series-' + state);\n }\n }\n });\n series.state = state;\n if (!series.chart.styledMode) {\n if (stateOptions[state] &&\n stateOptions[state].enabled === false) {\n return;\n }\n if (state) {\n lineWidth = (stateOptions[state].lineWidth ||\n lineWidth + (stateOptions[state].lineWidthPlus || 0)); // #4035\n opacity = pick(stateOptions[state].opacity, opacity);\n }\n if (graph && !graph.dashstyle && isNumber(lineWidth)) {\n attribs = {\n 'stroke-width': lineWidth\n };\n // Animate the graph stroke-width.\n graph.animate(attribs, stateAnimation);\n while (series['zone-graph-' + i]) {\n series['zone-graph-' + i].animate(attribs, stateAnimation);\n i = i + 1;\n }\n }\n // For some types (pie, networkgraph, sankey) opacity is\n // resolved on a point level\n if (!inactiveOtherPoints) {\n [\n series.group,\n series.markerGroup,\n series.dataLabelsGroup,\n series.labelBySeries\n ].forEach(function (group) {\n if (group) {\n group.animate({\n opacity: opacity\n }, stateAnimation);\n }\n });\n }\n }\n }\n // Don't loop over points on a series that doesn't apply inactive state\n // to siblings markers (e.g. line, column)\n if (inherit && inactiveOtherPoints && series.points) {\n series.setAllPointsToState(state || void 0);\n }\n };\n /**\n * Set the state for all points in the series.\n *\n * @function Highcharts.Series#setAllPointsToState\n *\n * @private\n *\n * @param {string} [state]\n * Can be either `hover` or undefined to set to normal state.\n */\n Series.prototype.setAllPointsToState = function (state) {\n this.points.forEach(function (point) {\n if (point.setState) {\n point.setState(state);\n }\n });\n };\n /**\n * Show or hide the series.\n *\n * @function Highcharts.Series#setVisible\n *\n * @param {boolean} [visible]\n * True to show the series, false to hide. If undefined, the visibility is\n * toggled.\n *\n * @param {boolean} [redraw=true]\n * Whether to redraw the chart after the series is altered. If doing more\n * operations on the chart, it is a good idea to set redraw to false and\n * call {@link Chart#redraw|chart.redraw()} after.\n *\n * @emits Highcharts.Series#event:hide\n * @emits Highcharts.Series#event:show\n */\n Series.prototype.setVisible = function (vis, redraw) {\n var series = this,\n chart = series.chart,\n ignoreHiddenSeries = chart.options.chart.ignoreHiddenSeries,\n oldVisibility = series.visible;\n // if called without an argument, toggle visibility\n series.visible =\n vis =\n series.options.visible =\n series.userOptions.visible =\n typeof vis === 'undefined' ? !oldVisibility : vis; // #5618\n var showOrHide = vis ? 'show' : 'hide';\n // show or hide elements\n [\n 'group',\n 'dataLabelsGroup',\n 'markerGroup',\n 'tracker',\n 'tt'\n ].forEach(function (key) {\n if (series[key]) {\n series[key][showOrHide]();\n }\n });\n // hide tooltip (#1361)\n if (chart.hoverSeries === series ||\n (chart.hoverPoint && chart.hoverPoint.series) === series) {\n series.onMouseOut();\n }\n if (series.legendItem) {\n chart.legend.colorizeItem(series, vis);\n }\n // rescale or adapt to resized chart\n series.isDirty = true;\n // in a stack, all other series are affected\n if (series.options.stacking) {\n chart.series.forEach(function (otherSeries) {\n if (otherSeries.options.stacking && otherSeries.visible) {\n otherSeries.isDirty = true;\n }\n });\n }\n // show or hide linked series\n series.linkedSeries.forEach(function (otherSeries) {\n otherSeries.setVisible(vis, false);\n });\n if (ignoreHiddenSeries) {\n chart.isDirtyBox = true;\n }\n fireEvent(series, showOrHide);\n if (redraw !== false) {\n chart.redraw();\n }\n };\n /**\n * Show the series if hidden.\n *\n * @sample highcharts/members/series-hide/\n * Toggle visibility from a button\n *\n * @function Highcharts.Series#show\n * @emits Highcharts.Series#event:show\n */\n Series.prototype.show = function () {\n this.setVisible(true);\n };\n /**\n * Hide the series if visible. If the\n * [chart.ignoreHiddenSeries](https://api.highcharts.com/highcharts/chart.ignoreHiddenSeries)\n * option is true, the chart is redrawn without this series.\n *\n * @sample highcharts/members/series-hide/\n * Toggle visibility from a button\n *\n * @function Highcharts.Series#hide\n * @emits Highcharts.Series#event:hide\n */\n Series.prototype.hide = function () {\n this.setVisible(false);\n };\n /**\n * Select or unselect the series. This means its\n * {@link Highcharts.Series.selected|selected}\n * property is set, the checkbox in the legend is toggled and when selected,\n * the series is returned by the {@link Highcharts.Chart#getSelectedSeries}\n * function.\n *\n * @sample highcharts/members/series-select/\n * Select a series from a button\n *\n * @function Highcharts.Series#select\n *\n * @param {boolean} [selected]\n * True to select the series, false to unselect. If undefined, the selection\n * state is toggled.\n *\n * @emits Highcharts.Series#event:select\n * @emits Highcharts.Series#event:unselect\n */\n Series.prototype.select = function (selected) {\n var series = this;\n series.selected =\n selected =\n this.options.selected = (typeof selected === 'undefined' ?\n !series.selected :\n selected);\n if (series.checkbox) {\n series.checkbox.checked = selected;\n }\n fireEvent(series, selected ? 'select' : 'unselect');\n };\n /**\n * Checks if a tooltip should be shown for a given point.\n *\n * @private\n */\n Series.prototype.shouldShowTooltip = function (plotX, plotY, options) {\n if (options === void 0) { options = {}; }\n options.series = this;\n options.visiblePlotOnly = true;\n return this.chart.isInsidePlot(plotX, plotY, options);\n };\n Series.defaultOptions = SeriesDefaults;\n /**\n * Registry of all available series types.\n *\n * @name Highcharts.Series.types\n * @type {Highcharts.Dictionary}\n */\n Series.types = SeriesRegistry.seriesTypes;\n /* *\n *\n * Static Functions\n *\n * */\n /**\n * Registers a series class to be accessible via `Series.types`.\n *\n * @function Highcharts.Series.registerType\n *\n * @param {string} seriesType\n * The series type as an identifier string in lower case.\n *\n * @param {Function} SeriesClass\n * The series class as a class pattern or a constructor function with\n * prototype.\n */\n Series.registerType = SeriesRegistry.registerSeriesType;\n return Series;\n }());\n extend(Series.prototype, {\n axisTypes: ['xAxis', 'yAxis'],\n coll: 'series',\n colorCounter: 0,\n cropShoulder: 1,\n directTouch: false,\n drawLegendSymbol: LegendSymbol.drawLineMarker,\n isCartesian: true,\n kdAxisArray: ['clientX', 'plotY'],\n // each point's x and y values are stored in this.xData and this.yData:\n parallelArrays: ['x', 'y'],\n pointClass: Point,\n requireSorting: true,\n // requires the data to be sorted:\n sorted: true\n });\n /* *\n *\n * Registry\n *\n * */\n SeriesRegistry.series = Series;\n /* *\n *\n * Default Export\n *\n * */\n /* *\n *\n * API Declarations\n *\n * */\n /**\n * This is a placeholder type of the possible series options for\n * [Highcharts](../highcharts/series), [Highcharts Stock](../highstock/series),\n * [Highmaps](../highmaps/series), and [Gantt](../gantt/series).\n *\n * In TypeScript is this dynamically generated to reference all possible types\n * of series options.\n *\n * @ignore-declaration\n * @typedef {Highcharts.SeriesOptions|Highcharts.Dictionary<*>} Highcharts.SeriesOptionsType\n */\n /**\n * Options for `dataSorting`.\n *\n * @interface Highcharts.DataSortingOptionsObject\n * @since 8.0.0\n */ /**\n * Enable or disable data sorting for the series.\n * @name Highcharts.DataSortingOptionsObject#enabled\n * @type {boolean|undefined}\n */ /**\n * Whether to allow matching points by name in an update.\n * @name Highcharts.DataSortingOptionsObject#matchByName\n * @type {boolean|undefined}\n */ /**\n * Determines what data value should be used to sort by.\n * @name Highcharts.DataSortingOptionsObject#sortKey\n * @type {string|undefined}\n */\n /**\n * Function callback when a series has been animated.\n *\n * @callback Highcharts.SeriesAfterAnimateCallbackFunction\n *\n * @param {Highcharts.Series} this\n * The series where the event occured.\n *\n * @param {Highcharts.SeriesAfterAnimateEventObject} event\n * Event arguments.\n */\n /**\n * Event information regarding completed animation of a series.\n *\n * @interface Highcharts.SeriesAfterAnimateEventObject\n */ /**\n * Animated series.\n * @name Highcharts.SeriesAfterAnimateEventObject#target\n * @type {Highcharts.Series}\n */ /**\n * Event type.\n * @name Highcharts.SeriesAfterAnimateEventObject#type\n * @type {\"afterAnimate\"}\n */\n /**\n * Function callback when the checkbox next to the series' name in the legend is\n * clicked.\n *\n * @callback Highcharts.SeriesCheckboxClickCallbackFunction\n *\n * @param {Highcharts.Series} this\n * The series where the event occured.\n *\n * @param {Highcharts.SeriesCheckboxClickEventObject} event\n * Event arguments.\n */\n /**\n * Event information regarding check of a series box.\n *\n * @interface Highcharts.SeriesCheckboxClickEventObject\n */ /**\n * Whether the box has been checked.\n * @name Highcharts.SeriesCheckboxClickEventObject#checked\n * @type {boolean}\n */ /**\n * Related series.\n * @name Highcharts.SeriesCheckboxClickEventObject#item\n * @type {Highcharts.Series}\n */ /**\n * Related series.\n * @name Highcharts.SeriesCheckboxClickEventObject#target\n * @type {Highcharts.Series}\n */ /**\n * Event type.\n * @name Highcharts.SeriesCheckboxClickEventObject#type\n * @type {\"checkboxClick\"}\n */\n /**\n * Function callback when a series is clicked. Return false to cancel toogle\n * actions.\n *\n * @callback Highcharts.SeriesClickCallbackFunction\n *\n * @param {Highcharts.Series} this\n * The series where the event occured.\n *\n * @param {Highcharts.SeriesClickEventObject} event\n * Event arguments.\n */\n /**\n * Common information for a click event on a series.\n *\n * @interface Highcharts.SeriesClickEventObject\n * @extends global.Event\n */ /**\n * Nearest point on the graph.\n * @name Highcharts.SeriesClickEventObject#point\n * @type {Highcharts.Point}\n */\n /**\n * Gets fired when the series is hidden after chart generation time, either by\n * clicking the legend item or by calling `.hide()`.\n *\n * @callback Highcharts.SeriesHideCallbackFunction\n *\n * @param {Highcharts.Series} this\n * The series where the event occured.\n *\n * @param {global.Event} event\n * The event that occured.\n */\n /**\n * The SVG value used for the `stroke-linecap` and `stroke-linejoin` of a line\n * graph.\n *\n * @typedef {\"butt\"|\"round\"|\"square\"|string} Highcharts.SeriesLinecapValue\n */\n /**\n * Gets fired when the legend item belonging to the series is clicked. The\n * default action is to toggle the visibility of the series. This can be\n * prevented by returning `false` or calling `event.preventDefault()`.\n *\n * @callback Highcharts.SeriesLegendItemClickCallbackFunction\n *\n * @param {Highcharts.Series} this\n * The series where the event occured.\n *\n * @param {Highcharts.SeriesLegendItemClickEventObject} event\n * The event that occured.\n */\n /**\n * Information about the event.\n *\n * @interface Highcharts.SeriesLegendItemClickEventObject\n */ /**\n * Related browser event.\n * @name Highcharts.SeriesLegendItemClickEventObject#browserEvent\n * @type {global.PointerEvent}\n */ /**\n * Prevent the default action of toggle the visibility of the series.\n * @name Highcharts.SeriesLegendItemClickEventObject#preventDefault\n * @type {Function}\n */ /**\n * Related series.\n * @name Highcharts.SeriesCheckboxClickEventObject#target\n * @type {Highcharts.Series}\n */ /**\n * Event type.\n * @name Highcharts.SeriesCheckboxClickEventObject#type\n * @type {\"checkboxClick\"}\n */\n /**\n * Gets fired when the mouse leaves the graph.\n *\n * @callback Highcharts.SeriesMouseOutCallbackFunction\n *\n * @param {Highcharts.Series} this\n * Series where the event occured.\n *\n * @param {global.PointerEvent} event\n * Event that occured.\n */\n /**\n * Gets fired when the mouse enters the graph.\n *\n * @callback Highcharts.SeriesMouseOverCallbackFunction\n *\n * @param {Highcharts.Series} this\n * Series where the event occured.\n *\n * @param {global.PointerEvent} event\n * Event that occured.\n */\n /**\n * Translation and scale for the plot area of a series.\n *\n * @interface Highcharts.SeriesPlotBoxObject\n */ /**\n * @name Highcharts.SeriesPlotBoxObject#scaleX\n * @type {number}\n */ /**\n * @name Highcharts.SeriesPlotBoxObject#scaleY\n * @type {number}\n */ /**\n * @name Highcharts.SeriesPlotBoxObject#translateX\n * @type {number}\n */ /**\n * @name Highcharts.SeriesPlotBoxObject#translateY\n * @type {number}\n */\n /**\n * Gets fired when the series is shown after chart generation time, either by\n * clicking the legend item or by calling `.show()`.\n *\n * @callback Highcharts.SeriesShowCallbackFunction\n *\n * @param {Highcharts.Series} this\n * Series where the event occured.\n *\n * @param {global.Event} event\n * Event that occured.\n */\n /**\n * Possible key values for the series state options.\n *\n * @typedef {\"hover\"|\"inactive\"|\"normal\"|\"select\"} Highcharts.SeriesStateValue\n */\n ''; // detach doclets above\n /* *\n *\n * API Options\n *\n * */\n /**\n * Series options for specific data and the data itself. In TypeScript you\n * have to cast the series options to specific series types, to get all\n * possible options for a series.\n *\n * @example\n * // TypeScript example\n * Highcharts.chart('container', {\n * series: [{\n * color: '#06C',\n * data: [[0, 1], [2, 3]]\n * } as Highcharts.SeriesLineOptions ]\n * });\n *\n * @type {Array<*>}\n * @apioption series\n */\n /**\n * An id for the series. This can be used after render time to get a pointer\n * to the series object through `chart.get()`.\n *\n * @sample {highcharts} highcharts/plotoptions/series-id/\n * Get series by id\n *\n * @type {string}\n * @since 1.2.0\n * @apioption series.id\n */\n /**\n * The index of the series in the chart, affecting the internal index in the\n * `chart.series` array, the visible Z index as well as the order in the\n * legend.\n *\n * @type {number}\n * @since 2.3.0\n * @apioption series.index\n */\n /**\n * The sequential index of the series in the legend.\n *\n * @see [legend.reversed](#legend.reversed),\n * [yAxis.reversedStacks](#yAxis.reversedStacks)\n *\n * @sample {highcharts|highstock} highcharts/series/legendindex/\n * Legend in opposite order\n *\n * @type {number}\n * @apioption series.legendIndex\n */\n /**\n * The name of the series as shown in the legend, tooltip etc.\n *\n * @sample {highcharts} highcharts/series/name/\n * Series name\n * @sample {highmaps} maps/demo/category-map/\n * Series name\n *\n * @type {string}\n * @apioption series.name\n */\n /**\n * This option allows grouping series in a stacked chart. The stack option\n * can be a string or anything else, as long as the grouped series' stack\n * options match each other after conversion into a string.\n *\n * @sample {highcharts} highcharts/series/stack/\n * Stacked and grouped columns\n *\n * @type {number|string}\n * @since 2.1\n * @product highcharts highstock\n * @apioption series.stack\n */\n /**\n * The type of series, for example `line` or `column`. By default, the\n * series type is inherited from [chart.type](#chart.type), so unless the\n * chart is a combination of series types, there is no need to set it on the\n * series level.\n *\n * @sample {highcharts} highcharts/series/type/\n * Line and column in the same chart\n * @sample highcharts/series/type-dynamic/\n * Dynamic types with button selector\n * @sample {highmaps} maps/demo/mapline-mappoint/\n * Multiple types in the same map\n *\n * @type {string}\n * @apioption series.type\n */\n /**\n * When using dual or multiple x axes, this number defines which xAxis the\n * particular series is connected to. It refers to either the\n * {@link #xAxis.id|axis id}\n * or the index of the axis in the xAxis array, with 0 being the first.\n *\n * @type {number|string}\n * @default 0\n * @product highcharts highstock\n * @apioption series.xAxis\n */\n /**\n * When using dual or multiple y axes, this number defines which yAxis the\n * particular series is connected to. It refers to either the\n * {@link #yAxis.id|axis id}\n * or the index of the axis in the yAxis array, with 0 being the first.\n *\n * @sample {highcharts} highcharts/series/yaxis/\n * Apply the column series to the secondary Y axis\n *\n * @type {number|string}\n * @default 0\n * @product highcharts highstock\n * @apioption series.yAxis\n */\n /**\n * Define the visual z index of the series.\n *\n * @sample {highcharts} highcharts/plotoptions/series-zindex-default/\n * With no z index, the series defined last are on top\n * @sample {highcharts} highcharts/plotoptions/series-zindex/\n * With a z index, the series with the highest z index is on top\n * @sample {highstock} highcharts/plotoptions/series-zindex-default/\n * With no z index, the series defined last are on top\n * @sample {highstock} highcharts/plotoptions/series-zindex/\n * With a z index, the series with the highest z index is on top\n *\n * @type {number}\n * @product highcharts highstock\n * @apioption series.zIndex\n */\n ''; // include precedent doclets in transpilat\n\n return Series;\n });\n _registerModule(_modules, 'Extensions/ScrollablePlotArea.js', [_modules['Core/Animation/AnimationUtilities.js'], _modules['Core/Axis/Axis.js'], _modules['Core/Chart/Chart.js'], _modules['Core/Series/Series.js'], _modules['Core/Renderer/RendererRegistry.js'], _modules['Core/Utilities.js']], function (A, Axis, Chart, Series, RendererRegistry, U) {\n /* *\n *\n * (c) 2010-2021 Torstein Honsi\n *\n * License: www.highcharts.com/license\n *\n * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!\n *\n * Highcharts feature to make the Y axis stay fixed when scrolling the chart\n * horizontally on mobile devices. Supports left and right side axes.\n */\n /*\n WIP on vertical scrollable plot area (#9378). To do:\n - Bottom axis positioning\n - Test with Gantt\n - Look for size optimizing the code\n - API and demos\n */\n var stop = A.stop;\n var addEvent = U.addEvent,\n createElement = U.createElement,\n defined = U.defined,\n merge = U.merge,\n pick = U.pick;\n /* eslint-disable no-invalid-this, valid-jsdoc */\n addEvent(Chart, 'afterSetChartSize', function (e) {\n var scrollablePlotArea = this.options.chart.scrollablePlotArea,\n scrollableMinWidth = scrollablePlotArea && scrollablePlotArea.minWidth,\n scrollableMinHeight = scrollablePlotArea && scrollablePlotArea.minHeight,\n scrollablePixelsX,\n scrollablePixelsY,\n corrections;\n if (!this.renderer.forExport) {\n // The amount of pixels to scroll, the difference between chart\n // width and scrollable width\n if (scrollableMinWidth) {\n this.scrollablePixelsX = scrollablePixelsX = Math.max(0, scrollableMinWidth - this.chartWidth);\n if (scrollablePixelsX) {\n this.scrollablePlotBox = (this.renderer.scrollablePlotBox = merge(this.plotBox));\n this.plotBox.width = this.plotWidth += scrollablePixelsX;\n if (this.inverted) {\n this.clipBox.height += scrollablePixelsX;\n }\n else {\n this.clipBox.width += scrollablePixelsX;\n }\n corrections = {\n // Corrections for right side\n 1: { name: 'right', value: scrollablePixelsX }\n };\n }\n // Currently we can only do either X or Y\n }\n else if (scrollableMinHeight) {\n this.scrollablePixelsY = scrollablePixelsY = Math.max(0, scrollableMinHeight - this.chartHeight);\n if (defined(scrollablePixelsY)) {\n this.scrollablePlotBox = (this.renderer.scrollablePlotBox = merge(this.plotBox));\n this.plotBox.height = this.plotHeight += scrollablePixelsY;\n if (this.inverted) {\n this.clipBox.width += scrollablePixelsY;\n }\n else {\n this.clipBox.height += scrollablePixelsY;\n }\n corrections = {\n 2: { name: 'bottom', value: scrollablePixelsY }\n };\n }\n }\n if (corrections && !e.skipAxes) {\n this.axes.forEach(function (axis) {\n // For right and bottom axes, only fix the plot line length\n if (corrections[axis.side]) {\n // Get the plot lines right in getPlotLinePath,\n // temporarily set it to the adjusted plot width.\n axis.getPlotLinePath = function () {\n var marginName = corrections[axis.side].name,\n correctionValue = corrections[axis.side].value, \n // axis.right or axis.bottom\n margin = this[marginName],\n path;\n // Temporarily adjust\n this[marginName] = margin - correctionValue;\n path = Axis.prototype.getPlotLinePath.apply(this, arguments);\n // Reset\n this[marginName] = margin;\n return path;\n };\n }\n else {\n // Apply the corrected plotWidth\n axis.setAxisSize();\n axis.setAxisTranslation();\n }\n });\n }\n }\n });\n addEvent(Chart, 'render', function () {\n if (this.scrollablePixelsX || this.scrollablePixelsY) {\n if (this.setUpScrolling) {\n this.setUpScrolling();\n }\n this.applyFixed();\n }\n else if (this.fixedDiv) { // Has been in scrollable mode\n this.applyFixed();\n }\n });\n /**\n * @private\n * @function Highcharts.Chart#setUpScrolling\n * @return {void}\n */\n Chart.prototype.setUpScrolling = function () {\n var _this = this;\n var css = {\n WebkitOverflowScrolling: 'touch',\n overflowX: 'hidden',\n overflowY: 'hidden'\n };\n if (this.scrollablePixelsX) {\n css.overflowX = 'auto';\n }\n if (this.scrollablePixelsY) {\n css.overflowY = 'auto';\n }\n // Insert a container with position relative\n // that scrolling and fixed container renders to (#10555)\n this.scrollingParent = createElement('div', {\n className: 'highcharts-scrolling-parent'\n }, {\n position: 'relative'\n }, this.renderTo);\n // Add the necessary divs to provide scrolling\n this.scrollingContainer = createElement('div', {\n 'className': 'highcharts-scrolling'\n }, css, this.scrollingParent);\n // On scroll, reset the chart position because it applies to the scrolled\n // container\n var lastHoverPoint;\n addEvent(this.scrollingContainer, 'scroll', function () {\n if (_this.pointer) {\n delete _this.pointer.chartPosition;\n if (_this.hoverPoint) {\n lastHoverPoint = _this.hoverPoint;\n }\n _this.pointer.runPointActions(void 0, lastHoverPoint, true);\n }\n });\n this.innerContainer = createElement('div', {\n 'className': 'highcharts-inner-container'\n }, null, this.scrollingContainer);\n // Now move the container inside\n this.innerContainer.appendChild(this.container);\n // Don't run again\n this.setUpScrolling = null;\n };\n /**\n * These elements are moved over to the fixed renderer and stay fixed when the\n * user scrolls the chart\n * @private\n */\n Chart.prototype.moveFixedElements = function () {\n var container = this.container,\n fixedRenderer = this.fixedRenderer,\n fixedSelectors = [\n '.highcharts-breadcrumbs-group',\n '.highcharts-contextbutton',\n '.highcharts-credits',\n '.highcharts-legend',\n '.highcharts-legend-checkbox',\n '.highcharts-navigator-series',\n '.highcharts-navigator-xaxis',\n '.highcharts-navigator-yaxis',\n '.highcharts-navigator',\n '.highcharts-reset-zoom',\n '.highcharts-drillup-button',\n '.highcharts-scrollbar',\n '.highcharts-subtitle',\n '.highcharts-title'\n ],\n axisClass;\n if (this.scrollablePixelsX && !this.inverted) {\n axisClass = '.highcharts-yaxis';\n }\n else if (this.scrollablePixelsX && this.inverted) {\n axisClass = '.highcharts-xaxis';\n }\n else if (this.scrollablePixelsY && !this.inverted) {\n axisClass = '.highcharts-xaxis';\n }\n else if (this.scrollablePixelsY && this.inverted) {\n axisClass = '.highcharts-yaxis';\n }\n if (axisClass) {\n fixedSelectors.push(\"\" + axisClass + \":not(.highcharts-radial-axis)\", \"\" + axisClass + \"-labels:not(.highcharts-radial-axis-labels)\");\n }\n fixedSelectors.forEach(function (className) {\n [].forEach.call(container.querySelectorAll(className), function (elem) {\n (elem.namespaceURI === fixedRenderer.SVG_NS ?\n fixedRenderer.box :\n fixedRenderer.box.parentNode).appendChild(elem);\n elem.style.pointerEvents = 'auto';\n });\n });\n };\n /**\n * @private\n * @function Highcharts.Chart#applyFixed\n * @return {void}\n */\n Chart.prototype.applyFixed = function () {\n var firstTime = !this.fixedDiv,\n chartOptions = this.options.chart,\n scrollableOptions = chartOptions.scrollablePlotArea,\n Renderer = RendererRegistry.getRendererType();\n var fixedRenderer,\n scrollableWidth,\n scrollableHeight;\n // First render\n if (firstTime) {\n this.fixedDiv = createElement('div', {\n className: 'highcharts-fixed'\n }, {\n position: 'absolute',\n overflow: 'hidden',\n pointerEvents: 'none',\n zIndex: (chartOptions.style && chartOptions.style.zIndex || 0) + 2,\n top: 0\n }, null, true);\n if (this.scrollingContainer) {\n this.scrollingContainer.parentNode.insertBefore(this.fixedDiv, this.scrollingContainer);\n }\n this.renderTo.style.overflow = 'visible';\n this.fixedRenderer = fixedRenderer = new Renderer(this.fixedDiv, this.chartWidth, this.chartHeight, this.options.chart.style);\n // Mask\n this.scrollableMask = fixedRenderer\n .path()\n .attr({\n fill: this.options.chart.backgroundColor || '#fff',\n 'fill-opacity': pick(scrollableOptions.opacity, 0.85),\n zIndex: -1\n })\n .addClass('highcharts-scrollable-mask')\n .add();\n addEvent(this, 'afterShowResetZoom', this.moveFixedElements);\n addEvent(this, 'afterApplyDrilldown', this.moveFixedElements);\n addEvent(this, 'afterLayOutTitles', this.moveFixedElements);\n }\n else {\n // Set the size of the fixed renderer to the visible width\n this.fixedRenderer.setSize(this.chartWidth, this.chartHeight);\n }\n if (this.scrollableDirty || firstTime) {\n this.scrollableDirty = false;\n this.moveFixedElements();\n }\n // Increase the size of the scrollable renderer and background\n scrollableWidth = this.chartWidth + (this.scrollablePixelsX || 0);\n scrollableHeight = this.chartHeight + (this.scrollablePixelsY || 0);\n stop(this.container);\n this.container.style.width = scrollableWidth + 'px';\n this.container.style.height = scrollableHeight + 'px';\n this.renderer.boxWrapper.attr({\n width: scrollableWidth,\n height: scrollableHeight,\n viewBox: [0, 0, scrollableWidth, scrollableHeight].join(' ')\n });\n this.chartBackground.attr({\n width: scrollableWidth,\n height: scrollableHeight\n });\n this.scrollingContainer.style.height = this.chartHeight + 'px';\n // Set scroll position\n if (firstTime) {\n if (scrollableOptions.scrollPositionX) {\n this.scrollingContainer.scrollLeft =\n this.scrollablePixelsX *\n scrollableOptions.scrollPositionX;\n }\n if (scrollableOptions.scrollPositionY) {\n this.scrollingContainer.scrollTop =\n this.scrollablePixelsY *\n scrollableOptions.scrollPositionY;\n }\n }\n // Mask behind the left and right side\n var axisOffset = this.axisOffset,\n maskTop = this.plotTop - axisOffset[0] - 1,\n maskLeft = this.plotLeft - axisOffset[3] - 1,\n maskBottom = this.plotTop + this.plotHeight + axisOffset[2] + 1,\n maskRight = this.plotLeft + this.plotWidth + axisOffset[1] + 1,\n maskPlotRight = this.plotLeft + this.plotWidth -\n (this.scrollablePixelsX || 0),\n maskPlotBottom = this.plotTop + this.plotHeight -\n (this.scrollablePixelsY || 0),\n d;\n if (this.scrollablePixelsX) {\n d = [\n // Left side\n ['M', 0, maskTop],\n ['L', this.plotLeft - 1, maskTop],\n ['L', this.plotLeft - 1, maskBottom],\n ['L', 0, maskBottom],\n ['Z'],\n // Right side\n ['M', maskPlotRight, maskTop],\n ['L', this.chartWidth, maskTop],\n ['L', this.chartWidth, maskBottom],\n ['L', maskPlotRight, maskBottom],\n ['Z']\n ];\n }\n else if (this.scrollablePixelsY) {\n d = [\n // Top side\n ['M', maskLeft, 0],\n ['L', maskLeft, this.plotTop - 1],\n ['L', maskRight, this.plotTop - 1],\n ['L', maskRight, 0],\n ['Z'],\n // Bottom side\n ['M', maskLeft, maskPlotBottom],\n ['L', maskLeft, this.chartHeight],\n ['L', maskRight, this.chartHeight],\n ['L', maskRight, maskPlotBottom],\n ['Z']\n ];\n }\n else {\n d = [['M', 0, 0]];\n }\n if (this.redrawTrigger !== 'adjustHeight') {\n this.scrollableMask.attr({ d: d });\n }\n };\n addEvent(Axis, 'afterInit', function () {\n this.chart.scrollableDirty = true;\n });\n addEvent(Series, 'show', function () {\n this.chart.scrollableDirty = true;\n });\n /* *\n *\n * API Declarations\n *\n * */\n /**\n * Options for a scrollable plot area. This feature provides a minimum size for\n * the plot area of the chart. If the size gets smaller than this, typically\n * on mobile devices, a native browser scrollbar is presented. This scrollbar\n * provides smooth scrolling for the contents of the plot area, whereas the\n * title, legend and unaffected axes are fixed.\n *\n * Since v7.1.2, a scrollable plot area can be defined for either horizontal or\n * vertical scrolling, depending on whether the `minWidth` or `minHeight`\n * option is set.\n *\n * @sample highcharts/chart/scrollable-plotarea\n * Scrollable plot area\n * @sample highcharts/chart/scrollable-plotarea-vertical\n * Vertically scrollable plot area\n * @sample {gantt} gantt/chart/scrollable-plotarea-vertical\n * Gantt chart with vertically scrollable plot area\n *\n * @since 6.1.0\n * @product highcharts gantt\n * @apioption chart.scrollablePlotArea\n */\n /**\n * The minimum height for the plot area. If it gets smaller than this, the plot\n * area will become scrollable.\n *\n * @type {number}\n * @since 7.1.2\n * @apioption chart.scrollablePlotArea.minHeight\n */\n /**\n * The minimum width for the plot area. If it gets smaller than this, the plot\n * area will become scrollable.\n *\n * @type {number}\n * @since 6.1.0\n * @apioption chart.scrollablePlotArea.minWidth\n */\n /**\n * The initial scrolling position of the scrollable plot area. Ranges from 0 to\n * 1, where 0 aligns the plot area to the left and 1 aligns it to the right.\n * Typically we would use 1 if the chart has right aligned Y axes.\n *\n * @type {number}\n * @since 6.1.0\n * @apioption chart.scrollablePlotArea.scrollPositionX\n */\n /**\n * The initial scrolling position of the scrollable plot area. Ranges from 0 to\n * 1, where 0 aligns the plot area to the top and 1 aligns it to the bottom.\n *\n * @type {number}\n * @since 7.1.2\n * @apioption chart.scrollablePlotArea.scrollPositionY\n */\n /**\n * The opacity of mask applied on one of the sides of the plot\n * area.\n *\n * @sample {highcharts} highcharts/chart/scrollable-plotarea-opacity\n * Disabled opacity for the mask\n *\n * @type {number}\n * @default 0.85\n * @since 7.1.1\n * @apioption chart.scrollablePlotArea.opacity\n */\n (''); // keep doclets above in transpiled file\n\n });\n _registerModule(_modules, 'Core/Axis/Stacking/StackItem.js', [_modules['Core/FormatUtilities.js'], _modules['Core/Series/SeriesRegistry.js'], _modules['Core/Utilities.js']], function (FU, SeriesRegistry, U) {\n /* *\n *\n * (c) 2010-2021 Torstein Honsi\n *\n * License: www.highcharts.com/license\n *\n * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!\n *\n * */\n var format = FU.format;\n var Series = SeriesRegistry.series;\n var destroyObjectProperties = U.destroyObjectProperties,\n pick = U.pick,\n isNumber = U.isNumber;\n /* *\n *\n * Class\n *\n * */\n /**\n * The class for stacks. Each stack, on a specific X value and either negative\n * or positive, has its own stack item.\n * @private\n */\n var StackItem = /** @class */ (function () {\n /* *\n *\n * Constructor\n *\n * */\n function StackItem(axis, options, negativeValue, x, stackOption) {\n var inverted = axis.chart.inverted, reversed = axis.reversed;\n this.axis = axis;\n // The stack goes to the left either if the stack has negative value\n // or when axis is reversed. XOR operator.\n var isNegative = (this.isNegative = !!negativeValue !== !!reversed);\n // Save the options to be able to style the label\n this.options = options = options || {};\n // Save the x value to be able to position the label later\n this.x = x;\n // Initialize total value\n this.total = null;\n this.cumulative = null;\n // This will keep each points' extremes stored by series.index and point\n // index\n this.points = {};\n this.hasValidPoints = false;\n // Save the stack option on the series configuration object,\n // and whether to treat it as percent\n this.stack = stackOption;\n this.leftCliff = 0;\n this.rightCliff = 0;\n // The align options and text align varies on whether the stack is\n // negative and if the chart is inverted or not.\n // First test the user supplied value, then use the dynamic.\n this.alignOptions = {\n align: options.align ||\n (inverted ? (isNegative ? 'left' : 'right') : 'center'),\n verticalAlign: options.verticalAlign ||\n (inverted ? 'middle' : isNegative ? 'bottom' : 'top'),\n y: options.y,\n x: options.x\n };\n this.textAlign =\n options.textAlign ||\n (inverted ? (!isNegative ? 'left' : 'right') : 'center');\n }\n /**\n * @private\n */\n StackItem.prototype.destroy = function () {\n destroyObjectProperties(this, this.axis);\n };\n /**\n * Renders the stack total label and adds it to the stack label group.\n * @private\n */\n StackItem.prototype.render = function (group) {\n var chart = this.axis.chart,\n options = this.options,\n formatOption = options.format, \n // Format the text in the label.\n str = formatOption ?\n format(formatOption,\n this,\n chart) :\n options.formatter.call(this);\n // Change the text to reflect the new total and set visibility to hidden\n // in case the serie is hidden\n if (this.label) {\n this.label.attr({ text: str, visibility: 'hidden' });\n }\n else {\n // Create new label\n this.label = chart.renderer.label(str, null, void 0, options.shape, void 0, void 0, options.useHTML, false, 'stack-labels');\n var attr = {\n r: options.borderRadius || 0,\n text: str,\n // set default padding to 5 as it is in datalabels #12308\n padding: pick(options.padding, 5),\n visibility: 'hidden' // hidden until setOffset is called\n };\n if (!chart.styledMode) {\n attr.fill = options.backgroundColor;\n attr.stroke = options.borderColor;\n attr['stroke-width'] = options.borderWidth;\n this.label.css(options.style || {});\n }\n this.label.attr(attr);\n if (!this.label.added) {\n this.label.add(group); // add to the labels-group\n }\n }\n // Rank it higher than data labels (#8742)\n this.label.labelrank = chart.plotSizeY;\n };\n /**\n * Sets the offset that the stack has from the x value and repositions the\n * label.\n * @private\n */\n StackItem.prototype.setOffset = function (xOffset, xWidth, boxBottom, boxTop, defaultX, xAxis) {\n var _a = this,\n alignOptions = _a.alignOptions,\n axis = _a.axis,\n label = _a.label,\n options = _a.options,\n textAlign = _a.textAlign,\n chart = axis.chart,\n stackBox = this.getStackBox({\n xOffset: xOffset,\n width: xWidth,\n boxBottom: boxBottom,\n boxTop: boxTop,\n defaultX: defaultX,\n xAxis: xAxis\n }),\n verticalAlign = alignOptions.verticalAlign;\n if (label && stackBox) {\n var labelBox = label.getBBox(),\n padding = label.padding;\n var isJustify = pick(options.overflow, 'justify') === 'justify',\n visible = void 0;\n // Reset alignOptions property after justify #12337\n alignOptions.x = options.x || 0;\n alignOptions.y = options.y || 0;\n // Calculate the adjusted Stack position, to take into consideration\n // The size if the labelBox and vertical alignment as\n // well as the text alignment. It's need to be done to work with\n // default SVGLabel.align/justify methods.\n var _b = this.adjustStackPosition({\n labelBox: labelBox,\n verticalAlign: verticalAlign,\n textAlign: textAlign\n }),\n x = _b.x,\n y = _b.y;\n stackBox.x -= x;\n stackBox.y -= y;\n // Align the label to the adjusted box.\n label.align(alignOptions, false, stackBox);\n // Check if label is inside the plotArea #12294\n visible = chart.isInsidePlot(label.alignAttr.x + alignOptions.x + x, label.alignAttr.y + alignOptions.y + y);\n if (!visible) {\n isJustify = false;\n }\n if (isJustify) {\n // Justify stackLabel into the stackBox\n Series.prototype.justifyDataLabel.call(axis, label, alignOptions, label.alignAttr, labelBox, stackBox);\n }\n // Add attr to aviod the default animation of justifyDataLabel.\n // Also add correct rotation with its rotation origin. #15129\n label.attr({\n x: label.alignAttr.x,\n y: label.alignAttr.y,\n rotation: options.rotation,\n rotationOriginX: labelBox.width / 2,\n rotationOriginY: labelBox.height / 2\n });\n // Check if the dataLabel should be visible.\n if (pick(!isJustify && options.crop, true)) {\n visible =\n isNumber(label.x) &&\n isNumber(label.y) &&\n chart.isInsidePlot(label.x - padding + label.width, label.y) &&\n chart.isInsidePlot(label.x + padding, label.y);\n }\n label[visible ? 'show' : 'hide']();\n }\n };\n /**\n * Adjust the stack BBox position, to take into consideration the alignment\n * of the dataLabel. This is necessary to make the stackDataLabel work with\n * core methods like `SVGLabel.adjust` and `Series.justifyDataLabel`.\n * @param AdjustStackPositionProps\n * @return {{x: number, y: number}} Adjusted BBox position of the stack.\n */\n StackItem.prototype.adjustStackPosition = function (_a) {\n var labelBox = _a.labelBox,\n verticalAlign = _a.verticalAlign,\n textAlign = _a.textAlign;\n var factorMap = {\n bottom: 0,\n middle: 1,\n top: 2,\n right: 1,\n center: 0,\n left: -1\n },\n verticalAlignFactor = factorMap[verticalAlign],\n textAlignFactor = factorMap[textAlign];\n return {\n x: labelBox.width / 2 + (labelBox.width / 2) * textAlignFactor,\n y: (labelBox.height / 2) * verticalAlignFactor\n };\n };\n /**\n * Get the bbox of the stack.\n * @private\n * @function Highcharts.StackItem#getStackBox\n * @return {BBoxObject} The x, y, height, width of the stack.\n */\n StackItem.prototype.getStackBox = function (stackBoxProps) {\n var stackItem = this,\n axis = this.axis,\n chart = axis.chart,\n boxTop = stackBoxProps.boxTop,\n defaultX = stackBoxProps.defaultX,\n xOffset = stackBoxProps.xOffset,\n width = stackBoxProps.width,\n boxBottom = stackBoxProps.boxBottom,\n totalStackValue = axis.stacking.usePercentage ?\n 100 :\n pick(boxTop,\n this.total, 0),\n y = axis.toPixels(totalStackValue),\n xAxis = stackBoxProps.xAxis || chart.xAxis[0],\n x = pick(defaultX,\n xAxis.toPixels(this.x)) + xOffset,\n yZero = axis.toPixels(boxBottom ? boxBottom : 0),\n height = Math.abs(y - yZero),\n inverted = chart.inverted,\n neg = stackItem.isNegative;\n return inverted ?\n {\n x: (neg ? y : y - height) - chart.plotLeft,\n y: x - chart.plotTop,\n width: height,\n height: width\n } : {\n x: x - chart.plotLeft,\n y: (neg ? y - height : y) - chart.plotTop,\n width: width,\n height: height\n };\n };\n return StackItem;\n }());\n /* *\n *\n * Default Export\n *\n * */\n /* *\n *\n * API Declarations\n *\n * */\n /**\n * Stack of data points\n *\n * @product highcharts\n *\n * @interface Highcharts.StackItemObject\n */ /**\n * Alignment settings\n * @name Highcharts.StackItemObject#alignOptions\n * @type {Highcharts.AlignObject}\n */ /**\n * Related axis\n * @name Highcharts.StackItemObject#axis\n * @type {Highcharts.Axis}\n */ /**\n * Cumulative value of the stacked data points\n * @name Highcharts.StackItemObject#cumulative\n * @type {number}\n */ /**\n * True if on the negative side\n * @name Highcharts.StackItemObject#isNegative\n * @type {boolean}\n */ /**\n * Related SVG element\n * @name Highcharts.StackItemObject#label\n * @type {Highcharts.SVGElement}\n */ /**\n * Related stack options\n * @name Highcharts.StackItemObject#options\n * @type {Highcharts.YAxisStackLabelsOptions}\n */ /**\n * Total value of the stacked data points\n * @name Highcharts.StackItemObject#total\n * @type {number}\n */ /**\n * Shared x value of the stack\n * @name Highcharts.StackItemObject#x\n * @type {number}\n */\n ''; // keeps doclets above in JS file\n\n return StackItem;\n });\n _registerModule(_modules, 'Core/Axis/Stacking/StackingAxis.js', [_modules['Core/Animation/AnimationUtilities.js'], _modules['Core/Axis/Axis.js'], _modules['Core/Series/SeriesRegistry.js'], _modules['Core/Axis/Stacking/StackItem.js'], _modules['Core/Utilities.js']], function (A, Axis, SeriesRegistry, StackItem, U) {\n /* *\n *\n * (c) 2010-2021 Torstein Honsi\n *\n * License: www.highcharts.com/license\n *\n * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!\n *\n * */\n var getDeferredAnimation = A.getDeferredAnimation;\n var seriesProto = SeriesRegistry.series.prototype;\n var addEvent = U.addEvent,\n correctFloat = U.correctFloat,\n defined = U.defined,\n destroyObjectProperties = U.destroyObjectProperties,\n fireEvent = U.fireEvent,\n isArray = U.isArray,\n isNumber = U.isNumber,\n objectEach = U.objectEach,\n pick = U.pick;\n /* *\n *\n * Functions\n *\n * */\n /**\n * Generate stacks for each series and calculate stacks total values\n *\n * @private\n * @function Highcharts.Chart#getStacks\n */\n function chartGetStacks() {\n var chart = this,\n inverted = chart.inverted;\n // reset stacks for each yAxis\n chart.yAxis.forEach(function (axis) {\n if (axis.stacking && axis.stacking.stacks && axis.hasVisibleSeries) {\n axis.stacking.oldStacks = axis.stacking.stacks;\n }\n });\n chart.series.forEach(function (series) {\n var xAxisOptions = series.xAxis && series.xAxis.options || {};\n if (series.options.stacking &&\n (series.visible === true ||\n chart.options.chart.ignoreHiddenSeries === false)) {\n series.stackKey = [\n series.type,\n pick(series.options.stack, ''),\n inverted ? xAxisOptions.top : xAxisOptions.left,\n inverted ? xAxisOptions.height : xAxisOptions.width\n ].join(',');\n }\n });\n }\n /**\n * @private\n */\n function onAxisDestroy() {\n var stacking = this.stacking;\n if (!stacking) {\n return;\n }\n var stacks = stacking.stacks;\n // Destroy each stack total\n objectEach(stacks, function (stack, stackKey) {\n destroyObjectProperties(stack);\n stacks[stackKey] = null;\n });\n if (stacking &&\n stacking.stackTotalGroup) {\n stacking.stackTotalGroup.destroy();\n }\n }\n /**\n * @private\n */\n function onAxisInit() {\n if (this.coll === 'yAxis' && !this.stacking) {\n this.stacking = new AxisAdditions(this);\n }\n }\n /**\n * Get stack indicator, according to it's x-value, to determine points with the\n * same x-value\n *\n * @private\n * @function Highcharts.Series#getStackIndicator\n */\n function seriesGetStackIndicator(stackIndicator, x, index, key) {\n // Update stack indicator, when:\n // first point in a stack || x changed || stack type (negative vs positive)\n // changed:\n if (!defined(stackIndicator) ||\n stackIndicator.x !== x ||\n (key && stackIndicator.stackKey !== key)) {\n stackIndicator = {\n x: x,\n index: 0,\n key: key,\n stackKey: key\n };\n }\n else {\n (stackIndicator).index++;\n }\n stackIndicator.key =\n [index, x, stackIndicator.index].join(',');\n return stackIndicator;\n }\n /**\n * Iterate over all stacks and compute the absolute values to percent\n *\n * @private\n * @function Highcharts.Series#modifyStacks\n */\n function seriesModifyStacks() {\n var series = this,\n yAxis = series.yAxis,\n stackKey = series.stackKey,\n stacks = yAxis.stacking.stacks,\n processedXData = series.processedXData,\n stacking = series.options.stacking,\n stacker = series[stacking + 'Stacker'];\n var stackIndicator;\n if (stacker) { // Modifier function exists (Series.percentStacker etc.)\n [stackKey, '-' + stackKey].forEach(function (key) {\n var i = processedXData.length,\n x,\n stack,\n pointExtremes;\n while (i--) {\n x = processedXData[i];\n stackIndicator = series.getStackIndicator(stackIndicator, x, series.index, key);\n stack = stacks[key] && stacks[key][x];\n pointExtremes =\n stack && stack.points[stackIndicator.key];\n if (pointExtremes) {\n stacker.call(series, pointExtremes, stack, i);\n }\n }\n });\n }\n }\n /**\n * Modifier function for percent stacks. Blows up the stack to 100%.\n *\n * @private\n * @function Highcharts.Series#percentStacker\n */\n function seriesPercentStacker(pointExtremes, stack, i) {\n var totalFactor = stack.total ? 100 / stack.total : 0;\n // Y bottom value\n pointExtremes[0] = correctFloat(pointExtremes[0] * totalFactor);\n // Y value\n pointExtremes[1] = correctFloat(pointExtremes[1] * totalFactor);\n this.stackedYData[i] = pointExtremes[1];\n }\n /**\n * Set grouped points in a stack-like object. When `centerInCategory` is true,\n * and `stacking` is not enabled, we need a pseudo (horizontal) stack in order\n * to handle grouping of points within the same category.\n *\n * @private\n * @function Highcharts.Series#setStackedPoints\n * @return {void}\n */\n function seriesSetGroupedPoints() {\n var stacking = this.yAxis.stacking;\n if (this.options.centerInCategory &&\n (this.is('column') || this.is('columnrange')) &&\n // With stacking enabled, we already have stacks that we can compute\n // from\n !this.options.stacking &&\n // With only one series, we don't need to consider centerInCategory\n this.chart.series.length > 1) {\n seriesProto.setStackedPoints.call(this, 'group');\n // After updating, if we now have proper stacks, we must delete the group\n // pseudo stacks (#14986)\n }\n else if (stacking) {\n objectEach(stacking.stacks, function (type, key) {\n if (key.slice(-5) === 'group') {\n objectEach(type, function (stack) { return stack.destroy(); });\n delete stacking.stacks[key];\n }\n });\n }\n }\n /**\n * Adds series' points value to corresponding stack\n *\n * @private\n * @function Highcharts.Series#setStackedPoints\n */\n function seriesSetStackedPoints(stackingParam) {\n var chart = this.chart,\n stacking = stackingParam || this.options.stacking;\n if (!stacking || (this.visible !== true &&\n chart.options.chart.ignoreHiddenSeries !== false)) {\n return;\n }\n var series = this, xData = series.processedXData, yData = series.processedYData, stackedYData = [], yDataLength = yData.length, seriesOptions = series.options, threshold = seriesOptions.threshold, stackThreshold = pick(seriesOptions.startFromThreshold && threshold, 0), stackOption = seriesOptions.stack, stackKey = stackingParam ? \"\" + series.type + \",\".concat(stacking) : series.stackKey, negKey = '-' + stackKey, negStacks = series.negStacks, yAxis = stacking === 'group' ?\n chart.yAxis[0] :\n series.yAxis, stacks = yAxis.stacking.stacks, oldStacks = yAxis.stacking.oldStacks;\n var stackIndicator,\n isNegative,\n stack,\n other,\n key,\n pointKey,\n i,\n x,\n y;\n yAxis.stacking.stacksTouched += 1;\n // loop over the non-null y values and read them into a local array\n for (i = 0; i < yDataLength; i++) {\n x = xData[i];\n y = yData[i];\n stackIndicator = series.getStackIndicator(stackIndicator, x, series.index);\n pointKey = stackIndicator.key;\n // Read stacked values into a stack based on the x value,\n // the sign of y and the stack key. Stacking is also handled for null\n // values (#739)\n isNegative = negStacks && y < (stackThreshold ? 0 : threshold);\n key = isNegative ? negKey : stackKey;\n // Create empty object for this stack if it doesn't exist yet\n if (!stacks[key]) {\n stacks[key] = {};\n }\n // Initialize StackItem for this x\n if (!stacks[key][x]) {\n if (oldStacks[key] &&\n oldStacks[key][x]) {\n stacks[key][x] = oldStacks[key][x];\n stacks[key][x].total = null;\n }\n else {\n stacks[key][x] = new StackItem(yAxis, yAxis.options.stackLabels, !!isNegative, x, stackOption);\n }\n }\n // If the StackItem doesn't exist, create it first\n stack = stacks[key][x];\n if (y !== null) {\n stack.points[pointKey] = stack.points[series.index] =\n [pick(stack.cumulative, stackThreshold)];\n // Record the base of the stack\n if (!defined(stack.cumulative)) {\n stack.base = pointKey;\n }\n stack.touched = yAxis.stacking.stacksTouched;\n // In area charts, if there are multiple points on the same X value,\n // let the area fill the full span of those points\n if (stackIndicator.index > 0 && series.singleStacks === false) {\n stack.points[pointKey][0] =\n stack.points[series.index + ',' + x + ',0'][0];\n }\n // When updating to null, reset the point stack (#7493)\n }\n else {\n stack.points[pointKey] = stack.points[series.index] =\n null;\n }\n // Add value to the stack total\n if (stacking === 'percent') {\n // Percent stacked column, totals are the same for the positive and\n // negative stacks\n other = isNegative ? stackKey : negKey;\n if (negStacks && stacks[other] && stacks[other][x]) {\n other = stacks[other][x];\n stack.total = other.total =\n Math.max(other.total, stack.total) +\n Math.abs(y) ||\n 0;\n // Percent stacked areas\n }\n else {\n stack.total =\n correctFloat(stack.total + (Math.abs(y) || 0));\n }\n }\n else if (stacking === 'group') {\n if (isArray(y)) {\n y = y[0];\n }\n // In this stack, the total is the number of valid points\n if (y !== null) {\n stack.total = (stack.total || 0) + 1;\n }\n }\n else {\n stack.total = correctFloat(stack.total + (y || 0));\n }\n if (stacking === 'group') {\n // This point's index within the stack, pushed to stack.points[1]\n stack.cumulative = (stack.total || 1) - 1;\n }\n else {\n stack.cumulative =\n pick(stack.cumulative, stackThreshold) + (y || 0);\n }\n if (y !== null) {\n stack.points[pointKey].push(stack.cumulative);\n stackedYData[i] = stack.cumulative;\n stack.hasValidPoints = true;\n }\n }\n if (stacking === 'percent') {\n yAxis.stacking.usePercentage = true;\n }\n if (stacking !== 'group') {\n this.stackedYData = stackedYData; // To be used in getExtremes\n }\n // Reset old stacks\n yAxis.stacking.oldStacks = {};\n }\n /* *\n *\n * Classes\n *\n * */\n /**\n * Adds stacking support to axes.\n * @private\n * @class\n */\n var AxisAdditions = /** @class */ (function () {\n /* *\n *\n * Constructors\n *\n * */\n function AxisAdditions(axis) {\n this.oldStacks = {};\n this.stacks = {};\n this.stacksTouched = 0;\n this.axis = axis;\n }\n /* *\n *\n * Functions\n *\n * */\n /**\n * Build the stacks from top down\n * @private\n */\n AxisAdditions.prototype.buildStacks = function () {\n var stacking = this;\n var axis = stacking.axis;\n var axisSeries = axis.series;\n var reversedStacks = axis.options.reversedStacks;\n var len = axisSeries.length;\n var actualSeries,\n i;\n stacking.usePercentage = false;\n i = len;\n while (i--) {\n actualSeries = axisSeries[reversedStacks ? i : len - i - 1];\n actualSeries.setStackedPoints();\n actualSeries.setGroupedPoints();\n }\n // Loop up again to compute percent and stream stack\n for (i = 0; i < len; i++) {\n axisSeries[i].modifyStacks();\n }\n fireEvent(axis, 'afterBuildStacks');\n };\n /**\n * @private\n */\n AxisAdditions.prototype.cleanStacks = function () {\n var stacking = this;\n var stacks;\n if (stacking.oldStacks) {\n stacks = stacking.stacks = stacking.oldStacks;\n }\n // reset stacks\n objectEach(stacks, function (type) {\n objectEach(type, function (stack) {\n stack.cumulative = stack.total;\n });\n });\n };\n /**\n * Set all the stacks to initial states and destroy unused ones.\n * @private\n */\n AxisAdditions.prototype.resetStacks = function () {\n var _this = this;\n objectEach(this.stacks, function (type) {\n objectEach(type, function (stack, x) {\n // Clean up memory after point deletion (#1044, #4320)\n if (isNumber(stack.touched) &&\n stack.touched < _this.stacksTouched) {\n stack.destroy();\n delete type[x];\n // Reset stacks\n }\n else {\n stack.total = null;\n stack.cumulative = null;\n }\n });\n });\n };\n /**\n * @private\n */\n AxisAdditions.prototype.renderStackTotals = function () {\n var stacking = this,\n axis = stacking.axis,\n chart = axis.chart,\n renderer = chart.renderer,\n stacks = stacking.stacks,\n stackLabelsAnim = axis.options.stackLabels &&\n axis.options.stackLabels.animation,\n animationConfig = getDeferredAnimation(chart,\n stackLabelsAnim || false),\n stackTotalGroup = stacking.stackTotalGroup = (stacking.stackTotalGroup ||\n renderer\n .g('stack-labels')\n .attr({\n zIndex: 6,\n opacity: 0\n })\n .add());\n // plotLeft/Top will change when y axis gets wider so we need to\n // translate the stackTotalGroup at every render call. See bug #506\n // and #516\n stackTotalGroup.translate(chart.plotLeft, chart.plotTop);\n // Render each stack total\n objectEach(stacks, function (type) {\n objectEach(type, function (stack) {\n stack.render(stackTotalGroup);\n });\n });\n stackTotalGroup.animate({\n opacity: 1\n }, animationConfig);\n };\n return AxisAdditions;\n }());\n /* *\n *\n * Composition\n *\n * */\n var StackingAxis;\n (function (StackingAxis) {\n /* *\n *\n * Constants\n *\n * */\n var composedClasses = [];\n /* *\n *\n * Functions\n *\n * */\n /**\n * Extends axis with stacking support.\n * @private\n */\n function compose(AxisClass, ChartClass, SeriesClass) {\n if (composedClasses.indexOf(AxisClass) === -1) {\n composedClasses.push(AxisClass);\n addEvent(AxisClass, 'init', onAxisInit);\n addEvent(AxisClass, 'destroy', onAxisDestroy);\n }\n if (composedClasses.indexOf(ChartClass) === -1) {\n composedClasses.push(ChartClass);\n var chartProto = ChartClass.prototype;\n chartProto.getStacks = chartGetStacks;\n }\n if (composedClasses.indexOf(SeriesClass) === -1) {\n composedClasses.push(SeriesClass);\n var seriesProto_1 = SeriesClass.prototype;\n seriesProto_1.getStackIndicator = seriesGetStackIndicator;\n seriesProto_1.modifyStacks = seriesModifyStacks;\n seriesProto_1.percentStacker = seriesPercentStacker;\n seriesProto_1.setGroupedPoints = seriesSetGroupedPoints;\n seriesProto_1.setStackedPoints = seriesSetStackedPoints;\n }\n }\n StackingAxis.compose = compose;\n })(StackingAxis || (StackingAxis = {}));\n /* *\n *\n * Default Export\n *\n * */\n\n return StackingAxis;\n });\n _registerModule(_modules, 'Series/Line/LineSeries.js', [_modules['Core/Series/Series.js'], _modules['Core/Series/SeriesRegistry.js'], _modules['Core/Utilities.js']], function (Series, SeriesRegistry, U) {\n /* *\n *\n * (c) 2010-2021 Torstein Honsi\n *\n * License: www.highcharts.com/license\n *\n * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!\n *\n * */\n var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d,\n b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d,\n b) { d.__proto__ = b; }) ||\n function (d,\n b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n })();\n var defined = U.defined,\n merge = U.merge;\n /* *\n *\n * Class\n *\n * */\n /**\n * The line series is the base type and is therefor the series base prototype.\n *\n * @private\n */\n var LineSeries = /** @class */ (function (_super) {\n __extends(LineSeries, _super);\n function LineSeries() {\n /* *\n *\n * Static Functions\n *\n * */\n var _this = _super !== null && _super.apply(this,\n arguments) || this;\n /* *\n *\n * Properties\n *\n * */\n _this.data = void 0;\n _this.options = void 0;\n _this.points = void 0;\n return _this;\n }\n /* *\n *\n * Functions\n *\n * */\n /**\n * Draw the graph. Called internally when rendering line-like series\n * types. The first time it generates the `series.graph` item and\n * optionally other series-wide items like `series.area` for area\n * charts. On subsequent calls these items are updated with new\n * positions and attributes.\n *\n * @function Highcharts.Series#drawGraph\n */\n LineSeries.prototype.drawGraph = function () {\n var series = this,\n options = this.options,\n graphPath = (this.gappedPath || this.getGraphPath).call(this),\n styledMode = this.chart.styledMode;\n var props = [[\n 'graph',\n 'highcharts-graph'\n ]];\n // Presentational properties\n if (!styledMode) {\n props[0].push((options.lineColor ||\n this.color ||\n \"#cccccc\" /* Palette.neutralColor20 */ // when colorByPoint = true\n ), options.dashStyle);\n }\n props = series.getZonesGraphs(props);\n // Draw the graph\n props.forEach(function (prop, i) {\n var graphKey = prop[0];\n var attribs,\n graph = series[graphKey];\n var verb = graph ? 'animate' : 'attr';\n if (graph) {\n graph.endX = series.preventGraphAnimation ?\n null :\n graphPath.xMap;\n graph.animate({ d: graphPath });\n }\n else if (graphPath.length) { // #1487\n /**\n * SVG element of area-based charts. Can be used for styling\n * purposes. If zones are configured, this element will be\n * hidden and replaced by multiple zone areas, accessible\n * via `series['zone-area-x']` (where x is a number,\n * starting with 0).\n *\n * @name Highcharts.Series#area\n * @type {Highcharts.SVGElement|undefined}\n */\n /**\n * SVG element of line-based charts. Can be used for styling\n * purposes. If zones are configured, this element will be\n * hidden and replaced by multiple zone lines, accessible\n * via `series['zone-graph-x']` (where x is a number,\n * starting with 0).\n *\n * @name Highcharts.Series#graph\n * @type {Highcharts.SVGElement|undefined}\n */\n series[graphKey] = graph = series.chart.renderer\n .path(graphPath)\n .addClass(prop[1])\n .attr({ zIndex: 1 }) // #1069\n .add(series.group);\n }\n if (graph && !styledMode) {\n attribs = {\n 'stroke': prop[2],\n 'stroke-width': options.lineWidth || 0,\n // Polygon series use filled graph\n 'fill': (series.fillGraph && series.color) || 'none'\n };\n // Apply dash style\n if (prop[3]) {\n attribs.dashstyle = prop[3];\n // The reason for the `else if` is that linecaps don't mix well\n // with dashstyle. The gaps get partially filled by the\n // linecap.\n }\n else if (options.linecap !== 'square') {\n attribs['stroke-linecap'] =\n attribs['stroke-linejoin'] = 'round';\n }\n graph[verb](attribs)\n // Add shadow to normal series (0) or to first\n // zone (1) #3932\n .shadow((i < 2) && options.shadow);\n }\n // Helpers for animation\n if (graph) {\n graph.startX = graphPath.xMap;\n graph.isArea = graphPath.isArea; // For arearange animation\n }\n });\n };\n // eslint-disable-next-line valid-jsdoc\n /**\n * Get the graph path.\n *\n * @private\n */\n LineSeries.prototype.getGraphPath = function (points, nullsAsZeroes, connectCliffs) {\n var series = this,\n options = series.options,\n graphPath = [],\n xMap = [];\n var gap,\n step = options.step;\n points = points || series.points;\n // Bottom of a stack is reversed\n var reversed = points.reversed;\n if (reversed) {\n points.reverse();\n }\n // Reverse the steps (#5004)\n step = {\n right: 1,\n center: 2\n }[step] || (step && 3);\n if (step && reversed) {\n step = 4 - step;\n }\n // Remove invalid points, especially in spline (#5015)\n points = this.getValidPoints(points, false, !(options.connectNulls && !nullsAsZeroes && !connectCliffs));\n // Build the line\n points.forEach(function (point, i) {\n var plotX = point.plotX,\n plotY = point.plotY,\n lastPoint = points[i - 1];\n // the path to this point from the previous\n var pathToPoint;\n if ((point.leftCliff || (lastPoint && lastPoint.rightCliff)) &&\n !connectCliffs) {\n gap = true; // ... and continue\n }\n // Line series, nullsAsZeroes is not handled\n if (point.isNull && !defined(nullsAsZeroes) && i > 0) {\n gap = !options.connectNulls;\n // Area series, nullsAsZeroes is set\n }\n else if (point.isNull && !nullsAsZeroes) {\n gap = true;\n }\n else {\n if (i === 0 || gap) {\n pathToPoint = [[\n 'M',\n point.plotX,\n point.plotY\n ]];\n // Generate the spline as defined in the SplineSeries object\n }\n else if (series.getPointSpline) {\n pathToPoint = [series.getPointSpline(points, point, i)];\n }\n else if (step) {\n if (step === 1) { // right\n pathToPoint = [[\n 'L',\n lastPoint.plotX,\n plotY\n ]];\n }\n else if (step === 2) { // center\n pathToPoint = [[\n 'L',\n (lastPoint.plotX + plotX) / 2,\n lastPoint.plotY\n ], [\n 'L',\n (lastPoint.plotX + plotX) / 2,\n plotY\n ]];\n }\n else {\n pathToPoint = [[\n 'L',\n plotX,\n lastPoint.plotY\n ]];\n }\n pathToPoint.push([\n 'L',\n plotX,\n plotY\n ]);\n }\n else {\n // normal line to next point\n pathToPoint = [[\n 'L',\n plotX,\n plotY\n ]];\n }\n // Prepare for animation. When step is enabled, there are\n // two path nodes for each x value.\n xMap.push(point.x);\n if (step) {\n xMap.push(point.x);\n if (step === 2) { // step = center (#8073)\n xMap.push(point.x);\n }\n }\n graphPath.push.apply(graphPath, pathToPoint);\n gap = false;\n }\n });\n graphPath.xMap = xMap;\n series.graphPath = graphPath;\n return graphPath;\n };\n // eslint-disable-next-line valid-jsdoc\n /**\n * Get zones properties for building graphs. Extendable by series with\n * multiple lines within one series.\n *\n * @private\n */\n LineSeries.prototype.getZonesGraphs = function (props) {\n // Add the zone properties if any\n this.zones.forEach(function (zone, i) {\n var propset = [\n 'zone-graph-' + i,\n 'highcharts-graph highcharts-zone-graph-' + i + ' ' +\n (zone.className || '')\n ];\n if (!this.chart.styledMode) {\n propset.push((zone.color || this.color), (zone.dashStyle || this.options.dashStyle));\n }\n props.push(propset);\n }, this);\n return props;\n };\n LineSeries.defaultOptions = merge(Series.defaultOptions, \n /**\n * General options for all series types.\n *\n * @optionparent plotOptions.series\n */\n {\n // nothing here yet\n });\n return LineSeries;\n }(Series));\n SeriesRegistry.registerSeriesType('line', LineSeries);\n /* *\n *\n * Default Export\n *\n * */\n /* *\n *\n * API Options\n *\n * */\n /**\n * A line series displays information as a series of data points connected by\n * straight line segments.\n *\n * @sample {highcharts} highcharts/demo/line-basic/\n * Line chart\n * @sample {highstock} stock/demo/basic-line/\n * Line chart\n *\n * @extends plotOptions.series\n * @product highcharts highstock\n * @apioption plotOptions.line\n */\n /**\n * The SVG value used for the `stroke-linecap` and `stroke-linejoin`\n * of a line graph. Round means that lines are rounded in the ends and\n * bends.\n *\n * @type {Highcharts.SeriesLinecapValue}\n * @default round\n * @since 3.0.7\n * @apioption plotOptions.line.linecap\n */\n /**\n * A `line` series. If the [type](#series.line.type) option is not\n * specified, it is inherited from [chart.type](#chart.type).\n *\n * @extends series,plotOptions.line\n * @excluding dataParser,dataURL\n * @product highcharts highstock\n * @apioption series.line\n */\n /**\n * An array of data points for the series. For the `line` series type,\n * points can be given in the following ways:\n *\n * 1. An array of numerical values. In this case, the numerical values will be\n * interpreted as `y` options. The `x` values will be automatically\n * calculated, either starting at 0 and incremented by 1, or from\n * `pointStart` and `pointInterval` given in the series options. If the axis\n * has categories, these will be used. Example:\n * ```js\n * data: [0, 5, 3, 5]\n * ```\n *\n * 2. An array of arrays with 2 values. In this case, the values correspond to\n * `x,y`. If the first value is a string, it is applied as the name of the\n * point, and the `x` value is inferred.\n * ```js\n * data: [\n * [0, 1],\n * [1, 2],\n * [2, 8]\n * ]\n * ```\n *\n * 3. An array of objects with named values. The following snippet shows only a\n * few settings, see the complete options set below. If the total number of\n * data points exceeds the series'\n * [turboThreshold](#series.line.turboThreshold),\n * this option is not available.\n * ```js\n * data: [{\n * x: 1,\n * y: 9,\n * name: \"Point2\",\n * color: \"#00FF00\"\n * }, {\n * x: 1,\n * y: 6,\n * name: \"Point1\",\n * color: \"#FF00FF\"\n * }]\n * ```\n *\n * **Note:** In TypeScript you have to extend `PointOptionsObject` with an\n * additional declaration to allow custom data types:\n * ```ts\n * declare module `highcharts` {\n * interface PointOptionsObject {\n * custom: Record;\n * }\n * }\n * ```\n *\n * @sample {highcharts} highcharts/chart/reflow-true/\n * Numerical values\n * @sample {highcharts} highcharts/series/data-array-of-arrays/\n * Arrays of numeric x and y\n * @sample {highcharts} highcharts/series/data-array-of-arrays-datetime/\n * Arrays of datetime x and y\n * @sample {highcharts} highcharts/series/data-array-of-name-value/\n * Arrays of point.name and y\n * @sample {highcharts} highcharts/series/data-array-of-objects/\n * Config objects\n *\n * @declare Highcharts.PointOptionsObject\n * @type {Array|null|*>}\n * @apioption series.line.data\n */\n /**\n * An additional, individual class name for the data point's graphic\n * representation. Changes to a point's color will also be reflected in a\n * chart's legend and tooltip.\n *\n * @sample {highcharts} highcharts/css/point-series-classname\n *\n * @type {string}\n * @since 5.0.0\n * @product highcharts gantt\n * @apioption series.line.data.className\n */\n /**\n * Individual color for the point. By default the color is pulled from\n * the global `colors` array.\n *\n * In styled mode, the `color` option doesn't take effect. Instead, use\n * `colorIndex`.\n *\n * @sample {highcharts} highcharts/point/color/\n * Mark the highest point\n *\n * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}\n * @product highcharts highstock gantt\n * @apioption series.line.data.color\n */\n /**\n * A specific color index to use for the point, so its graphic representations\n * are given the class name `highcharts-color-{n}`. In styled mode this will\n * change the color of the graphic. In non-styled mode, the color is set by the\n * `fill` attribute, so the change in class name won't have a visual effect by\n * default.\n *\n * @sample {highcharts} highcharts/css/colorindex/\n * Series and point color index\n *\n * @type {number}\n * @since 5.0.0\n * @product highcharts gantt\n * @apioption series.line.data.colorIndex\n */\n /**\n * A reserved subspace to store options and values for customized functionality.\n * Here you can add additional data for your own event callbacks and formatter\n * callbacks.\n *\n * @sample {highcharts} highcharts/point/custom/\n * Point and series with custom data\n *\n * @type {Highcharts.Dictionary<*>}\n * @apioption series.line.data.custom\n */\n /**\n * Individual data label for each point. The options are the same as\n * the ones for [plotOptions.series.dataLabels](\n * #plotOptions.series.dataLabels).\n *\n * @sample highcharts/point/datalabels/\n * Show a label for the last value\n *\n * @declare Highcharts.DataLabelsOptions\n * @extends plotOptions.line.dataLabels\n * @product highcharts highstock gantt\n * @apioption series.line.data.dataLabels\n */\n /**\n * A description of the point to add to the screen reader information\n * about the point.\n *\n * @type {string}\n * @since 5.0.0\n * @requires modules/accessibility\n * @apioption series.line.data.description\n */\n /**\n * An id for the point. This can be used after render time to get a\n * pointer to the point object through `chart.get()`.\n *\n * @sample {highcharts} highcharts/point/id/\n * Remove an id'd point\n *\n * @type {string}\n * @since 1.2.0\n * @product highcharts highstock gantt\n * @apioption series.line.data.id\n */\n /**\n * The rank for this point's data label in case of collision. If two\n * data labels are about to overlap, only the one with the highest `labelrank`\n * will be drawn.\n *\n * @type {number}\n * @apioption series.line.data.labelrank\n */\n /**\n * The name of the point as shown in the legend, tooltip, dataLabels, etc.\n *\n * @see [xAxis.uniqueNames](#xAxis.uniqueNames)\n *\n * @sample {highcharts} highcharts/series/data-array-of-objects/\n * Point names\n *\n * @type {string}\n * @apioption series.line.data.name\n */\n /**\n * Whether the data point is selected initially.\n *\n * @type {boolean}\n * @default false\n * @product highcharts highstock gantt\n * @apioption series.line.data.selected\n */\n /**\n * The x value of the point. For datetime axes, the X value is the timestamp\n * in milliseconds since 1970.\n *\n * @type {number}\n * @product highcharts highstock\n * @apioption series.line.data.x\n */\n /**\n * The y value of the point.\n *\n * @type {number|null}\n * @product highcharts highstock\n * @apioption series.line.data.y\n */\n /**\n * The individual point events.\n *\n * @extends plotOptions.series.point.events\n * @product highcharts highstock gantt\n * @apioption series.line.data.events\n */\n /**\n * Options for the point markers of line-like series.\n *\n * @declare Highcharts.PointMarkerOptionsObject\n * @extends plotOptions.series.marker\n * @product highcharts highstock\n * @apioption series.line.data.marker\n */\n ''; // include precedent doclets in transpilat\n\n return LineSeries;\n });\n _registerModule(_modules, 'Series/Area/AreaSeries.js', [_modules['Core/Color/Color.js'], _modules['Core/Legend/LegendSymbol.js'], _modules['Core/Series/SeriesRegistry.js'], _modules['Core/Utilities.js']], function (Color, LegendSymbol, SeriesRegistry, U) {\n /* *\n *\n * (c) 2010-2021 Torstein Honsi\n *\n * License: www.highcharts.com/license\n *\n * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!\n *\n * */\n var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d,\n b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d,\n b) { d.__proto__ = b; }) ||\n function (d,\n b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n })();\n var color = Color.parse;\n var LineSeries = SeriesRegistry.seriesTypes.line;\n var extend = U.extend,\n merge = U.merge,\n objectEach = U.objectEach,\n pick = U.pick;\n /* *\n *\n * Class\n *\n * */\n /**\n * Area series type.\n *\n * @private\n * @class\n * @name AreaSeries\n *\n * @augments LineSeries\n */\n var AreaSeries = /** @class */ (function (_super) {\n __extends(AreaSeries, _super);\n function AreaSeries() {\n /* *\n *\n * Static Properties\n *\n * */\n var _this = _super !== null && _super.apply(this,\n arguments) || this;\n _this.data = void 0;\n _this.options = void 0;\n _this.points = void 0;\n return _this;\n /* eslint-enable valid-jsdoc */\n }\n /* *\n *\n * Functions\n *\n * */\n /* eslint-disable valid-jsdoc */\n /**\n * Draw the graph and the underlying area. This method calls the Series\n * base function and adds the area. The areaPath is calculated in the\n * getSegmentPath method called from Series.prototype.drawGraph.\n * @private\n */\n AreaSeries.prototype.drawGraph = function () {\n // Define or reset areaPath\n this.areaPath = [];\n // Call the base method\n _super.prototype.drawGraph.apply(this);\n // Define local variables\n var series = this,\n areaPath = this.areaPath,\n options = this.options,\n zones = this.zones,\n props = [[\n 'area',\n 'highcharts-area',\n this.color,\n options.fillColor\n ]]; // area name, main color, fill color\n zones.forEach(function (zone,\n i) {\n props.push([\n 'zone-area-' + i,\n 'highcharts-area highcharts-zone-area-' + i + ' ' +\n zone.className,\n zone.color || series.color,\n zone.fillColor || options.fillColor\n ]);\n });\n props.forEach(function (prop) {\n var areaKey = prop[0],\n attribs = {};\n var area = series[areaKey];\n var verb = area ? 'animate' : 'attr';\n // Create or update the area\n if (area) { // update\n area.endX = series.preventGraphAnimation ?\n null :\n areaPath.xMap;\n area.animate({ d: areaPath });\n }\n else { // create\n attribs.zIndex = 0; // #1069\n area = series[areaKey] = series.chart.renderer\n .path(areaPath)\n .addClass(prop[1])\n .add(series.group);\n area.isArea = true;\n }\n if (!series.chart.styledMode) {\n attribs.fill = pick(prop[3], color(prop[2])\n .setOpacity(pick(options.fillOpacity, 0.75))\n .get());\n }\n area[verb](attribs);\n area.startX = areaPath.xMap;\n area.shiftUnit = options.step ? 2 : 1;\n });\n };\n /**\n * @private\n */\n AreaSeries.prototype.getGraphPath = function (points) {\n var getGraphPath = LineSeries.prototype.getGraphPath, options = this.options, stacking = options.stacking, yAxis = this.yAxis, bottomPoints = [], graphPoints = [], seriesIndex = this.index, stacks = yAxis.stacking.stacks[this.stackKey], threshold = options.threshold, translatedThreshold = Math.round(// #10909\n yAxis.getThreshold(options.threshold)), connectNulls = pick(// #10574\n options.connectNulls, stacking === 'percent'), \n // To display null points in underlying stacked series, this\n // series graph must be broken, and the area also fall down to\n // fill the gap left by the null point. #2069\n addDummyPoints = function (i, otherI, side) {\n var point = points[i], stackedValues = stacking &&\n stacks[point.x].points[seriesIndex], nullVal = point[side + 'Null'] || 0, cliffVal = point[side + 'Cliff'] || 0;\n var top,\n bottom,\n isNull = true;\n if (cliffVal || nullVal) {\n top = (nullVal ?\n stackedValues[0] :\n stackedValues[1]) + cliffVal;\n bottom = stackedValues[0] + cliffVal;\n isNull = !!nullVal;\n }\n else if (!stacking &&\n points[otherI] &&\n points[otherI].isNull) {\n top = bottom = threshold;\n }\n // Add to the top and bottom line of the area\n if (typeof top !== 'undefined') {\n graphPoints.push({\n plotX: plotX,\n plotY: top === null ?\n translatedThreshold :\n yAxis.getThreshold(top),\n isNull: isNull,\n isCliff: true\n });\n bottomPoints.push({\n plotX: plotX,\n plotY: bottom === null ?\n translatedThreshold :\n yAxis.getThreshold(bottom),\n doCurve: false // #1041, gaps in areaspline areas\n });\n }\n };\n var plotX,\n isNull,\n yBottom;\n // Find what points to use\n points = points || this.points;\n // Fill in missing points\n if (stacking) {\n points = this.getStackPoints(points);\n }\n for (var i = 0, iEnd = points.length; i < iEnd; ++i) {\n // Reset after series.update of stacking property (#12033)\n if (!stacking) {\n points[i].leftCliff = points[i].rightCliff =\n points[i].leftNull = points[i].rightNull = void 0;\n }\n isNull = points[i].isNull;\n plotX = pick(points[i].rectPlotX, points[i].plotX);\n yBottom = stacking ?\n pick(points[i].yBottom, translatedThreshold) :\n translatedThreshold;\n if (!isNull || connectNulls) {\n if (!connectNulls) {\n addDummyPoints(i, i - 1, 'left');\n }\n // Skip null point when stacking is false and connectNulls\n // true\n if (!(isNull && !stacking && connectNulls)) {\n graphPoints.push(points[i]);\n bottomPoints.push({\n x: i,\n plotX: plotX,\n plotY: yBottom\n });\n }\n if (!connectNulls) {\n addDummyPoints(i, i + 1, 'right');\n }\n }\n }\n var topPath = getGraphPath.call(this,\n graphPoints,\n true,\n true);\n bottomPoints.reversed = true;\n var bottomPath = getGraphPath.call(this,\n bottomPoints,\n true,\n true);\n var firstBottomPoint = bottomPath[0];\n if (firstBottomPoint && firstBottomPoint[0] === 'M') {\n bottomPath[0] = ['L', firstBottomPoint[1], firstBottomPoint[2]];\n }\n var areaPath = topPath.concat(bottomPath);\n if (areaPath.length) {\n areaPath.push(['Z']);\n }\n // TODO: don't set leftCliff and rightCliff when connectNulls?\n var graphPath = getGraphPath\n .call(this,\n graphPoints,\n false,\n connectNulls);\n areaPath.xMap = topPath.xMap;\n this.areaPath = areaPath;\n return graphPath;\n };\n /**\n * Return an array of stacked points, where null and missing points are\n * replaced by dummy points in order for gaps to be drawn correctly in\n * stacks.\n * @private\n */\n AreaSeries.prototype.getStackPoints = function (points) {\n var series = this,\n segment = [],\n keys = [],\n xAxis = this.xAxis,\n yAxis = this.yAxis,\n stack = yAxis.stacking.stacks[this.stackKey],\n pointMap = {},\n yAxisSeries = yAxis.series,\n seriesLength = yAxisSeries.length,\n upOrDown = yAxis.options.reversedStacks ? 1 : -1,\n seriesIndex = yAxisSeries.indexOf(series);\n points = points || this.points;\n if (this.options.stacking) {\n for (var i = 0; i < points.length; i++) {\n // Reset after point update (#7326)\n points[i].leftNull = points[i].rightNull = void 0;\n // Create a map where we can quickly look up the points by\n // their X values.\n pointMap[points[i].x] = points[i];\n }\n // Sort the keys (#1651)\n objectEach(stack, function (stackX, x) {\n // nulled after switching between\n // grouping and not (#1651, #2336)\n if (stackX.total !== null) {\n keys.push(x);\n }\n });\n keys.sort(function (a, b) {\n return a - b;\n });\n var visibleSeries_1 = yAxisSeries.map(function (s) { return s.visible; });\n keys.forEach(function (x, idx) {\n var y = 0,\n stackPoint,\n stackedValues;\n if (pointMap[x] && !pointMap[x].isNull) {\n segment.push(pointMap[x]);\n // Find left and right cliff. -1 goes left, 1 goes\n // right.\n [-1, 1].forEach(function (direction) {\n var nullName = direction === 1 ?\n 'rightNull' :\n 'leftNull',\n cliffName = direction === 1 ?\n 'rightCliff' :\n 'leftCliff',\n otherStack = stack[keys[idx + direction]];\n var cliff = 0;\n // If there is a stack next to this one,\n // to the left or to the right...\n if (otherStack) {\n var i = seriesIndex;\n // Can go either up or down,\n // depending on reversedStacks\n while (i >= 0 && i < seriesLength) {\n var si = yAxisSeries[i].index;\n stackPoint = otherStack.points[si];\n if (!stackPoint) {\n // If the next point in this series is\n // missing, mark the point with\n // point.leftNull or point.rightNull = true.\n if (si === series.index) {\n pointMap[x][nullName] = true;\n // If there are missing points in the next\n // stack in any of the series below this\n // one, we need to substract the missing\n // values and add a hiatus to the left or\n // right.\n }\n else if (visibleSeries_1[i]) {\n stackedValues = stack[x].points[si];\n if (stackedValues) {\n cliff -= (stackedValues[1] -\n stackedValues[0]);\n }\n }\n }\n // When reversedStacks is true, loop up,\n // else loop down\n i += upOrDown;\n }\n }\n pointMap[x][cliffName] = cliff;\n });\n // There is no point for this X value in this series, so we\n // insert a dummy point in order for the areas to be drawn\n // correctly.\n }\n else {\n // Loop down the stack to find the series below this\n // one that has a value (#1991)\n var i = seriesIndex;\n while (i >= 0 && i < seriesLength) {\n var si = yAxisSeries[i].index;\n stackPoint = stack[x].points[si];\n if (stackPoint) {\n y = stackPoint[1];\n break;\n }\n // When reversedStacks is true, loop up, else loop\n // down\n i += upOrDown;\n }\n y = pick(y, 0);\n y = yAxis.translate(// #6272\n y, 0, 1, 0, 1);\n segment.push({\n isNull: true,\n plotX: xAxis.translate(// #6272\n x, 0, 0, 0, 1),\n x: x,\n plotY: y,\n yBottom: y\n });\n }\n });\n }\n return segment;\n };\n /**\n * The area series type.\n *\n * @sample {highcharts} highcharts/demo/area-basic/\n * Area chart\n * @sample {highstock} stock/demo/area/\n * Area chart\n *\n * @extends plotOptions.line\n * @excluding useOhlcData\n * @product highcharts highstock\n * @optionparent plotOptions.area\n */\n AreaSeries.defaultOptions = merge(LineSeries.defaultOptions, {\n /**\n * @see [fillColor](#plotOptions.area.fillColor)\n * @see [fillOpacity](#plotOptions.area.fillOpacity)\n *\n * @apioption plotOptions.area.color\n */\n /**\n * Fill color or gradient for the area. When `null`, the series' `color`\n * is used with the series' `fillOpacity`.\n *\n * In styled mode, the fill color can be set with the `.highcharts-area`\n * class name.\n *\n * @see [color](#plotOptions.area.color)\n * @see [fillOpacity](#plotOptions.area.fillOpacity)\n *\n * @sample {highcharts} highcharts/plotoptions/area-fillcolor-default/\n * Null by default\n * @sample {highcharts} highcharts/plotoptions/area-fillcolor-gradient/\n * Gradient\n *\n * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}\n * @product highcharts highstock\n * @apioption plotOptions.area.fillColor\n */\n /**\n * Fill opacity for the area. When you set an explicit `fillColor`,\n * the `fillOpacity` is not applied. Instead, you should define the\n * opacity in the `fillColor` with an rgba color definition. The\n * `fillOpacity` setting, also the default setting, overrides the alpha\n * component of the `color` setting.\n *\n * In styled mode, the fill opacity can be set with the\n * `.highcharts-area` class name.\n *\n * @see [color](#plotOptions.area.color)\n * @see [fillColor](#plotOptions.area.fillColor)\n *\n * @sample {highcharts} highcharts/plotoptions/area-fillopacity/\n * Automatic fill color and fill opacity of 0.1\n *\n * @type {number}\n * @default {highcharts} 0.75\n * @default {highstock} 0.75\n * @product highcharts highstock\n * @apioption plotOptions.area.fillOpacity\n */\n /**\n * A separate color for the graph line. By default the line takes the\n * `color` of the series, but the lineColor setting allows setting a\n * separate color for the line without altering the `fillColor`.\n *\n * In styled mode, the line stroke can be set with the\n * `.highcharts-graph` class name.\n *\n * @sample {highcharts} highcharts/plotoptions/area-linecolor/\n * Dark gray line\n *\n * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}\n * @product highcharts highstock\n * @apioption plotOptions.area.lineColor\n */\n /**\n * A separate color for the negative part of the area.\n *\n * In styled mode, a negative color is set with the\n * `.highcharts-negative` class name.\n *\n * @see [negativeColor](#plotOptions.area.negativeColor)\n *\n * @sample {highcharts} highcharts/css/series-negative-color/\n * Negative color in styled mode\n *\n * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}\n * @since 3.0\n * @product highcharts\n * @apioption plotOptions.area.negativeFillColor\n */\n /**\n * Whether the whole area or just the line should respond to mouseover\n * tooltips and other mouse or touch events.\n *\n * @sample {highcharts|highstock} highcharts/plotoptions/area-trackbyarea/\n * Display the tooltip when the area is hovered\n *\n * @type {boolean}\n * @default false\n * @since 1.1.6\n * @product highcharts highstock\n * @apioption plotOptions.area.trackByArea\n */\n /**\n * The Y axis value to serve as the base for the area, for\n * distinguishing between values above and below a threshold. The area\n * between the graph and the threshold is filled.\n *\n * * If a number is given, the Y axis will scale to the threshold.\n * * If `null`, the scaling behaves like a line series with fill between\n * the graph and the Y axis minimum.\n * * If `Infinity` or `-Infinity`, the area between the graph and the\n * corresponding Y axis extreme is filled (since v6.1.0).\n *\n * @sample {highcharts} highcharts/plotoptions/area-threshold/\n * A threshold of 100\n * @sample {highcharts} highcharts/plotoptions/area-threshold-infinity/\n * A threshold of Infinity\n *\n * @type {number|null}\n * @since 2.0\n * @product highcharts highstock\n */\n threshold: 0\n });\n return AreaSeries;\n }(LineSeries));\n extend(AreaSeries.prototype, {\n singleStacks: false,\n drawLegendSymbol: LegendSymbol.drawRectangle\n });\n SeriesRegistry.registerSeriesType('area', AreaSeries);\n /* *\n *\n * Default Export\n *\n * */\n /* *\n *\n * API Options\n *\n * */\n /**\n * A `area` series. If the [type](#series.area.type) option is not\n * specified, it is inherited from [chart.type](#chart.type).\n *\n * @extends series,plotOptions.area\n * @excluding dataParser, dataURL, useOhlcData\n * @product highcharts highstock\n * @apioption series.area\n */\n /**\n * @see [fillColor](#series.area.fillColor)\n * @see [fillOpacity](#series.area.fillOpacity)\n *\n * @apioption series.area.color\n */\n /**\n * An array of data points for the series. For the `area` series type,\n * points can be given in the following ways:\n *\n * 1. An array of numerical values. In this case, the numerical values will be\n * interpreted as `y` options. The `x` values will be automatically\n * calculated, either starting at 0 and incremented by 1, or from\n * `pointStart` * and `pointInterval` given in the series options. If the\n * axis has categories, these will be used. Example:\n * ```js\n * data: [0, 5, 3, 5]\n * ```\n *\n * 2. An array of arrays with 2 values. In this case, the values correspond to\n * `x,y`. If the first value is a string, it is applied as the name of the\n * point, and the `x` value is inferred.\n * ```js\n * data: [\n * [0, 9],\n * [1, 7],\n * [2, 6]\n * ]\n * ```\n *\n * 3. An array of objects with named values. The following snippet shows only a\n * few settings, see the complete options set below. If the total number of\n * data points exceeds the series'\n * [turboThreshold](#series.area.turboThreshold), this option is not\n * available.\n * ```js\n * data: [{\n * x: 1,\n * y: 9,\n * name: \"Point2\",\n * color: \"#00FF00\"\n * }, {\n * x: 1,\n * y: 6,\n * name: \"Point1\",\n * color: \"#FF00FF\"\n * }]\n * ```\n *\n * @sample {highcharts} highcharts/chart/reflow-true/\n * Numerical values\n * @sample {highcharts} highcharts/series/data-array-of-arrays/\n * Arrays of numeric x and y\n * @sample {highcharts} highcharts/series/data-array-of-arrays-datetime/\n * Arrays of datetime x and y\n * @sample {highcharts} highcharts/series/data-array-of-name-value/\n * Arrays of point.name and y\n * @sample {highcharts} highcharts/series/data-array-of-objects/\n * Config objects\n *\n * @type {Array|null|*>}\n * @extends series.line.data\n * @product highcharts highstock\n * @apioption series.area.data\n */\n /**\n * @see [color](#series.area.color)\n * @see [fillOpacity](#series.area.fillOpacity)\n *\n * @apioption series.area.fillColor\n */\n /**\n * @see [color](#series.area.color)\n * @see [fillColor](#series.area.fillColor)\n *\n * @default {highcharts} 0.75\n * @default {highstock} 0.75\n * @apioption series.area.fillOpacity\n */\n ''; // adds doclets above to transpilat\n\n return AreaSeries;\n });\n _registerModule(_modules, 'Series/Spline/SplineSeries.js', [_modules['Core/Series/SeriesRegistry.js'], _modules['Core/Utilities.js']], function (SeriesRegistry, U) {\n /* *\n *\n * (c) 2010-2021 Torstein Honsi\n *\n * License: www.highcharts.com/license\n *\n * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!\n *\n * */\n var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d,\n b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d,\n b) { d.__proto__ = b; }) ||\n function (d,\n b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n })();\n var LineSeries = SeriesRegistry.seriesTypes.line;\n var merge = U.merge,\n pick = U.pick;\n /* *\n *\n * Class\n *\n * */\n /**\n * Spline series type.\n *\n * @private\n */\n var SplineSeries = /** @class */ (function (_super) {\n __extends(SplineSeries, _super);\n function SplineSeries() {\n /* *\n *\n * Static Properties\n *\n * */\n var _this = _super !== null && _super.apply(this,\n arguments) || this;\n /* *\n *\n * Properties\n *\n * */\n _this.data = void 0;\n _this.options = void 0;\n _this.points = void 0;\n return _this;\n /* eslint-enable valid-jsdoc */\n }\n /* *\n *\n * Functions\n *\n * */\n /* eslint-disable valid-jsdoc */\n /**\n * Get the spline segment from a given point's previous neighbour to the\n * given point.\n *\n * @private\n * @function Highcharts.seriesTypes.spline#getPointSpline\n */\n SplineSeries.prototype.getPointSpline = function (points, point, i) {\n var \n // 1 means control points midway between points, 2 means 1/3\n // from the point, 3 is 1/4 etc\n smoothing = 1.5,\n denom = smoothing + 1,\n plotX = point.plotX || 0,\n plotY = point.plotY || 0,\n lastPoint = points[i - 1],\n nextPoint = points[i + 1];\n var leftContX,\n leftContY,\n rightContX,\n rightContY;\n /**\n * @private\n */\n function doCurve(otherPoint) {\n return otherPoint &&\n !otherPoint.isNull &&\n otherPoint.doCurve !== false &&\n // #6387, area splines next to null:\n !point.isCliff;\n }\n // Find control points\n if (doCurve(lastPoint) && doCurve(nextPoint)) {\n var lastX = lastPoint.plotX || 0,\n lastY = lastPoint.plotY || 0,\n nextX = nextPoint.plotX || 0,\n nextY = nextPoint.plotY || 0;\n var correction = 0;\n leftContX = (smoothing * plotX + lastX) / denom;\n leftContY = (smoothing * plotY + lastY) / denom;\n rightContX = (smoothing * plotX + nextX) / denom;\n rightContY = (smoothing * plotY + nextY) / denom;\n // Have the two control points make a straight line through main\n // point\n if (rightContX !== leftContX) { // #5016, division by zero\n correction = (((rightContY - leftContY) *\n (rightContX - plotX)) /\n (rightContX - leftContX) + plotY - rightContY);\n }\n leftContY += correction;\n rightContY += correction;\n // to prevent false extremes, check that control points are\n // between neighbouring points' y values\n if (leftContY > lastY && leftContY > plotY) {\n leftContY = Math.max(lastY, plotY);\n // mirror of left control point\n rightContY = 2 * plotY - leftContY;\n }\n else if (leftContY < lastY && leftContY < plotY) {\n leftContY = Math.min(lastY, plotY);\n rightContY = 2 * plotY - leftContY;\n }\n if (rightContY > nextY && rightContY > plotY) {\n rightContY = Math.max(nextY, plotY);\n leftContY = 2 * plotY - rightContY;\n }\n else if (rightContY < nextY && rightContY < plotY) {\n rightContY = Math.min(nextY, plotY);\n leftContY = 2 * plotY - rightContY;\n }\n // record for drawing in next point\n point.rightContX = rightContX;\n point.rightContY = rightContY;\n }\n // Visualize control points for debugging\n /*\n if (leftContX) {\n this.chart.renderer.circle(\n leftContX + this.chart.plotLeft,\n leftContY + this.chart.plotTop,\n 2\n )\n .attr({\n stroke: 'red',\n 'stroke-width': 2,\n fill: 'none',\n zIndex: 9\n })\n .add();\n this.chart.renderer.path(['M', leftContX + this.chart.plotLeft,\n leftContY + this.chart.plotTop,\n 'L', plotX + this.chart.plotLeft, plotY + this.chart.plotTop])\n .attr({\n stroke: 'red',\n 'stroke-width': 2,\n zIndex: 9\n })\n .add();\n }\n if (rightContX) {\n this.chart.renderer.circle(\n rightContX + this.chart.plotLeft,\n rightContY + this.chart.plotTop,\n 2\n )\n .attr({\n stroke: 'green',\n 'stroke-width': 2,\n fill: 'none',\n zIndex: 9\n })\n .add();\n this.chart.renderer.path(['M', rightContX + this.chart.plotLeft,\n rightContY + this.chart.plotTop,\n 'L', plotX + this.chart.plotLeft, plotY + this.chart.plotTop])\n .attr({\n stroke: 'green',\n 'stroke-width': 2,\n zIndex: 9\n })\n .add();\n }\n // */\n var ret = [\n 'C',\n pick(lastPoint.rightContX,\n lastPoint.plotX, 0),\n pick(lastPoint.rightContY,\n lastPoint.plotY, 0),\n pick(leftContX,\n plotX, 0),\n pick(leftContY,\n plotY, 0),\n plotX,\n plotY\n ];\n // reset for updating series later\n lastPoint.rightContX = lastPoint.rightContY = void 0;\n return ret;\n };\n /**\n * A spline series is a special type of line series, where the segments\n * between the data points are smoothed.\n *\n * @sample {highcharts} highcharts/demo/spline-irregular-time/\n * Spline chart\n * @sample {highstock} stock/demo/spline/\n * Spline chart\n *\n * @extends plotOptions.series\n * @excluding step, boostThreshold, boostBlending\n * @product highcharts highstock\n * @optionparent plotOptions.spline\n */\n SplineSeries.defaultOptions = merge(LineSeries.defaultOptions);\n return SplineSeries;\n }(LineSeries));\n SeriesRegistry.registerSeriesType('spline', SplineSeries);\n /* *\n *\n * Default Export\n *\n * */\n /* *\n *\n * API Options\n *\n * */\n /**\n * A `spline` series. If the [type](#series.spline.type) option is\n * not specified, it is inherited from [chart.type](#chart.type).\n *\n * @extends series,plotOptions.spline\n * @excluding dataParser, dataURL, step, boostThreshold, boostBlending\n * @product highcharts highstock\n * @apioption series.spline\n */\n /**\n * An array of data points for the series. For the `spline` series type,\n * points can be given in the following ways:\n *\n * 1. An array of numerical values. In this case, the numerical values will be\n * interpreted as `y` options. The `x` values will be automatically\n * calculated, either starting at 0 and incremented by 1, or from\n * `pointStart` and `pointInterval` given in the series options. If the axis\n * has categories, these will be used. Example:\n * ```js\n * data: [0, 5, 3, 5]\n * ```\n *\n * 2. An array of arrays with 2 values. In this case, the values correspond to\n * `x,y`. If the first value is a string, it is applied as the name of the\n * point, and the `x` value is inferred.\n * ```js\n * data: [\n * [0, 9],\n * [1, 2],\n * [2, 8]\n * ]\n * ```\n *\n * 3. An array of objects with named values. The following snippet shows only a\n * few settings, see the complete options set below. If the total number of\n * data points exceeds the series'\n * [turboThreshold](#series.spline.turboThreshold),\n * this option is not available.\n * ```js\n * data: [{\n * x: 1,\n * y: 9,\n * name: \"Point2\",\n * color: \"#00FF00\"\n * }, {\n * x: 1,\n * y: 0,\n * name: \"Point1\",\n * color: \"#FF00FF\"\n * }]\n * ```\n *\n * @sample {highcharts} highcharts/chart/reflow-true/\n * Numerical values\n * @sample {highcharts} highcharts/series/data-array-of-arrays/\n * Arrays of numeric x and y\n * @sample {highcharts} highcharts/series/data-array-of-arrays-datetime/\n * Arrays of datetime x and y\n * @sample {highcharts} highcharts/series/data-array-of-name-value/\n * Arrays of point.name and y\n * @sample {highcharts} highcharts/series/data-array-of-objects/\n * Config objects\n *\n * @type {Array|null|*>}\n * @extends series.line.data\n * @product highcharts highstock\n * @apioption series.spline.data\n */\n ''; // adds doclets above intro transpilat\n\n return SplineSeries;\n });\n _registerModule(_modules, 'Series/AreaSpline/AreaSplineSeries.js', [_modules['Series/Spline/SplineSeries.js'], _modules['Core/Legend/LegendSymbol.js'], _modules['Core/Series/SeriesRegistry.js'], _modules['Core/Utilities.js']], function (SplineSeries, LegendSymbol, SeriesRegistry, U) {\n /* *\n *\n * (c) 2010-2021 Torstein Honsi\n *\n * License: www.highcharts.com/license\n *\n * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!\n *\n * */\n var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d,\n b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d,\n b) { d.__proto__ = b; }) ||\n function (d,\n b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n })();\n var _a = SeriesRegistry.seriesTypes,\n AreaSeries = _a.area,\n areaProto = _a.area.prototype;\n var extend = U.extend,\n merge = U.merge;\n /* *\n *\n * Class\n *\n * */\n /**\n * AreaSpline series type.\n *\n * @private\n * @class\n * @name Highcharts.seriesTypes.areaspline\n *\n * @augments Highcharts.Series\n */\n var AreaSplineSeries = /** @class */ (function (_super) {\n __extends(AreaSplineSeries, _super);\n function AreaSplineSeries() {\n /* *\n *\n * Static Properties\n *\n * */\n var _this = _super !== null && _super.apply(this,\n arguments) || this;\n /* *\n *\n * Properties\n *\n * */\n _this.data = void 0;\n _this.points = void 0;\n _this.options = void 0;\n return _this;\n }\n AreaSplineSeries.defaultOptions = merge(SplineSeries.defaultOptions, AreaSeries.defaultOptions);\n return AreaSplineSeries;\n }(SplineSeries));\n extend(AreaSplineSeries.prototype, {\n getGraphPath: areaProto.getGraphPath,\n getStackPoints: areaProto.getStackPoints,\n drawGraph: areaProto.drawGraph,\n drawLegendSymbol: LegendSymbol.drawRectangle\n });\n SeriesRegistry.registerSeriesType('areaspline', AreaSplineSeries);\n /* *\n *\n * Default Export\n *\n * */\n /* *\n *\n * API Options\n *\n * */\n /**\n * The area spline series is an area series where the graph between the\n * points is smoothed into a spline.\n *\n * @sample {highcharts} highcharts/demo/areaspline/\n * Area spline chart\n * @sample {highstock} stock/demo/areaspline/\n * Area spline chart\n *\n * @extends plotOptions.area\n * @excluding step, boostThreshold, boostBlending\n * @product highcharts highstock\n * @apioption plotOptions.areaspline\n */\n /**\n * @see [fillColor](#plotOptions.areaspline.fillColor)\n * @see [fillOpacity](#plotOptions.areaspline.fillOpacity)\n *\n * @apioption plotOptions.areaspline.color\n */\n /**\n * @see [color](#plotOptions.areaspline.color)\n * @see [fillOpacity](#plotOptions.areaspline.fillOpacity)\n *\n * @apioption plotOptions.areaspline.fillColor\n */\n /**\n * @see [color](#plotOptions.areaspline.color)\n * @see [fillColor](#plotOptions.areaspline.fillColor)\n *\n * @default 0.75\n * @apioption plotOptions.areaspline.fillOpacity\n */\n /**\n * A `areaspline` series. If the [type](#series.areaspline.type) option\n * is not specified, it is inherited from [chart.type](#chart.type).\n *\n *\n * @extends series,plotOptions.areaspline\n * @excluding dataParser, dataURL, step, boostThreshold, boostBlending\n * @product highcharts highstock\n * @apioption series.areaspline\n */\n /**\n * @see [fillColor](#series.areaspline.fillColor)\n * @see [fillOpacity](#series.areaspline.fillOpacity)\n *\n * @apioption series.areaspline.color\n */\n /**\n * An array of data points for the series. For the `areaspline` series\n * type, points can be given in the following ways:\n *\n * 1. An array of numerical values. In this case, the numerical values will be\n * interpreted as `y` options. The `x` values will be automatically\n * calculated, either starting at 0 and incremented by 1, or from\n * `pointStart` and `pointInterval` given in the series options. If the axis\n * has categories, these will be used. Example:\n * ```js\n * data: [0, 5, 3, 5]\n * ```\n *\n * 2. An array of arrays with 2 values. In this case, the values correspond to\n * `x,y`. If the first value is a string, it is applied as the name of the\n * point, and the `x` value is inferred.\n * ```js\n * data: [\n * [0, 10],\n * [1, 9],\n * [2, 3]\n * ]\n * ```\n *\n * 3. An array of objects with named values. The following snippet shows only a\n * few settings, see the complete options set below. If the total number of\n * data points exceeds the series'\n * [turboThreshold](#series.areaspline.turboThreshold), this option is not\n * available.\n * ```js\n * data: [{\n * x: 1,\n * y: 4,\n * name: \"Point2\",\n * color: \"#00FF00\"\n * }, {\n * x: 1,\n * y: 4,\n * name: \"Point1\",\n * color: \"#FF00FF\"\n * }]\n * ```\n *\n * @sample {highcharts} highcharts/chart/reflow-true/\n * Numerical values\n * @sample {highcharts} highcharts/series/data-array-of-arrays/\n * Arrays of numeric x and y\n * @sample {highcharts} highcharts/series/data-array-of-arrays-datetime/\n * Arrays of datetime x and y\n * @sample {highcharts} highcharts/series/data-array-of-name-value/\n * Arrays of point.name and y\n * @sample {highcharts} highcharts/series/data-array-of-objects/\n * Config objects\n *\n * @type {Array|null|*>}\n * @extends series.line.data\n * @product highcharts highstock\n * @apioption series.areaspline.data\n */\n /**\n * @see [color](#series.areaspline.color)\n * @see [fillOpacity](#series.areaspline.fillOpacity)\n *\n * @apioption series.areaspline.fillColor\n */\n /**\n * @see [color](#series.areaspline.color)\n * @see [fillColor](#series.areaspline.fillColor)\n *\n * @default 0.75\n * @apioption series.areaspline.fillOpacity\n */\n ''; // adds doclets above into transpilat\n\n return AreaSplineSeries;\n });\n _registerModule(_modules, 'Series/Column/ColumnSeriesDefaults.js', [], function () {\n /* *\n *\n * (c) 2010-2021 Torstein Honsi\n *\n * License: www.highcharts.com/license\n *\n * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!\n *\n * */\n /* *\n *\n * API Options\n *\n * */\n /**\n * Column series display one column per value along an X axis.\n *\n * @sample {highcharts} highcharts/demo/column-basic/\n * Column chart\n * @sample {highstock} stock/demo/column/\n * Column chart\n *\n * @extends plotOptions.line\n * @excluding connectEnds, connectNulls, gapSize, gapUnit, linecap,\n * lineWidth, marker, step, useOhlcData\n * @product highcharts highstock\n * @optionparent plotOptions.column\n */\n var ColumnSeriesDefaults = {\n /**\n * The corner radius of the border surrounding each column or bar.\n *\n * @sample {highcharts} highcharts/plotoptions/column-borderradius/\n * Rounded columns\n *\n * @product highcharts highstock gantt\n */\n borderRadius: 0,\n /**\n * When using automatic point colors pulled from the global\n * [colors](colors) or series-specific\n * [plotOptions.column.colors](series.colors) collections,\n this option\n * determines whether the chart should receive one color per series or\n * one color per point.\n *\n * In styled mode,\n the `colors` or `series.colors` arrays are not\n * supported,\n and instead this option gives the points individual color\n * class names on the form `highcharts-color-{n}`.\n *\n * @see [series colors](#plotOptions.column.colors)\n *\n * @sample {highcharts} highcharts/plotoptions/column-colorbypoint-false/\n * False by default\n * @sample {highcharts} highcharts/plotoptions/column-colorbypoint-true/\n * True\n *\n * @type {boolean}\n * @default false\n * @since 2.0\n * @product highcharts highstock gantt\n * @apioption plotOptions.column.colorByPoint\n */\n /**\n * A series specific or series type specific color set to apply instead\n * of the global [colors](#colors) when [colorByPoint](\n * #plotOptions.column.colorByPoint) is true.\n *\n * @type {Array}\n * @since 3.0\n * @product highcharts highstock gantt\n * @apioption plotOptions.column.colors\n */\n /**\n * When `true`,\n the columns will center in the category,\n ignoring null\n * or missing points. When `false`,\n space will be reserved for null or\n * missing points.\n *\n * @sample {highcharts} highcharts/series-column/centerincategory/\n * Center in category\n *\n * @since 8.0.1\n * @product highcharts highstock gantt\n */\n centerInCategory: false,\n /**\n * Padding between each value groups,\n in x axis units.\n *\n * @sample {highcharts} highcharts/plotoptions/column-grouppadding-default/\n * 0.2 by default\n * @sample {highcharts} highcharts/plotoptions/column-grouppadding-none/\n * No group padding - all columns are evenly spaced\n *\n * @product highcharts highstock gantt\n */\n groupPadding: 0.2,\n /**\n * Whether to group non-stacked columns or to let them render\n * independent of each other. Non-grouped columns will be laid out\n * individually and overlap each other.\n *\n * @sample {highcharts} highcharts/plotoptions/column-grouping-false/\n * Grouping disabled\n * @sample {highstock} highcharts/plotoptions/column-grouping-false/\n * Grouping disabled\n *\n * @type {boolean}\n * @default true\n * @since 2.3.0\n * @product highcharts highstock gantt\n * @apioption plotOptions.column.grouping\n */\n /** @ignore-option */\n marker: null,\n /**\n * The maximum allowed pixel width for a column,\n translated to the\n * height of a bar in a bar chart. This prevents the columns from\n * becoming too wide when there is a small number of points in the\n * chart.\n *\n * @see [pointWidth](#plotOptions.column.pointWidth)\n *\n * @sample {highcharts} highcharts/plotoptions/column-maxpointwidth-20/\n * Limited to 50\n * @sample {highstock} highcharts/plotoptions/column-maxpointwidth-20/\n * Limited to 50\n *\n * @type {number}\n * @since 4.1.8\n * @product highcharts highstock gantt\n * @apioption plotOptions.column.maxPointWidth\n */\n /**\n * Padding between each column or bar,\n in x axis units.\n *\n * @sample {highcharts} highcharts/plotoptions/column-pointpadding-default/\n * 0.1 by default\n * @sample {highcharts} highcharts/plotoptions/column-pointpadding-025/\n * 0.25\n * @sample {highcharts} highcharts/plotoptions/column-pointpadding-none/\n * 0 for tightly packed columns\n *\n * @product highcharts highstock gantt\n */\n pointPadding: 0.1,\n /**\n * A pixel value specifying a fixed width for each column or bar point.\n * When set to `undefined`,\n the width is calculated from the\n * `pointPadding` and `groupPadding`. The width effects the dimension\n * that is not based on the point value. For column series it is the\n * hoizontal length and for bar series it is the vertical length.\n *\n * @see [maxPointWidth](#plotOptions.column.maxPointWidth)\n *\n * @sample {highcharts} highcharts/plotoptions/column-pointwidth-20/\n * 20px wide columns regardless of chart width or the amount of\n * data points\n *\n * @type {number}\n * @since 1.2.5\n * @product highcharts highstock gantt\n * @apioption plotOptions.column.pointWidth\n */\n /**\n * A pixel value specifying a fixed width for the column or bar.\n * Overrides pointWidth on the series.\n *\n * @see [series.pointWidth](#plotOptions.column.pointWidth)\n *\n * @type {number}\n * @default undefined\n * @since 7.0.0\n * @product highcharts highstock gantt\n * @apioption series.column.data.pointWidth\n */\n /**\n * The minimal height for a column or width for a bar. By default,\n * 0 values are not shown. To visualize a 0 (or close to zero) point,\n * set the minimal point length to a pixel value like 3\\. In stacked\n * column charts,\n minPointLength might not be respected for tightly\n * packed values.\n *\n * @sample {highcharts} highcharts/plotoptions/column-minpointlength/\n * Zero base value\n * @sample {highcharts} highcharts/plotoptions/column-minpointlength-pos-and-neg/\n * Positive and negative close to zero values\n *\n * @product highcharts highstock gantt\n */\n minPointLength: 0,\n /**\n * When the series contains less points than the crop threshold,\n all\n * points are drawn,\n event if the points fall outside the visible plot\n * area at the current zoom. The advantage of drawing all points\n * (including markers and columns),\n is that animation is performed on\n * updates. On the other hand,\n when the series contains more points than\n * the crop threshold,\n the series data is cropped to only contain points\n * that fall within the plot area. The advantage of cropping away\n * invisible points is to increase performance on large series.\n *\n * @product highcharts highstock gantt\n */\n cropThreshold: 50,\n /**\n * The X axis range that each point is valid for. This determines the\n * width of the column. On a categorized axis,\n the range will be 1\n * by default (one category unit). On linear and datetime axes,\n the\n * range will be computed as the distance between the two closest data\n * points.\n *\n * The default `null` means it is computed automatically,\n but this\n * option can be used to override the automatic value.\n *\n * This option is set by default to 1 if data sorting is enabled.\n *\n * @sample {highcharts} highcharts/plotoptions/column-pointrange/\n * Set the point range to one day on a data set with one week\n * between the points\n *\n * @type {number|null}\n * @since 2.3\n * @product highcharts highstock gantt\n */\n pointRange: null,\n states: {\n /**\n * Options for the hovered point. These settings override the normal\n * state options when a point is moused over or touched.\n *\n * @extends plotOptions.series.states.hover\n * @excluding halo,\n lineWidth,\n lineWidthPlus,\n marker\n * @product highcharts highstock gantt\n */\n hover: {\n /** @ignore-option */\n halo: false,\n /**\n * A specific border color for the hovered point. Defaults to\n * inherit the normal state border color.\n *\n * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}\n * @product highcharts gantt\n * @apioption plotOptions.column.states.hover.borderColor\n */\n /**\n * A specific color for the hovered point.\n *\n * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}\n * @product highcharts gantt\n * @apioption plotOptions.column.states.hover.color\n */\n /**\n * How much to brighten the point on interaction. Requires the\n * main color to be defined in hex or rgb(a) format.\n *\n * In styled mode,\n the hover brightening is by default replaced\n * with a fill-opacity set in the `.highcharts-point:hover`\n * rule.\n *\n * @sample {highcharts} highcharts/plotoptions/column-states-hover-brightness/\n * Brighten by 0.5\n *\n * @product highcharts highstock gantt\n */\n brightness: 0.1\n },\n /**\n * Options for the selected point. These settings override the\n * normal state options when a point is selected.\n *\n * @extends plotOptions.series.states.select\n * @excluding halo,\n lineWidth,\n lineWidthPlus,\n marker\n * @product highcharts highstock gantt\n */\n select: {\n /**\n * A specific color for the selected point.\n *\n * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}\n * @default #cccccc\n * @product highcharts highstock gantt\n */\n color: \"#cccccc\" /* Palette.neutralColor20 */,\n /**\n * A specific border color for the selected point.\n *\n * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}\n * @default #000000\n * @product highcharts highstock gantt\n */\n borderColor: \"#000000\" /* Palette.neutralColor100 */\n }\n },\n dataLabels: {\n align: void 0,\n verticalAlign: void 0,\n /**\n * The y position offset of the label relative to the point in\n * pixels.\n *\n * @type {number}\n */\n y: void 0\n },\n // false doesn't work well: https://jsfiddle.net/highcharts/hz8fopan/14/\n /** @ignore-option */\n startFromThreshold: true,\n stickyTracking: false,\n tooltip: {\n distance: 6\n },\n /**\n * The Y axis value to serve as the base for the columns,\n for\n * distinguishing between values above and below a threshold. If `null`,\n * the columns extend from the padding Y axis minimum.\n *\n * @type {number|null}\n * @since 2.0\n * @product highcharts\n */\n threshold: 0,\n /**\n * The width of the border surrounding each column or bar. Defaults to\n * `1` when there is room for a border,\n but to `0` when the columns are\n * so dense that a border would cover the next column.\n *\n * In styled mode,\n the stroke width can be set with the\n * `.highcharts-point` rule.\n *\n * @sample {highcharts} highcharts/plotoptions/column-borderwidth/\n * 2px black border\n *\n * @type {number}\n * @default undefined\n * @product highcharts highstock gantt\n * @apioption plotOptions.column.borderWidth\n */\n /**\n * The color of the border surrounding each column or bar.\n *\n * In styled mode,\n the border stroke can be set with the\n * `.highcharts-point` rule.\n *\n * @sample {highcharts} highcharts/plotoptions/column-bordercolor/\n * Dark gray border\n *\n * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}\n * @default #ffffff\n * @product highcharts highstock gantt\n */\n borderColor: \"#ffffff\" /* Palette.backgroundColor */\n };\n /**\n * A `column` series. If the [type](#series.column.type) option is\n * not specified, it is inherited from [chart.type](#chart.type).\n *\n * @extends series,plotOptions.column\n * @excluding connectNulls, dataParser, dataURL, gapSize, gapUnit, linecap,\n * lineWidth, marker, connectEnds, step\n * @product highcharts highstock\n * @apioption series.column\n */\n /**\n * An array of data points for the series. For the `column` series type,\n * points can be given in the following ways:\n *\n * 1. An array of numerical values. In this case, the numerical values will be\n * interpreted as `y` options. The `x` values will be automatically\n * calculated, either starting at 0 and incremented by 1, or from\n * `pointStart` and `pointInterval` given in the series options. If the axis\n * has categories, these will be used. Example:\n * ```js\n * data: [0, 5, 3, 5]\n * ```\n *\n * 2. An array of arrays with 2 values. In this case, the values correspond to\n * `x,y`. If the first value is a string, it is applied as the name of the\n * point, and the `x` value is inferred.\n * ```js\n * data: [\n * [0, 6],\n * [1, 2],\n * [2, 6]\n * ]\n * ```\n *\n * 3. An array of objects with named values. The following snippet shows only a\n * few settings, see the complete options set below. If the total number of\n * data points exceeds the series'\n * [turboThreshold](#series.column.turboThreshold), this option is not\n * available.\n * ```js\n * data: [{\n * x: 1,\n * y: 9,\n * name: \"Point2\",\n * color: \"#00FF00\"\n * }, {\n * x: 1,\n * y: 6,\n * name: \"Point1\",\n * color: \"#FF00FF\"\n * }]\n * ```\n *\n * @sample {highcharts} highcharts/chart/reflow-true/\n * Numerical values\n * @sample {highcharts} highcharts/series/data-array-of-arrays/\n * Arrays of numeric x and y\n * @sample {highcharts} highcharts/series/data-array-of-arrays-datetime/\n * Arrays of datetime x and y\n * @sample {highcharts} highcharts/series/data-array-of-name-value/\n * Arrays of point.name and y\n * @sample {highcharts} highcharts/series/data-array-of-objects/\n * Config objects\n *\n * @type {Array|null|*>}\n * @extends series.line.data\n * @excluding marker\n * @product highcharts highstock\n * @apioption series.column.data\n */\n /**\n * The color of the border surrounding the column or bar.\n *\n * In styled mode, the border stroke can be set with the `.highcharts-point`\n * rule.\n *\n * @sample {highcharts} highcharts/plotoptions/column-bordercolor/\n * Dark gray border\n *\n * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}\n * @product highcharts highstock\n * @apioption series.column.data.borderColor\n */\n /**\n * The width of the border surrounding the column or bar.\n *\n * In styled mode, the stroke width can be set with the `.highcharts-point`\n * rule.\n *\n * @sample {highcharts} highcharts/plotoptions/column-borderwidth/\n * 2px black border\n *\n * @type {number}\n * @product highcharts highstock\n * @apioption series.column.data.borderWidth\n */\n /**\n * A name for the dash style to use for the column or bar. Overrides\n * dashStyle on the series.\n *\n * In styled mode, the stroke dash-array can be set with the same classes as\n * listed under [data.color](#series.column.data.color).\n *\n * @see [series.pointWidth](#plotOptions.column.dashStyle)\n *\n * @type {Highcharts.DashStyleValue}\n * @apioption series.column.data.dashStyle\n */\n /**\n * A pixel value specifying a fixed width for the column or bar. Overrides\n * pointWidth on the series. The width effects the dimension that is not based\n * on the point value.\n *\n * @see [series.pointWidth](#plotOptions.column.pointWidth)\n *\n * @type {number}\n * @apioption series.column.data.pointWidth\n */\n /**\n * @excluding halo, lineWidth, lineWidthPlus, marker\n * @product highcharts highstock\n * @apioption series.column.states.hover\n */\n /**\n * @excluding halo, lineWidth, lineWidthPlus, marker\n * @product highcharts highstock\n * @apioption series.column.states.select\n */\n ''; // keeps doclets above in JS file\n /* *\n *\n * Default Export\n *\n * */\n\n return ColumnSeriesDefaults;\n });\n _registerModule(_modules, 'Series/Column/ColumnSeries.js', [_modules['Core/Animation/AnimationUtilities.js'], _modules['Core/Color/Color.js'], _modules['Series/Column/ColumnSeriesDefaults.js'], _modules['Core/Globals.js'], _modules['Core/Legend/LegendSymbol.js'], _modules['Core/Series/Series.js'], _modules['Core/Series/SeriesRegistry.js'], _modules['Core/Utilities.js']], function (A, Color, ColumnSeriesDefaults, H, LegendSymbol, Series, SeriesRegistry, U) {\n /* *\n *\n * (c) 2010-2021 Torstein Honsi\n *\n * License: www.highcharts.com/license\n *\n * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!\n *\n * */\n var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d,\n b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d,\n b) { d.__proto__ = b; }) ||\n function (d,\n b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n })();\n var animObject = A.animObject;\n var color = Color.parse;\n var hasTouch = H.hasTouch,\n noop = H.noop;\n var clamp = U.clamp,\n css = U.css,\n defined = U.defined,\n extend = U.extend,\n fireEvent = U.fireEvent,\n isArray = U.isArray,\n isNumber = U.isNumber,\n merge = U.merge,\n pick = U.pick,\n objectEach = U.objectEach;\n /* *\n *\n * Class\n *\n * */\n /**\n * The column series type.\n *\n * @private\n * @class\n * @name Highcharts.seriesTypes.column\n *\n * @augments Highcharts.Series\n */\n var ColumnSeries = /** @class */ (function (_super) {\n __extends(ColumnSeries, _super);\n function ColumnSeries() {\n /* *\n *\n * Static Properties\n *\n * */\n var _this = _super !== null && _super.apply(this,\n arguments) || this;\n /* *\n *\n * Properties\n *\n * */\n _this.borderWidth = void 0;\n _this.data = void 0;\n _this.group = void 0;\n _this.options = void 0;\n _this.points = void 0;\n return _this;\n /* eslint-enable valid-jsdoc */\n }\n /* *\n *\n * Functions\n *\n * */\n /* eslint-disable valid-jsdoc */\n /**\n * Animate the column heights one by one from zero.\n *\n * @private\n * @function Highcharts.seriesTypes.column#animate\n *\n * @param {boolean} init\n * Whether to initialize the animation or run it\n */\n ColumnSeries.prototype.animate = function (init) {\n var series = this,\n yAxis = this.yAxis,\n options = series.options,\n inverted = this.chart.inverted,\n attr = {},\n translateProp = inverted ?\n 'translateX' :\n 'translateY';\n var translateStart,\n translatedThreshold;\n if (init) {\n attr.scaleY = 0.001;\n translatedThreshold = clamp(yAxis.toPixels(options.threshold), yAxis.pos, yAxis.pos + yAxis.len);\n if (inverted) {\n attr.translateX = translatedThreshold - yAxis.len;\n }\n else {\n attr.translateY = translatedThreshold;\n }\n // apply finnal clipping (used in Highcharts Stock) (#7083)\n // animation is done by scaleY, so cliping is for panes\n if (series.clipBox) {\n series.setClip();\n }\n series.group.attr(attr);\n }\n else { // run the animation\n translateStart = Number(series.group.attr(translateProp));\n series.group.animate({ scaleY: 1 }, extend(animObject(series.options.animation), {\n // Do the scale synchronously to ensure smooth\n // updating (#5030, #7228)\n step: function (val, fx) {\n if (series.group) {\n attr[translateProp] = translateStart +\n fx.pos * (yAxis.pos - translateStart);\n series.group.attr(attr);\n }\n }\n }));\n }\n };\n /**\n * Initialize the series. Extends the basic Series.init method by\n * marking other series of the same type as dirty.\n *\n * @private\n * @function Highcharts.seriesTypes.column#init\n */\n ColumnSeries.prototype.init = function (chart, options) {\n _super.prototype.init.apply(this, arguments);\n var series = this;\n chart = series.chart;\n // if the series is added dynamically, force redraw of other\n // series affected by a new column\n if (chart.hasRendered) {\n chart.series.forEach(function (otherSeries) {\n if (otherSeries.type === series.type) {\n otherSeries.isDirty = true;\n }\n });\n }\n };\n /**\n * Return the width and x offset of the columns adjusted for grouping,\n * groupPadding, pointPadding, pointWidth etc.\n *\n * @private\n * @function Highcharts.seriesTypes.column#getColumnMetrics\n */\n ColumnSeries.prototype.getColumnMetrics = function () {\n var series = this,\n options = series.options,\n xAxis = series.xAxis,\n yAxis = series.yAxis,\n reversedStacks = xAxis.options.reversedStacks, \n // Keep backward compatibility: reversed xAxis had reversed\n // stacks\n reverseStacks = (xAxis.reversed && !reversedStacks) ||\n (!xAxis.reversed && reversedStacks),\n stackGroups = {};\n var stackKey,\n columnCount = 0;\n // Get the total number of column type series. This is called on\n // every series. Consider moving this logic to a chart.orderStacks()\n // function and call it on init, addSeries and removeSeries\n if (options.grouping === false) {\n columnCount = 1;\n }\n else {\n series.chart.series.forEach(function (otherSeries) {\n var otherYAxis = otherSeries.yAxis,\n otherOptions = otherSeries.options;\n var columnIndex;\n if (otherSeries.type === series.type &&\n (otherSeries.visible ||\n !series.chart.options.chart.ignoreHiddenSeries) &&\n yAxis.len === otherYAxis.len &&\n yAxis.pos === otherYAxis.pos) { // #642, #2086\n if (otherOptions.stacking &&\n otherOptions.stacking !== 'group') {\n stackKey = otherSeries.stackKey;\n if (typeof stackGroups[stackKey] ===\n 'undefined') {\n stackGroups[stackKey] = columnCount++;\n }\n columnIndex = stackGroups[stackKey];\n }\n else if (otherOptions.grouping !== false) { // #1162\n columnIndex = columnCount++;\n }\n otherSeries.columnIndex = columnIndex;\n }\n });\n }\n var categoryWidth = Math.min(Math.abs(xAxis.transA) * ((xAxis.ordinal && xAxis.ordinal.slope) ||\n options.pointRange ||\n xAxis.closestPointRange ||\n xAxis.tickInterval ||\n 1), // #2610\n xAxis.len // #1535\n ),\n groupPadding = categoryWidth * options.groupPadding,\n groupWidth = categoryWidth - 2 * groupPadding,\n pointOffsetWidth = groupWidth / (columnCount || 1),\n pointWidth = Math.min(options.maxPointWidth || xAxis.len,\n pick(options.pointWidth,\n pointOffsetWidth * (1 - 2 * options.pointPadding))),\n pointPadding = (pointOffsetWidth - pointWidth) / 2, \n // #1251, #3737\n colIndex = (series.columnIndex || 0) + (reverseStacks ? 1 : 0),\n pointXOffset = pointPadding +\n (groupPadding +\n colIndex * pointOffsetWidth -\n (categoryWidth / 2)) * (reverseStacks ? -1 : 1);\n // Save it for reading in linked series (Error bars particularly)\n series.columnMetrics = {\n width: pointWidth,\n offset: pointXOffset,\n paddedWidth: pointOffsetWidth,\n columnCount: columnCount\n };\n return series.columnMetrics;\n };\n /**\n * Make the columns crisp. The edges are rounded to the nearest full\n * pixel.\n *\n * @private\n * @function Highcharts.seriesTypes.column#crispCol\n */\n ColumnSeries.prototype.crispCol = function (x, y, w, h) {\n var chart = this.chart,\n borderWidth = this.borderWidth,\n xCrisp = -(borderWidth % 2 ? 0.5 : 0);\n var right,\n yCrisp = borderWidth % 2 ? 0.5 : 1;\n if (chart.inverted && chart.renderer.isVML) {\n yCrisp += 1;\n }\n // Horizontal. We need to first compute the exact right edge, then\n // round it and compute the width from there.\n if (this.options.crisp) {\n right = Math.round(x + w) + xCrisp;\n x = Math.round(x) + xCrisp;\n w = right - x;\n }\n // Vertical\n var bottom = Math.round(y + h) + yCrisp,\n fromTop = Math.abs(y) <= 0.5 && bottom > 0.5; // #4504, #4656\n y = Math.round(y) + yCrisp;\n h = bottom - y;\n // Top edges are exceptions\n if (fromTop && h) { // #5146\n y -= 1;\n h += 1;\n }\n return {\n x: x,\n y: y,\n width: w,\n height: h\n };\n };\n /**\n * Adjust for missing columns, according to the `centerInCategory`\n * option. Missing columns are either single points or stacks where the\n * point or points are either missing or null.\n *\n * @private\n * @function Highcharts.seriesTypes.column#adjustForMissingColumns\n * @param {number} x\n * The x coordinate of the column, left side\n *\n * @param {number} pointWidth\n * The pointWidth, already computed upstream\n *\n * @param {Highcharts.ColumnPoint} point\n * The point instance\n *\n * @param {Highcharts.ColumnMetricsObject} metrics\n * The series-wide column metrics\n *\n * @return {number}\n * The adjusted x position, or the original if not adjusted\n */\n ColumnSeries.prototype.adjustForMissingColumns = function (x, pointWidth, point, metrics) {\n var _this = this;\n var stacking = this.options.stacking;\n if (!point.isNull && metrics.columnCount > 1) {\n var reversedStacks_1 = this.yAxis.options.reversedStacks;\n var indexInCategory_1 = 0,\n totalInCategory_1 = reversedStacks_1 ? 0 : -metrics.columnCount;\n // Loop over all the stacks on the Y axis. When stacking is enabled,\n // these are real point stacks. When stacking is not enabled, but\n // `centerInCategory` is true, there is one stack handling the\n // grouping of points in each category. This is done in the\n // `setGroupedPoints` function.\n objectEach(this.yAxis.stacking && this.yAxis.stacking.stacks, function (stack) {\n if (typeof point.x === 'number') {\n var stackItem_1 = stack[point.x.toString()];\n if (stackItem_1) {\n var pointValues = stackItem_1.points[_this.index];\n // If true `stacking` is enabled, count the total\n // number of non-null stacks in the category, and\n // note which index this point is within those\n // stacks.\n if (stacking) {\n if (pointValues) {\n indexInCategory_1 = totalInCategory_1;\n }\n if (stackItem_1.hasValidPoints) {\n reversedStacks_1 ? // #16169\n totalInCategory_1++ : totalInCategory_1--;\n }\n // If `stacking` is not enabled, look for the index\n }\n else if (isArray(pointValues)) {\n // If there are multiple points with the same X\n // then gather all series in category, and\n // assign index\n var seriesIndexes = Object\n .keys(stackItem_1.points)\n .filter(function (pointKey) {\n // Filter out duplicate X's\n return !pointKey.match(',') &&\n // Filter out null points\n stackItem_1.points[pointKey] &&\n stackItem_1.points[pointKey].length > 1;\n })\n .map(parseFloat)\n .sort(function (a, b) { return b - a; });\n indexInCategory_1 = seriesIndexes.indexOf(_this.index);\n totalInCategory_1 = seriesIndexes.length;\n }\n }\n }\n });\n // Compute the adjusted x position\n var boxWidth = (totalInCategory_1 - 1) * metrics.paddedWidth +\n pointWidth;\n x = (point.plotX || 0) + boxWidth / 2 - pointWidth -\n indexInCategory_1 * metrics.paddedWidth;\n }\n return x;\n };\n /**\n * Translate each point to the plot area coordinate system and find\n * shape positions\n *\n * @private\n * @function Highcharts.seriesTypes.column#translate\n */\n ColumnSeries.prototype.translate = function () {\n var series = this,\n chart = series.chart,\n options = series.options,\n dense = series.dense =\n series.closestPointRange * series.xAxis.transA < 2,\n borderWidth = series.borderWidth = pick(options.borderWidth,\n dense ? 0 : 1 // #3635\n ),\n xAxis = series.xAxis,\n yAxis = series.yAxis,\n threshold = options.threshold,\n translatedThreshold = series.translatedThreshold =\n yAxis.getThreshold(threshold),\n minPointLength = pick(options.minPointLength, 5),\n metrics = series.getColumnMetrics(),\n seriesPointWidth = metrics.width,\n seriesXOffset = series.pointXOffset = metrics.offset,\n dataMin = series.dataMin,\n dataMax = series.dataMax;\n // postprocessed for border width\n var seriesBarW = series.barW =\n Math.max(seriesPointWidth, 1 + 2 * borderWidth);\n if (chart.inverted) {\n translatedThreshold -= 0.5; // #3355\n }\n // When the pointPadding is 0, we want the columns to be packed\n // tightly, so we allow individual columns to have individual sizes.\n // When pointPadding is greater, we strive for equal-width columns\n // (#2694).\n if (options.pointPadding) {\n seriesBarW = Math.ceil(seriesBarW);\n }\n Series.prototype.translate.apply(series);\n // Record the new values\n series.points.forEach(function (point) {\n var yBottom = pick(point.yBottom,\n translatedThreshold),\n safeDistance = 999 + Math.abs(yBottom),\n plotX = point.plotX || 0, \n // Don't draw too far outside plot area (#1303, #2241,\n // #4264)\n plotY = clamp(point.plotY, -safeDistance,\n yAxis.len + safeDistance);\n var up,\n barY = Math.min(plotY,\n yBottom),\n barH = Math.max(plotY,\n yBottom) - barY,\n pointWidth = seriesPointWidth,\n barX = plotX + seriesXOffset,\n barW = seriesBarW;\n // Handle options.minPointLength\n if (minPointLength && Math.abs(barH) < minPointLength) {\n barH = minPointLength;\n up = (!yAxis.reversed && !point.negative) ||\n (yAxis.reversed && point.negative);\n // Reverse zeros if there's no positive value in the series\n // in visible range (#7046)\n if (isNumber(threshold) &&\n isNumber(dataMax) &&\n point.y === threshold &&\n dataMax <= threshold &&\n // and if there's room for it (#7311)\n (yAxis.min || 0) < threshold &&\n // if all points are the same value (i.e zero) not draw\n // as negative points (#10646), but only if there's room\n // for it (#14876)\n (dataMin !== dataMax || (yAxis.max || 0) <= threshold)) {\n up = !up;\n }\n // If stacked...\n barY = (Math.abs(barY - translatedThreshold) > minPointLength ?\n // ...keep position\n yBottom - minPointLength :\n // #1485, #4051\n translatedThreshold -\n (up ? minPointLength : 0));\n }\n // Handle point.options.pointWidth\n // @todo Handle grouping/stacking too. Calculate offset properly\n if (defined(point.options.pointWidth)) {\n pointWidth = barW =\n Math.ceil(point.options.pointWidth);\n barX -= Math.round((pointWidth - seriesPointWidth) / 2);\n }\n // Adjust for null or missing points\n if (options.centerInCategory) {\n barX = series.adjustForMissingColumns(barX, pointWidth, point, metrics);\n }\n // Cache for access in polar\n point.barX = barX;\n point.pointWidth = pointWidth;\n // Fix the tooltip on center of grouped columns (#1216, #424,\n // #3648)\n point.tooltipPos = chart.inverted ?\n [\n clamp(yAxis.len + yAxis.pos - chart.plotLeft - plotY, yAxis.pos - chart.plotLeft, yAxis.len + yAxis.pos - chart.plotLeft),\n xAxis.len + xAxis.pos - chart.plotTop - barX - barW / 2,\n barH\n ] :\n [\n xAxis.left - chart.plotLeft + barX + barW / 2,\n clamp(plotY + yAxis.pos -\n chart.plotTop, yAxis.pos - chart.plotTop, yAxis.len + yAxis.pos - chart.plotTop),\n barH\n ];\n // Register shape type and arguments to be used in drawPoints\n // Allow shapeType defined on pointClass level\n point.shapeType = series.pointClass.prototype.shapeType || 'rect';\n point.shapeArgs = series.crispCol.apply(series, point.isNull ?\n // #3169, drilldown from null must have a position to work\n // from #6585, dataLabel should be placed on xAxis, not\n // floating in the middle of the chart\n [barX, translatedThreshold, barW, 0] :\n [barX, barY, barW, barH]);\n });\n };\n /**\n * Columns have no graph\n *\n * @private\n * @function Highcharts.seriesTypes.column#drawGraph\n */\n ColumnSeries.prototype.drawGraph = function () {\n this.group[this.dense ? 'addClass' : 'removeClass']('highcharts-dense-data');\n };\n /**\n * Get presentational attributes\n *\n * @private\n * @function Highcharts.seriesTypes.column#pointAttribs\n */\n ColumnSeries.prototype.pointAttribs = function (point, state) {\n var options = this.options, p2o = this.pointAttrToOptions || {}, strokeOption = p2o.stroke || 'borderColor', strokeWidthOption = p2o['stroke-width'] || 'borderWidth';\n var stateOptions,\n zone,\n brightness,\n fill = (point && point.color) || this.color, \n // set to fill when borderColor null:\n stroke = ((point && point[strokeOption]) ||\n options[strokeOption] ||\n fill),\n dashstyle = (point && point.options.dashStyle) || options.dashStyle,\n strokeWidth = (point && point[strokeWidthOption]) ||\n options[strokeWidthOption] ||\n this[strokeWidthOption] || 0,\n opacity = pick(point && point.opacity,\n options.opacity, 1);\n // Handle zone colors\n if (point && this.zones.length) {\n zone = point.getZone();\n // When zones are present, don't use point.color (#4267).\n // Changed order (#6527), added support for colorAxis (#10670)\n fill = (point.options.color ||\n (zone && (zone.color || point.nonZonedColor)) ||\n this.color);\n if (zone) {\n stroke = zone.borderColor || stroke;\n dashstyle = zone.dashStyle || dashstyle;\n strokeWidth = zone.borderWidth || strokeWidth;\n }\n }\n // Select or hover states\n if (state && point) {\n stateOptions = merge(options.states[state], \n // #6401\n point.options.states &&\n point.options.states[state] ||\n {});\n brightness = stateOptions.brightness;\n fill =\n stateOptions.color || (typeof brightness !== 'undefined' &&\n color(fill)\n .brighten(stateOptions.brightness)\n .get()) || fill;\n stroke = stateOptions[strokeOption] || stroke;\n strokeWidth =\n stateOptions[strokeWidthOption] || strokeWidth;\n dashstyle = stateOptions.dashStyle || dashstyle;\n opacity = pick(stateOptions.opacity, opacity);\n }\n var ret = {\n fill: fill,\n stroke: stroke,\n 'stroke-width': strokeWidth,\n opacity: opacity\n };\n if (dashstyle) {\n ret.dashstyle = dashstyle;\n }\n return ret;\n };\n /**\n * Draw the columns. For bars, the series.group is rotated, so the same\n * coordinates apply for columns and bars. This method is inherited by\n * scatter series.\n *\n * @private\n * @function Highcharts.seriesTypes.column#drawPoints\n */\n ColumnSeries.prototype.drawPoints = function (points) {\n if (points === void 0) { points = this.points; }\n var series = this,\n chart = this.chart,\n options = series.options,\n renderer = chart.renderer,\n animationLimit = options.animationLimit || 250;\n var shapeArgs;\n // draw the columns\n points.forEach(function (point) {\n var plotY = point.plotY;\n var graphic = point.graphic,\n hasGraphic = !!graphic,\n verb = graphic && chart.pointCount < animationLimit ?\n 'animate' : 'attr';\n if (isNumber(plotY) && point.y !== null) {\n shapeArgs = point.shapeArgs;\n // When updating a series between 2d and 3d or cartesian and\n // polar, the shape type changes.\n if (graphic && point.hasNewShapeType()) {\n graphic = graphic.destroy();\n }\n // Set starting position for point sliding animation.\n if (series.enabledDataSorting) {\n point.startXPos = series.xAxis.reversed ?\n -(shapeArgs ? (shapeArgs.width || 0) : 0) :\n series.xAxis.width;\n }\n if (!graphic) {\n point.graphic = graphic =\n renderer[point.shapeType](shapeArgs)\n .add(point.group || series.group);\n if (graphic &&\n series.enabledDataSorting &&\n chart.hasRendered &&\n chart.pointCount < animationLimit) {\n graphic.attr({\n x: point.startXPos\n });\n hasGraphic = true;\n verb = 'animate';\n }\n }\n if (graphic && hasGraphic) { // update\n graphic[verb](merge(shapeArgs));\n }\n // Border radius is not stylable (#6900)\n if (options.borderRadius) {\n graphic[verb]({\n r: options.borderRadius\n });\n }\n // Presentational\n if (!chart.styledMode) {\n graphic[verb](series.pointAttribs(point, (point.selected && 'select')))\n .shadow(point.allowShadow !== false && options.shadow, null, options.stacking && !options.borderRadius);\n }\n if (graphic) {\n graphic.addClass(point.getClassName(), true);\n graphic.attr({\n visibility: point.visible ? 'inherit' : 'hidden'\n });\n }\n }\n else if (graphic) {\n point.graphic = graphic.destroy(); // #1269\n }\n });\n };\n /**\n * Draw the tracker for a point.\n * @private\n */\n ColumnSeries.prototype.drawTracker = function (points) {\n if (points === void 0) { points = this.points; }\n var series = this,\n chart = series.chart,\n pointer = chart.pointer,\n onMouseOver = function (e) {\n var point = pointer.getPointFromEvent(e);\n // undefined on graph in scatterchart\n if (typeof point !== 'undefined') {\n pointer.isDirectTouch = true;\n point.onMouseOver(e);\n }\n };\n var dataLabels;\n // Add reference to the point\n points.forEach(function (point) {\n dataLabels = (isArray(point.dataLabels) ?\n point.dataLabels :\n (point.dataLabel ? [point.dataLabel] : []));\n if (point.graphic) {\n point.graphic.element.point = point;\n }\n dataLabels.forEach(function (dataLabel) {\n if (dataLabel.div) {\n dataLabel.div.point = point;\n }\n else {\n dataLabel.element.point = point;\n }\n });\n });\n // Add the event listeners, we need to do this only once\n if (!series._hasTracking) {\n series.trackerGroups.forEach(function (key) {\n if (series[key]) {\n // we don't always have dataLabelsGroup\n series[key]\n .addClass('highcharts-tracker')\n .on('mouseover', onMouseOver)\n .on('mouseout', function (e) {\n pointer.onTrackerMouseOut(e);\n });\n if (hasTouch) {\n series[key].on('touchstart', onMouseOver);\n }\n if (!chart.styledMode && series.options.cursor) {\n series[key]\n .css({ cursor: series.options.cursor });\n }\n }\n });\n series._hasTracking = true;\n }\n fireEvent(this, 'afterDrawTracker');\n };\n /**\n * Remove this series from the chart\n *\n * @private\n * @function Highcharts.seriesTypes.column#remove\n */\n ColumnSeries.prototype.remove = function () {\n var series = this,\n chart = series.chart;\n // column and bar series affects other series of the same type\n // as they are either stacked or grouped\n if (chart.hasRendered) {\n chart.series.forEach(function (otherSeries) {\n if (otherSeries.type === series.type) {\n otherSeries.isDirty = true;\n }\n });\n }\n Series.prototype.remove.apply(series, arguments);\n };\n ColumnSeries.defaultOptions = merge(Series.defaultOptions, ColumnSeriesDefaults);\n return ColumnSeries;\n }(Series));\n extend(ColumnSeries.prototype, {\n cropShoulder: 0,\n // When tooltip is not shared, this series (and derivatives) requires\n // direct touch/hover. KD-tree does not apply.\n directTouch: true,\n /**\n * Use a solid rectangle like the area series types\n *\n * @private\n * @function Highcharts.seriesTypes.column#drawLegendSymbol\n *\n * @param {Highcharts.Legend} legend\n * The legend object\n *\n * @param {Highcharts.Series|Highcharts.Point} item\n * The series (this) or point\n */\n drawLegendSymbol: LegendSymbol.drawRectangle,\n getSymbol: noop,\n // use separate negative stacks, unlike area stacks where a negative\n // point is substracted from previous (#1910)\n negStacks: true,\n trackerGroups: ['group', 'dataLabelsGroup']\n });\n SeriesRegistry.registerSeriesType('column', ColumnSeries);\n /* *\n *\n * Default Export\n *\n * */\n /* *\n *\n * API Declarations\n *\n * */\n /**\n * Adjusted width and x offset of the columns for grouping.\n *\n * @private\n * @interface Highcharts.ColumnMetricsObject\n */ /**\n * Width of the columns.\n * @name Highcharts.ColumnMetricsObject#width\n * @type {number}\n */ /**\n * Offset of the columns.\n * @name Highcharts.ColumnMetricsObject#offset\n * @type {number}\n */\n ''; // detach doclets above\n\n return ColumnSeries;\n });\n _registerModule(_modules, 'Core/Series/DataLabel.js', [_modules['Core/Animation/AnimationUtilities.js'], _modules['Core/FormatUtilities.js'], _modules['Core/Utilities.js']], function (A, F, U) {\n /* *\n *\n * (c) 2010-2021 Torstein Honsi\n *\n * License: www.highcharts.com/license\n *\n * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!\n *\n * */\n var getDeferredAnimation = A.getDeferredAnimation;\n var format = F.format;\n var defined = U.defined,\n extend = U.extend,\n fireEvent = U.fireEvent,\n isArray = U.isArray,\n isString = U.isString,\n merge = U.merge,\n objectEach = U.objectEach,\n pick = U.pick,\n splat = U.splat;\n /* *\n *\n * Composition\n *\n * */\n /* eslint-disable valid-jsdoc */\n var DataLabel;\n (function (DataLabel) {\n /* *\n *\n * Declarations\n *\n * */\n /* *\n *\n * Constants\n *\n * */\n var composedClasses = [];\n /* *\n *\n * Functions\n *\n * */\n /* eslint-disable valid-jsdoc */\n /**\n * Align each individual data label.\n * @private\n */\n function alignDataLabel(point, dataLabel, options, alignTo, isNew) {\n var series = this,\n chart = this.chart,\n inverted = this.isCartesian && chart.inverted,\n enabledDataSorting = this.enabledDataSorting,\n plotX = point.plotX,\n plotY = point.plotY,\n rotation = options.rotation,\n align = options.align,\n isInsidePlot = defined(plotX) &&\n defined(plotY) &&\n chart.isInsidePlot(plotX,\n Math.round(plotY), {\n inverted: inverted,\n paneCoordinates: true,\n series: series\n }),\n setStartPos = function (alignOptions) {\n if (enabledDataSorting && series.xAxis && !justify) {\n series.setDataLabelStartPos(point,\n dataLabel,\n isNew,\n isInsidePlot,\n alignOptions);\n }\n };\n var baseline,\n rotCorr, // rotation correction\n // Math.round for rounding errors (#2683), alignTo to allow column\n // labels (#2700)\n alignAttr, // the final position;\n justify = pick(options.overflow, (enabledDataSorting ? 'none' : 'justify')) === 'justify', visible = this.visible &&\n point.visible !== false &&\n defined(plotX) &&\n (point.series.forceDL ||\n (enabledDataSorting && !justify) ||\n isInsidePlot ||\n (\n // If the data label is inside the align box, it is\n // enough that parts of the align box is inside the\n // plot area (#12370). When stacking, it is always\n // inside regardless of the option (#15148).\n pick(options.inside, !!this.options.stacking) &&\n alignTo &&\n chart.isInsidePlot(plotX, inverted ?\n alignTo.x + 1 :\n alignTo.y + alignTo.height - 1, {\n inverted: inverted,\n paneCoordinates: true,\n series: series\n })));\n var pos = point.pos();\n if (visible && pos) {\n if (rotation) {\n dataLabel.attr({ align: align });\n }\n var bBox = dataLabel.getBBox(true),\n bBoxCorrection = [0, 0];\n baseline = chart.renderer.fontMetrics(chart.styledMode ? void 0 : options.style.fontSize, dataLabel).b;\n // The alignment box is a singular point\n alignTo = extend({\n x: pos[0],\n y: Math.round(pos[1]),\n width: 0,\n height: 0\n }, alignTo);\n // Add the text size for alignment calculation\n extend(options, {\n width: bBox.width,\n height: bBox.height\n });\n // Allow a hook for changing alignment in the last moment, then do\n // the alignment\n if (rotation) {\n justify = false; // Not supported for rotated text\n rotCorr = chart.renderer.rotCorr(baseline, rotation); // #3723\n alignAttr = {\n x: (alignTo.x +\n (options.x || 0) +\n alignTo.width / 2 +\n rotCorr.x),\n y: (alignTo.y +\n (options.y || 0) +\n { top: 0, middle: 0.5, bottom: 1 }[options.verticalAlign] *\n alignTo.height)\n };\n bBoxCorrection = [\n bBox.x - Number(dataLabel.attr('x')),\n bBox.y - Number(dataLabel.attr('y'))\n ];\n setStartPos(alignAttr); // data sorting\n dataLabel[isNew ? 'attr' : 'animate'](alignAttr);\n }\n else {\n setStartPos(alignTo); // data sorting\n dataLabel.align(options, void 0, alignTo);\n alignAttr = dataLabel.alignAttr;\n }\n // Handle justify or crop\n if (justify && alignTo.height >= 0) { // #8830\n this.justifyDataLabel(dataLabel, options, alignAttr, bBox, alignTo, isNew);\n // Now check that the data label is within the plot area\n }\n else if (pick(options.crop, true)) {\n var x = alignAttr.x,\n y = alignAttr.y;\n x += bBoxCorrection[0];\n y += bBoxCorrection[1];\n // Uncomment this block to visualize the bounding boxes used for\n // determining visibility\n /*\n chart.renderer.rect(\n chart.plotLeft + alignAttr.x + bBox.x,\n chart.plotTop + alignAttr.y + bBox.y + 9999,\n bBox.width,\n bBox.height\n ).attr({\n stroke: 'rgba(0, 0, 0, 0.3)',\n 'stroke-width': 0.5\n }).add();\n chart.renderer.circle(\n chart.plotLeft + alignAttr.x,\n chart.plotTop + alignAttr.y,\n 2\n ).attr({\n fill: 'red',\n zIndex: 20\n }).add();\n // */\n visible =\n chart.isInsidePlot(x, y, {\n paneCoordinates: true,\n series: series\n }) &&\n chart.isInsidePlot(x + bBox.width, y + bBox.height, {\n paneCoordinates: true,\n series: series\n });\n }\n // When we're using a shape, make it possible with a connector or an\n // arrow pointing to thie point\n if (options.shape && !rotation) {\n dataLabel[isNew ? 'attr' : 'animate']({\n anchorX: pos[0],\n anchorY: pos[1]\n });\n }\n }\n // To use alignAttr property in hideOverlappingLabels\n if (isNew && enabledDataSorting) {\n dataLabel.placed = false;\n }\n // Show or hide based on the final aligned position\n if (!visible && (!enabledDataSorting || justify)) {\n dataLabel.hide();\n dataLabel.placed = false; // don't animate back in\n }\n else {\n dataLabel.show();\n }\n }\n /**\n * Handle the dataLabels.filter option.\n * @private\n */\n function applyFilter(point, options) {\n var filter = options.filter;\n if (filter) {\n var op = filter.operator;\n var prop = point[filter.property];\n var val = filter.value;\n if ((op === '>' && prop > val) ||\n (op === '<' && prop < val) ||\n (op === '>=' && prop >= val) ||\n (op === '<=' && prop <= val) ||\n (op === '==' && prop == val) || // eslint-disable-line eqeqeq\n (op === '===' && prop === val)) {\n return true;\n }\n return false;\n }\n return true;\n }\n /**\n * @private\n */\n function compose(SeriesClass) {\n if (composedClasses.indexOf(SeriesClass) === -1) {\n var seriesProto = SeriesClass.prototype;\n composedClasses.push(SeriesClass);\n seriesProto.alignDataLabel = alignDataLabel;\n seriesProto.drawDataLabels = drawDataLabels;\n seriesProto.justifyDataLabel = justifyDataLabel;\n seriesProto.setDataLabelStartPos = setDataLabelStartPos;\n }\n }\n DataLabel.compose = compose;\n /**\n * Draw the data labels\n * @private\n */\n function drawDataLabels(points) {\n if (points === void 0) { points = this.points; }\n var series = this,\n chart = series.chart,\n seriesOptions = series.options,\n hasRendered = series.hasRendered || 0,\n renderer = chart.renderer,\n _a = chart.options.chart,\n backgroundColor = _a.backgroundColor,\n plotBackgroundColor = _a.plotBackgroundColor,\n contrastColor = renderer.getContrast((isString(plotBackgroundColor) && plotBackgroundColor) ||\n (isString(backgroundColor) && backgroundColor) ||\n \"#000000\" /* Palette.neutralColor100 */);\n var seriesDlOptions = seriesOptions.dataLabels,\n pointOptions,\n dataLabelsGroup;\n var dataLabelAnim = seriesDlOptions.animation,\n animationConfig = seriesDlOptions.defer ?\n getDeferredAnimation(chart,\n dataLabelAnim,\n series) :\n { defer: 0,\n duration: 0 };\n // Merge in plotOptions.dataLabels for series\n seriesDlOptions = mergeArrays(mergeArrays(chart.options.plotOptions &&\n chart.options.plotOptions.series &&\n chart.options.plotOptions.series.dataLabels, chart.options.plotOptions &&\n chart.options.plotOptions[series.type] &&\n chart.options.plotOptions[series.type].dataLabels), seriesDlOptions);\n fireEvent(this, 'drawDataLabels');\n if (isArray(seriesDlOptions) ||\n seriesDlOptions.enabled ||\n series._hasPointLabels) {\n // Create a separate group for the data labels to avoid rotation\n dataLabelsGroup = series.plotGroup('dataLabelsGroup', 'data-labels', !hasRendered ? 'hidden' : 'inherit', // #5133, #10220\n seriesDlOptions.zIndex || 6);\n dataLabelsGroup.attr({ opacity: +hasRendered }); // #3300\n if (!hasRendered) {\n var group = series.dataLabelsGroup;\n if (group) {\n if (series.visible) { // #2597, #3023, #3024\n dataLabelsGroup.show();\n }\n group[seriesOptions.animation ? 'animate' : 'attr']({ opacity: 1 }, animationConfig);\n }\n }\n // Make the labels for each point\n points.forEach(function (point) {\n // Merge in series options for the point.\n // @note dataLabelAttribs (like pointAttribs) would eradicate\n // the need for dlOptions, and simplify the section below.\n pointOptions = splat(mergeArrays(seriesDlOptions, \n // dlOptions is used in treemaps\n (point.dlOptions ||\n (point.options && point.options.dataLabels))));\n // Handle each individual data label for this point\n pointOptions.forEach(function (labelOptions, i) {\n // Options for one datalabel\n var labelEnabled = (labelOptions.enabled &&\n // #2282, #4641, #7112, #10049\n (!point.isNull || point.dataLabelOnNull) &&\n applyFilter(point,\n labelOptions)),\n connector = point.connectors ?\n point.connectors[i] :\n point.connector;\n var labelConfig,\n formatString,\n labelText,\n style,\n rotation,\n attr,\n dataLabel = point.dataLabels ?\n point.dataLabels[i] : point.dataLabel,\n isNew = !dataLabel;\n var labelDistance = pick(labelOptions.distance,\n point.labelDistance);\n if (labelEnabled) {\n // Create individual options structure that can be\n // extended without affecting others\n labelConfig = point.getLabelConfig();\n formatString = pick(labelOptions[point.formatPrefix + 'Format'], labelOptions.format);\n labelText = defined(formatString) ?\n format(formatString, labelConfig, chart) :\n (labelOptions[point.formatPrefix + 'Formatter'] ||\n labelOptions.formatter).call(labelConfig, labelOptions);\n style = labelOptions.style;\n rotation = labelOptions.rotation;\n if (!chart.styledMode) {\n // Determine the color\n style.color = pick(labelOptions.color, style.color, series.color, \"#000000\" /* Palette.neutralColor100 */);\n // Get automated contrast color\n if (style.color === 'contrast') {\n point.contrastColor = renderer.getContrast((point.color || series.color));\n style.color = (!defined(labelDistance) &&\n labelOptions.inside) ||\n labelDistance < 0 ||\n !!seriesOptions.stacking ?\n point.contrastColor :\n contrastColor;\n }\n else {\n delete point.contrastColor;\n }\n if (seriesOptions.cursor) {\n style.cursor = seriesOptions.cursor;\n }\n }\n attr = {\n r: labelOptions.borderRadius || 0,\n rotation: rotation,\n padding: labelOptions.padding,\n zIndex: 1\n };\n if (!chart.styledMode) {\n var backgroundColor_1 = labelOptions.backgroundColor,\n borderColor = labelOptions.borderColor;\n attr.fill = backgroundColor_1 === 'auto' ?\n point.color :\n backgroundColor_1;\n attr.stroke = borderColor === 'auto' ?\n point.color :\n borderColor;\n attr['stroke-width'] = labelOptions.borderWidth;\n }\n // Remove unused attributes (#947)\n objectEach(attr, function (val, name) {\n if (typeof val === 'undefined') {\n delete attr[name];\n }\n });\n }\n // If the point is outside the plot area, destroy it. #678,\n // #820\n if (dataLabel && (!labelEnabled ||\n !defined(labelText) ||\n !!dataLabel.div !== !!labelOptions.useHTML ||\n (\n // Change from no rotation to rotation and\n // vice versa. Don't use defined() because\n // rotation = 0 means also rotation = undefined\n (!dataLabel.rotation ||\n !labelOptions.rotation) &&\n dataLabel.rotation !== labelOptions.rotation))) {\n isNew = true;\n point.dataLabel = dataLabel =\n point.dataLabel && point.dataLabel.destroy();\n if (point.dataLabels) {\n // Remove point.dataLabels if this was the last one\n if (point.dataLabels.length === 1) {\n delete point.dataLabels;\n }\n else {\n delete point.dataLabels[i];\n }\n }\n if (!i) {\n delete point.dataLabel;\n }\n if (connector) {\n point.connector = point.connector.destroy();\n if (point.connectors) {\n // Remove point.connectors if this was the last\n // one\n if (point.connectors.length === 1) {\n delete point.connectors;\n }\n else {\n delete point.connectors[i];\n }\n }\n }\n }\n // Individual labels are disabled if the are explicitly\n // disabled in the point options, or if they fall outside\n // the plot area.\n if (labelEnabled && defined(labelText)) {\n if (!dataLabel) {\n // Create new label element\n point.dataLabels = point.dataLabels || [];\n dataLabel = point.dataLabels[i] = rotation ?\n // Labels don't rotate, use text element\n renderer.text(labelText, 0, 0, labelOptions.useHTML)\n .addClass('highcharts-data-label') :\n // We can use label\n renderer.label(labelText, 0, 0, labelOptions.shape, null, null, labelOptions.useHTML, null, 'data-label');\n // Store for backwards compatibility\n if (!i) {\n point.dataLabel = dataLabel;\n }\n dataLabel.addClass(' highcharts-data-label-color-' +\n point.colorIndex +\n ' ' + (labelOptions.className || '') +\n ( // #3398\n labelOptions.useHTML ?\n ' highcharts-tracker' :\n ''));\n }\n else {\n // Use old element and just update text\n attr.text = labelText;\n }\n // Store data label options for later access\n dataLabel.options = labelOptions;\n dataLabel.attr(attr);\n if (!chart.styledMode) {\n // Styles must be applied before add in order to\n // read text bounding box\n dataLabel.css(style).shadow(labelOptions.shadow);\n }\n var textPathOptions = labelOptions[point.formatPrefix + 'TextPath'] ||\n labelOptions.textPath;\n if (textPathOptions && !labelOptions.useHTML) {\n dataLabel.setTextPath((point.getDataLabelPath &&\n point.getDataLabelPath(dataLabel)) || point.graphic, textPathOptions);\n if (point.dataLabelPath &&\n !textPathOptions.enabled) {\n // clean the DOM\n point.dataLabelPath = (point.dataLabelPath.destroy());\n }\n }\n if (!dataLabel.added) {\n dataLabel.add(dataLabelsGroup);\n }\n // Now the data label is created and placed at 0,0, so\n // we need to align it\n series.alignDataLabel(point, dataLabel, labelOptions, null, isNew);\n }\n else if (dataLabel) {\n dataLabel.hide();\n }\n });\n });\n }\n fireEvent(this, 'afterDrawDataLabels');\n }\n /**\n * If data labels fall partly outside the plot area, align them back in, in\n * a way that doesn't hide the point.\n * @private\n */\n function justifyDataLabel(dataLabel, options, alignAttr, bBox, alignTo, isNew) {\n var chart = this.chart,\n align = options.align,\n verticalAlign = options.verticalAlign,\n padding = dataLabel.box ? 0 : (dataLabel.padding || 0);\n var _a = options.x,\n x = _a === void 0 ? 0 : _a,\n _b = options.y,\n y = _b === void 0 ? 0 : _b,\n off,\n justified;\n // Off left\n off = (alignAttr.x || 0) + padding;\n if (off < 0) {\n if (align === 'right' && x >= 0) {\n options.align = 'left';\n options.inside = true;\n }\n else {\n x -= off;\n }\n justified = true;\n }\n // Off right\n off = (alignAttr.x || 0) + bBox.width - padding;\n if (off > chart.plotWidth) {\n if (align === 'left' && x <= 0) {\n options.align = 'right';\n options.inside = true;\n }\n else {\n x += chart.plotWidth - off;\n }\n justified = true;\n }\n // Off top\n off = alignAttr.y + padding;\n if (off < 0) {\n if (verticalAlign === 'bottom' && y >= 0) {\n options.verticalAlign = 'top';\n options.inside = true;\n }\n else {\n y -= off;\n }\n justified = true;\n }\n // Off bottom\n off = (alignAttr.y || 0) + bBox.height - padding;\n if (off > chart.plotHeight) {\n if (verticalAlign === 'top' && y <= 0) {\n options.verticalAlign = 'bottom';\n options.inside = true;\n }\n else {\n y += chart.plotHeight - off;\n }\n justified = true;\n }\n if (justified) {\n options.x = x;\n options.y = y;\n dataLabel.placed = !isNew;\n dataLabel.align(options, void 0, alignTo);\n }\n return justified;\n }\n /**\n * Merge two objects that can be arrays. If one of them is an array, the\n * other is merged into each element. If both are arrays, each element is\n * merged by index. If neither are arrays, we use normal merge.\n * @private\n */\n function mergeArrays(one, two) {\n var res = [],\n i;\n if (isArray(one) && !isArray(two)) {\n res = one.map(function (el) {\n return merge(el, two);\n });\n }\n else if (isArray(two) && !isArray(one)) {\n res = two.map(function (el) {\n return merge(one, el);\n });\n }\n else if (!isArray(one) && !isArray(two)) {\n res = merge(one, two);\n }\n else {\n i = Math.max(one.length, two.length);\n while (i--) {\n res[i] = merge(one[i], two[i]);\n }\n }\n return res;\n }\n /**\n * Set starting position for data label sorting animation.\n * @private\n */\n function setDataLabelStartPos(point, dataLabel, isNew, isInside, alignOptions) {\n var chart = this.chart,\n inverted = chart.inverted,\n xAxis = this.xAxis,\n reversed = xAxis.reversed,\n labelCenter = inverted ? dataLabel.height / 2 : dataLabel.width / 2,\n pointWidth = point.pointWidth,\n halfWidth = pointWidth ? pointWidth / 2 : 0;\n dataLabel.startXPos = inverted ?\n alignOptions.x :\n (reversed ?\n -labelCenter - halfWidth :\n xAxis.width - labelCenter + halfWidth);\n dataLabel.startYPos = inverted ?\n (reversed ?\n this.yAxis.height - labelCenter + halfWidth :\n -labelCenter - halfWidth) : alignOptions.y;\n // We need to handle visibility in case of sorting point outside plot\n // area\n if (!isInside) {\n dataLabel\n .attr({ opacity: 1 })\n .animate({ opacity: 0 }, void 0, dataLabel.hide);\n }\n else if (dataLabel.visibility === 'hidden') {\n dataLabel.show();\n dataLabel\n .attr({ opacity: 0 })\n .animate({ opacity: 1 });\n }\n // Save start position on first render, but do not change position\n if (!chart.hasRendered) {\n return;\n }\n // Set start position\n if (isNew) {\n dataLabel.attr({ x: dataLabel.startXPos, y: dataLabel.startYPos });\n }\n dataLabel.placed = true;\n }\n })(DataLabel || (DataLabel = {}));\n /* *\n *\n * Default Export\n *\n * */\n /* *\n *\n * API Declarations\n *\n * */\n /**\n * Callback JavaScript function to format the data label as a string. Note that\n * if a `format` is defined, the format takes precedence and the formatter is\n * ignored.\n *\n * @callback Highcharts.DataLabelsFormatterCallbackFunction\n *\n * @param {Highcharts.PointLabelObject} this\n * Data label context to format\n *\n * @param {Highcharts.DataLabelsOptions} options\n * [API options](/highcharts/plotOptions.series.dataLabels) of the data label\n *\n * @return {number|string|null|undefined}\n * Formatted data label text\n */\n /**\n * Values for handling data labels that flow outside the plot area.\n *\n * @typedef {\"allow\"|\"justify\"} Highcharts.DataLabelsOverflowValue\n */\n ''; // keeps doclets above in JS file\n\n return DataLabel;\n });\n _registerModule(_modules, 'Series/Column/ColumnDataLabel.js', [_modules['Core/Series/DataLabel.js'], _modules['Core/Series/SeriesRegistry.js'], _modules['Core/Utilities.js']], function (DataLabel, SeriesRegistry, U) {\n /* *\n *\n * (c) 2010-2021 Torstein Honsi\n *\n * License: www.highcharts.com/license\n *\n * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!\n *\n * */\n var Series = SeriesRegistry.series;\n var merge = U.merge,\n pick = U.pick;\n /* *\n *\n * Composition\n *\n * */\n var ColumnDataLabel;\n (function (ColumnDataLabel) {\n /* *\n *\n * Constants\n *\n * */\n var composedClasses = [];\n /* *\n *\n * Functions\n *\n * */\n /* eslint-disable valid-jsdoc */\n /**\n * Override the basic data label alignment by adjusting for the position of\n * the column.\n * @private\n */\n function alignDataLabel(point, dataLabel, options, alignTo, isNew) {\n var inverted = this.chart.inverted,\n series = point.series,\n xLen = (series.xAxis ? series.xAxis.len : this.chart.plotSizeX) || 0,\n yLen = (series.yAxis ? series.yAxis.len : this.chart.plotSizeY) || 0, \n // data label box for alignment\n dlBox = point.dlBox || point.shapeArgs,\n below = pick(point.below, // range series\n point.plotY >\n pick(this.translatedThreshold,\n yLen)), \n // draw it inside the box?\n inside = pick(options.inside, !!this.options.stacking),\n overshoot;\n // Align to the column itself, or the top of it\n if (dlBox) { // Area range uses this method but not alignTo\n alignTo = merge(dlBox);\n if (alignTo.y < 0) {\n alignTo.height += alignTo.y;\n alignTo.y = 0;\n }\n // If parts of the box overshoots outside the plot area, modify the\n // box to center the label inside\n overshoot = alignTo.y + alignTo.height - yLen;\n if (overshoot > 0 && overshoot < alignTo.height) {\n alignTo.height -= overshoot;\n }\n if (inverted) {\n alignTo = {\n x: yLen - alignTo.y - alignTo.height,\n y: xLen - alignTo.x - alignTo.width,\n width: alignTo.height,\n height: alignTo.width\n };\n }\n // Compute the alignment box\n if (!inside) {\n if (inverted) {\n alignTo.x += below ? 0 : alignTo.width;\n alignTo.width = 0;\n }\n else {\n alignTo.y += below ? alignTo.height : 0;\n alignTo.height = 0;\n }\n }\n }\n // When alignment is undefined (typically columns and bars), display the\n // individual point below or above the point depending on the threshold\n options.align = pick(options.align, !inverted || inside ? 'center' : below ? 'right' : 'left');\n options.verticalAlign = pick(options.verticalAlign, inverted || inside ? 'middle' : below ? 'top' : 'bottom');\n // Call the parent method\n Series.prototype.alignDataLabel.call(this, point, dataLabel, options, alignTo, isNew);\n // If label was justified and we have contrast, set it:\n if (options.inside && point.contrastColor) {\n dataLabel.css({\n color: point.contrastColor\n });\n }\n }\n /** @private */\n function compose(ColumnSeriesClass) {\n DataLabel.compose(Series);\n if (composedClasses.indexOf(ColumnSeriesClass) === -1) {\n composedClasses.push(ColumnSeriesClass);\n ColumnSeriesClass.prototype.alignDataLabel = alignDataLabel;\n }\n }\n ColumnDataLabel.compose = compose;\n })(ColumnDataLabel || (ColumnDataLabel = {}));\n /* *\n *\n * Default Export\n *\n * */\n\n return ColumnDataLabel;\n });\n _registerModule(_modules, 'Series/Bar/BarSeries.js', [_modules['Series/Column/ColumnSeries.js'], _modules['Core/Series/SeriesRegistry.js'], _modules['Core/Utilities.js']], function (ColumnSeries, SeriesRegistry, U) {\n /* *\n *\n * (c) 2010-2021 Torstein Honsi\n *\n * License: www.highcharts.com/license\n *\n * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!\n *\n * */\n var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d,\n b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d,\n b) { d.__proto__ = b; }) ||\n function (d,\n b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n })();\n var extend = U.extend,\n merge = U.merge;\n /* *\n *\n * Class\n *\n * */\n /**\n * Bar series type.\n *\n * @private\n * @class\n * @name Highcharts.seriesTypes.bar\n *\n * @augments Highcharts.Series\n */\n var BarSeries = /** @class */ (function (_super) {\n __extends(BarSeries, _super);\n function BarSeries() {\n /* *\n *\n * Static Properties\n *\n * */\n var _this = _super !== null && _super.apply(this,\n arguments) || this;\n /* *\n *\n * Properties\n *\n * */\n _this.data = void 0;\n _this.options = void 0;\n _this.points = void 0;\n return _this;\n }\n /**\n * A bar series is a special type of column series where the columns are\n * horizontal.\n *\n * @sample highcharts/demo/bar-basic/\n * Bar chart\n *\n * @extends plotOptions.column\n * @product highcharts\n * @optionparent plotOptions.bar\n */\n BarSeries.defaultOptions = merge(ColumnSeries.defaultOptions, {\n // nothing here yet\n });\n return BarSeries;\n }(ColumnSeries));\n extend(BarSeries.prototype, {\n inverted: true\n });\n SeriesRegistry.registerSeriesType('bar', BarSeries);\n /* *\n *\n * Default Export\n *\n * */\n /* *\n *\n * API Options\n *\n * */\n /**\n * A `bar` series. If the [type](#series.bar.type) option is not specified,\n * it is inherited from [chart.type](#chart.type).\n *\n * @extends series,plotOptions.bar\n * @excluding connectNulls, dashStyle, dataParser, dataURL, gapSize, gapUnit,\n * linecap, lineWidth, marker, connectEnds, step\n * @product highcharts\n * @apioption series.bar\n */\n /**\n * An array of data points for the series. For the `bar` series type,\n * points can be given in the following ways:\n *\n * 1. An array of numerical values. In this case, the numerical values will be\n * interpreted as `y` options. The `x` values will be automatically\n * calculated, either starting at 0 and incremented by 1, or from\n * `pointStart` and `pointInterval` given in the series options. If the axis\n * has categories, these will be used. Example:\n * ```js\n * data: [0, 5, 3, 5]\n * ```\n *\n * 2. An array of arrays with 2 values. In this case, the values correspond to\n * `x,y`. If the first value is a string, it is applied as the name of the\n * point, and the `x` value is inferred.\n * ```js\n * data: [\n * [0, 5],\n * [1, 10],\n * [2, 3]\n * ]\n * ```\n *\n * 3. An array of objects with named values. The following snippet shows only a\n * few settings, see the complete options set below. If the total number of\n * data points exceeds the series'\n * [turboThreshold](#series.bar.turboThreshold), this option is not\n * available.\n * ```js\n * data: [{\n * x: 1,\n * y: 1,\n * name: \"Point2\",\n * color: \"#00FF00\"\n * }, {\n * x: 1,\n * y: 10,\n * name: \"Point1\",\n * color: \"#FF00FF\"\n * }]\n * ```\n *\n * @sample {highcharts} highcharts/chart/reflow-true/\n * Numerical values\n * @sample {highcharts} highcharts/series/data-array-of-arrays/\n * Arrays of numeric x and y\n * @sample {highcharts} highcharts/series/data-array-of-arrays-datetime/\n * Arrays of datetime x and y\n * @sample {highcharts} highcharts/series/data-array-of-name-value/\n * Arrays of point.name and y\n * @sample {highcharts} highcharts/series/data-array-of-objects/\n * Config objects\n *\n * @type {Array|null|*>}\n * @extends series.column.data\n * @product highcharts\n * @apioption series.bar.data\n */\n /**\n * @excluding halo,lineWidth,lineWidthPlus,marker\n * @product highcharts highstock\n * @apioption series.bar.states.hover\n */\n /**\n * @excluding halo,lineWidth,lineWidthPlus,marker\n * @product highcharts highstock\n * @apioption series.bar.states.select\n */\n ''; // gets doclets above into transpilat\n\n return BarSeries;\n });\n _registerModule(_modules, 'Series/Scatter/ScatterSeriesDefaults.js', [], function () {\n /* *\n *\n * (c) 2010-2021 Torstein Honsi\n *\n * License: www.highcharts.com/license\n *\n * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!\n *\n * */\n /* *\n *\n * API Options\n *\n * */\n /**\n * A scatter plot uses cartesian coordinates to display values for two\n * variables for a set of data.\n *\n * @sample {highcharts} highcharts/demo/scatter/\n * Scatter plot\n *\n * @extends plotOptions.line\n * @excluding cropThreshold, pointPlacement, shadow, useOhlcData\n * @product highcharts highstock\n * @optionparent plotOptions.scatter\n */\n var ScatterSeriesDefaults = {\n /**\n * The width of the line connecting the data points.\n *\n * @sample {highcharts} highcharts/plotoptions/scatter-linewidth-none/\n * 0 by default\n * @sample {highcharts} highcharts/plotoptions/scatter-linewidth-1/\n * 1px\n *\n * @product highcharts highstock\n */\n lineWidth: 0,\n findNearestPointBy: 'xy',\n /**\n * Apply a jitter effect for the rendered markers. When plotting\n * discrete values,\n a little random noise may help telling the points\n * apart. The jitter setting applies a random displacement of up to `n`\n * axis units in either direction. So for example on a horizontal X\n * axis,\n setting the `jitter.x` to 0.24 will render the point in a\n * random position between 0.24 units to the left and 0.24 units to the\n * right of the true axis position. On a category axis,\n setting it to\n * 0.5 will fill up the bin and make the data appear continuous.\n *\n * When rendered on top of a box plot or a column series,\n a jitter value\n * of 0.24 will correspond to the underlying series' default\n * [groupPadding](\n * https://api.highcharts.com/highcharts/plotOptions.column.groupPadding)\n * and [pointPadding](\n * https://api.highcharts.com/highcharts/plotOptions.column.pointPadding)\n * settings.\n *\n * @sample {highcharts} highcharts/demo/scatter-jitter\n * Jitter on a scatter plot\n *\n * @sample {highcharts} highcharts/series-scatter/jitter-boxplot\n * Jittered scatter plot on top of a box plot\n *\n * @product highcharts highstock\n * @since 7.0.2\n */\n jitter: {\n /**\n * The maximal X offset for the random jitter effect.\n */\n x: 0,\n /**\n * The maximal Y offset for the random jitter effect.\n */\n y: 0\n },\n marker: {\n enabled: true // Overrides auto-enabling in line series (#3647)\n },\n /**\n * Sticky tracking of mouse events. When true,\n the `mouseOut` event\n * on a series isn't triggered until the mouse moves over another\n * series,\n or out of the plot area. When false,\n the `mouseOut` event on\n * a series is triggered when the mouse leaves the area around the\n * series' graph or markers. This also implies the tooltip. When\n * `stickyTracking` is false and `tooltip.shared` is false,\n the tooltip\n * will be hidden when moving the mouse between series.\n *\n * @type {boolean}\n * @default false\n * @product highcharts highstock highmaps\n * @apioption plotOptions.scatter.stickyTracking\n */\n /**\n * A configuration object for the tooltip rendering of each single\n * series. Properties are inherited from [tooltip](#tooltip).\n * Overridable properties are `headerFormat`,\n `pointFormat`,\n * `yDecimals`,\n `xDateFormat`,\n `yPrefix` and `ySuffix`. Unlike other\n * series,\n in a scatter plot the series.name by default shows in the\n * headerFormat and point.x and point.y in the pointFormat.\n *\n * @product highcharts highstock highmaps\n */\n tooltip: {\n /**\n * @product highcharts highstock\n */\n headerFormat: '\\u25CF ' +\n ' {series.name}
',\n pointFormat: 'x: {point.x}
y: {point.y}
'\n }\n };\n /**\n * A `scatter` series. If the [type](#series.scatter.type) option is\n * not specified, it is inherited from [chart.type](#chart.type).\n *\n * @extends series,plotOptions.scatter\n * @excluding cropThreshold, dataParser, dataURL, useOhlcData\n * @product highcharts highstock\n * @apioption series.scatter\n */\n /**\n * An array of data points for the series. For the `scatter` series\n * type, points can be given in the following ways:\n *\n * 1. An array of numerical values. In this case, the numerical values will be\n * interpreted as `y` options. The `x` values will be automatically\n * calculated, either starting at 0 and incremented by 1, or from\n * `pointStart` and `pointInterval` given in the series options. If the axis\n * has categories, these will be used. Example:\n * ```js\n * data: [0, 5, 3, 5]\n * ```\n *\n * 2. An array of arrays with 2 values. In this case, the values correspond to\n * `x,y`. If the first value is a string, it is applied as the name of the\n * point, and the `x` value is inferred.\n * ```js\n * data: [\n * [0, 0],\n * [1, 8],\n * [2, 9]\n * ]\n * ```\n *\n * 3. An array of objects with named values. The following snippet shows only a\n * few settings, see the complete options set below. If the total number of\n * data points exceeds the series'\n * [turboThreshold](#series.scatter.turboThreshold), this option is not\n * available.\n * ```js\n * data: [{\n * x: 1,\n * y: 2,\n * name: \"Point2\",\n * color: \"#00FF00\"\n * }, {\n * x: 1,\n * y: 4,\n * name: \"Point1\",\n * color: \"#FF00FF\"\n * }]\n * ```\n *\n * @sample {highcharts} highcharts/chart/reflow-true/\n * Numerical values\n * @sample {highcharts} highcharts/series/data-array-of-arrays/\n * Arrays of numeric x and y\n * @sample {highcharts} highcharts/series/data-array-of-arrays-datetime/\n * Arrays of datetime x and y\n * @sample {highcharts} highcharts/series/data-array-of-name-value/\n * Arrays of point.name and y\n * @sample {highcharts} highcharts/series/data-array-of-objects/\n * Config objects\n *\n * @type {Array|null|*>}\n * @extends series.line.data\n * @product highcharts highstock\n * @apioption series.scatter.data\n */\n ''; // keeps doclets above in JS file\n /* *\n *\n * Default Export\n *\n * */\n\n return ScatterSeriesDefaults;\n });\n _registerModule(_modules, 'Series/Scatter/ScatterSeries.js', [_modules['Series/Scatter/ScatterSeriesDefaults.js'], _modules['Core/Series/SeriesRegistry.js'], _modules['Core/Utilities.js']], function (ScatterSeriesDefaults, SeriesRegistry, U) {\n /* *\n *\n * (c) 2010-2021 Torstein Honsi\n *\n * License: www.highcharts.com/license\n *\n * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!\n *\n * */\n var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d,\n b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d,\n b) { d.__proto__ = b; }) ||\n function (d,\n b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n })();\n var _a = SeriesRegistry.seriesTypes,\n ColumnSeries = _a.column,\n LineSeries = _a.line;\n var addEvent = U.addEvent,\n extend = U.extend,\n merge = U.merge;\n /* *\n *\n * Class\n *\n * */\n /**\n * Scatter series type.\n *\n * @private\n */\n var ScatterSeries = /** @class */ (function (_super) {\n __extends(ScatterSeries, _super);\n function ScatterSeries() {\n /* *\n *\n * Static Properties\n *\n * */\n var _this = _super !== null && _super.apply(this,\n arguments) || this;\n /* *\n *\n * Properties\n *\n * */\n _this.data = void 0;\n _this.options = void 0;\n _this.points = void 0;\n return _this;\n /* eslint-enable valid-jsdoc */\n }\n /* *\n *\n * Functions\n *\n * */\n /* eslint-disable valid-jsdoc */\n /**\n * Optionally add the jitter effect.\n * @private\n */\n ScatterSeries.prototype.applyJitter = function () {\n var series = this,\n jitter = this.options.jitter,\n len = this.points.length;\n /**\n * Return a repeatable, pseudo-random number based on an integer\n * seed.\n * @private\n */\n function unrandom(seed) {\n var rand = Math.sin(seed) * 10000;\n return rand - Math.floor(rand);\n }\n if (jitter) {\n this.points.forEach(function (point, i) {\n ['x', 'y'].forEach(function (dim, j) {\n var axis,\n plotProp = 'plot' + dim.toUpperCase(),\n min,\n max,\n translatedJitter;\n if (jitter[dim] && !point.isNull) {\n axis = series[dim + 'Axis'];\n translatedJitter =\n jitter[dim] * axis.transA;\n if (axis && !axis.isLog) {\n // Identify the outer bounds of the jitter range\n min = Math.max(0, point[plotProp] - translatedJitter);\n max = Math.min(axis.len, point[plotProp] + translatedJitter);\n // Find a random position within this range\n point[plotProp] = min +\n (max - min) * unrandom(i + j * len);\n // Update clientX for the tooltip k-d-tree\n if (dim === 'x') {\n point.clientX = point.plotX;\n }\n }\n }\n });\n });\n }\n };\n /**\n * @private\n */\n ScatterSeries.prototype.drawGraph = function () {\n if (this.options.lineWidth) {\n _super.prototype.drawGraph.call(this);\n }\n else if (this.graph) {\n this.graph = this.graph.destroy();\n }\n };\n ScatterSeries.defaultOptions = merge(LineSeries.defaultOptions, ScatterSeriesDefaults);\n return ScatterSeries;\n }(LineSeries));\n extend(ScatterSeries.prototype, {\n drawTracker: ColumnSeries.prototype.drawTracker,\n sorted: false,\n requireSorting: false,\n noSharedTooltip: true,\n trackerGroups: ['group', 'markerGroup', 'dataLabelsGroup'],\n takeOrdinalPosition: false // #2342\n });\n /* *\n *\n * Events\n *\n * */\n /* eslint-disable no-invalid-this */\n addEvent(ScatterSeries, 'afterTranslate', function () {\n this.applyJitter();\n });\n SeriesRegistry.registerSeriesType('scatter', ScatterSeries);\n /* *\n *\n * Default Export\n *\n * */\n\n return ScatterSeries;\n });\n _registerModule(_modules, 'Series/CenteredUtilities.js', [_modules['Core/Globals.js'], _modules['Core/Series/Series.js'], _modules['Core/Utilities.js']], function (H, Series, U) {\n /* *\n *\n * (c) 2010-2021 Torstein Honsi\n *\n * License: www.highcharts.com/license\n *\n * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!\n *\n * */\n var deg2rad = H.deg2rad;\n var fireEvent = U.fireEvent,\n isNumber = U.isNumber,\n pick = U.pick,\n relativeLength = U.relativeLength;\n /**\n * @private\n */\n var CenteredUtilities;\n (function (CenteredUtilities) {\n /* *\n *\n * Declarations\n *\n * */\n /* *\n *\n * Functions\n *\n * */\n /* eslint-disable valid-jsdoc */\n /**\n * Get the center of the pie based on the size and center options relative\n * to the plot area. Borrowed by the polar and gauge series types.\n *\n * @private\n * @function Highcharts.CenteredSeriesMixin.getCenter\n */\n function getCenter() {\n var options = this.options,\n chart = this.chart,\n slicingRoom = 2 * (options.slicedOffset || 0),\n plotWidth = chart.plotWidth - 2 * slicingRoom,\n plotHeight = chart.plotHeight - 2 * slicingRoom,\n centerOption = options.center,\n smallestSize = Math.min(plotWidth,\n plotHeight),\n thickness = options.thickness;\n var handleSlicingRoom,\n size = options.size,\n innerSize = options.innerSize || 0,\n i,\n value;\n if (typeof size === 'string') {\n size = parseFloat(size);\n }\n if (typeof innerSize === 'string') {\n innerSize = parseFloat(innerSize);\n }\n var positions = [\n pick(centerOption[0], '50%'),\n pick(centerOption[1], '50%'),\n // Prevent from negative values\n pick(size && size < 0 ? void 0 : options.size, '100%'),\n pick(innerSize && innerSize < 0 ? void 0 : options.innerSize || 0, '0%')\n ];\n // No need for inner size in angular (gauges) series but still required\n // for pie series\n if (chart.angular && !(this instanceof Series)) {\n positions[3] = 0;\n }\n for (i = 0; i < 4; ++i) {\n value = positions[i];\n handleSlicingRoom = i < 2 || (i === 2 && /%$/.test(value));\n // i == 0: centerX, relative to width\n // i == 1: centerY, relative to height\n // i == 2: size, relative to smallestSize\n // i == 3: innerSize, relative to size\n positions[i] = relativeLength(value, [plotWidth, plotHeight, smallestSize, positions[2]][i]) + (handleSlicingRoom ? slicingRoom : 0);\n }\n // innerSize cannot be larger than size (#3632)\n if (positions[3] > positions[2]) {\n positions[3] = positions[2];\n }\n // thickness overrides innerSize, need to be less than pie size (#6647)\n if (isNumber(thickness) &&\n thickness * 2 < positions[2] && thickness > 0) {\n positions[3] = positions[2] - thickness * 2;\n }\n fireEvent(this, 'afterGetCenter', { positions: positions });\n return positions;\n }\n CenteredUtilities.getCenter = getCenter;\n /**\n * getStartAndEndRadians - Calculates start and end angles in radians.\n * Used in series types such as pie and sunburst.\n *\n * @private\n * @function Highcharts.CenteredSeriesMixin.getStartAndEndRadians\n *\n * @param {number} [start]\n * Start angle in degrees.\n *\n * @param {number} [end]\n * Start angle in degrees.\n *\n * @return {Highcharts.RadianAngles}\n * Returns an object containing start and end angles as radians.\n */\n function getStartAndEndRadians(start, end) {\n var startAngle = isNumber(start) ? start : 0, // must be a number\n endAngle = ((isNumber(end) && // must be a number\n end > startAngle && // must be larger than the start angle\n // difference must be less than 360 degrees\n (end - startAngle) < 360) ?\n end :\n startAngle + 360),\n correction = -90;\n return {\n start: deg2rad * (startAngle + correction),\n end: deg2rad * (endAngle + correction)\n };\n }\n CenteredUtilities.getStartAndEndRadians = getStartAndEndRadians;\n })(CenteredUtilities || (CenteredUtilities = {}));\n /* *\n *\n * Default Export\n *\n * */\n /* *\n *\n * API Declarations\n *\n * */\n /**\n * @private\n * @interface Highcharts.RadianAngles\n */ /**\n * @name Highcharts.RadianAngles#end\n * @type {number}\n */ /**\n * @name Highcharts.RadianAngles#start\n * @type {number}\n */\n ''; // keeps doclets above in JS file\n\n return CenteredUtilities;\n });\n _registerModule(_modules, 'Series/Pie/PiePoint.js', [_modules['Core/Animation/AnimationUtilities.js'], _modules['Core/Series/Point.js'], _modules['Core/Utilities.js']], function (A, Point, U) {\n /* *\n *\n * (c) 2010-2021 Torstein Honsi\n *\n * License: www.highcharts.com/license\n *\n * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!\n *\n * */\n var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d,\n b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d,\n b) { d.__proto__ = b; }) ||\n function (d,\n b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n })();\n var setAnimation = A.setAnimation;\n var addEvent = U.addEvent,\n defined = U.defined,\n extend = U.extend,\n isNumber = U.isNumber,\n pick = U.pick,\n relativeLength = U.relativeLength;\n /* *\n *\n * Class\n *\n * */\n var PiePoint = /** @class */ (function (_super) {\n __extends(PiePoint, _super);\n function PiePoint() {\n /* *\n *\n * Properties\n *\n * */\n var _this = _super !== null && _super.apply(this,\n arguments) || this;\n _this.labelDistance = void 0;\n _this.options = void 0;\n _this.series = void 0;\n return _this;\n }\n /* *\n *\n * Functions\n *\n * */\n /* eslint-disable valid-jsdoc */\n /**\n * Extendable method for getting the path of the connector between the\n * data label and the pie slice.\n * @private\n */\n PiePoint.prototype.getConnectorPath = function () {\n var labelPosition = this.labelPosition,\n options = this.series.options.dataLabels,\n predefinedShapes = this.connectorShapes;\n var connectorShape = options.connectorShape;\n // find out whether to use the predefined shape\n if (predefinedShapes[connectorShape]) {\n connectorShape = predefinedShapes[connectorShape];\n }\n return connectorShape.call(this, {\n // pass simplified label position object for user's convenience\n x: labelPosition.final.x,\n y: labelPosition.final.y,\n alignment: labelPosition.alignment\n }, labelPosition.connectorPosition, options);\n };\n /**\n * @private\n */\n PiePoint.prototype.getTranslate = function () {\n return this.sliced ? this.slicedTranslation : {\n translateX: 0,\n translateY: 0\n };\n };\n /**\n * @private\n */\n PiePoint.prototype.haloPath = function (size) {\n var shapeArgs = this.shapeArgs;\n return this.sliced || !this.visible ?\n [] :\n this.series.chart.renderer.symbols.arc(shapeArgs.x, shapeArgs.y, shapeArgs.r + size, shapeArgs.r + size, {\n // Substract 1px to ensure the background is not bleeding\n // through between the halo and the slice (#7495).\n innerR: shapeArgs.r - 1,\n start: shapeArgs.start,\n end: shapeArgs.end\n });\n };\n /**\n * Initialize the pie slice.\n * @private\n */\n PiePoint.prototype.init = function () {\n var _this = this;\n _super.prototype.init.apply(this, arguments);\n this.name = pick(this.name, 'Slice');\n // add event listener for select\n var toggleSlice = function (e) {\n _this.slice(e.type === 'select');\n };\n addEvent(this, 'select', toggleSlice);\n addEvent(this, 'unselect', toggleSlice);\n return this;\n };\n /**\n * Negative points are not valid (#1530, #3623, #5322)\n * @private\n */\n PiePoint.prototype.isValid = function () {\n return isNumber(this.y) && this.y >= 0;\n };\n /**\n * Toggle the visibility of a pie slice or other data point. Note that this\n * method is available only for some series, like pie, treemap and sunburst.\n *\n * @function Highcharts.Point#setVisible\n *\n * @param {boolean} [vis]\n * True to show the pie slice or other data point, false to hide. If\n * undefined, the visibility is toggled.\n *\n * @param {boolean} [redraw] Whether to redraw the chart after the point is\n * altered. If doing more operations on the chart, it is a good idea to set\n * redraw to false and call {@link Chart#redraw|chart.redraw()} after.\n *\n */\n PiePoint.prototype.setVisible = function (vis, redraw) {\n var _this = this;\n var series = this.series,\n chart = series.chart,\n ignoreHiddenPoint = series.options.ignoreHiddenPoint;\n redraw = pick(redraw, ignoreHiddenPoint);\n if (vis !== this.visible) {\n // If called without an argument, toggle visibility\n this.visible = this.options.visible = vis =\n typeof vis === 'undefined' ? !this.visible : vis;\n // update userOptions.data\n series.options.data[series.data.indexOf(this)] =\n this.options;\n // Show and hide associated elements. This is performed\n // regardless of redraw or not, because chart.redraw only\n // handles full series.\n ['graphic', 'dataLabel', 'connector', 'shadowGroup'].forEach(function (key) {\n if (_this[key]) {\n _this[key][vis ? 'show' : 'hide'](vis);\n }\n });\n if (this.legendItem) {\n chart.legend.colorizeItem(this, vis);\n }\n // #4170, hide halo after hiding point\n if (!vis && this.state === 'hover') {\n this.setState('');\n }\n // Handle ignore hidden slices\n if (ignoreHiddenPoint) {\n series.isDirty = true;\n }\n if (redraw) {\n chart.redraw();\n }\n }\n };\n /**\n * Set or toggle whether the slice is cut out from the pie.\n * @private\n *\n * @param {boolean} sliced\n * When undefined, the slice state is toggled.\n *\n * @param {boolean} [redraw]\n * Whether to redraw the chart. True by default.\n *\n * @param {boolean|Partial} [animation]\n * Animation options.\n */\n PiePoint.prototype.slice = function (sliced, redraw, animation) {\n var series = this.series,\n chart = series.chart;\n setAnimation(animation, chart);\n // redraw is true by default\n redraw = pick(redraw, true);\n /**\n * Pie series only. Whether to display a slice offset from the\n * center.\n * @name Highcharts.Point#sliced\n * @type {boolean|undefined}\n */\n // if called without an argument, toggle\n this.sliced = this.options.sliced = sliced =\n defined(sliced) ? sliced : !this.sliced;\n // update userOptions.data\n series.options.data[series.data.indexOf(this)] =\n this.options;\n if (this.graphic) {\n this.graphic.animate(this.getTranslate());\n }\n if (this.shadowGroup) {\n this.shadowGroup.animate(this.getTranslate());\n }\n };\n return PiePoint;\n }(Point));\n extend(PiePoint.prototype, {\n connectorShapes: {\n // only one available before v7.0.0\n fixedOffset: function (labelPosition, connectorPosition, options) {\n var breakAt = connectorPosition.breakAt,\n touchingSliceAt = connectorPosition.touchingSliceAt,\n lineSegment = options.softConnector ? [\n 'C',\n // 1st control point (of the curve)\n labelPosition.x +\n // 5 gives the connector a little horizontal bend\n (labelPosition.alignment === 'left' ? -5 : 5),\n labelPosition.y,\n 2 * breakAt.x - touchingSliceAt.x,\n 2 * breakAt.y - touchingSliceAt.y,\n breakAt.x,\n breakAt.y //\n ] : [\n 'L',\n breakAt.x,\n breakAt.y\n ];\n // assemble the path\n return ([\n ['M', labelPosition.x, labelPosition.y],\n lineSegment,\n ['L', touchingSliceAt.x, touchingSliceAt.y]\n ]);\n },\n straight: function (labelPosition, connectorPosition) {\n var touchingSliceAt = connectorPosition.touchingSliceAt;\n // direct line to the slice\n return [\n ['M', labelPosition.x, labelPosition.y],\n ['L', touchingSliceAt.x, touchingSliceAt.y]\n ];\n },\n crookedLine: function (labelPosition, connectorPosition, options) {\n var touchingSliceAt = connectorPosition.touchingSliceAt,\n series = this.series,\n pieCenterX = series.center[0],\n plotWidth = series.chart.plotWidth,\n plotLeft = series.chart.plotLeft,\n alignment = labelPosition.alignment,\n radius = this.shapeArgs.r,\n crookDistance = relativeLength(// % to fraction\n options.crookDistance, 1),\n crookX = alignment === 'left' ?\n pieCenterX + radius + (plotWidth + plotLeft -\n pieCenterX - radius) * (1 - crookDistance) :\n plotLeft + (pieCenterX - radius) * crookDistance,\n segmentWithCrook = [\n 'L',\n crookX,\n labelPosition.y\n ];\n var useCrook = true;\n // crookedLine formula doesn't make sense if the path overlaps\n // the label - use straight line instead in that case\n if (alignment === 'left' ?\n (crookX > labelPosition.x || crookX < touchingSliceAt.x) :\n (crookX < labelPosition.x || crookX > touchingSliceAt.x)) {\n useCrook = false;\n }\n // assemble the path\n var path = [['M',\n labelPosition.x,\n labelPosition.y]];\n if (useCrook) {\n path.push(segmentWithCrook);\n }\n path.push(['L', touchingSliceAt.x, touchingSliceAt.y]);\n return path;\n }\n }\n });\n /* *\n *\n * Default Export\n *\n * */\n\n return PiePoint;\n });\n _registerModule(_modules, 'Series/Pie/PieSeriesDefaults.js', [], function () {\n /* *\n *\n * (c) 2010-2021 Torstein Honsi\n *\n * License: www.highcharts.com/license\n *\n * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!\n *\n * */\n /* *\n *\n * API Options\n *\n * */\n /**\n * A pie chart is a circular graphic which is divided into slices to\n * illustrate numerical proportion.\n *\n * @sample highcharts/demo/pie-basic/\n * Pie chart\n *\n * @extends plotOptions.line\n * @excluding animationLimit, boostThreshold, connectEnds, connectNulls,\n * cropThreshold, dashStyle, dataSorting, dragDrop,\n * findNearestPointBy, getExtremesFromAll, label, lineWidth,\n * linkedTo, marker, negativeColor, pointInterval,\n * pointIntervalUnit, pointPlacement, pointStart,\n * softThreshold, stacking, step, threshold, turboThreshold,\n * zoneAxis, zones, dataSorting, boostBlending\n * @product highcharts highmaps\n * @optionparent plotOptions.pie\n *\n * @private\n */\n var PieSeriesDefaults = {\n /**\n * @excluding legendItemClick\n * @apioption plotOptions.pie.events\n */\n /**\n * Fires when the checkbox next to the point name in the legend is\n * clicked. One parameter, event, is passed to the function. The state\n * of the checkbox is found by event.checked. The checked item is found\n * by event.item. Return false to prevent the default action which is to\n * toggle the select state of the series.\n *\n * @sample {highcharts} highcharts/plotoptions/series-events-checkboxclick/\n * Alert checkbox status\n *\n * @type {Function}\n * @since 1.2.0\n * @product highcharts highmaps\n * @context Highcharts.Point\n * @apioption plotOptions.pie.events.checkboxClick\n */\n /**\n * Fires when the legend item belonging to the pie point (slice) is\n * clicked. The `this` keyword refers to the point itself. One\n * parameter, `event`, is passed to the function, containing common\n * event information. The default action is to toggle the visibility of\n * the point. This can be prevented by calling `event.preventDefault()`.\n *\n * @sample {highcharts} highcharts/plotoptions/pie-point-events-legenditemclick/\n * Confirm toggle visibility\n *\n * @type {Highcharts.PointLegendItemClickCallbackFunction}\n * @since 1.2.0\n * @product highcharts highmaps\n * @apioption plotOptions.pie.point.events.legendItemClick\n */\n /**\n * The center of the pie chart relative to the plot area. Can be\n * percentages or pixel values. The default behaviour (as of 3.0) is to\n * center the pie so that all slices and data labels are within the plot\n * area. As a consequence, the pie may actually jump around in a chart\n * with dynamic values, as the data labels move. In that case, the\n * center should be explicitly set, for example to `[\"50%\", \"50%\"]`.\n *\n * @sample {highcharts} highcharts/plotoptions/pie-center/\n * Centered at 100, 100\n *\n * @type {Array<(number|string|null),(number|string|null)>}\n * @default [null, null]\n * @product highcharts highmaps\n *\n * @private\n */\n center: [null, null],\n /**\n * The color of the pie series. A pie series is represented as an empty\n * circle if the total sum of its values is 0. Use this property to\n * define the color of its border.\n *\n * In styled mode, the color can be defined by the\n * [colorIndex](#plotOptions.series.colorIndex) option. Also, the series\n * color can be set with the `.highcharts-series`,\n * `.highcharts-color-{n}`, `.highcharts-{type}-series` or\n * `.highcharts-series-{n}` class, or individual classes given by the\n * `className` option.\n *\n * @sample {highcharts} highcharts/plotoptions/pie-emptyseries/\n * Empty pie series\n *\n * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}\n * @default #cccccc\n * @apioption plotOptions.pie.color\n */\n /**\n * @product highcharts\n *\n * @private\n */\n clip: false,\n /**\n * @ignore-option\n *\n * @private\n */\n colorByPoint: true,\n /**\n * A series specific or series type specific color set to use instead\n * of the global [colors](#colors).\n *\n * @sample {highcharts} highcharts/demo/pie-monochrome/\n * Set default colors for all pies\n *\n * @type {Array}\n * @since 3.0\n * @product highcharts highmaps\n * @apioption plotOptions.pie.colors\n */\n /**\n * @declare Highcharts.SeriesPieDataLabelsOptionsObject\n * @extends plotOptions.series.dataLabels\n * @excluding align, allowOverlap, inside, staggerLines, step\n * @private\n */\n dataLabels: {\n /**\n * Alignment method for data labels. Possible values are:\n *\n * - `plotEdges`: Each label touches the nearest vertical edge of\n * the plot area.\n *\n * - `connectors`: Connectors have the same x position and the\n * widest label of each half (left & right) touches the nearest\n * vertical edge of the plot area.\n *\n * @sample {highcharts} highcharts/plotoptions/pie-datalabels-alignto-connectors/\n * alignTo: connectors\n * @sample {highcharts} highcharts/plotoptions/pie-datalabels-alignto-plotedges/\n * alignTo: plotEdges\n *\n * @type {string}\n * @since 7.0.0\n * @product highcharts highmaps\n * @apioption plotOptions.pie.dataLabels.alignTo\n */\n allowOverlap: true,\n /**\n * The color of the line connecting the data label to the pie slice.\n * The default color is the same as the point's color.\n *\n * In styled mode, the connector stroke is given in the\n * `.highcharts-data-label-connector` class.\n *\n * @sample {highcharts} highcharts/plotoptions/pie-datalabels-connectorcolor/\n * Blue connectors\n * @sample {highcharts} highcharts/css/pie-point/\n * Styled connectors\n *\n * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}\n * @since 2.1\n * @product highcharts highmaps\n * @apioption plotOptions.pie.dataLabels.connectorColor\n */\n /**\n * The distance from the data label to the connector. Note that\n * data labels also have a default `padding`, so in order for the\n * connector to touch the text, the `padding` must also be 0.\n *\n * @sample {highcharts} highcharts/plotoptions/pie-datalabels-connectorpadding/\n * No padding\n *\n * @since 2.1\n * @product highcharts highmaps\n */\n connectorPadding: 5,\n /**\n * Specifies the method that is used to generate the connector path.\n * Highcharts provides 3 built-in connector shapes: `'fixedOffset'`\n * (default), `'straight'` and `'crookedLine'`. Using\n * `'crookedLine'` has the most sense (in most of the cases) when\n * `'alignTo'` is set.\n *\n * Users can provide their own method by passing a function instead\n * of a String. 3 arguments are passed to the callback:\n *\n * - Object that holds the information about the coordinates of the\n * label (`x` & `y` properties) and how the label is located in\n * relation to the pie (`alignment` property). `alignment` can by\n * one of the following:\n * `'left'` (pie on the left side of the data label),\n * `'right'` (pie on the right side of the data label) or\n * `'center'` (data label overlaps the pie).\n *\n * - Object that holds the information about the position of the\n * connector. Its `touchingSliceAt` porperty tells the position\n * of the place where the connector touches the slice.\n *\n * - Data label options\n *\n * The function has to return an SVG path definition in array form\n * (see the example).\n *\n * @sample {highcharts} highcharts/plotoptions/pie-datalabels-connectorshape-string/\n * connectorShape is a String\n * @sample {highcharts} highcharts/plotoptions/pie-datalabels-connectorshape-function/\n * connectorShape is a function\n *\n * @type {string|Function}\n * @since 7.0.0\n * @product highcharts highmaps\n */\n connectorShape: 'fixedOffset',\n /**\n * The width of the line connecting the data label to the pie slice.\n *\n * In styled mode, the connector stroke width is given in the\n * `.highcharts-data-label-connector` class.\n *\n * @sample {highcharts} highcharts/plotoptions/pie-datalabels-connectorwidth-disabled/\n * Disable the connector\n * @sample {highcharts} highcharts/css/pie-point/\n * Styled connectors\n *\n * @type {number}\n * @default 1\n * @since 2.1\n * @product highcharts highmaps\n * @apioption plotOptions.pie.dataLabels.connectorWidth\n */\n /**\n * Works only if `connectorShape` is `'crookedLine'`. It defines how\n * far from the vertical plot edge the coonnector path should be\n * crooked.\n *\n * @sample {highcharts} highcharts/plotoptions/pie-datalabels-crookdistance/\n * crookDistance set to 90%\n *\n * @since 7.0.0\n * @product highcharts highmaps\n */\n crookDistance: '70%',\n /**\n * The distance of the data label from the pie's edge. Negative\n * numbers put the data label on top of the pie slices. Can also be\n * defined as a percentage of pie's radius. Connectors are only\n * shown for data labels outside the pie.\n *\n * @sample {highcharts} highcharts/plotoptions/pie-datalabels-distance/\n * Data labels on top of the pie\n *\n * @type {number|string}\n * @since 2.1\n * @product highcharts highmaps\n */\n distance: 30,\n enabled: true,\n /**\n * A\n * [format string](https://www.highcharts.com/docs/chart-concepts/labels-and-string-formatting)\n * for the data label. Available variables are the same as for\n * `formatter`.\n *\n * @sample {highcharts} highcharts/plotoptions/series-datalabels-format/\n * Add a unit\n *\n * @type {string}\n * @default undefined\n * @since 3.0\n * @apioption plotOptions.pie.dataLabels.format\n */\n // eslint-disable-next-line valid-jsdoc\n /**\n * Callback JavaScript function to format the data label. Note that\n * if a `format` is defined, the format takes precedence and the\n * formatter is ignored.\n *\n * @type {Highcharts.DataLabelsFormatterCallbackFunction}\n * @default function () { return this.point.isNull ? void 0 : this.point.name; }\n */\n formatter: function () {\n return this.point.isNull ? void 0 : this.point.name;\n },\n /**\n * Whether to render the connector as a soft arc or a line with\n * sharp break. Works only if `connectorShape` equals to\n * `fixedOffset`.\n *\n * @sample {highcharts} highcharts/plotoptions/pie-datalabels-softconnector-true/\n * Soft\n * @sample {highcharts} highcharts/plotoptions/pie-datalabels-softconnector-false/\n * Non soft\n *\n * @since 2.1.7\n * @product highcharts highmaps\n */\n softConnector: true,\n /**\n * @sample {highcharts} highcharts/plotoptions/pie-datalabels-overflow\n * Long labels truncated with an ellipsis\n * @sample {highcharts} highcharts/plotoptions/pie-datalabels-overflow-wrap\n * Long labels are wrapped\n *\n * @type {Highcharts.CSSObject}\n * @apioption plotOptions.pie.dataLabels.style\n */\n x: 0\n },\n /**\n * If the total sum of the pie's values is 0, the series is represented\n * as an empty circle . The `fillColor` option defines the color of that\n * circle. Use [pie.borderWidth](#plotOptions.pie.borderWidth) to set\n * the border thickness.\n *\n * @sample {highcharts} highcharts/plotoptions/pie-emptyseries/\n * Empty pie series\n *\n * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}\n * @private\n */\n fillColor: void 0,\n /**\n * The end angle of the pie in degrees where 0 is top and 90 is right.\n * Defaults to `startAngle` plus 360.\n *\n * @sample {highcharts} highcharts/demo/pie-semi-circle/\n * Semi-circle donut\n *\n * @type {number}\n * @since 1.3.6\n * @product highcharts highmaps\n * @apioption plotOptions.pie.endAngle\n */\n /**\n * Thickness describing the ring size for a donut type chart,\n * overriding [innerSize](#plotOptions.pie.innerSize).\n *\n * @type {number}\n * @default undefined\n * @product highcharts\n * @since 10.1.0\n * @apioption plotOptions.pie.thickness\n * @private\n */\n /**\n * Equivalent to [chart.ignoreHiddenSeries](#chart.ignoreHiddenSeries),\n * this option tells whether the series shall be redrawn as if the\n * hidden point were `null`.\n *\n * The default value changed from `false` to `true` with Highcharts\n * 3.0.\n *\n * @sample {highcharts} highcharts/plotoptions/pie-ignorehiddenpoint/\n * True, the hiddden point is ignored\n *\n * @since 2.3.0\n * @product highcharts highmaps\n *\n * @private\n */\n ignoreHiddenPoint: true,\n /**\n * @ignore-option\n *\n * @private\n */\n inactiveOtherPoints: true,\n /**\n * The size of the inner diameter for the pie. A size greater than 0\n * renders a donut chart. Can be a percentage or pixel value.\n * Percentages are relative to the pie size. Pixel values are given as\n * integers. Setting overridden by thickness.\n *\n *\n * Note: in Highcharts < 4.1.2, the percentage was relative to the plot\n * area, not the pie size.\n *\n * @sample {highcharts} highcharts/plotoptions/pie-innersize-80px/\n * 80px inner size\n * @sample {highcharts} highcharts/plotoptions/pie-innersize-50percent/\n * 50% of the plot area\n * @sample {highcharts} highcharts/demo/3d-pie-donut/\n * 3D donut\n *\n * @type {number|string}\n * @default 0\n * @since 2.0\n * @product highcharts highmaps\n * @apioption plotOptions.pie.innerSize\n */\n /**\n * @ignore-option\n *\n * @private\n */\n legendType: 'point',\n /**\n * @ignore-option\n *\n * @private\n */\n marker: null,\n /**\n * The minimum size for a pie in response to auto margins. The pie will\n * try to shrink to make room for data labels in side the plot area,\n * but only to this size.\n *\n * @type {number|string}\n * @default 80\n * @since 3.0\n * @product highcharts highmaps\n * @apioption plotOptions.pie.minSize\n */\n /**\n * The diameter of the pie relative to the plot area. Can be a\n * percentage or pixel value. Pixel values are given as integers. The\n * default behaviour (as of 3.0) is to scale to the plot area and give\n * room for data labels within the plot area.\n * [slicedOffset](#plotOptions.pie.slicedOffset) is also included in the\n * default size calculation. As a consequence, the size of the pie may\n * vary when points are updated and data labels more around. In that\n * case it is best to set a fixed value, for example `\"75%\"`.\n *\n * @sample {highcharts} highcharts/plotoptions/pie-size/\n * Smaller pie\n *\n * @type {number|string|null}\n * @product highcharts highmaps\n *\n * @private\n */\n size: null,\n /**\n * Whether to display this particular series or series type in the\n * legend. Since 2.1, pies are not shown in the legend by default.\n *\n * @sample {highcharts} highcharts/plotoptions/series-showinlegend/\n * One series in the legend, one hidden\n *\n * @product highcharts highmaps\n *\n * @private\n */\n showInLegend: false,\n /**\n * If a point is sliced, moved out from the center, how many pixels\n * should it be moved?.\n *\n * @sample {highcharts} highcharts/plotoptions/pie-slicedoffset-20/\n * 20px offset\n *\n * @product highcharts highmaps\n *\n * @private\n */\n slicedOffset: 10,\n /**\n * The start angle of the pie slices in degrees where 0 is top and 90\n * right.\n *\n * @sample {highcharts} highcharts/plotoptions/pie-startangle-90/\n * Start from right\n *\n * @type {number}\n * @default 0\n * @since 2.3.4\n * @product highcharts highmaps\n * @apioption plotOptions.pie.startAngle\n */\n /**\n * Sticky tracking of mouse events. When true, the `mouseOut` event\n * on a series isn't triggered until the mouse moves over another\n * series, or out of the plot area. When false, the `mouseOut` event on\n * a series is triggered when the mouse leaves the area around the\n * series' graph or markers. This also implies the tooltip. When\n * `stickyTracking` is false and `tooltip.shared` is false, the tooltip\n * will be hidden when moving the mouse between series.\n *\n * @product highcharts highmaps\n *\n * @private\n */\n stickyTracking: false,\n tooltip: {\n followPointer: true\n },\n /**\n * The color of the border surrounding each slice. When `null`, the\n * border takes the same color as the slice fill. This can be used\n * together with a `borderWidth` to fill drawing gaps created by\n * antialiazing artefacts in borderless pies.\n *\n * In styled mode, the border stroke is given in the `.highcharts-point`\n * class.\n *\n * @sample {highcharts} highcharts/plotoptions/pie-bordercolor-black/\n * Black border\n *\n * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}\n * @default #ffffff\n * @product highcharts highmaps\n *\n * @private\n */\n borderColor: \"#ffffff\" /* Palette.backgroundColor */,\n /**\n * The width of the border surrounding each slice.\n *\n * When setting the border width to 0, there may be small gaps between\n * the slices due to SVG antialiasing artefacts. To work around this,\n * keep the border width at 0.5 or 1, but set the `borderColor` to\n * `null` instead.\n *\n * In styled mode, the border stroke width is given in the\n * `.highcharts-point` class.\n *\n * @sample {highcharts} highcharts/plotoptions/pie-borderwidth/\n * 3px border\n *\n * @product highcharts highmaps\n *\n * @private\n */\n borderWidth: 1,\n /**\n * @ignore-option\n * @private\n */\n lineWidth: void 0,\n states: {\n /**\n * @extends plotOptions.series.states.hover\n * @excluding marker, lineWidth, lineWidthPlus\n * @product highcharts highmaps\n */\n hover: {\n /**\n * How much to brighten the point on interaction. Requires the\n * main color to be defined in hex or rgb(a) format.\n *\n * In styled mode, the hover brightness is by default replaced\n * by a fill-opacity given in the `.highcharts-point-hover`\n * class.\n *\n * @sample {highcharts} highcharts/plotoptions/pie-states-hover-brightness/\n * Brightened by 0.5\n *\n * @product highcharts highmaps\n */\n brightness: 0.1\n }\n }\n };\n /**\n * A `pie` series. If the [type](#series.pie.type) option is not specified,\n * it is inherited from [chart.type](#chart.type).\n *\n * @extends series,plotOptions.pie\n * @excluding cropThreshold, dataParser, dataURL, linkedTo, stack, xAxis, yAxis,\n * dataSorting, step, boostThreshold, boostBlending\n * @product highcharts highmaps\n * @apioption series.pie\n */\n /**\n * An array of data points for the series. For the `pie` series type,\n * points can be given in the following ways:\n *\n * 1. An array of numerical values. In this case, the numerical values will be\n * interpreted as `y` options. Example:\n * ```js\n * data: [0, 5, 3, 5]\n * ```\n *\n * 2. An array of objects with named values. The following snippet shows only a\n * few settings, see the complete options set below. If the total number of\n * data points exceeds the series'\n * [turboThreshold](#series.pie.turboThreshold),\n * this option is not available.\n * ```js\n * data: [{\n * y: 1,\n * name: \"Point2\",\n * color: \"#00FF00\"\n * }, {\n * y: 7,\n * name: \"Point1\",\n * color: \"#FF00FF\"\n * }]\n * ```\n *\n * @sample {highcharts} highcharts/chart/reflow-true/\n * Numerical values\n * @sample {highcharts} highcharts/series/data-array-of-arrays/\n * Arrays of numeric x and y\n * @sample {highcharts} highcharts/series/data-array-of-arrays-datetime/\n * Arrays of datetime x and y\n * @sample {highcharts} highcharts/series/data-array-of-name-value/\n * Arrays of point.name and y\n * @sample {highcharts} highcharts/series/data-array-of-objects/\n * Config objects\n *\n * @type {Array|null|*>}\n * @extends series.line.data\n * @excluding marker, x\n * @product highcharts highmaps\n * @apioption series.pie.data\n */\n /**\n * @type {Highcharts.SeriesPieDataLabelsOptionsObject}\n * @product highcharts highmaps\n * @apioption series.pie.data.dataLabels\n */\n /**\n * The sequential index of the data point in the legend.\n *\n * @type {number}\n * @product highcharts highmaps\n * @apioption series.pie.data.legendIndex\n */\n /**\n * Whether to display a slice offset from the center.\n *\n * @sample {highcharts} highcharts/point/sliced/\n * One sliced point\n *\n * @type {boolean}\n * @product highcharts highmaps\n * @apioption series.pie.data.sliced\n */\n /**\n * @extends plotOptions.pie.dataLabels\n * @excluding align, allowOverlap, inside, staggerLines, step\n * @product highcharts highmaps\n * @apioption series.pie.dataLabels\n */\n /**\n * @excluding legendItemClick\n * @product highcharts highmaps\n * @apioption series.pie.events\n */\n ''; // placeholder for transpiled doclets above\n /* *\n *\n * Default Export\n *\n * */\n\n return PieSeriesDefaults;\n });\n _registerModule(_modules, 'Series/Pie/PieSeries.js', [_modules['Series/CenteredUtilities.js'], _modules['Series/Column/ColumnSeries.js'], _modules['Core/Globals.js'], _modules['Core/Legend/LegendSymbol.js'], _modules['Series/Pie/PiePoint.js'], _modules['Series/Pie/PieSeriesDefaults.js'], _modules['Core/Series/Series.js'], _modules['Core/Series/SeriesRegistry.js'], _modules['Core/Renderer/SVG/Symbols.js'], _modules['Core/Utilities.js']], function (CU, ColumnSeries, H, LegendSymbol, PiePoint, PieSeriesDefaults, Series, SeriesRegistry, Symbols, U) {\n /* *\n *\n * (c) 2010-2021 Torstein Honsi\n *\n * License: www.highcharts.com/license\n *\n * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!\n *\n * */\n var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d,\n b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d,\n b) { d.__proto__ = b; }) ||\n function (d,\n b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n })();\n var getStartAndEndRadians = CU.getStartAndEndRadians;\n var noop = H.noop;\n var clamp = U.clamp,\n extend = U.extend,\n fireEvent = U.fireEvent,\n merge = U.merge,\n pick = U.pick,\n relativeLength = U.relativeLength;\n /* *\n *\n * Class\n *\n * */\n /**\n * Pie series type.\n *\n * @private\n * @class\n * @name Highcharts.seriesTypes.pie\n *\n * @augments Highcharts.Series\n */\n var PieSeries = /** @class */ (function (_super) {\n __extends(PieSeries, _super);\n function PieSeries() {\n /* *\n *\n * Static Properties\n *\n * */\n var _this = _super !== null && _super.apply(this,\n arguments) || this;\n /* *\n *\n * Properties\n *\n * */\n _this.center = void 0;\n _this.data = void 0;\n _this.maxLabelDistance = void 0;\n _this.options = void 0;\n _this.points = void 0;\n return _this;\n /* eslint-enable valid-jsdoc */\n }\n /* *\n *\n * Functions\n *\n * */\n /* eslint-disable valid-jsdoc */\n /**\n * Animates the pies in.\n * @private\n */\n PieSeries.prototype.animate = function (init) {\n var series = this,\n points = series.points,\n startAngleRad = series.startAngleRad;\n if (!init) {\n points.forEach(function (point) {\n var graphic = point.graphic,\n args = point.shapeArgs;\n if (graphic && args) {\n // start values\n graphic.attr({\n // animate from inner radius (#779)\n r: pick(point.startR, (series.center && series.center[3] / 2)),\n start: startAngleRad,\n end: startAngleRad\n });\n // animate\n graphic.animate({\n r: args.r,\n start: args.start,\n end: args.end\n }, series.options.animation);\n }\n });\n }\n };\n /**\n * Called internally to draw auxiliary graph in pie-like series in\n * situtation when the default graph is not sufficient enough to present\n * the data well. Auxiliary graph is saved in the same object as\n * regular graph.\n * @private\n */\n PieSeries.prototype.drawEmpty = function () {\n var start = this.startAngleRad,\n end = this.endAngleRad,\n options = this.options;\n var centerX,\n centerY;\n // Draw auxiliary graph if there're no visible points.\n if (this.total === 0 && this.center) {\n centerX = this.center[0];\n centerY = this.center[1];\n if (!this.graph) {\n this.graph = this.chart.renderer\n .arc(centerX, centerY, this.center[1] / 2, 0, start, end)\n .addClass('highcharts-empty-series')\n .add(this.group);\n }\n this.graph.attr({\n d: Symbols.arc(centerX, centerY, this.center[2] / 2, 0, {\n start: start,\n end: end,\n innerR: this.center[3] / 2\n })\n });\n if (!this.chart.styledMode) {\n this.graph.attr({\n 'stroke-width': options.borderWidth,\n fill: options.fillColor || 'none',\n stroke: options.color || \"#cccccc\" /* Palette.neutralColor20 */\n });\n }\n }\n else if (this.graph) { // Destroy the graph object.\n this.graph = this.graph.destroy();\n }\n };\n /**\n * Slices in pie chart are initialized in DOM, but it's shapes and\n * animations are normally run in `drawPoints()`.\n * @private\n */\n PieSeries.prototype.drawPoints = function () {\n var renderer = this.chart.renderer;\n this.points.forEach(function (point) {\n // When updating a series between 2d and 3d or cartesian and\n // polar, the shape type changes.\n if (point.graphic && point.hasNewShapeType()) {\n point.graphic = point.graphic.destroy();\n }\n if (!point.graphic) {\n point.graphic = renderer[point.shapeType](point.shapeArgs)\n .add(point.series.group);\n point.delayedRendering = true;\n }\n });\n };\n /**\n * Extend the generatePoints method by adding total and percentage\n * properties to each point\n * @private\n */\n PieSeries.prototype.generatePoints = function () {\n _super.prototype.generatePoints.call(this);\n this.updateTotals();\n };\n /**\n * Utility for getting the x value from a given y, used for\n * anticollision logic in data labels. Added point for using specific\n * points' label distance.\n * @private\n */\n PieSeries.prototype.getX = function (y, left, point) {\n var center = this.center, \n // Variable pie has individual radius\n radius = this.radii ?\n this.radii[point.index] || 0 :\n center[2] / 2;\n var angle = Math.asin(clamp((y - center[1]) / (radius + point.labelDistance), -1, 1));\n var x = center[0] +\n (left ? -1 : 1) *\n (Math.cos(angle) * (radius + point.labelDistance)) +\n (point.labelDistance > 0 ?\n (left ? -1 : 1) * this.options.dataLabels.padding :\n 0);\n return x;\n };\n /**\n * Define hasData function for non-cartesian series. Returns true if the\n * series has points at all.\n * @private\n */\n PieSeries.prototype.hasData = function () {\n return !!this.processedXData.length; // != 0\n };\n /**\n * Draw the data points\n * @private\n */\n PieSeries.prototype.redrawPoints = function () {\n var series = this,\n chart = series.chart,\n renderer = chart.renderer,\n shadow = series.options.shadow;\n var groupTranslation,\n graphic,\n pointAttr,\n shapeArgs;\n this.drawEmpty();\n if (shadow && !series.shadowGroup && !chart.styledMode) {\n series.shadowGroup = renderer\n .g('shadow')\n .attr({ zIndex: -1 })\n .add(series.group);\n }\n // draw the slices\n series.points.forEach(function (point) {\n var animateTo = {};\n graphic = point.graphic;\n if (!point.isNull && graphic) {\n var shadowGroup = void 0;\n shapeArgs = point.shapeArgs;\n // If the point is sliced, use special translation, else use\n // plot area translation\n groupTranslation = point.getTranslate();\n if (!chart.styledMode) {\n // Put the shadow behind all points\n shadowGroup = point.shadowGroup;\n if (shadow && !shadowGroup) {\n shadowGroup = point.shadowGroup = renderer\n .g('shadow')\n .add(series.shadowGroup);\n }\n if (shadowGroup) {\n shadowGroup.attr(groupTranslation);\n }\n pointAttr = series.pointAttribs(point, (point.selected && 'select'));\n }\n // Draw the slice\n if (!point.delayedRendering) {\n graphic\n .setRadialReference(series.center);\n if (!chart.styledMode) {\n merge(true, animateTo, pointAttr);\n }\n merge(true, animateTo, shapeArgs, groupTranslation);\n graphic.animate(animateTo);\n }\n else {\n graphic\n .setRadialReference(series.center)\n .attr(shapeArgs)\n .attr(groupTranslation);\n if (!chart.styledMode) {\n graphic\n .attr(pointAttr)\n .attr({ 'stroke-linejoin': 'round' })\n .shadow(shadow, shadowGroup);\n }\n point.delayedRendering = false;\n }\n graphic.attr({\n visibility: point.visible ? 'inherit' : 'hidden'\n });\n graphic.addClass(point.getClassName(), true);\n }\n else if (graphic) {\n point.graphic = graphic.destroy();\n }\n });\n };\n /**\n * Utility for sorting data labels.\n * @private\n */\n PieSeries.prototype.sortByAngle = function (points, sign) {\n points.sort(function (a, b) {\n return ((typeof a.angle !== 'undefined') &&\n (b.angle - a.angle) * sign);\n });\n };\n /**\n * Do translation for pie slices\n * @private\n */\n PieSeries.prototype.translate = function (positions) {\n fireEvent(this, 'translate');\n this.generatePoints();\n var series = this,\n precision = 1000, // issue #172\n options = series.options,\n slicedOffset = options.slicedOffset,\n connectorOffset = slicedOffset + (options.borderWidth || 0),\n radians = getStartAndEndRadians(options.startAngle,\n options.endAngle),\n startAngleRad = series.startAngleRad = radians.start,\n endAngleRad = series.endAngleRad = radians.end,\n circ = endAngleRad - startAngleRad, // 2 * Math.PI,\n points = series.points,\n labelDistance = options.dataLabels.distance,\n ignoreHiddenPoint = options.ignoreHiddenPoint,\n len = points.length;\n var finalConnectorOffset,\n start,\n end,\n angle, \n // the x component of the radius vector for a given point\n radiusX,\n radiusY,\n i,\n point,\n cumulative = 0;\n // Get positions - either an integer or a percentage string must be\n // given. If positions are passed as a parameter, we're in a\n // recursive loop for adjusting space for data labels.\n if (!positions) {\n series.center = positions = series.getCenter();\n }\n // Calculate the geometry for each point\n for (i = 0; i < len; i++) {\n point = points[i];\n // set start and end angle\n start = startAngleRad + (cumulative * circ);\n if (point.isValid() &&\n (!ignoreHiddenPoint || point.visible)) {\n cumulative += point.percentage / 100;\n }\n end = startAngleRad + (cumulative * circ);\n // set the shape\n var shapeArgs = {\n x: positions[0],\n y: positions[1],\n r: positions[2] / 2,\n innerR: positions[3] / 2,\n start: Math.round(start * precision) / precision,\n end: Math.round(end * precision) / precision\n };\n point.shapeType = 'arc';\n point.shapeArgs = shapeArgs;\n // Used for distance calculation for specific point.\n point.labelDistance = pick((point.options.dataLabels &&\n point.options.dataLabels.distance), labelDistance);\n // Compute point.labelDistance if it's defined as percentage\n // of slice radius (#8854)\n point.labelDistance = relativeLength(point.labelDistance, shapeArgs.r);\n // Saved for later dataLabels distance calculation.\n series.maxLabelDistance = Math.max(series.maxLabelDistance || 0, point.labelDistance);\n // The angle must stay within -90 and 270 (#2645)\n angle = (end + start) / 2;\n if (angle > 1.5 * Math.PI) {\n angle -= 2 * Math.PI;\n }\n else if (angle < -Math.PI / 2) {\n angle += 2 * Math.PI;\n }\n // Center for the sliced out slice\n point.slicedTranslation = {\n translateX: Math.round(Math.cos(angle) * slicedOffset),\n translateY: Math.round(Math.sin(angle) * slicedOffset)\n };\n // set the anchor point for tooltips\n radiusX = Math.cos(angle) * positions[2] / 2;\n radiusY = Math.sin(angle) * positions[2] / 2;\n point.tooltipPos = [\n positions[0] + radiusX * 0.7,\n positions[1] + radiusY * 0.7\n ];\n point.half = angle < -Math.PI / 2 || angle > Math.PI / 2 ?\n 1 :\n 0;\n point.angle = angle;\n // Set the anchor point for data labels. Use point.labelDistance\n // instead of labelDistance // #1174\n // finalConnectorOffset - not override connectorOffset value.\n finalConnectorOffset = Math.min(connectorOffset, point.labelDistance / 5); // #1678\n point.labelPosition = {\n natural: {\n // initial position of the data label - it's utilized for\n // finding the final position for the label\n x: positions[0] + radiusX + Math.cos(angle) *\n point.labelDistance,\n y: positions[1] + radiusY + Math.sin(angle) *\n point.labelDistance\n },\n 'final': {\n // used for generating connector path -\n // initialized later in drawDataLabels function\n // x: undefined,\n // y: undefined\n },\n // left - pie on the left side of the data label\n // right - pie on the right side of the data label\n // center - data label overlaps the pie\n alignment: point.labelDistance < 0 ?\n 'center' : point.half ? 'right' : 'left',\n connectorPosition: {\n breakAt: {\n x: positions[0] + radiusX + Math.cos(angle) *\n finalConnectorOffset,\n y: positions[1] + radiusY + Math.sin(angle) *\n finalConnectorOffset\n },\n touchingSliceAt: {\n x: positions[0] + radiusX,\n y: positions[1] + radiusY\n }\n }\n };\n }\n fireEvent(series, 'afterTranslate');\n };\n /**\n * Recompute total chart sum and update percentages of points.\n * @private\n */\n PieSeries.prototype.updateTotals = function () {\n var points = this.points,\n len = points.length,\n ignoreHiddenPoint = this.options.ignoreHiddenPoint;\n var i,\n point,\n total = 0;\n // Get the total sum\n for (i = 0; i < len; i++) {\n point = points[i];\n if (point.isValid() &&\n (!ignoreHiddenPoint || point.visible)) {\n total += point.y;\n }\n }\n this.total = total;\n // Set each point's properties\n for (i = 0; i < len; i++) {\n point = points[i];\n point.percentage =\n (total > 0 && (point.visible || !ignoreHiddenPoint)) ?\n point.y / total * 100 :\n 0;\n point.total = total;\n }\n };\n PieSeries.defaultOptions = merge(Series.defaultOptions, PieSeriesDefaults);\n return PieSeries;\n }(Series));\n extend(PieSeries.prototype, {\n axisTypes: [],\n directTouch: true,\n drawGraph: void 0,\n drawLegendSymbol: LegendSymbol.drawRectangle,\n drawTracker: ColumnSeries.prototype.drawTracker,\n getCenter: CU.getCenter,\n getSymbol: noop,\n isCartesian: false,\n noSharedTooltip: true,\n pointAttribs: ColumnSeries.prototype.pointAttribs,\n pointClass: PiePoint,\n requireSorting: false,\n searchPoint: noop,\n trackerGroups: ['group', 'dataLabelsGroup']\n });\n SeriesRegistry.registerSeriesType('pie', PieSeries);\n /* *\n *\n * Default Export\n *\n * */\n\n return PieSeries;\n });\n _registerModule(_modules, 'Series/Pie/PieDataLabel.js', [_modules['Core/Series/DataLabel.js'], _modules['Core/Globals.js'], _modules['Core/Renderer/RendererUtilities.js'], _modules['Core/Series/SeriesRegistry.js'], _modules['Core/Utilities.js']], function (DataLabel, H, R, SeriesRegistry, U) {\n /* *\n *\n * (c) 2010-2021 Torstein Honsi\n *\n * License: www.highcharts.com/license\n *\n * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!\n *\n * */\n var noop = H.noop;\n var distribute = R.distribute;\n var Series = SeriesRegistry.series;\n var arrayMax = U.arrayMax,\n clamp = U.clamp,\n defined = U.defined,\n merge = U.merge,\n pick = U.pick,\n relativeLength = U.relativeLength;\n /* *\n *\n * Composition\n *\n * */\n var ColumnDataLabel;\n (function (ColumnDataLabel) {\n /* *\n *\n * Constants\n *\n * */\n var composedClasses = [];\n var dataLabelPositioners = {\n // Based on the value computed in Highcharts' distribute algorithm.\n radialDistributionY: function (point) {\n return point.top + point.distributeBox.pos;\n },\n // get the x - use the natural x position for labels near the\n // top and bottom, to prevent the top and botton slice\n // connectors from touching each other on either side\n // Based on the value computed in Highcharts' distribute algorithm.\n radialDistributionX: function (series, point, y, naturalY) {\n return series.getX(y < point.top + 2 || y > point.bottom - 2 ?\n naturalY :\n y, point.half, point);\n },\n // dataLabels.distance determines the x position of the label\n justify: function (point, radius, seriesCenter) {\n return seriesCenter[0] + (point.half ? -1 : 1) *\n (radius + point.labelDistance);\n },\n // Left edges of the left-half labels touch the left edge of the plot\n // area. Right edges of the right-half labels touch the right edge of\n // the plot area.\n alignToPlotEdges: function (dataLabel, half, plotWidth, plotLeft) {\n var dataLabelWidth = dataLabel.getBBox().width;\n return half ? dataLabelWidth + plotLeft :\n plotWidth - dataLabelWidth - plotLeft;\n },\n // Connectors of each side end in the same x position. Labels are\n // aligned to them. Left edge of the widest left-half label touches the\n // left edge of the plot area. Right edge of the widest right-half label\n // touches the right edge of the plot area.\n alignToConnectors: function (points, half, plotWidth, plotLeft) {\n var maxDataLabelWidth = 0,\n dataLabelWidth;\n // find widest data label\n points.forEach(function (point) {\n dataLabelWidth = point.dataLabel.getBBox().width;\n if (dataLabelWidth > maxDataLabelWidth) {\n maxDataLabelWidth = dataLabelWidth;\n }\n });\n return half ? maxDataLabelWidth + plotLeft :\n plotWidth - maxDataLabelWidth - plotLeft;\n }\n };\n /* *\n *\n * Functions\n *\n * */\n /* eslint-disable valid-jsdoc */\n /** @private */\n function compose(PieSeriesClass) {\n DataLabel.compose(Series);\n if (composedClasses.indexOf(PieSeriesClass) === -1) {\n composedClasses.push(PieSeriesClass);\n var pieProto = PieSeriesClass.prototype;\n pieProto.dataLabelPositioners = dataLabelPositioners;\n pieProto.alignDataLabel = noop;\n pieProto.drawDataLabels = drawDataLabels;\n pieProto.placeDataLabels = placeDataLabels;\n pieProto.verifyDataLabelOverflow = verifyDataLabelOverflow;\n }\n }\n ColumnDataLabel.compose = compose;\n /**\n * Override the base drawDataLabels method by pie specific functionality\n * @private\n */\n function drawDataLabels() {\n var series = this,\n data = series.data,\n chart = series.chart,\n options = series.options.dataLabels || {},\n connectorPadding = options.connectorPadding,\n plotWidth = chart.plotWidth,\n plotHeight = chart.plotHeight,\n plotLeft = chart.plotLeft,\n maxWidth = Math.round(chart.chartWidth / 3),\n seriesCenter = series.center,\n radius = seriesCenter[2] / 2,\n centerY = seriesCenter[1],\n halves = [\n [],\n [] // left\n ],\n overflow = [0, 0, 0, 0], // top, right, bottom, left\n dataLabelPositioners = series.dataLabelPositioners;\n var point,\n connectorWidth,\n connector,\n dataLabel,\n dataLabelWidth, \n // labelPos,\n labelPosition,\n labelHeight, \n // divide the points into right and left halves for anti collision\n x,\n y,\n visibility,\n j,\n pointDataLabelsOptions;\n // get out if not enabled\n if (!series.visible ||\n (!options.enabled &&\n !series._hasPointLabels)) {\n return;\n }\n // Reset all labels that have been shortened\n data.forEach(function (point) {\n if (point.dataLabel && point.visible && point.dataLabel.shortened) {\n point.dataLabel\n .attr({\n width: 'auto'\n }).css({\n width: 'auto',\n textOverflow: 'clip'\n });\n point.dataLabel.shortened = false;\n }\n });\n // run parent method\n Series.prototype.drawDataLabels.apply(series);\n data.forEach(function (point) {\n if (point.dataLabel) {\n if (point.visible) { // #407, #2510\n // Arrange points for detection collision\n halves[point.half].push(point);\n // Reset positions (#4905)\n point.dataLabel._pos = null;\n // Avoid long labels squeezing the pie size too far down\n if (!defined(options.style.width) &&\n !defined(point.options.dataLabels &&\n point.options.dataLabels.style &&\n point.options.dataLabels.style.width)) {\n if (point.dataLabel.getBBox().width > maxWidth) {\n point.dataLabel.css({\n // Use a fraction of the maxWidth to avoid\n // wrapping close to the end of the string.\n width: Math.round(maxWidth * 0.7) + 'px'\n });\n point.dataLabel.shortened = true;\n }\n }\n }\n else {\n point.dataLabel = point.dataLabel.destroy();\n // Workaround to make pies destroy multiple datalabels\n // correctly. This logic needs rewriting to support multiple\n // datalabels fully.\n if (point.dataLabels && point.dataLabels.length === 1) {\n delete point.dataLabels;\n }\n }\n }\n });\n /* Loop over the points in each half, starting from the top and bottom\n * of the pie to detect overlapping labels.\n */\n halves.forEach(function (points, i) {\n var length = points.length,\n positions = [];\n var top,\n bottom,\n naturalY,\n sideOverflow,\n size,\n distributionLength;\n if (!length) {\n return;\n }\n // Sort by angle\n series.sortByAngle(points, i - 0.5);\n // Only do anti-collision when we have dataLabels outside the pie\n // and have connectors. (#856)\n if (series.maxLabelDistance > 0) {\n top = Math.max(0, centerY - radius - series.maxLabelDistance);\n bottom = Math.min(centerY + radius + series.maxLabelDistance, chart.plotHeight);\n points.forEach(function (point) {\n // check if specific points' label is outside the pie\n if (point.labelDistance > 0 && point.dataLabel) {\n // point.top depends on point.labelDistance value\n // Used for calculation of y value in getX method\n point.top = Math.max(0, centerY - radius - point.labelDistance);\n point.bottom = Math.min(centerY + radius + point.labelDistance, chart.plotHeight);\n size = point.dataLabel.getBBox().height || 21;\n // point.positionsIndex is needed for getting index of\n // parameter related to specific point inside positions\n // array - not every point is in positions array.\n point.distributeBox = {\n target: point.labelPosition.natural.y -\n point.top + size / 2,\n size: size,\n rank: point.y\n };\n positions.push(point.distributeBox);\n }\n });\n distributionLength = bottom + size - top;\n distribute(positions, distributionLength, distributionLength / 5);\n }\n // Now the used slots are sorted, fill them up sequentially\n for (j = 0; j < length; j++) {\n point = points[j];\n // labelPos = point.labelPos;\n labelPosition = point.labelPosition;\n dataLabel = point.dataLabel;\n visibility = point.visible === false ? 'hidden' : 'inherit';\n naturalY = labelPosition.natural.y;\n y = naturalY;\n if (positions && defined(point.distributeBox)) {\n if (typeof point.distributeBox.pos === 'undefined') {\n visibility = 'hidden';\n }\n else {\n labelHeight = point.distributeBox.size;\n // Find label's y position\n y = dataLabelPositioners\n .radialDistributionY(point);\n }\n }\n // It is needed to delete point.positionIndex for\n // dynamically added points etc.\n delete point.positionIndex; // @todo unused\n // Find label's x position\n // justify is undocumented in the API - preserve support for it\n if (options.justify) {\n x = dataLabelPositioners.justify(point, radius, seriesCenter);\n }\n else {\n switch (options.alignTo) {\n case 'connectors':\n x = dataLabelPositioners.alignToConnectors(points, i, plotWidth, plotLeft);\n break;\n case 'plotEdges':\n x = dataLabelPositioners.alignToPlotEdges(dataLabel, i, plotWidth, plotLeft);\n break;\n default:\n x = dataLabelPositioners.radialDistributionX(series, point, y, naturalY);\n }\n }\n // Record the placement and visibility\n dataLabel._attr = {\n visibility: visibility,\n align: labelPosition.alignment\n };\n pointDataLabelsOptions = point.options.dataLabels || {};\n dataLabel._pos = {\n x: (x +\n pick(pointDataLabelsOptions.x, options.x) + // (#12985)\n ({\n left: connectorPadding,\n right: -connectorPadding\n }[labelPosition.alignment] || 0)),\n // 10 is for the baseline (label vs text)\n y: (y +\n pick(pointDataLabelsOptions.y, options.y) - // (#12985)\n 10)\n };\n // labelPos.x = x;\n // labelPos.y = y;\n labelPosition.final.x = x;\n labelPosition.final.y = y;\n // Detect overflowing data labels\n if (pick(options.crop, true)) {\n dataLabelWidth = dataLabel.getBBox().width;\n sideOverflow = null;\n // Overflow left\n if (x - dataLabelWidth < connectorPadding &&\n i === 1 // left half\n ) {\n sideOverflow = Math.round(dataLabelWidth - x + connectorPadding);\n overflow[3] = Math.max(sideOverflow, overflow[3]);\n // Overflow right\n }\n else if (x + dataLabelWidth > plotWidth - connectorPadding &&\n i === 0 // right half\n ) {\n sideOverflow = Math.round(x + dataLabelWidth - plotWidth + connectorPadding);\n overflow[1] = Math.max(sideOverflow, overflow[1]);\n }\n // Overflow top\n if (y - labelHeight / 2 < 0) {\n overflow[0] = Math.max(Math.round(-y + labelHeight / 2), overflow[0]);\n // Overflow left\n }\n else if (y + labelHeight / 2 > plotHeight) {\n overflow[2] = Math.max(Math.round(y + labelHeight / 2 - plotHeight), overflow[2]);\n }\n dataLabel.sideOverflow = sideOverflow;\n }\n } // for each point\n }); // for each half\n // Do not apply the final placement and draw the connectors until we\n // have verified that labels are not spilling over.\n if (arrayMax(overflow) === 0 ||\n this.verifyDataLabelOverflow(overflow)) {\n // Place the labels in the final position\n this.placeDataLabels();\n this.points.forEach(function (point) {\n // #8864: every connector can have individual options\n pointDataLabelsOptions =\n merge(options, point.options.dataLabels);\n connectorWidth =\n pick(pointDataLabelsOptions.connectorWidth, 1);\n // Draw the connector\n if (connectorWidth) {\n var isNew = void 0;\n connector = point.connector;\n dataLabel = point.dataLabel;\n if (dataLabel &&\n dataLabel._pos &&\n point.visible &&\n point.labelDistance > 0) {\n visibility = dataLabel._attr.visibility;\n isNew = !connector;\n if (isNew) {\n point.connector = connector = chart.renderer\n .path()\n .addClass('highcharts-data-label-connector ' +\n ' highcharts-color-' + point.colorIndex +\n (point.className ?\n ' ' + point.className :\n ''))\n .add(series.dataLabelsGroup);\n if (!chart.styledMode) {\n connector.attr({\n 'stroke-width': connectorWidth,\n 'stroke': (pointDataLabelsOptions.connectorColor ||\n point.color ||\n \"#666666\" /* Palette.neutralColor60 */)\n });\n }\n }\n connector[isNew ? 'attr' : 'animate']({\n d: point.getConnectorPath()\n });\n connector.attr('visibility', visibility);\n }\n else if (connector) {\n point.connector = connector.destroy();\n }\n }\n });\n }\n }\n /**\n * Perform the final placement of the data labels after we have verified\n * that they fall within the plot area.\n * @private\n */\n function placeDataLabels() {\n this.points.forEach(function (point) {\n var dataLabel = point.dataLabel,\n _pos;\n if (dataLabel && point.visible) {\n _pos = dataLabel._pos;\n if (_pos) {\n // Shorten data labels with ellipsis if they still overflow\n // after the pie has reached minSize (#223).\n if (dataLabel.sideOverflow) {\n dataLabel._attr.width =\n Math.max(dataLabel.getBBox().width -\n dataLabel.sideOverflow, 0);\n dataLabel.css({\n width: dataLabel._attr.width + 'px',\n textOverflow: ((this.options.dataLabels.style || {})\n .textOverflow ||\n 'ellipsis')\n });\n dataLabel.shortened = true;\n }\n dataLabel.attr(dataLabel._attr);\n dataLabel[dataLabel.moved ? 'animate' : 'attr'](_pos);\n dataLabel.moved = true;\n }\n else if (dataLabel) {\n dataLabel.attr({ y: -9999 });\n }\n }\n // Clear for update\n delete point.distributeBox;\n }, this);\n }\n /**\n * Verify whether the data labels are allowed to draw, or we should run more\n * translation and data label positioning to keep them inside the plot area.\n * Returns true when data labels are ready to draw.\n * @private\n */\n function verifyDataLabelOverflow(overflow) {\n var center = this.center,\n options = this.options,\n centerOption = options.center,\n minSize = options.minSize || 80,\n newSize = minSize, \n // If a size is set, return true and don't try to shrink the pie\n // to fit the labels.\n ret = options.size !== null;\n if (!ret) {\n // Handle horizontal size and center\n if (centerOption[0] !== null) { // Fixed center\n newSize = Math.max(center[2] -\n Math.max(overflow[1], overflow[3]), minSize);\n }\n else { // Auto center\n newSize = Math.max(\n // horizontal overflow\n center[2] - overflow[1] - overflow[3], minSize);\n // horizontal center\n center[0] += (overflow[3] - overflow[1]) / 2;\n }\n // Handle vertical size and center\n if (centerOption[1] !== null) { // Fixed center\n newSize = clamp(newSize, minSize, center[2] - Math.max(overflow[0], overflow[2]));\n }\n else { // Auto center\n newSize = clamp(newSize, minSize, \n // vertical overflow\n center[2] - overflow[0] - overflow[2]);\n // vertical center\n center[1] += (overflow[0] - overflow[2]) / 2;\n }\n // If the size must be decreased, we need to run translate and\n // drawDataLabels again\n if (newSize < center[2]) {\n center[2] = newSize;\n center[3] = Math.min(// #3632\n options.thickness ?\n Math.max(0, newSize - options.thickness * 2) :\n Math.max(0, relativeLength(options.innerSize || 0, newSize)), newSize); // #6647\n this.translate(center);\n if (this.drawDataLabels) {\n this.drawDataLabels();\n }\n // Else, return true to indicate that the pie and its labels is\n // within the plot area\n }\n else {\n ret = true;\n }\n }\n return ret;\n }\n })(ColumnDataLabel || (ColumnDataLabel = {}));\n /* *\n *\n * Default Export\n *\n * */\n\n return ColumnDataLabel;\n });\n _registerModule(_modules, 'Extensions/OverlappingDataLabels.js', [_modules['Core/Chart/Chart.js'], _modules['Core/Utilities.js']], function (Chart, U) {\n /* *\n *\n * Highcharts module to hide overlapping data labels.\n * This module is included in Highcharts.\n *\n * (c) 2009-2021 Torstein Honsi\n *\n * License: www.highcharts.com/license\n *\n * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!\n *\n * */\n var addEvent = U.addEvent,\n fireEvent = U.fireEvent,\n isArray = U.isArray,\n isNumber = U.isNumber,\n objectEach = U.objectEach,\n pick = U.pick;\n /**\n * Internal type\n * @private\n */\n /* eslint-disable no-invalid-this */\n // Collect potensial overlapping data labels. Stack labels probably don't need\n // to be considered because they are usually accompanied by data labels that lie\n // inside the columns.\n addEvent(Chart, 'render', function collectAndHide() {\n var chart = this,\n labels = [];\n // Consider external label collectors\n (this.labelCollectors || []).forEach(function (collector) {\n labels = labels.concat(collector());\n });\n (this.yAxis || []).forEach(function (yAxis) {\n if (yAxis.stacking &&\n yAxis.options.stackLabels &&\n !yAxis.options.stackLabels.allowOverlap) {\n objectEach(yAxis.stacking.stacks, function (stack) {\n objectEach(stack, function (stackItem) {\n if (stackItem.label) {\n labels.push(stackItem.label);\n }\n });\n });\n }\n });\n (this.series || []).forEach(function (series) {\n var dlOptions = series.options.dataLabels;\n if (series.visible &&\n !(dlOptions.enabled === false && !series._hasPointLabels)) { // #3866\n var push = function (points) {\n return points.forEach(function (point) {\n if (point.visible) {\n var dataLabels = (isArray(point.dataLabels) ?\n point.dataLabels :\n (point.dataLabel ? [point.dataLabel] : []));\n dataLabels.forEach(function (label) {\n var options = label.options;\n label.labelrank = pick(options.labelrank, point.labelrank, point.shapeArgs && point.shapeArgs.height); // #4118\n if (!options.allowOverlap) {\n labels.push(label);\n }\n else { // #13449\n label.oldOpacity = label.opacity;\n label.newOpacity = 1;\n hideOrShow(label, chart);\n }\n });\n }\n });\n };\n push(series.nodes || []);\n push(series.points);\n }\n });\n this.hideOverlappingLabels(labels);\n });\n /**\n * Hide overlapping labels. Labels are moved and faded in and out on zoom to\n * provide a smooth visual imression.\n *\n * @private\n * @function Highcharts.Chart#hideOverlappingLabels\n * @param {Array} labels\n * Rendered data labels\n * @requires modules/overlapping-datalabels\n */\n Chart.prototype.hideOverlappingLabels = function (labels) {\n var chart = this,\n len = labels.length,\n ren = chart.renderer,\n label,\n i,\n j,\n label1,\n label2,\n box1,\n box2,\n isLabelAffected = false,\n isIntersectRect = function (box1,\n box2) {\n return !(box2.x >= box1.x + box1.width ||\n box2.x + box2.width <= box1.x ||\n box2.y >= box1.y + box1.height ||\n box2.y + box2.height <= box1.y);\n }, \n // Get the box with its position inside the chart, as opposed to getBBox\n // that only reports the position relative to the parent.\n getAbsoluteBox = function (label) {\n var pos,\n parent,\n bBox, \n // Substract the padding if no background or border (#4333)\n padding = label.box ? 0 : (label.padding || 0),\n lineHeightCorrection = 0,\n xOffset = 0,\n boxWidth,\n alignValue;\n if (label &&\n (!label.alignAttr || label.placed)) {\n pos = label.alignAttr || {\n x: label.attr('x'),\n y: label.attr('y')\n };\n parent = label.parentGroup;\n // Get width and height if pure text nodes (stack labels)\n if (!label.width) {\n bBox = label.getBBox();\n label.width = bBox.width;\n label.height = bBox.height;\n // Labels positions are computed from top left corner, so\n // we need to substract the text height from text nodes too.\n lineHeightCorrection = ren\n .fontMetrics(null, label.element).h;\n }\n boxWidth = label.width - 2 * padding;\n alignValue = {\n left: '0',\n center: '0.5',\n right: '1'\n }[label.alignValue];\n if (alignValue) {\n xOffset = +alignValue * boxWidth;\n }\n else if (isNumber(label.x) &&\n Math.round(label.x) !== label.translateX) {\n xOffset = label.x - label.translateX;\n }\n return {\n x: pos.x + (parent.translateX || 0) + padding -\n (xOffset || 0),\n y: pos.y + (parent.translateY || 0) + padding -\n lineHeightCorrection,\n width: label.width - 2 * padding,\n height: label.height - 2 * padding\n };\n }\n };\n for (i = 0; i < len; i++) {\n label = labels[i];\n if (label) {\n // Mark with initial opacity\n label.oldOpacity = label.opacity;\n label.newOpacity = 1;\n label.absoluteBox = getAbsoluteBox(label);\n }\n }\n // Prevent a situation in a gradually rising slope, that each label will\n // hide the previous one because the previous one always has lower rank.\n labels.sort(function (a, b) {\n return (b.labelrank || 0) - (a.labelrank || 0);\n });\n // Detect overlapping labels\n for (i = 0; i < len; i++) {\n label1 = labels[i];\n box1 = label1 && label1.absoluteBox;\n for (j = i + 1; j < len; ++j) {\n label2 = labels[j];\n box2 = label2 && label2.absoluteBox;\n if (box1 &&\n box2 &&\n label1 !== label2 && // #6465, polar chart with connectEnds\n label1.newOpacity !== 0 &&\n label2.newOpacity !== 0 &&\n // #15863 dataLabels are no longer hidden by translation\n label1.visibility !== 'hidden' &&\n label2.visibility !== 'hidden') {\n if (isIntersectRect(box1, box2)) {\n (label1.labelrank < label2.labelrank ? label1 : label2)\n .newOpacity = 0;\n }\n }\n }\n }\n // Hide or show\n labels.forEach(function (label) {\n if (hideOrShow(label, chart)) {\n isLabelAffected = true;\n }\n });\n if (isLabelAffected) {\n fireEvent(chart, 'afterHideAllOverlappingLabels');\n }\n };\n /**\n * Hide or show labels based on opacity.\n *\n * @private\n * @function hideOrShow\n * @param {Highcharts.SVGElement} label\n * The label.\n * @param {Highcharts.Chart} chart\n * The chart that contains the label.\n * @return {boolean}\n * Whether label is affected\n */\n function hideOrShow(label, chart) {\n var complete,\n newOpacity,\n isLabelAffected = false;\n if (label) {\n newOpacity = label.newOpacity;\n if (label.oldOpacity !== newOpacity) {\n // Make sure the label is completely hidden to avoid catching clicks\n // (#4362)\n if (label.alignAttr && label.placed) { // data labels\n label[newOpacity ? 'removeClass' : 'addClass']('highcharts-data-label-hidden');\n complete = function () {\n if (!chart.styledMode) {\n label.css({\n pointerEvents: newOpacity ? 'auto' : 'none'\n });\n }\n };\n isLabelAffected = true;\n // Animate or set the opacity\n label.alignAttr.opacity = newOpacity;\n label[label.isOld ? 'animate' : 'attr'](label.alignAttr, null, complete);\n fireEvent(chart, 'afterHideOverlappingLabel');\n }\n else { // other labels, tick labels\n label.attr({\n opacity: newOpacity\n });\n }\n }\n label.isOld = true;\n }\n return isLabelAffected;\n }\n\n });\n _registerModule(_modules, 'Core/Responsive.js', [_modules['Core/Utilities.js']], function (U) {\n /* *\n *\n * (c) 2010-2021 Torstein Honsi\n *\n * License: www.highcharts.com/license\n *\n * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!\n *\n * */\n var extend = U.extend,\n find = U.find,\n isArray = U.isArray,\n isObject = U.isObject,\n merge = U.merge,\n objectEach = U.objectEach,\n pick = U.pick,\n splat = U.splat,\n uniqueKey = U.uniqueKey;\n /* *\n *\n * Composition\n *\n * */\n var Responsive;\n (function (Responsive) {\n /* *\n *\n * Declarations\n *\n * */\n /* *\n *\n * Constants\n *\n * */\n var composedClasses = [];\n /* *\n *\n * Functions\n *\n * */\n /* eslint-disable valid-jsdoc */\n /**\n * @private\n */\n function compose(ChartClass) {\n if (composedClasses.indexOf(ChartClass) === -1) {\n composedClasses.push(ChartClass);\n extend(ChartClass.prototype, Additions.prototype);\n }\n return ChartClass;\n }\n Responsive.compose = compose;\n /* *\n *\n * Class\n *\n * */\n var Additions = /** @class */ (function () {\n function Additions() {\n }\n /* *\n *\n * Functions\n *\n * */\n /**\n * Get the current values for a given set of options. Used before we\n * update the chart with a new responsiveness rule.\n *\n * @todo Restore axis options (by id?). The matching of items in\n * collections bears resemblance to the oneToOne matching in\n * Chart.update. Probably we can refactor out that matching and reuse it\n * in both functions.\n *\n * @private\n * @function Highcharts.Chart#currentOptions\n */\n Additions.prototype.currentOptions = function (options) {\n var chart = this, ret = {};\n /**\n * Recurse over a set of options and its current values,\n * and store the current values in the ret object.\n */\n function getCurrent(options, curr, ret, depth) {\n var i;\n objectEach(options, function (val, key) {\n if (!depth &&\n chart.collectionsWithUpdate.indexOf(key) > -1 &&\n curr[key]) {\n val = splat(val);\n ret[key] = [];\n // Iterate over collections like series, xAxis or yAxis\n // and map the items by index.\n for (i = 0; i < Math.max(val.length, curr[key].length); i++) {\n // Item exists in current data (#6347)\n if (curr[key][i]) {\n // If the item is missing from the new data, we\n // need to save the whole config structure. Like\n // when responsively updating from a dual axis\n // layout to a single axis and back (#13544).\n if (val[i] === void 0) {\n ret[key][i] = curr[key][i];\n // Otherwise, proceed\n }\n else {\n ret[key][i] = {};\n getCurrent(val[i], curr[key][i], ret[key][i], depth + 1);\n }\n }\n }\n }\n else if (isObject(val)) {\n ret[key] = isArray(val) ? [] : {};\n getCurrent(val, curr[key] || {}, ret[key], depth + 1);\n }\n else if (typeof curr[key] === 'undefined') { // #10286\n ret[key] = null;\n }\n else {\n ret[key] = curr[key];\n }\n });\n }\n getCurrent(options, this.options, ret, 0);\n return ret;\n };\n /**\n * Handle a single responsiveness rule.\n *\n * @private\n * @function Highcharts.Chart#matchResponsiveRule\n * @param {Highcharts.ResponsiveRulesOptions} rule\n * @param {Array} matches\n */\n Additions.prototype.matchResponsiveRule = function (rule, matches) {\n var condition = rule.condition,\n fn = condition.callback || function () {\n return (this.chartWidth <= pick(condition.maxWidth,\n Number.MAX_VALUE) &&\n this.chartHeight <= pick(condition.maxHeight,\n Number.MAX_VALUE) &&\n this.chartWidth >= pick(condition.minWidth, 0) &&\n this.chartHeight >= pick(condition.minHeight, 0));\n };\n if (fn.call(this)) {\n matches.push(rule._id);\n }\n };\n /**\n * Update the chart based on the current chart/document size and options\n * for responsiveness.\n *\n * @private\n * @function Highcharts.Chart#setResponsive\n * @param {boolean} [redraw=true]\n * @param {boolean} [reset=false]\n * Reset by un-applying all rules. Chart.update resets all rules before\n * applying updated options.\n */\n Additions.prototype.setResponsive = function (redraw, reset) {\n var _this = this;\n var options = this.options.responsive,\n currentResponsive = this.currentResponsive;\n var ruleIds = [],\n undoOptions;\n if (!reset && options && options.rules) {\n options.rules.forEach(function (rule) {\n if (typeof rule._id === 'undefined') {\n rule._id = uniqueKey();\n }\n _this.matchResponsiveRule(rule, ruleIds /* , redraw */);\n }, this);\n }\n // Merge matching rules\n var mergedOptions = merge.apply(void 0,\n ruleIds\n .map(function (ruleId) { return find((options || {}).rules || [],\n function (rule) { return (rule._id === ruleId); }); })\n .map(function (rule) { return (rule && rule.chartOptions); }));\n mergedOptions.isResponsiveOptions = true;\n // Stringified key for the rules that currently apply.\n ruleIds = (ruleIds.toString() || void 0);\n var currentRuleIds = (currentResponsive && currentResponsive.ruleIds);\n // Changes in what rules apply\n if (ruleIds !== currentRuleIds) {\n // Undo previous rules. Before we apply a new set of rules, we\n // need to roll back completely to base options (#6291).\n if (currentResponsive) {\n this.update(currentResponsive.undoOptions, redraw, true);\n }\n if (ruleIds) {\n // Get undo-options for matching rules\n undoOptions = this.currentOptions(mergedOptions);\n undoOptions.isResponsiveOptions = true;\n this.currentResponsive = {\n ruleIds: ruleIds,\n mergedOptions: mergedOptions,\n undoOptions: undoOptions\n };\n this.update(mergedOptions, redraw, true);\n }\n else {\n this.currentResponsive = void 0;\n }\n }\n };\n return Additions;\n }());\n })(Responsive || (Responsive = {}));\n /* *\n *\n * Default Export\n *\n * */\n /* *\n *\n * API Declarations\n *\n * */\n /**\n * A callback function to gain complete control on when the responsive rule\n * applies.\n *\n * @callback Highcharts.ResponsiveCallbackFunction\n *\n * @param {Highcharts.Chart} this\n * Chart context.\n *\n * @return {boolean}\n * Return `true` if it applies.\n */\n (''); // keeps doclets above in JS file\n /* *\n *\n * API Options\n *\n * */\n /**\n * Allows setting a set of rules to apply for different screen or chart\n * sizes. Each rule specifies additional chart options.\n *\n * @sample {highstock} stock/demo/responsive/\n * Stock chart\n * @sample highcharts/responsive/axis/\n * Axis\n * @sample highcharts/responsive/legend/\n * Legend\n * @sample highcharts/responsive/classname/\n * Class name\n *\n * @since 5.0.0\n * @apioption responsive\n */\n /**\n * A set of rules for responsive settings. The rules are executed from\n * the top down.\n *\n * @sample {highcharts} highcharts/responsive/axis/\n * Axis changes\n * @sample {highstock} highcharts/responsive/axis/\n * Axis changes\n * @sample {highmaps} highcharts/responsive/axis/\n * Axis changes\n *\n * @type {Array<*>}\n * @since 5.0.0\n * @apioption responsive.rules\n */\n /**\n * A full set of chart options to apply as overrides to the general\n * chart options. The chart options are applied when the given rule\n * is active.\n *\n * A special case is configuration objects that take arrays, for example\n * [xAxis](#xAxis), [yAxis](#yAxis) or [series](#series). For these\n * collections, an `id` option is used to map the new option set to\n * an existing object. If an existing object of the same id is not found,\n * the item of the same indexupdated. So for example, setting `chartOptions`\n * with two series items without an `id`, will cause the existing chart's\n * two series to be updated with respective options.\n *\n * @sample {highstock} stock/demo/responsive/\n * Stock chart\n * @sample highcharts/responsive/axis/\n * Axis\n * @sample highcharts/responsive/legend/\n * Legend\n * @sample highcharts/responsive/classname/\n * Class name\n *\n * @type {Highcharts.Options}\n * @since 5.0.0\n * @apioption responsive.rules.chartOptions\n */\n /**\n * Under which conditions the rule applies.\n *\n * @since 5.0.0\n * @apioption responsive.rules.condition\n */\n /**\n * A callback function to gain complete control on when the responsive\n * rule applies. Return `true` if it applies. This opens for checking\n * against other metrics than the chart size, for example the document\n * size or other elements.\n *\n * @type {Highcharts.ResponsiveCallbackFunction}\n * @since 5.0.0\n * @context Highcharts.Chart\n * @apioption responsive.rules.condition.callback\n */\n /**\n * The responsive rule applies if the chart height is less than this.\n *\n * @type {number}\n * @since 5.0.0\n * @apioption responsive.rules.condition.maxHeight\n */\n /**\n * The responsive rule applies if the chart width is less than this.\n *\n * @sample highcharts/responsive/axis/\n * Max width is 500\n *\n * @type {number}\n * @since 5.0.0\n * @apioption responsive.rules.condition.maxWidth\n */\n /**\n * The responsive rule applies if the chart height is greater than this.\n *\n * @type {number}\n * @default 0\n * @since 5.0.0\n * @apioption responsive.rules.condition.minHeight\n */\n /**\n * The responsive rule applies if the chart width is greater than this.\n *\n * @type {number}\n * @default 0\n * @since 5.0.0\n * @apioption responsive.rules.condition.minWidth\n */\n (''); // keeps doclets above in JS file\n\n return Responsive;\n });\n _registerModule(_modules, 'masters/highcharts.src.js', [_modules['Core/Globals.js'], _modules['Core/Utilities.js'], _modules['Core/Defaults.js'], _modules['Core/Animation/Fx.js'], _modules['Core/Animation/AnimationUtilities.js'], _modules['Core/Renderer/HTML/AST.js'], _modules['Core/FormatUtilities.js'], _modules['Core/Renderer/RendererUtilities.js'], _modules['Core/Renderer/SVG/SVGElement.js'], _modules['Core/Renderer/SVG/SVGRenderer.js'], _modules['Core/Renderer/HTML/HTMLElement.js'], _modules['Core/Renderer/HTML/HTMLRenderer.js'], _modules['Core/Axis/Axis.js'], _modules['Core/Axis/DateTimeAxis.js'], _modules['Core/Axis/LogarithmicAxis.js'], _modules['Core/Axis/PlotLineOrBand/PlotLineOrBand.js'], _modules['Core/Axis/Tick.js'], _modules['Core/Tooltip.js'], _modules['Core/Series/Point.js'], _modules['Core/Pointer.js'], _modules['Core/MSPointer.js'], _modules['Core/Legend/Legend.js'], _modules['Core/Chart/Chart.js'], _modules['Core/Axis/Stacking/StackingAxis.js'], _modules['Core/Axis/Stacking/StackItem.js'], _modules['Core/Series/Series.js'], _modules['Core/Series/SeriesRegistry.js'], _modules['Series/Column/ColumnSeries.js'], _modules['Series/Column/ColumnDataLabel.js'], _modules['Series/Pie/PieSeries.js'], _modules['Series/Pie/PieDataLabel.js'], _modules['Core/Series/DataLabel.js'], _modules['Core/Responsive.js'], _modules['Core/Color/Color.js'], _modules['Core/Time.js']], function (Highcharts, Utilities, Defaults, Fx, Animation, AST, FormatUtilities, RendererUtilities, SVGElement, SVGRenderer, HTMLElement, HTMLRenderer, Axis, DateTimeAxis, LogarithmicAxis, PlotLineOrBand, Tick, Tooltip, Point, Pointer, MSPointer, Legend, Chart, StackingAxis, StackItem, Series, SeriesRegistry, ColumnSeries, ColumnDataLabel, PieSeries, PieDataLabel, DataLabel, Responsive, Color, Time) {\n\n var G = Highcharts;\n // Animation\n G.animate = Animation.animate;\n G.animObject = Animation.animObject;\n G.getDeferredAnimation = Animation.getDeferredAnimation;\n G.setAnimation = Animation.setAnimation;\n G.stop = Animation.stop;\n G.timers = Fx.timers;\n // Classes\n G.AST = AST;\n G.Axis = Axis;\n G.Chart = Chart;\n G.chart = Chart.chart;\n G.Fx = Fx;\n G.Legend = Legend;\n G.PlotLineOrBand = PlotLineOrBand;\n G.Point = Point;\n G.Pointer = (MSPointer.isRequired() ? MSPointer : Pointer);\n G.Series = Series;\n G.StackItem = StackItem;\n G.SVGElement = SVGElement;\n G.SVGRenderer = SVGRenderer;\n G.Tick = Tick;\n G.Time = Time;\n G.Tooltip = Tooltip;\n // Color\n G.Color = Color;\n G.color = Color.parse;\n // Compositions\n HTMLRenderer.compose(SVGRenderer);\n HTMLElement.compose(SVGElement);\n // DefaultOptions\n G.defaultOptions = Defaults.defaultOptions;\n G.getOptions = Defaults.getOptions;\n G.time = Defaults.defaultTime;\n G.setOptions = Defaults.setOptions;\n // Format Utilities\n G.dateFormat = FormatUtilities.dateFormat;\n G.format = FormatUtilities.format;\n G.numberFormat = FormatUtilities.numberFormat;\n // Utilities\n G.addEvent = Utilities.addEvent;\n G.arrayMax = Utilities.arrayMax;\n G.arrayMin = Utilities.arrayMin;\n G.attr = Utilities.attr;\n G.clearTimeout = Utilities.clearTimeout;\n G.correctFloat = Utilities.correctFloat;\n G.createElement = Utilities.createElement;\n G.css = Utilities.css;\n G.defined = Utilities.defined;\n G.destroyObjectProperties = Utilities.destroyObjectProperties;\n G.discardElement = Utilities.discardElement;\n G.distribute = RendererUtilities.distribute;\n G.erase = Utilities.erase;\n G.error = Utilities.error;\n G.extend = Utilities.extend;\n G.extendClass = Utilities.extendClass;\n G.find = Utilities.find;\n G.fireEvent = Utilities.fireEvent;\n G.getMagnitude = Utilities.getMagnitude;\n G.getStyle = Utilities.getStyle;\n G.inArray = Utilities.inArray;\n G.isArray = Utilities.isArray;\n G.isClass = Utilities.isClass;\n G.isDOMElement = Utilities.isDOMElement;\n G.isFunction = Utilities.isFunction;\n G.isNumber = Utilities.isNumber;\n G.isObject = Utilities.isObject;\n G.isString = Utilities.isString;\n G.keys = Utilities.keys;\n G.merge = Utilities.merge;\n G.normalizeTickInterval = Utilities.normalizeTickInterval;\n G.objectEach = Utilities.objectEach;\n G.offset = Utilities.offset;\n G.pad = Utilities.pad;\n G.pick = Utilities.pick;\n G.pInt = Utilities.pInt;\n G.relativeLength = Utilities.relativeLength;\n G.removeEvent = Utilities.removeEvent;\n G.seriesType = SeriesRegistry.seriesType;\n G.splat = Utilities.splat;\n G.stableSort = Utilities.stableSort;\n G.syncTimeout = Utilities.syncTimeout;\n G.timeUnits = Utilities.timeUnits;\n G.uniqueKey = Utilities.uniqueKey;\n G.useSerialIds = Utilities.useSerialIds;\n G.wrap = Utilities.wrap;\n // Compositions\n ColumnDataLabel.compose(ColumnSeries);\n DataLabel.compose(Series);\n DateTimeAxis.compose(Axis);\n LogarithmicAxis.compose(Axis);\n PieDataLabel.compose(PieSeries);\n PlotLineOrBand.compose(Axis);\n Responsive.compose(Chart);\n StackingAxis.compose(Axis, Chart, Series);\n // Default Export\n\n return G;\n });\n _modules['masters/highcharts.src.js']._modules = _modules;\n return _modules['masters/highcharts.src.js'];\n}));","//import React from 'react';\n//import { HighchartsReact } from 'highcharts-react-official';\n//import { Chart, HighchartsChart, HighchartsProvider, Legend, LineSeries, Subtitle, Title, XAxis, YAxis } from 'react-jsx-highcharts';\n\nimport ChartModuleMore from 'highcharts/highcharts-more.js';\nimport HCData from 'highcharts/modules/data.js';\nimport HCSoldGauge from 'highcharts/modules/solid-gauge';\nimport * as Highcharts from 'highcharts';\nimport { Chart, SeriesGaugeOptions } from 'highcharts';\n\nif (typeof Highcharts === 'object') {\n ChartModuleMore(Highcharts);\n HCData(Highcharts);\n HCSoldGauge(Highcharts);\n}\n\n\nasync function getData(serviceUrl) {\n const response2 = await fetch(serviceUrl);\n const gridCondition = await response2.json();\n return gridCondition;\n}\n\nexport function GridConditionsWidget(blockID: string, serviceUrl: string) {\n getData(serviceUrl).then(response => {\n drawChart(blockID, serviceUrl, response.condition,response.alertString);\n }).catch(error => {\n drawChart(blockID, serviceUrl, \"error\");\n })\n\n}\n\n\nfunction drawChart(blockID, serviceUrl, response, alertString = \"\") {\n let seriesGaugeOptions: SeriesGaugeOptions = {\n type: \"gauge\",\n enableMouseTracking: false,\n dial: {\n radius: '80%',\n backgroundColor: '#636569',\n baseWidth: 38,\n borderWidth: 3,\n borderColor: '#FFF',\n baseLength: '0%',\n rearLength: '0%',\n topWidth: 0,\n },\n showInLegend: false,\n data: [\n chartLookup[response]\n ],\n pivot: {\n radius: 17, borderWidth: 3, borderColor: \"FFF\", backgroundColor: \"#636569\"\n }\n };\n\n let seriesGaugeOptionsMobile: SeriesGaugeOptions = {\n type: \"gauge\",\n showInLegend: false,\n enableMouseTracking: false,\n dial: {\n radius: '80%',\n backgroundColor: '#636569',\n baseWidth: 28,\n borderWidth: 3,\n borderColor: '#FFF',\n baseLength: '0%',\n rearLength: '0%',\n topWidth: 0,\n },\n pivot: {\n radius: 12, borderWidth: 3, borderColor: \"FFF\", backgroundColor: \"#636569\"\n },\n };\n let seriesOptionsLabelYellow: SeriesGaugeOptions = {\n type: \"gauge\", name: \"Advisories/Warnings\", color: \"#FFC844\", events: { legendItemClick: function () { return false; } }, showInLegend: true, pivot: { radius: 4, borderWidth: 3, borderColor: \"FFF\", backgroundColor: \"#FFF\" }\n };\n let seriesOptionsLabelOrange: SeriesGaugeOptions = { type: \"gauge\", name: \"Some risk that demand could exceed supply\", color: \"#ee7623\", events: { legendItemClick: function () { return false; } }, showInLegend: true , pivot: { radius: 4, borderWidth: 3, borderColor: \"FFF\", backgroundColor: \"#FFF\" } };\n let seriesOptionsLabelRed: SeriesGaugeOptions = { type: \"gauge\", name: \"Emergency power and/or reduced demand necessary\", color: \"#E74F3D\", events: { legendItemClick: function () { return false; } }, showInLegend: true, pivot: { radius: 4, borderWidth: 3, borderColor: \"FFF\", backgroundColor: \"#FFF\" } };\n let seriesOptionsLabelDarkRed: SeriesGaugeOptions = { type: \"gauge\", name: \"Power interruptions imminent or happening\", color: \"#B2292E\", events: { legendItemClick: function () { return false; } }, showInLegend: true, pivot: { radius: 1, borderWidth: 4, borderColor: \"FFF\", backgroundColor: \"#FFF\" } };\n let gridChart = Highcharts.chart(blockID, {\n\n title: {\n text: chartLookup[response].text,\n style: {\n color: chartLookup[response].color,\n\n },\n //color:\"\",\n align: 'center',\n verticalAlign: 'bottom',\n useHTML: true,\n y: -30,\n //floating: true,\n //margin:10\n //x:-50\n },\n \n subtitle: {\n text: chartLookup[response].subtext + \"\" + alertString +\"
\",\n useHTML: true,\n verticalAlign: 'middle',\n style: {\n color: \"#000\",\n textTransform: \"uppercase\",\n textAlign: \"center\",\n fontWeight:\"bold\"\n },\n y: 150,\n },\n yAxis: {\n min: 0, max: 100,\n plotBands: [{\n from: 0,\n to: 20,\n outerRadius: \"99%\",\n color: '#7fbc42',\n thickness: 60,\n className: \"gauge1 insetShadowSVG\",\n }, {\n from: 20,\n to: 40,\n outerRadius: \"99%\",\n color: '#FFC844',\n thickness: 60,\n className: \"gauge2 insetShadowSVG\"\n }, {\n from: 40,\n to: 60,\n outerRadius: \"99%\",\n color: '#ee7623',\n thickness: 60,\n className: \"gauge3 insetShadowSVG\"\n }, {\n from: 60,\n to: 80,\n outerRadius: \"99%\",\n color: '#E74F3D',\n thickness: 60,\n className: \"gauge4 insetShadowSVG\"\n }, {\n from: 80,\n to: 100,\n outerRadius: \"99%\",\n color: '#B2292E',\n thickness: 60,\n className: \"gauge5 insetShadowSVG\"\n }],\n tickLength: 64,\n tickWidth: 3,\n tickPositions: [0, 20, 40, 60, 80, 100],\n tickColor: \"#fff\",\n minorTickInterval: null,\n labels: { enabled: false },\n lineColor: \"transparent\",\n lineWidth: 0,\n },\n xAxis: {\n accessibility: { rangeDescription: '' }\n },\n legend: {\n enabled: alertString == \"\" && response == \"green\" ? true : false,\n //enabled: true,\n floating:true,\n layout: 'horizontal',\n verticalAlign: 'bottom',\n itemHoverStyle: {\n cursor: \"default\"\n },\n itemStyle: {\n display: \"flex\",\n textAlign: \"left\",\n fontSize: \"14px\",\n fontWeight:\"normal\"\n\n },\n useHTML: true,\n className: 'w-100 d-flex justify-content-between',\n squareSymbol:true,\n symbolHeight: 12,\n symbolWidth: 12,\n symbolRadius: 6,\n symbolPadding: 0,\n y: 35,\n\n },\n plotOptions: {\n series: {\n label: { enabled: false },\n point: {\n events: {\n legendItemClick: function () {\n return false;\n }\n }\n },\n\n },\n\n },\n pane: {\n startAngle: -90,\n endAngle: 89.9,\n background: null,\n center: ['50%', '75%'],\n size: '125%'\n },\n chart: {\n backgroundColor: 'transparent',\n height: \"75%\",\n marginBottom: 60,\n spacingTop: 0,\n spacingLeft: 0,\n spacingRight: 0,\n spacingBottom:30,\n \n reflow: true,\n style: {\n fontFamily: 'Lato, Arial, Helvetica, sans-serif',\n whiteSpace: \"wrap\"\n },\n events: {\n load: function () {\n setTimeout(this.reflow.bind(this), 30);\n setInterval(function () {\n $.getJSON(serviceUrl,\n function (data) {\n response = data.condition;\n alertString = data.alertString;\n gridChart.series[0].setData([chartLookup[response]],false);\n gridChart.title.update({\n text: chartLookup[response].text,\n style: {\n color: chartLookup[response].color,\n\n },\n }, false);\n gridChart.subtitle.update({\n text: chartLookup[response].subtext + \"\" + alertString + \"
\",\n }, false);\n gridChart.legend.update({\n enabled: alertString == \"\" && response == \"green\" ? true : false\n }, false);\n gridChart.redraw();\n\n }\n )\n }, 300000);\n },\n render: function () {\n if (response == \"green\" && alertString.length == 0) {\n $('#' + blockID.id + \"additionalLink\").html(\"Needle moves when alerts/warnings/events are active\").css(\"display\", \"block\").css(\"text-align\", \"center\");\n } else {\n $('#' + blockID.id + \"additionalLink\").css(\"display\", \"block\");\n }\n }\n }\n },\n //series: [seriesGaugeOptions],\n series: [seriesGaugeOptions, seriesOptionsLabelYellow, seriesOptionsLabelOrange, seriesOptionsLabelRed, seriesOptionsLabelDarkRed],\n responsive: {\n rules: [{\n condition: {\n maxWidth: 380\n },\n\n chartOptions: {\n series: [seriesGaugeOptionsMobile, seriesOptionsLabelYellow, seriesOptionsLabelOrange, seriesOptionsLabelRed, seriesOptionsLabelDarkRed],\n chart: { height: 330, spacingBottom: 30, marginBottom:10 },\n pane: {\n startAngle: -90,\n endAngle: 89.9,\n background: null,\n center: ['50%', '60%'],\n size: '100%'\n }, title: { y: -20 }, subtitle: { y: 60 }, legend: {y:35},\n yAxis: {\n min: 0, max: 100,\n plotBands: [{\n from: 0,\n to: 20,\n borderWidth: 0,\n borderColor: '#FFF',\n outerRadius: \"99%\",\n color: '#7fbc42',\n thickness: 40,\n className: \"gauge1 insetShadowSVG\"\n }, {\n from: 20,\n to: 40,\n borderWidth: 0,\n borderColor: '#FFF',\n outerRadius: \"99%\",\n color: '#FFC844',\n thickness: 40,\n className: \"gauge2 insetShadowSVG\"\n }, {\n from: 40,\n to: 60,\n borderWidth: 0,\n borderColor: '#FFF',\n outerRadius: \"99%\",\n color: '#ee7623',\n thickness: 40,\n className: \"gauge3 insetShadowSVG\"\n }, {\n from: 60,\n to: 80,\n borderWidth: 0,\n borderColor: '#FFF',\n outerRadius: \"99%\",\n color: '#E74F3D',\n thickness: 40,\n className: \"gauge4 insetShadowSVG\"\n }, {\n from: 80,\n to: 100,\n borderWidth: 0,\n borderColor: '#FFF',\n outerRadius: \"99%\",\n color: '#B2292E',\n thickness: 40,\n className: \"gauge5 insetShadowSVG\"\n }],\n tickLength: 64,\n tickWidth: 3,\n tickColor: \"#fff\",\n minorTickInterval: null,\n labels: { enabled: false },\n lineColor: \"transparent\",\n lineWidth: 0,\n }\n },\n\n }, {\n condition: {\n maxWidth: 300\n },\n chartOptions: {\n \n chart: { height: 330, spacingBottom: 30, marginBottom: 10 },\n title: { y: -20 }, subtitle: { y: 60 }, legend: { y: 35 }\n }\n }]\n }\n\n });\n}\n\nconst chartLookup = {\n \"null\": {\n y: 0,\n dataLabels: {\n enabled: false\n },\n text: \"\" + \"Loading\" + \"
\" + \"\" + '
',\n subtext: \" \",\n color: \"#000\"\n },\n \"green\": {\n y: 10,\n dataLabels: {\n enabled: false\n },\n text: \"Grid Conditions Normal
\",\n //subtext: \"\" + alertString +\"
\",\n subtext: \"\",\n color: \"#000\"\n },\n \"yellow\": {\n y: 30,\n dataLabels: {\n enabled: false\n },\n text: \"Grid Advisories/Warnings
\",\n subtext: \"Grid Stable
\",\n color: \"#000\"\n },\n \"orange\": {\n y: 50,\n dataLabels: {\n enabled: false\n },\n text: \"Energy Emergency Alert 1 (EEA1)
\",\n subtext: \"Power demand could exceed available supply
Grid Stable
\",\n color: \"#ee7623\"\n },\n \"lightRed\": {\n y: 70,\n dataLabels: {\n enabled: false\n },\n text: \"Energy Emergency Alert 2 (EEA2)
\",\n subtext: \"Emergency power and/or reduced demand neccessary
\",\n color: \"#E74F3D\"\n },\n \"darkRed\": {\n y: 90,\n dataLabels: {\n enabled: false\n },\n text: \"Energy Emergency Alert 3 (EEA3)
\",\n subtext: \"Power interruptions imminent or happening
\",\n color: \"#B2292E\"\n },\n \"error\": {\n y: 0,\n dataLabels: {\n enabled: false\n },\n text: \"\" + \"Site Timeout\" + \"
\" + \"Please refresh the page for further updates\" + '
',\n subtext: \"\",\n color: \"#000\"\n },\n};","//import React from 'react';\n//import { HighchartsReact } from 'highcharts-react-official';\n//import { Chart, HighchartsChart, HighchartsProvider, Legend, LineSeries, Subtitle, Title, XAxis, YAxis } from 'react-jsx-highcharts';\n\nimport ChartModuleMore from 'highcharts/highcharts-more.js';\nimport HCSoldGauge from 'highcharts/modules/sunburst';\nimport HCData from 'highcharts/modules/data.js';\nimport * as Highcharts from 'highcharts';\nimport { Chart, SeriesPieOptions, PointOptionsObject } from 'highcharts';\n\nif (typeof Highcharts === 'object') {\n ChartModuleMore(Highcharts);\n HCData(Highcharts);\n HCSoldGauge(Highcharts);\n}\nlet totalMW = '';\nasync function getData(serviceUrl) {\n const response = await fetch(serviceUrl);\n const mix = await response.json();\n totalMW = parseInt(mix.TotalMW).toLocaleString(\"en-US\");\n return format(mix.Fuel.Type);\n}\nfunction format(mix) {\n var formmattedMix = mix.map((fuel, i) => {\n return { name: fuel.CATEGORY, y: parseInt(fuel.ACT), color: ColorLookup[fuel.CATEGORY].color, className: \"insetShadowSVG\" }\n })\n return formmattedMix;\n}\nexport function FuelMixWidget(blockID: string, serviceUrl:string) {\n\n getData(serviceUrl).then(response => {\n drawChart(blockID, serviceUrl, response);\n }).catch(error => {\n drawChart(blockID, serviceUrl, \"error\");\n })\n\n\n\n}\nfunction drawChart(blockID, serviceUrl, response) {\n let seriesPieOptionsDesktop: SeriesPieOptions = {\n innerSize: \"80%\",\n description: \"fuelmix\",\n dataLabels: [{\n format: (\"\" + \"fuelmx\" + \"
\" + \"megawatt!\" + '
'),\n borderWidth: 0,\n useHTML: true,\n style: {\n padding: '20px 0px 0px 0px',\n fontSize: '24px',\n top: '30px',\n color: \"333\",\n textOutline: null\n }\n }],\n data: response,\n type: 'pie'\n }\n // Build the chart\n let pieChart = Highcharts.chart(blockID, {\n chart: {\n plotBackgroundColor: null,\n plotBorderWidth: null,\n plotShadow: false,\n type: 'pie',\n backgroundColor: 'transparent',\n //marginRight:140,\n //marginBottom: 90,\n height: (function (s) {\n //console.log(s);\n var gridRowHgt = 50;\n var cats = s.data.length;\n var newHgtpx = (cats) * (gridRowHgt) + 120;\n return newHgtpx;\n })(seriesPieOptionsDesktop), \n style: {\n fontFamily: 'Lato, Arial, Helvetica, sans-serif',\n whiteSpace:\"wrap\"\n },\n events: {\n load: function () {\n //setTimeout( () => console.log(this), 30);\n setTimeout(this.reflow.bind(this), 30);\n setInterval(function () {\n\n $.getJSON(serviceUrl,\n function (data) {\n response = format(data.Fuel.Type);\n totalMW = parseInt(data.TotalMW).toLocaleString(\"en-US\");\n pieChart.series[0].setData(response);\n pieChart.setTitle({ text: '' + totalMW + ' MW
Total Megawatts' });\n pieChart.legend.update(response, true);\n //console.log(pieChart);\n pieChart.redraw();\n }\n )\n }, 300000);\n }\n }\n },\n title: {\n text: '' + totalMW + ' MW
Total Megawatts',\n align: 'center',\n verticalAlign: 'middle',\n y:-35,\n //floating: true,\n //margin:0\n //x:-50\n },\n tooltip: {\n pointFormat: '{point.percentage:.1f}%'\n },\n legend: {\n enabled: true,\n //align: \"right\",\n //itemWidth: 300,\n width: '100%',\n //floating:true,\n //useHTML:true,\n //x: 0,\n //y: -7,\n layout: 'horizontal',\n itemMarginBottom: 5,\n itemStyle: {\n display: \"flex\"\n //justify- content:\"space-between\"\n },\n className:'w-100 d-flex justify-content-between',\n labelFormatter: function () {\n return '' + this.name + \"
\" + this['y'].toLocaleString(\"en-US\") + \" MW\" + '