aw-highstock_rails 7.0.3

data/vendor/assets/javascripts/highstock/es-modules/parts-more/Pane.js

@@ -0,0 +1,399 @@
+/* *
+ * (c) 2010-2019 Torstein Honsi
+ *
+ * License: www.highcharts.com/license
+ */
+
+'use strict';
+
+import H from '../parts/Globals.js';
+import '../mixins/centered-series.js';
+import '../parts/Utilities.js';
+
+var CenteredSeriesMixin = H.CenteredSeriesMixin,
+    extend = H.extend,
+    merge = H.merge,
+    splat = H.splat;
+
+/**
+ * The Pane object allows options that are common to a set of X and Y axes.
+ *
+ * In the future, this can be extended to basic Highcharts and Highstock.
+ *
+ * @private
+ * @class
+ * @name Highcharts.Pane
+ *
+ * @param {Highcharts.PaneOptions} options
+ *
+ * @param {Highcharts.Chart} chart
+ */
+function Pane(options, chart) {
+    this.init(options, chart);
+}
+
+// Extend the Pane prototype
+extend(Pane.prototype, {
+
+    coll: 'pane', // Member of chart.pane
+
+    /**
+     * Initialize the Pane object
+     *
+     * @private
+     * @function Highcharts.Pane#init
+     *
+     * @param {Highcharts.PaneOptions} options
+     *
+     * @param {Highcharts.Chart} chart
+     */
+    init: function (options, chart) {
+        this.chart = chart;
+        this.background = [];
+
+        chart.pane.push(this);
+
+        this.setOptions(options);
+    },
+
+    /**
+     * @private
+     * @function Highcharts.Pane#setOptions
+     *
+     * @param {Highcharts.PaneOptions} options
+     */
+    setOptions: function (options) {
+
+        // Set options. Angular charts have a default background (#3318)
+        this.options = options = merge(
+            this.defaultOptions,
+            this.chart.angular ? { background: {} } : undefined,
+            options
+        );
+    },
+
+    /**
+     * Render the pane with its backgrounds.
+     *
+     * @private
+     * @function Highcharts.Pane#render
+     */
+    render: function () {
+
+        var options = this.options,
+            backgroundOption = this.options.background,
+            renderer = this.chart.renderer,
+            len,
+            i;
+
+        if (!this.group) {
+            this.group = renderer.g('pane-group')
+                .attr({ zIndex: options.zIndex || 0 })
+                .add();
+        }
+
+        this.updateCenter();
+
+        // Render the backgrounds
+        if (backgroundOption) {
+            backgroundOption = splat(backgroundOption);
+
+            len = Math.max(
+                backgroundOption.length,
+                this.background.length || 0
+            );
+
+            for (i = 0; i < len; i++) {
+                // #6641 - if axis exists, chart is circular and apply
+                // background
+                if (backgroundOption[i] && this.axis) {
+                    this.renderBackground(
+                        merge(
+                            this.defaultBackgroundOptions,
+                            backgroundOption[i]
+                        ),
+                        i
+                    );
+                } else if (this.background[i]) {
+                    this.background[i] = this.background[i].destroy();
+                    this.background.splice(i, 1);
+                }
+            }
+        }
+    },
+
+    /**
+     * Render an individual pane background.
+     *
+     * @private
+     * @function Highcharts.Pane#renderBackground
+     *
+     * @param {Highcharts.PaneBackgroundOptions} backgroundOptions
+     *        Background options
+     *
+     * @param {number} i
+     *        The index of the background in this.backgrounds
+     */
+    renderBackground: function (backgroundOptions, i) {
+        var method = 'animate',
+            attribs = {
+                'class':
+                    'highcharts-pane ' + (backgroundOptions.className || '')
+            };
+
+        if (!this.chart.styledMode) {
+            extend(attribs, {
+                'fill': backgroundOptions.backgroundColor,
+                'stroke': backgroundOptions.borderColor,
+                'stroke-width': backgroundOptions.borderWidth
+            });
+        }
+
+        if (!this.background[i]) {
+            this.background[i] = this.chart.renderer.path()
+                .add(this.group);
+            method = 'attr';
+        }
+
+        this.background[i][method]({
+            'd': this.axis.getPlotBandPath(
+                backgroundOptions.from,
+                backgroundOptions.to,
+                backgroundOptions
+            )
+        }).attr(attribs);
+
+    },
+
+    /**
+     * The pane serves as a container for axes and backgrounds for circular
+     * gauges and polar charts.
+     *
+     * @since        2.3.0
+     * @product      highcharts
+     * @optionparent pane
+     */
+    defaultOptions: {
+
+        /**
+         * The end angle of the polar X axis or gauge value axis, given in
+         * degrees where 0 is north. Defaults to [startAngle](#pane.startAngle)
+         * + 360.
+         *
+         * @sample {highcharts} highcharts/demo/gauge-vu-meter/
+         *         VU-meter with custom start and end angle
+         *
+         * @type      {number}
+         * @since     2.3.0
+         * @product   highcharts
+         * @apioption pane.endAngle
+         */
+
+        /**
+         * The center of a polar chart or angular gauge, given as an array
+         * of [x, y] positions. Positions can be given as integers that
+         * transform to pixels, or as percentages of the plot area size.
+         *
+         * @sample {highcharts} highcharts/demo/gauge-vu-meter/
+         *         Two gauges with different center
+         *
+         * @type    {Array<string|number>}
+         * @default ["50%", "50%"]
+         * @since   2.3.0
+         * @product highcharts
+         */
+        center: ['50%', '50%'],
+
+        /**
+         * The size of the pane, either as a number defining pixels, or a
+         * percentage defining a percentage of the plot are.
+         *
+         * @sample {highcharts} highcharts/demo/gauge-vu-meter/
+         *         Smaller size
+         *
+         * @type    {number|string}
+         * @product highcharts
+         */
+        size: '85%',
+
+        /**
+         * The start angle of the polar X axis or gauge axis, given in degrees
+         * where 0 is north. Defaults to 0.
+         *
+         * @sample {highcharts} highcharts/demo/gauge-vu-meter/
+         *         VU-meter with custom start and end angle
+         *
+         * @since   2.3.0
+         * @product highcharts
+         */
+        startAngle: 0
+    },
+
+    /**
+     * An array of background items for the pane.
+     *
+     * @sample {highcharts} highcharts/demo/gauge-speedometer/
+     *         Speedometer gauge with multiple backgrounds
+     *
+     * @type         {Array<*>}
+     * @optionparent pane.background
+     */
+    defaultBackgroundOptions: {
+
+        /**
+         * The class name for this background.
+         *
+         * @sample {highcharts} highcharts/css/pane/
+         *         Panes styled by CSS
+         * @sample {highstock} highcharts/css/pane/
+         *         Panes styled by CSS
+         * @sample {highmaps} highcharts/css/pane/
+         *         Panes styled by CSS
+         *
+         * @type      {string}
+         * @default   highcharts-pane
+         * @since     5.0.0
+         * @apioption pane.background.className
+         */
+
+        /**
+         * The shape of the pane background. When `solid`, the background
+         * is circular. When `arc`, the background extends only from the min
+         * to the max of the value axis.
+         *
+         * @type       {string}
+         * @since      2.3.0
+         * @validvalue ["arc", "circle", "solid"]
+         * @product    highcharts
+         */
+        shape: 'circle',
+
+        /**
+         * The pixel border width of the pane background.
+         *
+         * @since 2.3.0
+         * @product highcharts
+         */
+        borderWidth: 1,
+
+        /**
+         * The pane background border color.
+         *
+         * @type    {Highcharts.ColorString}
+         * @since   2.3.0
+         * @product highcharts
+         */
+        borderColor: '#cccccc',
+
+        /**
+         * The background color or gradient for the pane.
+         *
+         * @type    {Highcharts.GradientColorObject}
+         * @default { linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 }, stops: [[0, #ffffff], [1, #e6e6e6]] }
+         * @since   2.3.0
+         * @product highcharts
+         */
+        backgroundColor: {
+
+            /**
+             * @ignore
+             */
+            linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
+
+            /**
+             * @ignore
+             */
+            stops: [
+                [0, '#ffffff'],
+                [1, '#e6e6e6']
+            ]
+
+        },
+
+        /** @ignore-option */
+        from: -Number.MAX_VALUE, // corrected to axis min
+
+        /**
+         * The inner radius of the pane background. Can be either numeric
+         * (pixels) or a percentage string.
+         *
+         * @type    {number|string}
+         * @since   2.3.0
+         * @product highcharts
+         */
+        innerRadius: 0,
+
+        /**
+         * @ignore-option
+         */
+        to: Number.MAX_VALUE, // corrected to axis max
+
+        /**
+         * The outer radius of the circular pane background. Can be either
+         * numeric (pixels) or a percentage string.
+         *
+         * @type     {number|string}
+         * @since    2.3.0
+         * @product  highcharts
+         */
+        outerRadius: '105%'
+
+    },
+
+    /**
+     * Gets the center for the pane and its axis.
+     *
+     * @private
+     * @function Highcharts.Pane#updateCenter
+     *
+     * @param {Highcharts.RadialAxis} axis
+     */
+    updateCenter: function (axis) {
+        this.center = (axis || this.axis || {}).center =
+            CenteredSeriesMixin.getCenter.call(this);
+    },
+
+    /**
+     * Destroy the pane item
+     *
+     * @ignore
+     * @private
+     * @function Highcharts.Pane#destroy
+     * /
+    destroy: function () {
+        H.erase(this.chart.pane, this);
+        this.background.forEach(function (background) {
+            background.destroy();
+        });
+        this.background.length = 0;
+        this.group = this.group.destroy();
+    },
+    */
+
+    /**
+     * Update the pane item with new options
+     *
+     * @private
+     * @function Highcharts.Pane#update
+     *
+     * @param {Highcharts.PaneOptions} options
+     *        New pane options
+     *
+     * @param {boolean} redraw
+     */
+    update: function (options, redraw) {
+
+        merge(true, this.options, options);
+        this.setOptions(this.options);
+        this.render();
+        this.chart.axes.forEach(function (axis) {
+            if (axis.pane === this) {
+                axis.pane = null;
+                axis.update({}, redraw);
+            }
+        }, this);
+    }
+
+});
+
+H.Pane = Pane;

