/* *
 *
 *  (c) 2010-2019 Torstein Honsi
 *
 *  License: www.highcharts.com/license
 *
 *  !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!
 *
 * */
'use strict';
import H from './Globals.js';
/**
 * The operator to compare by in the filter.
 *
 * @typedef {">"|"<"|">="|"<="|"=="|"==="} Highcharts.DataLabelsFilterOperatorValue
 */
/**
 * A declarative filter to control of which data labels to display. The
 * declarative filter is designed for use when callback functions are not
 * available, like when the chart options require a pure JSON structure or for
 * use with graphical editors. For programmatic control, use the `formatter`
 * instead, and return `undefined` to disable a single data label.
 *
 * @example
 * filter: {
 *     property: 'percentage',
 *     operator: '>',
 *     value: 4
 * }
 *
 * @see {@link https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/demo/pie-monochrome|Highcharts-Demo:}
 *      Data labels filtered by percentage
 *
 * @since 6.0.3
 * @interface Highcharts.DataLabelsFilterOptionsObject
 */ /**
* The operator to compare by. Can be one of `>`, `<`, `>=`, `<=`, `==`, and
* `===`.
* @name Highcharts.DataLabelsFilterOptionsObject#operator
* @type {Highcharts.DataLabelsFilterOperatorValue}
*/ /**
* The point property to filter by. Point options are passed directly to
* properties, additionally there are `y` value, `percentage` and others listed
* under {@link Highcharts.Point} members.
* @name Highcharts.DataLabelsFilterOptionsObject#property
* @type {string}
*/ /**
* The value to compare against.
* @name Highcharts.DataLabelsFilterOptionsObject#value
* @type {number|null}
*/
/**
 * Callback JavaScript function to format the data label as a string. Note that
 * if a `format` is defined, the format takes precedence and the formatter is
 * ignored.
 *
 * @callback Highcharts.DataLabelsFormatterCallbackFunction
 *
 * @param {Highcharts.DataLabelsFormatterContextObject} this
 *        Data label context to format
 *
 * @return {number|string|null|undefined}
 *         Formatted data label text
 */