data/vendor/assets/javascripts/highstock/es-modules/parts-more/Polar.js

@@ -0,0 +1,634 @@
+/* *
+ * (c) 2010-2019 Torstein Honsi
+ *
+ * License: www.highcharts.com/license
+ */
+
+'use strict';
+
+import H from '../parts/Globals.js';
+import '../parts/Utilities.js';
+import '../parts/Pointer.js';
+import '../parts/Series.js';
+import '../parts/Pointer.js';
+
+// Extensions for polar charts. Additionally, much of the geometry required for
+// polar charts is gathered in RadialAxes.js.
+
+var pick = H.pick,
+    Pointer = H.Pointer,
+    Series = H.Series,
+    seriesTypes = H.seriesTypes,
+    wrap = H.wrap,
+
+    seriesProto = Series.prototype,
+    pointerProto = Pointer.prototype,
+    colProto;
+
+if (!H.polarExtended) {
+    H.polarExtended = true;
+
+
+    /**
+     * Search a k-d tree by the point angle, used for shared tooltips in polar
+     * charts
+     */
+    seriesProto.searchPointByAngle = function (e) {
+        var series = this,
+            chart = series.chart,
+            xAxis = series.xAxis,
+            center = xAxis.pane.center,
+            plotX = e.chartX - center[0] - chart.plotLeft,
+            plotY = e.chartY - center[1] - chart.plotTop;
+
+        return this.searchKDTree({
+            clientX: 180 + (Math.atan2(plotX, plotY) * (-180 / Math.PI))
+        });
+
+    };
+
+    /**
+     * #6212 Calculate connectors for spline series in polar chart.
+     * @param {boolean} calculateNeighbours
+     *        Check if connectors should be calculated for neighbour points as
+     *        well allows short recurence
+     */
+    seriesProto.getConnectors = function (
+        segment,
+        index,
+        calculateNeighbours,
+        connectEnds
+    ) {
+
+        var i,
+            prevPointInd,
+            nextPointInd,
+            previousPoint,
+            nextPoint,
+            previousX,
+            previousY,
+            nextX,
+            nextY,
+            plotX,
+            plotY,
+            ret,
+            // 1 means control points midway between points, 2 means 1/3 from
+            // the point, 3 is 1/4 etc;
+            smoothing = 1.5,
+            denom = smoothing + 1,
+            leftContX,
+            leftContY,
+            rightContX,
+            rightContY,
+            dLControlPoint, // distance left control point
+            dRControlPoint,
+            leftContAngle,
+            rightContAngle,
+            jointAngle,
+            addedNumber = connectEnds ? 1 : 0;
+
+        // Calculate final index of points depending on the initial index value.
+        // Because of calculating neighbours, index may be outisde segment
+        // array.
+        if (index >= 0 && index <= segment.length - 1) {
+            i = index;
+        } else if (index < 0) {
+            i = segment.length - 1 + index;
+        } else {
+            i = 0;
+        }
+
+        prevPointInd = (i - 1 < 0) ? segment.length - (1 + addedNumber) : i - 1;
+        nextPointInd = (i + 1 > segment.length - 1) ? addedNumber : i + 1;
+        previousPoint = segment[prevPointInd];
+        nextPoint = segment[nextPointInd];
+        previousX = previousPoint.plotX;
+        previousY = previousPoint.plotY;
+        nextX = nextPoint.plotX;
+        nextY = nextPoint.plotY;
+        plotX = segment[i].plotX; // actual point
+        plotY = segment[i].plotY;
+        leftContX = (smoothing * plotX + previousX) / denom;
+        leftContY = (smoothing * plotY + previousY) / denom;
+        rightContX = (smoothing * plotX + nextX) / denom;
+        rightContY = (smoothing * plotY + nextY) / denom;
+        dLControlPoint = Math.sqrt(
+            Math.pow(leftContX - plotX, 2) + Math.pow(leftContY - plotY, 2)
+        );
+        dRControlPoint = Math.sqrt(
+            Math.pow(rightContX - plotX, 2) + Math.pow(rightContY - plotY, 2)
+        );
+        leftContAngle = Math.atan2(leftContY - plotY, leftContX - plotX);
+        rightContAngle = Math.atan2(rightContY - plotY, rightContX - plotX);
+        jointAngle = (Math.PI / 2) + ((leftContAngle + rightContAngle) / 2);
+        // Ensure the right direction, jointAngle should be in the same quadrant
+        // as leftContAngle
+        if (Math.abs(leftContAngle - jointAngle) > Math.PI / 2) {
+            jointAngle -= Math.PI;
+        }
+        // Find the corrected control points for a spline straight through the
+        // point
+        leftContX = plotX + Math.cos(jointAngle) * dLControlPoint;
+        leftContY = plotY + Math.sin(jointAngle) * dLControlPoint;
+        rightContX = plotX + Math.cos(Math.PI + jointAngle) * dRControlPoint;
+        rightContY = plotY + Math.sin(Math.PI + jointAngle) * dRControlPoint;
+
+        // push current point's connectors into returned object
+
+        ret = {
+            rightContX: rightContX,
+            rightContY: rightContY,
+            leftContX: leftContX,
+            leftContY: leftContY,
+            plotX: plotX,
+            plotY: plotY
+        };
+
+        // calculate connectors for previous and next point and push them inside
+        // returned object
+        if (calculateNeighbours) {
+            ret.prevPointCont = this.getConnectors(
+                segment,
+                prevPointInd,
+                false,
+                connectEnds
+            );
+        }
+        return ret;
+    };
+
+    /**
+     * Translate a point's plotX and plotY from the internal angle and radius
+     * measures to true plotX, plotY coordinates
+     */
+    seriesProto.toXY = function (point) {
+        var xy,
+            chart = this.chart,
+            plotX = point.plotX,
+            plotY = point.plotY,
+            clientX;
+
+        // Save rectangular plotX, plotY for later computation
+        point.rectPlotX = plotX;
+        point.rectPlotY = plotY;
+
+        // Find the polar plotX and plotY
+        xy = this.xAxis.postTranslate(point.plotX, this.yAxis.len - plotY);
+        point.plotX = point.polarPlotX = xy.x - chart.plotLeft;
+        point.plotY = point.polarPlotY = xy.y - chart.plotTop;
+
+        // If shared tooltip, record the angle in degrees in order to align X
+        // points. Otherwise, use a standard k-d tree to get the nearest point
+        // in two dimensions.
+        if (this.kdByAngle) {
+            clientX = (
+                (plotX / Math.PI * 180) + this.xAxis.pane.options.startAngle
+            ) % 360;
+            if (clientX < 0) { // #2665
+                clientX += 360;
+            }
+            point.clientX = clientX;
+        } else {
+            point.clientX = point.plotX;
+        }
+    };
+
+    if (seriesTypes.spline) {
+        /**
+         * Overridden method for calculating a spline from one point to the next
+         */
+        wrap(
+            seriesTypes.spline.prototype,
+            'getPointSpline',
+            function (proceed, segment, point, i) {
+                var ret,
+                    connectors;
+
+                if (this.chart.polar) {
+                    // moveTo or lineTo
+                    if (!i) {
+                        ret = ['M', point.plotX, point.plotY];
+                    } else { // curve from last point to this
+                        connectors = this.getConnectors(
+                            segment,
+                            i,
+                            true,
+                            this.connectEnds
+                        );
+                        ret = [
+                            'C',
+                            connectors.prevPointCont.rightContX,
+                            connectors.prevPointCont.rightContY,
+                            connectors.leftContX,
+                            connectors.leftContY,
+                            connectors.plotX,
+                            connectors.plotY
+                        ];
+                    }
+                } else {
+                    ret = proceed.call(this, segment, point, i);
+                }
+                return ret;
+            }
+        );
+
+        // #6430 Areasplinerange series use unwrapped getPointSpline method, so
+        // we need to set this method again.
+        if (seriesTypes.areasplinerange) {
+            seriesTypes.areasplinerange.prototype.getPointSpline =
+                seriesTypes.spline.prototype.getPointSpline;
+        }
+    }
+
+    /**
+     * Extend translate. The plotX and plotY values are computed as if the polar
+     * chart were a cartesian plane, where plotX denotes the angle in radians
+     * and (yAxis.len - plotY) is the pixel distance from center.
+     */
+    H.addEvent(Series, 'afterTranslate', function () {
+        var chart = this.chart,
+            points,
+            i;
+
+        if (chart.polar) {
+
+            // Prepare k-d-tree handling. It searches by angle (clientX) in
+            // case of shared tooltip, and by two dimensional distance in case
+            // of non-shared.
+            this.kdByAngle = chart.tooltip && chart.tooltip.shared;
+            if (this.kdByAngle) {
+                this.searchPoint = this.searchPointByAngle;
+            } else {
+                this.options.findNearestPointBy = 'xy';
+            }
+
+            // Postprocess plot coordinates
+            if (!this.preventPostTranslate) {
+                points = this.points;
+                i = points.length;
+
+                while (i--) {
+                    // Translate plotX, plotY from angle and radius to true plot
+                    // coordinates
+                    this.toXY(points[i]);
+                }
+            }
+
+            // Perform clip after render
+            if (!this.hasClipCircleSetter) {
+                this.hasClipCircleSetter = Boolean(
+                    H.addEvent(this, 'afterRender', function () {
+                        var circ;
+
+                        if (chart.polar) {
+                            circ = this.yAxis.center;
+                            this.group.clip(
+                                chart.renderer.clipCircle(
+                                    circ[0],
+                                    circ[1],
+                                    circ[2] / 2
+                                )
+                            );
+                            this.setClip = H.noop;
+                        }
+                    })
+                );
+            }
+        }
+    }, { order: 2 }); // Run after translation of ||-coords
+
+    /**
+     * Extend getSegmentPath to allow connecting ends across 0 to provide a
+     * closed circle in line-like series.
+     */
+    wrap(seriesProto, 'getGraphPath', function (proceed, points) {
+        var series = this,
+            i,
+            firstValid,
+            popLastPoint;
+
+        // Connect the path
+        if (this.chart.polar) {
+            points = points || this.points;
+
+            // Append first valid point in order to connect the ends
+            for (i = 0; i < points.length; i++) {
+                if (!points[i].isNull) {
+                    firstValid = i;
+                    break;
+                }
+            }
+
+
+            /**
+             * Polar charts only. Whether to connect the ends of a line series
+             * plot across the extremes.
+             *
+             * @sample {highcharts} highcharts/plotoptions/line-connectends-false/
+             *         Do not connect
+             *
+             * @type      {boolean}
+             * @since     2.3.0
+             * @product   highcharts
+             * @apioption plotOptions.series.connectEnds
+             */
+            if (this.options.connectEnds !== false &&
+                firstValid !== undefined
+            ) {
+                this.connectEnds = true; // re-used in splines
+                points.splice(points.length, 0, points[firstValid]);
+                popLastPoint = true;
+            }
+
+            // For area charts, pseudo points are added to the graph, now we
+            // need to translate these
+            points.forEach(function (point) {
+                if (point.polarPlotY === undefined) {
+                    series.toXY(point);
+                }
+            });
+        }
+
+        // Run uber method
+        var ret = proceed.apply(this, [].slice.call(arguments, 1));
+
+        // #6212 points.splice method is adding points to an array. In case of
+        // areaspline getGraphPath method is used two times and in both times
+        // points are added to an array. That is why points.pop is used, to get
+        // unmodified points.
+        if (popLastPoint) {
+            points.pop();
+        }
+        return ret;
+    });
+
+
+    var polarAnimate = function (proceed, init) {
+        var chart = this.chart,
+            animation = this.options.animation,
+            group = this.group,
+            markerGroup = this.markerGroup,
+            center = this.xAxis.center,
+            plotLeft = chart.plotLeft,
+            plotTop = chart.plotTop,
+            attribs;
+
+        // Specific animation for polar charts
+        if (chart.polar) {
+
+            // Enable animation on polar charts only in SVG. In VML, the scaling
+            // is different, plus animation would be so slow it would't matter.
+            if (chart.renderer.isSVG) {
+
+                if (animation === true) {
+                    animation = {};
+                }
+
+                // Initialize the animation
+                if (init) {
+
+                    // Scale down the group and place it in the center
+                    attribs = {
+                        translateX: center[0] + plotLeft,
+                        translateY: center[1] + plotTop,
+                        scaleX: 0.001, // #1499
+                        scaleY: 0.001
+                    };
+
+                    group.attr(attribs);
+                    if (markerGroup) {
+                        markerGroup.attr(attribs);
+                    }
+
+                // Run the animation
+                } else {
+                    attribs = {
+                        translateX: plotLeft,
+                        translateY: plotTop,
+                        scaleX: 1,
+                        scaleY: 1
+                    };
+                    group.animate(attribs, animation);
+                    if (markerGroup) {
+                        markerGroup.animate(attribs, animation);
+                    }
+
+                    // Delete this function to allow it only once
+                    this.animate = null;
+                }
+            }
+
+        // For non-polar charts, revert to the basic animation
+        } else {
+            proceed.call(this, init);
+        }
+    };
+
+    // Define the animate method for regular series
+    wrap(seriesProto, 'animate', polarAnimate);
+
+
+    if (seriesTypes.column) {
+
+        colProto = seriesTypes.column.prototype;
+
+        colProto.polarArc = function (low, high, start, end) {
+            var center = this.xAxis.center,
+                len = this.yAxis.len;
+
+            return this.chart.renderer.symbols.arc(
+                center[0],
+                center[1],
+                len - high,
+                null,
+                {
+                    start: start,
+                    end: end,
+                    innerR: len - pick(low, len)
+                }
+            );
+        };
+
+        /**
+        * Define the animate method for columnseries
+        */
+        wrap(colProto, 'animate', polarAnimate);
+
+
+        /**
+         * Extend the column prototype's translate method
+         */
+        wrap(colProto, 'translate', function (proceed) {
+
+            var xAxis = this.xAxis,
+                startAngleRad = xAxis.startAngleRad,
+                start,
+                points,
+                point,
+                i;
+
+            this.preventPostTranslate = true;
+
+            // Run uber method
+            proceed.call(this);
+
+            // Postprocess plot coordinates
+            if (xAxis.isRadial) {
+                points = this.points;
+                i = points.length;
+                while (i--) {
+                    point = points[i];
+                    start = point.barX + startAngleRad;
+                    point.shapeType = 'path';
+                    point.shapeArgs = {
+                        d: this.polarArc(
+                            point.yBottom,
+                            point.plotY,
+                            start,
+                            start + point.pointWidth
+                        )
+                    };
+                    // Provide correct plotX, plotY for tooltip
+                    this.toXY(point);
+                    point.tooltipPos = [point.plotX, point.plotY];
+                    point.ttBelow = point.plotY > xAxis.center[1];
+                }
+            }
+        });
+
+
+        /**
+         * Align column data labels outside the columns. #1199.
+         */
+        wrap(colProto, 'alignDataLabel', function (
+            proceed,
+            point,
+            dataLabel,
+            options,
+            alignTo,
+            isNew
+        ) {
+
+            if (this.chart.polar) {
+                var angle = point.rectPlotX / Math.PI * 180,
+                    align,
+                    verticalAlign;
+
+                // Align nicely outside the perimeter of the columns
+                if (options.align === null) {
+                    if (angle > 20 && angle < 160) {
+                        align = 'left'; // right hemisphere
+                    } else if (angle > 200 && angle < 340) {
+                        align = 'right'; // left hemisphere
+                    } else {
+                        align = 'center'; // top or bottom
+                    }
+                    options.align = align;
+                }
+                if (options.verticalAlign === null) {
+                    if (angle < 45 || angle > 315) {
+                        verticalAlign = 'bottom'; // top part
+                    } else if (angle > 135 && angle < 225) {
+                        verticalAlign = 'top'; // bottom part
+                    } else {
+                        verticalAlign = 'middle'; // left or right
+                    }
+                    options.verticalAlign = verticalAlign;
+                }
+
+                seriesProto.alignDataLabel.call(
+                    this,
+                    point,
+                    dataLabel,
+                    options,
+                    alignTo,
+                    isNew
+                );
+            } else {
+                proceed.call(this, point, dataLabel, options, alignTo, isNew);
+            }
+
+        });
+    }
+
+    /**
+     * Extend getCoordinates to prepare for polar axis values
+     */
+    wrap(pointerProto, 'getCoordinates', function (proceed, e) {
+        var chart = this.chart,
+            ret = {
+                xAxis: [],
+                yAxis: []
+            };
+
+        if (chart.polar) {
+
+            chart.axes.forEach(function (axis) {
+                var isXAxis = axis.isXAxis,
+                    center = axis.center,
+                    x = e.chartX - center[0] - chart.plotLeft,
+                    y = e.chartY - center[1] - chart.plotTop;
+
+                ret[isXAxis ? 'xAxis' : 'yAxis'].push({
+                    axis: axis,
+                    value: axis.translate(
+                        isXAxis ?
+                            Math.PI - Math.atan2(x, y) : // angle
+                            // distance from center
+                            Math.sqrt(Math.pow(x, 2) + Math.pow(y, 2)),
+                        true
+                    )
+                });
+            });
+
+        } else {
+            ret = proceed.call(this, e);
+        }
+
+        return ret;
+    });
+
+    H.SVGRenderer.prototype.clipCircle = function (x, y, r) {
+        var wrapper,
+            id = H.uniqueKey(),
+
+            clipPath = this.createElement('clipPath').attr({
+                id: id
+            }).add(this.defs);
+
+        wrapper = this.circle(x, y, r).add(clipPath);
+        wrapper.id = id;
+        wrapper.clipPath = clipPath;
+
+        return wrapper;
+    };
+
+    H.addEvent(H.Chart, 'getAxes', function () {
+
+        if (!this.pane) {
+            this.pane = [];
+        }
+        H.splat(this.options.pane).forEach(function (paneOptions) {
+            new H.Pane( // eslint-disable-line no-new
+                paneOptions,
+                this
+            );
+        }, this);
+    });
+
+    H.addEvent(H.Chart, 'afterDrawChartBox', function () {
+        this.pane.forEach(function (pane) {
+            pane.render();
+        });
+    });
+
+    /**
+     * Extend chart.get to also search in panes. Used internally in
+     * responsiveness and chart.update.
+     */
+    wrap(H.Chart.prototype, 'get', function (proceed, id) {
+        return H.find(this.pane, function (pane) {
+            return pane.options.id === id;
+        }) || proceed.call(this, id);
+    });
+}