/**
 * Context for the callback function to format the data label.
 *
 * @interface Highcharts.DataLabelsFormatterContextObject
 */ /**
* Stacked series and pies only. The point's percentage of the total.
* @name Highcharts.DataLabelsFormatterContextObject#percentage
* @type {number|undefined}
*/ /**
* The point object. The point name, if defined, is available through
* `this.point.name`.
* @name Highcharts.DataLabelsFormatterContextObject#point
* @type {Highcharts.Point}
*/ /**
* The series object. The series name is available through `this.series.name`.
* @name Highcharts.DataLabelsFormatterContextObject#series
* @type {Highcharts.Series}
*/ /**
* Stacked series only. The total value at this point's x value.
* @name Highcharts.DataLabelsFormatterContextObject#total
* @type {number|undefined}
*/ /**
* The x value.
* @name Highcharts.DataLabelsFormatterContextObject#x
* @type {number}
*/ /**
* The y value.
* @name Highcharts.DataLabelsFormatterContextObject#y
* @type {number|null}
*/
/**
 * Options for the series data labels, appearing next to each data point.
 *
 * Since v6.2.0, multiple data labels can be applied to each single point by
 * defining them as an array of configs.
 *
 * In styled mode, the data labels can be styled with the
 * `.highcharts-data-label-box` and `.highcharts-data-label` class names.
 *
 * @see {@link https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/plotoptions/series-datalabels-enabled|Highcharts-Demo:}
 *      Data labels enabled
 * @see {@link https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/plotoptions/series-datalabels-multiple|Highcharts-Demo:}
 *      Multiple data labels on a bar series
 * @see {@link https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/css/series-datalabels|Highcharts-Demo:}
 *      Style mode example
 *
 * @interface Highcharts.DataLabelsOptionsObject
 */ /**
* The alignment of the data label compared to the point. If `right`, the right
* side of the label should be touching the point. For points with an extent,
* like columns, the alignments also dictates how to align it inside the box, as
* given with the
* [inside](/highcharts/plotOptions.column.dataLabels.inside)
* option. Can be one of `left`, `center` or `right`.
*
* @see {@link https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/plotoptions/series-datalabels-align-left/|Highcharts-Demo:}
*      Left aligned
* @see {@link https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/plotoptions/bar-datalabels-align-inside-bar/|Highcharts-Demo:}
*      Data labels inside the bar
*
* @name Highcharts.DataLabelsOptionsObject#align
* @type {Highcharts.AlignValue|null|undefined}
* @default center
*/ /**
* Whether to allow data labels to overlap. To make the labels less sensitive
* for overlapping, the
* [dataLabels.padding](/highcharts/#plotOptions.series.dataLabels.padding) can
* be set to 0.
*
* @see {@link https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/plotoptions/series-datalabels-allowoverlap-false/|Highcharts-Demo:}
*      Don't allow overlap
*
* @name Highcharts.DataLabelsOptionsObject#allowOverlap
* @type {boolean|undefined}
* @since 4.1.0
* @default false
*/ /**
* The background color or gradient for the data label.
*
* @see {@link https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/plotoptions/series-datalabels-box/|Highcharts-Demo:}
*      Data labels box options
* @see {@link https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/maps/plotoptions/series-datalabels-box/|Highmaps-Demo:}
*      Data labels box options
*
* @name Highcharts.DataLabelsOptionsObject#backgroundColor
* @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject|undefined}
* @since 2.2.1
*/ /**
* The border color for the data label. Defaults to `undefined`.
*
* @see {@link https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/plotoptions/series-datalabels-box/|Highcharts-Demo:}
*      Data labels box options
*
* @name Highcharts.DataLabelsOptionsObject#borderColor
* @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject|undefined}
* @since 2.2.1
*/ /**
* The border radius in pixels for the data label.
*
* @see {@link https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/plotoptions/series-datalabels-box/|Highcharts-Demo:}
*      Data labels box options
* @see {@link https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/maps/plotoptions/series-datalabels-box/|Highmaps-Demo:}
*      Data labels box options
*
* @name Highcharts.DataLabelsOptionsObject#borderRadius
* @type {number|undefined}
* @since 2.2.1
* @default 0
*/ /**
* The border width in pixels for the data label.
*
* @see {@link https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/plotoptions/series-datalabels-box/|Highcharts-Demo:}
*      Data labels box options
*
* @name Highcharts.DataLabelsOptionsObject#borderWidth
* @type {number|undefined}
* @since 2.2.1
* @default 0
*/ /**
* A class name for the data label. Particularly in styled mode, this can be
* used to give each series' or point's data label unique styling. In addition
* to this option, a default color class name is added so that we can give the
* labels a contrast text shadow.
*
* @see {@link https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/css/data-label-contrast/|Highcharts-Demo:}
*      Contrast text shadow
* @see {@link https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/css/series-datalabels/|Highcharts-Demo:}
*      Styling by CSS
*
* @name Highcharts.DataLabelsOptionsObject#className
* @type {string|undefined}
* @since 5.0.0
*/ /**
* The text color for the data labels. Defaults to `undefined`. For certain
* series types, like column or map, the data labels can be drawn inside the
* points. In this case the data label will be drawn with maximum contrast by
* default. Additionally, it will be given a `text-outline` style with the
* opposite color, to further increase the contrast. This can be overridden by
* setting the `text-outline` style to `none` in the `dataLabels.style` option.
*
* @see {@link https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/plotoptions/series-datalabels-color/|Highcharts-Demo:}
*      Red data labels
* @see {@link https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/maps/demo/color-axis/|Highmaps-Demo:}
*      White data labels
*
* @name Highcharts.DataLabelsOptionsObject#color
* @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject|undefined}
*/ /**
* Whether to hide data labels that are outside the plot area. By default, the
* data label is moved inside the plot area according to the
* [overflow](/highcharts/#plotOptions.series.dataLabels.overflow) option.
*
* @name Highcharts.DataLabelsOptionsObject#crop
* @type {boolean|undefined}
* @default true
* @since 2.3.3
*/ /**
* Whether to defer displaying the data labels until the initial series
* animation has finished.
*
* @name Highcharts.DataLabelsOptionsObject#defer
* @type {boolean|undefined}
* @default true
* @since 4.0.0
* @product highcharts highstock gantt
*/ /**
* Enable or disable the data labels.
*
* @see {@link https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/plotoptions/series-datalabels-enabled/|Highcharts-Demo:}
*      Data labels enabled
* @see {@link https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/maps/demo/color-axis/|Highmaps-Demo:}
*      Data labels enabled
*
* @name Highcharts.DataLabelsOptionsObject#enabled
* @type {boolean|undefined}
* @default false
*/ /**
* A declarative filter to control of which data labels to display. The
* declarative filter is designed for use when callback functions are not
* available, like when the chart options require a pure JSON structure or for
* use with graphical editors. For programmatic control, use the `formatter`
* instead, and return `undefined` to disable a single data label.
*
* @example
* filter: {
*     property: 'percentage',
*     operator: '>',
*     value: 4
* }
*
* @see {@link https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/demo/pie-monochrome|Highcharts-Demo:}
*      Data labels filtered by percentage
*
* @name Highcharts.DataLabelsOptionsObject#filter
* @type {Highcharts.DataLabelsFilterOptionsObject|undefined}
* @since 6.0.3
*/ /**
* Callback JavaScript function to format the data label. Note that if a
* `format` is defined, the format takes precedence and the formatter is
* ignored.
*
* @see {@link https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/maps/plotoptions/series-datalabels-format/|Highmaps-Demo:}
*      Formatted value
*
* @name Highcharts.DataLabelsOptionsObject#formatter
* @type {Highcharts.DataLabelsFormatterCallbackFunction|undefined}
* @default function () { return this.y; }
*/ /**
* A
* [format string](https://www.highcharts.com/docs/chart-concepts/labels-and-string-formatting)
* for the data label. Available variables are the same as for `formatter`.
*
* @see {@link https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/plotoptions/series-datalabels-format/|Highcharts-Demo:}
*      Add a unit
* @see {@link https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/maps/plotoptions/series-datalabels-format/|Highmaps-Demo:}
*      Formatted value in the data label
*
* @name Highcharts.DataLabelsOptionsObject#format
* @type {string|undefined}
* @default y
* @default point.value
* @since 3.0
*/ /**
* For points with an extent, like columns or map areas, whether to align the
* data label inside the box or to the actual value point. Defaults to `false`
* in most cases, `true` in stacked columns.
*
* @name Highcharts.DataLabelsOptionsObject#inside
* @type {boolean|undefined}
* @since 3.0
*/ /**
* Format for points with the value of null. Works analogously to
* [format](#plotOptions.series.dataLabels.format).
* `nullFormat` can be applied only to series which support
* displaying null points.
*
* @see {@link https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/plotoptions/series-datalabels-format/|Highmaps-Demo:}
*      Format data label and tooltip for null point.
*
* @name Highcharts.DataLabelsOptionsObject#nullFormat
* @type {string|boolean|undefined}
* @since 7.1.0
*/ /**
* Callback JavaScript function that defines formatting for points
* with the value of null. Works analogously to
* [formatter](#plotOptions.series.dataLabels.formatter).
* `nullPointFormatter` can be applied only to series which support
* displaying null points.
*
* @see {@link https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/plotoptions/series-datalabels-format/|Highmaps-Demo:}
*      Format data label and tooltip for null point.
*
* @name Highcharts.DataLabelsOptionsObject#nullFormatter
* @type {Highcharts.DataLabelsFormatterCallbackFunction|undefined}
* @since 7.1.0
*/ /**
* How to handle data labels that flow outside the plot area. The default is
* `"justify"`, which aligns them inside the plot area. For columns and bars,
* this means it will be moved inside the bar. To display data labels outside
* the plot area, set `crop` to `false` and `overflow` to `"allow"`.
*
* @name Highcharts.DataLabelsOptionsObject#overflow
* @type {Highcharts.DataLabelsOverflowValue|undefined}
* @default justify
* @since 3.0.6
*/ /**
* When either the `borderWidth` or the `backgroundColor` is set, this is the
* padding within the box.
*
* @see {@link https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/plotoptions/series-datalabels-box/|Highcharts-Demo:}
*      Data labels box options
* @see {@link https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/maps/plotoptions/series-datalabels-box/|Highmaps-Demo:}
*      Data labels box options
*
* @name Highcharts.DataLabelsOptionsObject#padding
* @type {number|undefined}
* @since 2.2.1
*/ /**
* Text rotation in degrees. Note that due to a more complex structure,
* backgrounds, borders and padding will be lost on a rotated data label.
*
* @see {@link https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/plotoptions/series-datalabels-rotation/|Highcharts-Demo:}
*      Vertical labels
*
* @name Highcharts.DataLabelsOptionsObject#rotation
* @type {number|undefined}
* @default 0
*/ /**
* The shadow of the box. Works best with `borderWidth` or
* `backgroundColor`. Since 2.3 the shadow can be an object
* configuration containing `color`, `offsetX`, `offsetY`, `opacity`
* and `width`.
*
* @see {@link https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/plotoptions/series-datalabels-box/|Highcharts-Demo:}
*      Data labels box options
*
* @name Highcharts.DataLabelsOptionsObject#shadow
* @type {boolean|Highcharts.ShadowOptionsObject|undefined}
* @default false
* @since 2.2.1
*/ /**
* The name of a symbol to use for the border around the label.
* Symbols are predefined functions on the Renderer object.
*
* @see {@link https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/plotoptions/series-datalabels-shape/|Highcharts-Demo:}
*      A callout for annotations
*
* @name Highcharts.DataLabelsOptionsObject#shape
* @type {string|undefined}
* @default   square
* @since     4.1.2
*/ /**
* Styles for the label. The default `color` setting is `"contrast"`, which is a
* pseudo color that Highcharts picks up and applies the maximum contrast to the
* underlying point item, for example the bar in a bar chart.
*
* The `textOutline` is a pseudo property that applies an outline of the given
* width with the given color, which by default is the maximum contrast to the
* text. So a bright text color will result in a black text outline for maximum
* readability on a mixed background. In some cases, especially with grayscale
* text, the text outline doesn't work well, in which cases it can be disabled
* by setting it to `"none"`. When `useHTML` is true, the `textOutline` will not
* be picked up. In this, case, the same effect can be acheived through the
* `text-shadow` CSS property.
*
* For some series types, where each point has an extent, like for example tree
* maps, the data label may overflow the point. There are two strategies for
* handling overflow. By default, the text will wrap to multiple lines. The
* other strategy is to set `style.textOverflow` to `ellipsis`, which will keep
* the text on one line plus it will break inside long words.
*
* @see {@link https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/plotoptions/series-datalabels-style/|Highcharts-Demo:}
*      Bold labels
* @see {@link https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/plotOptions/pie-datalabels-overflow|Highcharts-Demo:}
*      Long labels truncated with an ellipsis in a pie
* @see {@link https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/plotOptions/pie-datalabels-overflow-wrap|Highcharts-Demo:}
*      Long labels are wrapped in a pie
* @see {@link https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/maps/demo/color-axis/|Highmaps-Demo:}
*      Bold labels
*
* @name Highcharts.DataLabelsOptionsObject#style
* @type {Highcharts.CSSObject|undefined}
* @default {"color": "contrast", "fontSize": "11px", "fontWeight": "bold", "textOutline": "1px contrast" }
* @since 4.1.0
*/ /**
* Options for a label text which should follow marker's shape. Border and
* background are disabled for a label that follows a path.
* **Note:** Only SVG-based renderer supports this option. Setting `useHTML` to
* true will disable this option.
* @name Highcharts.DataLabelsOptionsObject#textPath
* @type {Highcharts.DataLabelsTextPathOptionsObject|undefined}
* @since 7.1.0
*/ /**
* Whether to
* [use HTML](https://www.highcharts.com/docs/chart-concepts/labels-and-string-formatting#html)
* to render the labels.
*
* @name Highcharts.DataLabelsOptionsObject#useHTML
* @type {boolean|undefined}
* @default false
*/ /**
* The vertical alignment of a data label. Can be one of `top`, `middle` or
* `bottom`. The default value depends on the data, for instance in a column
* chart, the label is above positive values and below negative values.
*
* @name Highcharts.DataLabelsOptionsObject#verticalAlign
* @type {Highcharts.VerticalAlignValue|null|undefined}
* @since 2.3.3
*/ /**
* The x position offset of the label relative to the point in pixels.
*
* @see {@link https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/plotoptions/series-datalabels-rotation/|Highcharts-Demo:}
*      Vertical and positioned
* @see {@link https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/plotoptions/bar-datalabels-align-inside-bar/|Highcharts-Demo:}
*      Data labels inside the bar
*
* @name Highcharts.DataLabelsOptionsObject#x
* @type {number|undefined}
*/ /**
* The y position offset of the label relative to the point in pixels.
*
* @see {@link https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/plotoptions/series-datalabels-rotation/|Highcharts-Demo:}
*      Vertical and positioned
*
* @name Highcharts.DataLabelsOptionsObject#y
* @type {number|undefined}
*/ /**
* The Z index of the data labels. The default Z index puts it above
* the series. Use a Z index of 2 to display it behind the series.
*
* @name Highcharts.DataLabelsOptionsObject#zIndex
* @type {number|undefined}
* @default 6
* @since 2.3.5
*/
/**
 * Values for handling data labels that flow outside the plot area.
 *
 * @typedef {"allow"|"justify"} Highcharts.DataLabelsOverflowValue
 */
/**
 * Options for a label text which should follow marker's shape.
 * **Note:** Only SVG-based renderer supports this option.
 *
 * @see {@link Highcharts.SeriesNetworkDataLabelsTextPath#linkTextPath}
 * @see {@link Highcharts.SeriesNetworkDataLabelsTextPath#textPath}
 *
 * @interface Highcharts.DataLabelsTextPathOptionsObject
 * @since 7.1.0
 */ /**
* Presentation attributes for the text path.
* @name Highcharts.DataLabelsTextPathOptionsObject#attributes
* @type {Highcharts.SVGAttributes|undefined}
* @since 7.1.0
*/ /**
* Enable or disable `textPath` option for link's or marker's data labels.
* @name Highcharts.DataLabelsTextPathOptionsObject#enabled
* @type {boolean|undefined}
* @since 7.1.0
*/
/**
 * @interface Highcharts.PointOptionsObject
 */ /**
* Individual data labels for each point.
* @name Highcharts.PointOptionsObject#dataLabels
* @type {Highcharts.DataLabelsOptionsObject|Array<Highcharts.DataLabelsOptionsObject>|undefined}
*/ /**
* The rank for this point's data label in case of collision. If two data labels
* are about to overlap, only the one with the highest labelrank will be drawn.
* @name Highcharts.PointOptionsObject#labelrank
* @type {number|undefined}
*/
import U from './Utilities.js';
var defined = U.defined, isArray = U.isArray, objectEach = U.objectEach, splat = U.splat;
import './Series.js';
var arrayMax = H.arrayMax, extend = H.extend, format = H.format, merge = H.merge, noop = H.noop, pick = H.pick, relativeLength = H.relativeLength, Series = H.Series, seriesTypes = H.seriesTypes, stableSort = H.stableSort;
/* eslint-disable valid-jsdoc */
/**
 * General distribution algorithm for distributing labels of differing size
 * along a confined length in two dimensions. The algorithm takes an array of
 * objects containing a size, a target and a rank. It will place the labels as
 * close as possible to their targets, skipping the lowest ranked labels if
 * necessary.
 *
 * @private
 * @function Highcharts.distribute
 * @param {Highcharts.DataLabelsBoxArray} boxes
 * @param {number} len
 * @param {number} maxDistance
 * @return {void}
 */
H.distribute = function (boxes, len, maxDistance) {
    var i, overlapping = true, origBoxes = boxes, // Original array will be altered with added .pos
    restBoxes = [], // The outranked overshoot
    box, target, total = 0, reducedLen = origBoxes.reducedLen || len;
    /**
     * @private
     */
    function sortByTarget(a, b) {
        return a.target - b.target;
    }
    // If the total size exceeds the len, remove those boxes with the lowest
    // rank
    i = boxes.length;
    while (i--) {
        total += boxes[i].size;
    }
    // Sort by rank, then slice away overshoot
    if (total > reducedLen) {
        stableSort(boxes, function (a, b) {
            return (b.rank || 0) - (a.rank || 0);
        });
        i = 0;
        total = 0;
        while (total <= reducedLen) {
            total += boxes[i].size;
            i++;
        }
        restBoxes = boxes.splice(i - 1, boxes.length);
    }
    // Order by target
    stableSort(boxes, sortByTarget);
    // So far we have been mutating the original array. Now
    // create a copy with target arrays
    boxes = boxes.map(function (box) {
        return {
            size: box.size,
            targets: [box.target],
            align: pick(box.align, 0.5)
        };
    });
    while (overlapping) {
        // Initial positions: target centered in box
        i = boxes.length;
        while (i--) {
            box = boxes[i];
            // Composite box, average of targets
            target = (Math.min.apply(0, box.targets) +
                Math.max.apply(0, box.targets)) / 2;
            box.pos = Math.min(Math.max(0, target - box.size * box.align), len - box.size);
        }
        // Detect overlap and join boxes
        i = boxes.length;
        overlapping = false;
        while (i--) {
            // Overlap
            if (i > 0 &&
                boxes[i - 1].pos + boxes[i - 1].size >
                    boxes[i].pos) {
                // Add this size to the previous box
                boxes[i - 1].size += boxes[i].size;
                boxes[i - 1].targets = boxes[i - 1]
                    .targets
                    .concat(boxes[i].targets);
                boxes[i - 1].align = 0.5;
                // Overlapping right, push left
                if (boxes[i - 1].pos + boxes[i - 1].size > len) {
                    boxes[i - 1].pos = len - boxes[i - 1].size;
                }
                boxes.splice(i, 1); // Remove this item
                overlapping = true;
            }
        }
    }
    // Add the rest (hidden boxes)
    origBoxes.push.apply(origBoxes, restBoxes);
    // Now the composite boxes are placed, we need to put the original boxes
    // within them
    i = 0;
    boxes.some(function (box) {
        var posInCompositeBox = 0;
        if (box.targets.some(function () {
            origBoxes[i].pos = box.pos + posInCompositeBox;
            // If the distance between the position and the target exceeds
            // maxDistance, abort the loop and decrease the length in increments
            // of 10% to recursively reduce the  number of visible boxes by
            // rank. Once all boxes are within the maxDistance, we're good.
            if (Math.abs(origBoxes[i].pos - origBoxes[i].target) >
                maxDistance) {
                // Reset the positions that are already set
                origBoxes.slice(0, i + 1).forEach(function (box) {
                    delete box.pos;
                });
                // Try with a smaller length
                origBoxes.reducedLen =
                    (origBoxes.reducedLen || len) - (len * 0.1);
                // Recurse
                if (origBoxes.reducedLen > len * 0.1) {
                    H.distribute(origBoxes, len, maxDistance);
                }
                // Exceeded maxDistance => abort
                return true;
            }
            posInCompositeBox += origBoxes[i].size;
            i++;
        })) {
            // Exceeded maxDistance => abort
            return true;
        }
    });
    // Add the rest (hidden) boxes and sort by target
    stableSort(origBoxes, sortByTarget);
};
/**
 * Draw the data labels
 *
 * @private
 * @function Highcharts.Series#drawDataLabels
 * @return {void}
 * @fires Highcharts.Series#event:afterDrawDataLabels
 */
Series.prototype.drawDataLabels = function () {
    var series = this, chart = series.chart, seriesOptions = series.options, seriesDlOptions = seriesOptions.dataLabels, points = series.points, pointOptions, hasRendered = series.hasRendered || 0, dataLabelsGroup, seriesAnimDuration = H.animObject(seriesOptions.animation).duration, fadeInDuration = Math.min(seriesAnimDuration, 200), defer = !chart.renderer.forExport && pick(seriesDlOptions.defer, fadeInDuration > 0), renderer = chart.renderer;
    /**
     * Handle the dataLabels.filter option.
     * @private
     */
    function applyFilter(point, options) {
        var filter = options.filter, op, prop, val;
        if (filter) {
            op = filter.operator;
            prop = point[filter.property];
            val = filter.value;
            if ((op === '>' && prop > val) ||
                (op === '<' && prop < val) ||
                (op === '>=' && prop >= val) ||
                (op === '<=' && prop <= val) ||
                (op === '==' && prop == val) || // eslint-disable-line eqeqeq
                (op === '===' && prop === val)) {
                return true;
            }
            return false;
        }
        return true;
    }
    /**
     * Merge two objects that can be arrays. If one of them is an array, the
     * other is merged into each element. If both are arrays, each element is
     * merged by index. If neither are arrays, we use normal merge.
     * @private
     */
    function mergeArrays(one, two) {
        var res = [], i;
        if (isArray(one) && !isArray(two)) {
            res = one.map(function (el) {
                return merge(el, two);
            });
        }
        else if (isArray(two) && !isArray(one)) {
            res = two.map(function (el) {
                return merge(one, el);
            });
        }
        else if (!isArray(one) && !isArray(two)) {
            res = merge(one, two);
        }
        else {
            i = Math.max(one.length, two.length);
            while (i--) {
                res[i] = merge(one[i], two[i]);
            }
        }
        return res;
    }
    // Merge in plotOptions.dataLabels for series
    seriesDlOptions = mergeArrays(mergeArrays(chart.options.plotOptions &&
        chart.options.plotOptions.series &&
        chart.options.plotOptions.series.dataLabels, chart.options.plotOptions &&
        chart.options.plotOptions[series.type] &&
        chart.options.plotOptions[series.type].dataLabels), seriesDlOptions);
    H.fireEvent(this, 'drawDataLabels');
    if (isArray(seriesDlOptions) ||
        seriesDlOptions.enabled ||
        series._hasPointLabels) {
        // Create a separate group for the data labels to avoid rotation
        dataLabelsGroup = series.plotGroup('dataLabelsGroup', 'data-labels', defer && !hasRendered ? 'hidden' : 'inherit', // #5133, #10220
        seriesDlOptions.zIndex || 6);
        if (defer) {
            dataLabelsGroup.attr({ opacity: +hasRendered }); // #3300
            if (!hasRendered) {
                setTimeout(function () {
                    var group = series.dataLabelsGroup;
                    if (group) {
                        if (series.visible) { // #2597, #3023, #3024
                            dataLabelsGroup.show(true);
                        }
                        group[seriesOptions.animation ? 'animate' : 'attr']({ opacity: 1 }, { duration: fadeInDuration });
                    }
                }, seriesAnimDuration - fadeInDuration);
            }
        }
        // Make the labels for each point
        points.forEach(function (point) {
            // Merge in series options for the point.
            // @note dataLabelAttribs (like pointAttribs) would eradicate
            // the need for dlOptions, and simplify the section below.
            pointOptions = splat(mergeArrays(seriesDlOptions, point.dlOptions || // dlOptions is used in treemaps
                (point.options && point.options.dataLabels)));
            // Handle each individual data label for this point
            pointOptions.forEach(function (labelOptions, i) {
                // Options for one datalabel
                var labelEnabled = (labelOptions.enabled &&
                    // #2282, #4641, #7112, #10049
                    (!point.isNull || point.dataLabelOnNull) &&
                    applyFilter(point, labelOptions)), labelConfig, formatString, labelText, style, rotation, attr, dataLabel = point.dataLabels ? point.dataLabels[i] :
                    point.dataLabel, connector = point.connectors ? point.connectors[i] :
                    point.connector, labelDistance = pick(labelOptions.distance, point.labelDistance), isNew = !dataLabel;
                if (labelEnabled) {
                    // Create individual options structure that can be extended
                    // without affecting others
                    labelConfig = point.getLabelConfig();
                    formatString = pick(labelOptions[point.formatPrefix + 'Format'], labelOptions.format);
                    labelText = defined(formatString) ?
                        format(formatString, labelConfig, chart.time) :
                        (labelOptions[point.formatPrefix + 'Formatter'] ||
                            labelOptions.formatter).call(labelConfig, labelOptions);
                    style = labelOptions.style;
                    rotation = labelOptions.rotation;
                    if (!chart.styledMode) {
                        // Determine the color
                        style.color = pick(labelOptions.color, style.color, series.color, '#000000');
                        // Get automated contrast color
                        if (style.color === 'contrast') {
                            point.contrastColor = renderer.getContrast((point.color || series.color));
                            style.color = (!defined(labelDistance) &&
                                labelOptions.inside) ||
                                labelDistance < 0 ||
                                !!seriesOptions.stacking ?
                                point.contrastColor :
                                '#000000';
                        }
                        if (seriesOptions.cursor) {
                            style.cursor = seriesOptions.cursor;
                        }
                    }
                    attr = {
                        r: labelOptions.borderRadius || 0,
                        rotation: rotation,
                        padding: labelOptions.padding,
                        zIndex: 1
                    };
                    if (!chart.styledMode) {
                        attr.fill = labelOptions.backgroundColor;
                        attr.stroke = labelOptions.borderColor;
                        attr['stroke-width'] = labelOptions.borderWidth;
                    }
                    // Remove unused attributes (#947)
                    objectEach(attr, function (val, name) {
                        if (val === undefined) {
                            delete attr[name];
                        }
                    });
                }
                // If the point is outside the plot area, destroy it. #678, #820
                if (dataLabel && (!labelEnabled || !defined(labelText))) {
                    point.dataLabel =
                        point.dataLabel && point.dataLabel.destroy();
                    if (point.dataLabels) {
                        // Remove point.dataLabels if this was the last one
                        if (point.dataLabels.length === 1) {
                            delete point.dataLabels;
                        }
                        else {
                            delete point.dataLabels[i];
                        }
                    }
                    if (!i) {
                        delete point.dataLabel;
                    }
                    if (connector) {
                        point.connector = point.connector.destroy();
                        if (point.connectors) {
                            // Remove point.connectors if this was the last one
                            if (point.connectors.length === 1) {
                                delete point.connectors;
                            }
                            else {
                                delete point.connectors[i];
                            }
                        }
                    }
                    // Individual labels are disabled if the are explicitly disabled
                    // in the point options, or if they fall outside the plot area.
                }
                else if (labelEnabled && defined(labelText)) {
                    if (!dataLabel) {
                        // Create new label element
                        point.dataLabels = point.dataLabels || [];
                        dataLabel = point.dataLabels[i] = rotation ?
                            // Labels don't rotate, use text element
                            renderer.text(labelText, 0, -9999)
                                .addClass('highcharts-data-label') :
                            // We can use label
                            renderer.label(labelText, 0, -9999, labelOptions.shape, null, null, labelOptions.useHTML, null, 'data-label');
                        // Store for backwards compatibility
                        if (!i) {
                            point.dataLabel = dataLabel;
                        }
                        dataLabel.addClass(' highcharts-data-label-color-' + point.colorIndex +
                            ' ' + (labelOptions.className || '') +
                            ( // #3398
                            labelOptions.useHTML ?
                                ' highcharts-tracker' :
                                ''));
                    }
                    else {
                        // Use old element and just update text
                        attr.text = labelText;
                    }
                    // Store data label options for later access
                    dataLabel.options = labelOptions;
                    dataLabel.attr(attr);
                    if (!chart.styledMode) {
                        // Styles must be applied before add in order to read
                        // text bounding box
                        dataLabel.css(style).shadow(labelOptions.shadow);
                    }
                    if (!dataLabel.added) {
                        dataLabel.add(dataLabelsGroup);
                    }
                    if (labelOptions.textPath && !labelOptions.useHTML) {
                        dataLabel.setTextPath((point.getDataLabelPath &&
                            point.getDataLabelPath(dataLabel)) || point.graphic, labelOptions.textPath);
                    }
                    // Now the data label is created and placed at 0,0, so we
                    // need to align it
                    series.alignDataLabel(point, dataLabel, labelOptions, null, isNew);
                }
            });
        });
    }
    H.fireEvent(this, 'afterDrawDataLabels');
};
/**
 * Align each individual data label.
 *
 * @private
 * @function Highcharts.Series#alignDataLabel
 * @param {Highcharts.Point} point
 * @param {Highcharts.SVGElement} dataLabel
 * @param {Highcharts.DataLabelsOptionsObject} options
 * @param {Highcharts.BBoxObject} alignTo
 * @param {boolean} [isNew]
 * @return {void}
 */
Series.prototype.alignDataLabel = function (point, dataLabel, options, alignTo, isNew) {
    var chart = this.chart, inverted = this.isCartesian && chart.inverted, plotX = pick(point.dlBox && point.dlBox.centerX, point.plotX, -9999), plotY = pick(point.plotY, -9999), bBox = dataLabel.getBBox(), baseline, rotation = options.rotation, normRotation, negRotation, align = options.align, rotCorr, // rotation correction
    // Math.round for rounding errors (#2683), alignTo to allow column
    // labels (#2700)
    visible = this.visible &&
        (point.series.forceDL ||
            chart.isInsidePlot(plotX, Math.round(plotY), inverted) ||
            (alignTo && chart.isInsidePlot(plotX, inverted ?
                alignTo.x + 1 :
                alignTo.y + alignTo.height - 1, inverted))), alignAttr, // the final position;
    justify = pick(options.overflow, 'justify') === 'justify';
    if (visible) {
        baseline = chart.renderer.fontMetrics(chart.styledMode ? undefined : options.style.fontSize, dataLabel).b;
        // The alignment box is a singular point
        alignTo = extend({
            x: inverted ? this.yAxis.len - plotY : plotX,
            y: Math.round(inverted ? this.xAxis.len - plotX : plotY),
            width: 0,
            height: 0
        }, alignTo);
        // Add the text size for alignment calculation
        extend(options, {
            width: bBox.width,
            height: bBox.height
        });
        // Allow a hook for changing alignment in the last moment, then do the
        // alignment
        if (rotation) {
            justify = false; // Not supported for rotated text
            rotCorr = chart.renderer.rotCorr(baseline, rotation); // #3723
            alignAttr = {
                x: (alignTo.x +
                    options.x +
                    alignTo.width / 2 +
                    rotCorr.x),
                y: (alignTo.y +
                    options.y +
                    { top: 0, middle: 0.5, bottom: 1 }[options.verticalAlign] *
                        alignTo.height)
            };
            dataLabel[isNew ? 'attr' : 'animate'](alignAttr)
                .attr({
                align: align
            });
            // Compensate for the rotated label sticking out on the sides
            normRotation = (rotation + 720) % 360;
            negRotation = normRotation > 180 && normRotation < 360;
            if (align === 'left') {
                alignAttr.y -= negRotation ? bBox.height : 0;
            }
            else if (align === 'center') {
                alignAttr.x -= bBox.width / 2;
                alignAttr.y -= bBox.height / 2;
            }
            else if (align === 'right') {
                alignAttr.x -= bBox.width;
                alignAttr.y -= negRotation ? 0 : bBox.height;
            }
            dataLabel.placed = true;
            dataLabel.alignAttr = alignAttr;
        }
        else {
            dataLabel.align(options, null, alignTo);
            alignAttr = dataLabel.alignAttr;
        }
        // Handle justify or crop
        if (justify && alignTo.height >= 0) { // #8830
            this.justifyDataLabel(dataLabel, options, alignAttr, bBox, alignTo, isNew);
            // Now check that the data label is within the plot area
        }
        else if (pick(options.crop, true)) {
            visible =
                chart.isInsidePlot(alignAttr.x, alignAttr.y) &&
                    chart.isInsidePlot(alignAttr.x + bBox.width, alignAttr.y + bBox.height);
        }
        // When we're using a shape, make it possible with a connector or an
        // arrow pointing to thie point
        if (options.shape && !rotation) {
            dataLabel[isNew ? 'attr' : 'animate']({
                anchorX: inverted ?
                    chart.plotWidth - point.plotY :
                    point.plotX,
                anchorY: inverted ?
                    chart.plotHeight - point.plotX :
                    point.plotY
            });
        }
    }
    // Show or hide based on the final aligned position
    if (!visible) {
        dataLabel.hide(true);
        dataLabel.placed = false; // don't animate back in
    }
};
/**
 * If data labels fall partly outside the plot area, align them back in, in a
 * way that doesn't hide the point.
 *
 * @private
 * @function Highcharts.Series#justifyDataLabel
 * @param {Highcharts.SVGElement} dataLabel
 * @param {Highcharts.DataLabelsOptionsObject} options
 * @param {Highcharts.SVGAttributes} alignAttr
 * @param {Highcharts.BBoxObject} bBox
 * @param {Highcharts.BBoxObject} [alignTo]
 * @param {boolean} [isNew]
 * @return {boolean|undefined}
 */
Series.prototype.justifyDataLabel = function (dataLabel, options, alignAttr, bBox, alignTo, isNew) {
    var chart = this.chart, align = options.align, verticalAlign = options.verticalAlign, off, justified, padding = dataLabel.box ? 0 : (dataLabel.padding || 0);
    // Off left
    off = alignAttr.x + padding;
    if (off < 0) {
        if (align === 'right') {
            options.align = 'left';
            options.inside = true;
        }
        else {
            options.x = -off;
        }
        justified = true;
    }
    // Off right
    off = alignAttr.x + bBox.width - padding;
    if (off > chart.plotWidth) {
        if (align === 'left') {
            options.align = 'right';
            options.inside = true;
        }
        else {
            options.x = chart.plotWidth - off;
        }
        justified = true;
    }
    // Off top
    off = alignAttr.y + padding;
    if (off < 0) {
        if (verticalAlign === 'bottom') {
            options.verticalAlign = 'top';
            options.inside = true;
        }
        else {
            options.y = -off;
        }
        justified = true;
    }
    // Off bottom
    off = alignAttr.y + bBox.height - padding;
    if (off > chart.plotHeight) {
        if (verticalAlign === 'top') {
            options.verticalAlign = 'bottom';
            options.inside = true;
        }
        else {
            options.y = chart.plotHeight - off;
        }
        justified = true;
    }
    if (justified) {
        dataLabel.placed = !isNew;
        dataLabel.align(options, null, alignTo);
    }
    return justified;
};
if (seriesTypes.pie) {
    seriesTypes.pie.prototype.dataLabelPositioners = {
        // Based on the value computed in Highcharts' distribute algorithm.
        radialDistributionY: function (point) {
            return point.top + point.distributeBox.pos;
        },
        // get the x - use the natural x position for labels near the
        // top and bottom, to prevent the top and botton slice
        // connectors from touching each other on either side
        // Based on the value computed in Highcharts' distribute algorithm.
        radialDistributionX: function (series, point, y, naturalY) {
            return series.getX(y < point.top + 2 || y > point.bottom - 2 ?
                naturalY :
                y, point.half, point);
        },
        // dataLabels.distance determines the x position of the label
        justify: function (point, radius, seriesCenter) {
            return seriesCenter[0] + (point.half ? -1 : 1) *
                (radius + point.labelDistance);
        },
        // Left edges of the left-half labels touch the left edge of the plot
        // area. Right edges of the right-half labels touch the right edge of
        // the plot area.
        alignToPlotEdges: function (dataLabel, half, plotWidth, plotLeft) {
            var dataLabelWidth = dataLabel.getBBox().width;
            return half ? dataLabelWidth + plotLeft :
                plotWidth - dataLabelWidth - plotLeft;
        },
        // Connectors of each side end in the same x position. Labels are
        // aligned to them. Left edge of the widest left-half label touches the
        // left edge of the plot area. Right edge of the widest right-half label
        // touches the right edge of the plot area.
        alignToConnectors: function (points, half, plotWidth, plotLeft) {
            var maxDataLabelWidth = 0, dataLabelWidth;
            // find widest data label
            points.forEach(function (point) {
                dataLabelWidth = point.dataLabel.getBBox().width;
                if (dataLabelWidth > maxDataLabelWidth) {
                    maxDataLabelWidth = dataLabelWidth;
                }
            });
            return half ? maxDataLabelWidth + plotLeft :
                plotWidth - maxDataLabelWidth - plotLeft;
        }
    };
    /**
     * Override the base drawDataLabels method by pie specific functionality
     *
     * @private
     * @function Highcharts.seriesTypes.pie#drawDataLabels
     * @return {void}
     */
    seriesTypes.pie.prototype.drawDataLabels = function () {
        var series = this, data = series.data, point, chart = series.chart, options = series.options.dataLabels, connectorPadding = options.connectorPadding, connectorWidth, plotWidth = chart.plotWidth, plotHeight = chart.plotHeight, plotLeft = chart.plotLeft, maxWidth = Math.round(chart.chartWidth / 3), connector, seriesCenter = series.center, radius = seriesCenter[2] / 2, centerY = seriesCenter[1], dataLabel, dataLabelWidth, 
        // labelPos,
        labelPosition, labelHeight, 
        // divide the points into right and left halves for anti collision
        halves = [
            [],
            [] // left
        ], x, y, visibility, j, overflow = [0, 0, 0, 0], // top, right, bottom, left
        dataLabelPositioners = series.dataLabelPositioners, pointDataLabelsOptions;
        // get out if not enabled
        if (!series.visible ||
            (!options.enabled &&
                !series._hasPointLabels)) {
            return;
        }
        // Reset all labels that have been shortened
        data.forEach(function (point) {
            if (point.dataLabel && point.visible && point.dataLabel.shortened) {
                point.dataLabel
                    .attr({
                    width: 'auto'
                }).css({
                    width: 'auto',
                    textOverflow: 'clip'
                });
                point.dataLabel.shortened = false;
            }
        });
        // run parent method
        Series.prototype.drawDataLabels.apply(series);
        data.forEach(function (point) {
            if (point.dataLabel) {
                if (point.visible) { // #407, #2510
                    // Arrange points for detection collision
                    halves[point.half].push(point);
                    // Reset positions (#4905)
                    point.dataLabel._pos = null;
                    // Avoid long labels squeezing the pie size too far down
                    if (!defined(options.style.width) &&
                        !defined(point.options.dataLabels &&
                            point.options.dataLabels.style &&
                            point.options.dataLabels.style.width)) {
                        if (point.dataLabel.getBBox().width > maxWidth) {
                            point.dataLabel.css({
                                // Use a fraction of the maxWidth to avoid
                                // wrapping close to the end of the string.
                                width: maxWidth * 0.7
                            });
                            point.dataLabel.shortened = true;
                        }
                    }
                }
                else {
                    point.dataLabel = point.dataLabel.destroy();
                    // Workaround to make pies destroy multiple datalabels
                    // correctly. This logic needs rewriting to support multiple
                    // datalabels fully.
                    if (point.dataLabels && point.dataLabels.length === 1) {
                        delete point.dataLabels;
                    }
                }
            }
        });
        /* Loop over the points in each half, starting from the top and bottom
         * of the pie to detect overlapping labels.
         */
        halves.forEach(function (points, i) {
            var top, bottom, length = points.length, positions = [], naturalY, sideOverflow, size, distributionLength;
            if (!length) {
                return;
            }
            // Sort by angle
            series.sortByAngle(points, i - 0.5);
            // Only do anti-collision when we have dataLabels outside the pie
            // and have connectors. (#856)
            if (series.maxLabelDistance > 0) {
                top = Math.max(0, centerY - radius - series.maxLabelDistance);
                bottom = Math.min(centerY + radius + series.maxLabelDistance, chart.plotHeight);
                points.forEach(function (point) {
                    // check if specific points' label is outside the pie
                    if (point.labelDistance > 0 && point.dataLabel) {
                        // point.top depends on point.labelDistance value
                        // Used for calculation of y value in getX method
                        point.top = Math.max(0, centerY - radius - point.labelDistance);
                        point.bottom = Math.min(centerY + radius + point.labelDistance, chart.plotHeight);
                        size = point.dataLabel.getBBox().height || 21;
                        // point.positionsIndex is needed for getting index of
                        // parameter related to specific point inside positions
                        // array - not every point is in positions array.
                        point.distributeBox = {
                            target: point.labelPosition.natural.y -
                                point.top + size / 2,
                            size: size,
                            rank: point.y
                        };
                        positions.push(point.distributeBox);
                    }
                });
                distributionLength = bottom + size - top;
                H.distribute(positions, distributionLength, distributionLength / 5);
            }
            // Now the used slots are sorted, fill them up sequentially
            for (j = 0; j < length; j++) {
                point = points[j];
                // labelPos = point.labelPos;
                labelPosition = point.labelPosition;
                dataLabel = point.dataLabel;
                visibility = point.visible === false ? 'hidden' : 'inherit';
                naturalY = labelPosition.natural.y;
                y = naturalY;
                if (positions && defined(point.distributeBox)) {
                    if (point.distributeBox.pos === undefined) {
                        visibility = 'hidden';
                    }
                    else {
                        labelHeight = point.distributeBox.size;
                        // Find label's y position
                        y = dataLabelPositioners
                            .radialDistributionY(point);
                    }
                }
                // It is needed to delete point.positionIndex for
                // dynamically added points etc.
                delete point.positionIndex; // @todo unused
                // Find label's x position
                // justify is undocumented in the API - preserve support for it
                if (options.justify) {
                    x = dataLabelPositioners.justify(point, radius, seriesCenter);
                }
                else {
                    switch (options.alignTo) {
                        case 'connectors':
                            x = dataLabelPositioners.alignToConnectors(points, i, plotWidth, plotLeft);
                            break;
                        case 'plotEdges':
                            x = dataLabelPositioners.alignToPlotEdges(dataLabel, i, plotWidth, plotLeft);
                            break;
                        default:
                            x = dataLabelPositioners.radialDistributionX(series, point, y, naturalY);
                    }
                }
                // Record the placement and visibility
                dataLabel._attr = {
                    visibility: visibility,
                    align: labelPosition.alignment
                };
                dataLabel._pos = {
                    x: (x +
                        options.x +
                        ({
                            left: connectorPadding,
                            right: -connectorPadding
                        }[labelPosition.alignment] || 0)),
                    // 10 is for the baseline (label vs text)
                    y: y + options.y - 10
                };
                // labelPos.x = x;
                // labelPos.y = y;
                labelPosition.final.x = x;
                labelPosition.final.y = y;
                // Detect overflowing data labels
                if (pick(options.crop, true)) {
                    dataLabelWidth = dataLabel.getBBox().width;
                    sideOverflow = null;
                    // Overflow left
                    if (x - dataLabelWidth < connectorPadding &&
                        i === 1 // left half
                    ) {
                        sideOverflow = Math.round(dataLabelWidth - x + connectorPadding);
                        overflow[3] = Math.max(sideOverflow, overflow[3]);
                        // Overflow right
                    }
                    else if (x + dataLabelWidth > plotWidth - connectorPadding &&
                        i === 0 // right half
                    ) {
                        sideOverflow = Math.round(x + dataLabelWidth - plotWidth + connectorPadding);
                        overflow[1] = Math.max(sideOverflow, overflow[1]);
                    }
                    // Overflow top
                    if (y - labelHeight / 2 < 0) {
                        overflow[0] = Math.max(Math.round(-y + labelHeight / 2), overflow[0]);
                        // Overflow left
                    }
                    else if (y + labelHeight / 2 > plotHeight) {
                        overflow[2] = Math.max(Math.round(y + labelHeight / 2 - plotHeight), overflow[2]);
                    }
                    dataLabel.sideOverflow = sideOverflow;
                }
            } // for each point
        }); // for each half
        // Do not apply the final placement and draw the connectors until we
        // have verified that labels are not spilling over.
        if (arrayMax(overflow) === 0 ||
            this.verifyDataLabelOverflow(overflow)) {
            // Place the labels in the final position
            this.placeDataLabels();
            this.points.forEach(function (point) {
                // #8864: every connector can have individual options
                pointDataLabelsOptions =
                    merge(options, point.options.dataLabels);
                connectorWidth =
                    pick(pointDataLabelsOptions.connectorWidth, 1);
                // Draw the connector
                if (connectorWidth) {
                    var isNew;
                    connector = point.connector;
                    dataLabel = point.dataLabel;
                    if (dataLabel &&
                        dataLabel._pos &&
                        point.visible &&
                        point.labelDistance > 0) {
                        visibility = dataLabel._attr.visibility;
                        isNew = !connector;
                        if (isNew) {
                            point.connector = connector = chart.renderer
                                .path()
                                .addClass('highcharts-data-label-connector ' +
                                ' highcharts-color-' + point.colorIndex +
                                (point.className ?
                                    ' ' + point.className :
                                    ''))
                                .add(series.dataLabelsGroup);
                            if (!chart.styledMode) {
                                connector.attr({
                                    'stroke-width': connectorWidth,
                                    'stroke': (pointDataLabelsOptions.connectorColor ||
                                        point.color ||
                                        '#666666')
                                });
                            }
                        }
                        connector[isNew ? 'attr' : 'animate']({
                            d: point.getConnectorPath()
                        });
                        connector.attr('visibility', visibility);
                    }
                    else if (connector) {
                        point.connector = connector.destroy();
                    }
                }
            });
        }
    };
    /**
     * Extendable method for getting the path of the connector between the data
     * label and the pie slice.
     *
     * @private
     * @function Highcharts.seriesTypes.pie#connectorPath
     *
     * @param {*} labelPos
     *
     * @return {Highcharts.SVGPathArray}
     */
    // TODO: depracated - remove it
    /*
    seriesTypes.pie.prototype.connectorPath = function (labelPos) {
        var x = labelPos.x,
            y = labelPos.y;
        return pick(this.options.dataLabels.softConnector, true) ? [
            'M',
            // end of the string at the label
            x + (labelPos[6] === 'left' ? 5 : -5), y,
            'C',
            x, y, // first break, next to the label
            2 * labelPos[2] - labelPos[4], 2 * labelPos[3] - labelPos[5],
            labelPos[2], labelPos[3], // second break
            'L',
            labelPos[4], labelPos[5] // base
        ] : [
            'M',
            // end of the string at the label
            x + (labelPos[6] === 'left' ? 5 : -5), y,
            'L',
            labelPos[2], labelPos[3], // second break
            'L',
            labelPos[4], labelPos[5] // base
        ];
    };
    */
    /**
     * Perform the final placement of the data labels after we have verified
     * that they fall within the plot area.
     *
     * @private
     * @function Highcharts.seriesTypes.pie#placeDataLabels
     * @return {void}
     */
    seriesTypes.pie.prototype.placeDataLabels = function () {
        this.points.forEach(function (point) {
            var dataLabel = point.dataLabel, _pos;
            if (dataLabel && point.visible) {
                _pos = dataLabel._pos;
                if (_pos) {
                    // Shorten data labels with ellipsis if they still overflow
                    // after the pie has reached minSize (#223).
                    if (dataLabel.sideOverflow) {
                        dataLabel._attr.width =
                            Math.max(dataLabel.getBBox().width -
                                dataLabel.sideOverflow, 0);
                        dataLabel.css({
                            width: dataLabel._attr.width + 'px',
                            textOverflow: ((this.options.dataLabels.style || {})
                                .textOverflow ||
                                'ellipsis')
                        });
                        dataLabel.shortened = true;
                    }
                    dataLabel.attr(dataLabel._attr);
                    dataLabel[dataLabel.moved ? 'animate' : 'attr'](_pos);
                    dataLabel.moved = true;
                }
                else if (dataLabel) {
                    dataLabel.attr({ y: -9999 });
                }
            }
            // Clear for update
            delete point.distributeBox;
        }, this);
    };
    seriesTypes.pie.prototype.alignDataLabel = noop;
    /**
     * Verify whether the data labels are allowed to draw, or we should run more
     * translation and data label positioning to keep them inside the plot area.
     * Returns true when data labels are ready to draw.
     *
     * @private
     * @function Highcharts.seriesTypes.pie#verifyDataLabelOverflow
     * @param {Array<number>} overflow
     * @return {boolean}
     */
    seriesTypes.pie.prototype.verifyDataLabelOverflow = function (overflow) {
        var center = this.center, options = this.options, centerOption = options.center, minSize = options.minSize || 80, newSize = minSize, 
        // If a size is set, return true and don't try to shrink the pie
        // to fit the labels.
        ret = options.size !== null;
        if (!ret) {
            // Handle horizontal size and center
            if (centerOption[0] !== null) { // Fixed center
                newSize = Math.max(center[2] -
                    Math.max(overflow[1], overflow[3]), minSize);
            }
            else { // Auto center
                newSize = Math.max(
                // horizontal overflow
                center[2] - overflow[1] - overflow[3], minSize);
                // horizontal center
                center[0] += (overflow[3] - overflow[1]) / 2;
            }
            // Handle vertical size and center
            if (centerOption[1] !== null) { // Fixed center
                newSize = Math.max(Math.min(newSize, center[2] -
                    Math.max(overflow[0], overflow[2])), minSize);
            }
            else { // Auto center
                newSize = Math.max(Math.min(newSize, 
                // vertical overflow
                center[2] - overflow[0] - overflow[2]), minSize);
                // vertical center
                center[1] += (overflow[0] - overflow[2]) / 2;
            }
            // If the size must be decreased, we need to run translate and
            // drawDataLabels again
            if (newSize < center[2]) {
                center[2] = newSize;
                center[3] = Math.min(// #3632
                relativeLength(options.innerSize || 0, newSize), newSize);
                this.translate(center);
                if (this.drawDataLabels) {
                    this.drawDataLabels();
                }
                // Else, return true to indicate that the pie and its labels is
                // within the plot area
            }
            else {
                ret = true;
            }
        }
        return ret;
    };
}
if (seriesTypes.column) {
    /**
     * Override the basic data label alignment by adjusting for the position of
     * the column.
     *
     * @private
     * @function Highcharts.seriesTypes.column#alignDataLabel
     * @param {Highcharts.Point} point
     * @param {Highcharts.SVGElement} dataLabel
     * @param {Highcharts.DataLabelsOptionsObject} options
     * @param {Highcharts.BBoxObject} alignTo
     * @param {boolean} [isNew]
     * @return {void}
     */
    seriesTypes.column.prototype.alignDataLabel = function (point, dataLabel, options, alignTo, isNew) {
        var inverted = this.chart.inverted, series = point.series, 
        // data label box for alignment
        dlBox = point.dlBox || point.shapeArgs, below = pick(point.below, // range series
        point.plotY >
            pick(this.translatedThreshold, series.yAxis.len)), 
        // draw it inside the box?
        inside = pick(options.inside, !!this.options.stacking), overshoot;
        // Align to the column itself, or the top of it
        if (dlBox) { // Area range uses this method but not alignTo
            alignTo = merge(dlBox);
            if (alignTo.y < 0) {
                alignTo.height += alignTo.y;
                alignTo.y = 0;
            }
            overshoot = alignTo.y + alignTo.height - series.yAxis.len;
            if (overshoot > 0) {
                alignTo.height -= overshoot;
            }
            if (inverted) {
                alignTo = {
                    x: series.yAxis.len - alignTo.y - alignTo.height,
                    y: series.xAxis.len - alignTo.x - alignTo.width,
                    width: alignTo.height,
                    height: alignTo.width
                };
            }
            // Compute the alignment box
            if (!inside) {
                if (inverted) {
                    alignTo.x += below ? 0 : alignTo.width;
                    alignTo.width = 0;
                }
                else {
                    alignTo.y += below ? alignTo.height : 0;
                    alignTo.height = 0;
                }
            }
        }
        // When alignment is undefined (typically columns and bars), display the
        // individual point below or above the point depending on the threshold
        options.align = pick(options.align, !inverted || inside ? 'center' : below ? 'right' : 'left');
        options.verticalAlign = pick(options.verticalAlign, inverted || inside ? 'middle' : below ? 'top' : 'bottom');
        // Call the parent method
        Series.prototype.alignDataLabel.call(this, point, dataLabel, options, alignTo, isNew);
        // If label was justified and we have contrast, set it:
        if (options.inside && point.contrastColor) {
            dataLabel.css({
                color: point.contrastColor
            });
        }
    };
}
