highcharts-rails 4.2.5 → 4.2.6

data/app/assets/javascripts/highcharts/highcharts-3d.js

@@ -2,7 +2,7 @@
 // @compilation_level SIMPLE_OPTIMIZATIONS
 
 /**
- * @license Highcharts JS v4.2.5 (2016-05-06)
+ * @license Highcharts JS v4.2.6 (2016-08-02)
  *
  * 3D features for Highcharts JS
  *
@@ -35,6 +35,41 @@
         cos = Math.cos,
         round = Math.round;
 
+    /**
+     * Apply 3-D rotation
+     * Euler Angles (XYZ): cosA = cos(Alfa|Roll), cosB = cos(Beta|Pitch), cosG = cos(Gamma|Yaw) 
+     * 
+     * Composite rotation:
+     * |          cosB * cosG             |           cosB * sinG            |    -sinB    |
+     * | sinA * sinB * cosG - cosA * sinG | sinA * sinB * sinG + cosA * cosG | sinA * cosB |
+     * | cosA * sinB * cosG + sinA * sinG | cosA * sinB * sinG - sinA * cosG | cosA * cosB |
+     * 
+     * Now, Gamma/Yaw is not used (angle=0), so we assume cosG = 1 and sinG = 0, so we get:
+     * |     cosB    |   0    |   - sinB    |
+     * | sinA * sinB |  cosA  | sinA * cosB |
+     * | cosA * sinB | - sinA | cosA * cosB |
+     * 
+     * But in browsers, y is reversed, so we get sinA => -sinA. The general result is:
+     * |      cosB     |   0    |    - sinB     |     | x |     | px |
+     * | - sinA * sinB |  cosA  | - sinA * cosB |  x  | y |  =  | py | 
+     * |  cosA * sinB  |  sinA  |  cosA * cosB  |     | z |     | pz |
+     */
+    function rotate3D(x, y, z, angles) {
+        return {
+            x: angles.cosB * x - angles.sinB * z,
+            y: -angles.sinA * angles.sinB * x + angles.cosA * y - angles.cosB * angles.sinA * z,
+            z: angles.cosA * angles.sinB * x + angles.sinA * y + angles.cosA * angles.cosB * z
+        };
+    }
+
+    function perspective3D(coordinate, origin, distance) {
+        var projection = ((distance > 0) && (distance < Number.POSITIVE_INFINITY)) ? distance / (coordinate.z + origin.z + distance) : 1;
+        return {
+            x: coordinate.x * projection,
+            y: coordinate.y * projection
+        };
+    }
+
     /**
      * Transforms a given array of points according to the angles in chart.options.
      * Parameters:
@@ -44,97 +79,52 @@
      * Returns:
      *        - an array of transformed points
      */
-    function perspective(points, chart, insidePlotArea) {
+    var perspective = Highcharts.perspective = function (points, chart, insidePlotArea) {
         var options3d = chart.options.chart.options3d,
-            inverted = false,
-            origin,
-            scale = chart.scale3d || 1;
-
-        if (insidePlotArea) {
-            inverted = chart.inverted;
+            inverted = insidePlotArea ? chart.inverted : false,
             origin = {
                 x: chart.plotWidth / 2,
                 y: chart.plotHeight / 2,
                 z: options3d.depth / 2,
                 vd: pick(options3d.depth, 1) * pick(options3d.viewDistance, 0)
+            },
+            scale = chart.scale3d || 1,
+            beta = deg2rad * options3d.beta * (inverted ? -1 : 1),
+            alpha = deg2rad * options3d.alpha * (inverted ? -1 : 1),
+            angles = {
+                cosA: cos(alpha),
+                cosB: cos(-beta),
+                sinA: sin(alpha),
+                sinB: sin(-beta)
             };
-        } else {
-            origin = {
-                x: chart.plotLeft + (chart.plotWidth / 2),
-                y: chart.plotTop + (chart.plotHeight / 2),
-                z: options3d.depth / 2,
-                vd: pick(options3d.depth, 1) * pick(options3d.viewDistance, 0)
-            };
-        }
-
-        var result = [],
-            xe = origin.x,
-            ye = origin.y,
-            ze = origin.z,
-            vd = origin.vd,
-            angle1 = deg2rad * (inverted ?  options3d.beta  : -options3d.beta),
-            angle2 = deg2rad * (inverted ? -options3d.alpha :  options3d.alpha),
-            s1 = sin(angle1),
-            c1 = cos(angle1),
-            s2 = sin(angle2),
-            c2 = cos(angle2);
 
-        var x, y, z, px, py, pz;
+        if (!insidePlotArea) {
+            origin.x += chart.plotLeft;
+            origin.y += chart.plotTop;
+        }
 
         // Transform each point
-        each(points, function (point) {
-            x = (inverted ? point.y : point.x) - xe;
-            y = (inverted ? point.x : point.y) - ye;
-            z = (point.z || 0) - ze;
-
-            // Apply 3-D rotation
-            // Euler Angles (XYZ): cosA = cos(Alfa|Roll), cosB = cos(Beta|Pitch), cosG = cos(Gamma|Yaw) 
-            // 
-            // Composite rotation:
-            // |          cosB * cosG             |           cosB * sinG            |    -sinB    |
-            // | sinA * sinB * cosG - cosA * sinG | sinA * sinB * sinG + cosA * cosG | sinA * cosB |
-            // | cosA * sinB * cosG + sinA * sinG | cosA * sinB * sinG - sinA * cosG | cosA * cosB |
-            // 
-            // Now, Gamma/Yaw is not used (angle=0), so we assume cosG = 1 and sinG = 0, so we get:
-            // |     cosB    |   0    |   - sinB    |
-            // | sinA * sinB |  cosA  | sinA * cosB |
-            // | cosA * sinB | - sinA | cosA * cosB |
-            // 
-            // But in browsers, y is reversed, so we get sinA => -sinA. The general result is:
-            // |      cosB     |   0    |    - sinB     |     | x |     | px |
-            // | - sinA * sinB |  cosA  | - sinA * cosB |  x  | y |  =  | py | 
-            // |  cosA * sinB  |  sinA  |  cosA * cosB  |     | z |     | pz |
-            //
-            // Result: 
-            px = c1 * x - s1 * z;
-            py = -s1 * s2 * x + c2 * y - c1 * s2 * z;
-            pz = s1 * c2 * x + s2 * y + c1 * c2 * z;
-
-
-            // Apply perspective
-            if ((vd > 0) && (vd < Number.POSITIVE_INFINITY)) {
-                px = px * (vd / (pz + ze + vd));
-                py = py * (vd / (pz + ze + vd));
-            }
-
+        return Highcharts.map(points, function (point) {
+            var rotated = rotate3D(
+                    (inverted ? point.y : point.x) - origin.x,
+                    (inverted ? point.x : point.y) - origin.y,
+                    (point.z || 0) - origin.z,
+                    angles
+                ),
+                coordinate = perspective3D(rotated, origin, origin.vd); // Apply perspective
+
+            // Apply translation
+            coordinate.x = coordinate.x * scale + origin.x;
+            coordinate.y = coordinate.y * scale + origin.y;
+            coordinate.z = rotated.z * scale + origin.z;
 
-            //Apply translation
-            px = px * scale + xe;
-            py = py * scale + ye;
-            pz = pz * scale + ze;
-
-
-            result.push({
-                x: (inverted ? py : px),
-                y: (inverted ? px : py),
-                z: pz
-            });
+            return {
+                x: (inverted ? coordinate.y : coordinate.x),
+                y: (inverted ? coordinate.x : coordinate.y),
+                z: coordinate.z 
+            };
         });
-        return result;
-    }
-    // Make function acessible to plugins
-    Highcharts.perspective = perspective;
-    /***
+    };/***
         EXTENSION TO THE SVG-RENDERER TO ENABLE 3D SHAPES
         ***/
     ////// HELPER METHODS //////
@@ -480,7 +470,8 @@
         wrap(wrapper, 'animate', function (proceed, params, animation, complete) {
             var ca,
                 from = this.attribs,
-                to;
+                to,
+                anim;
 
             // Attribute-line properties connected to 3D. These shouldn't have been in the 
             // attribs collection in the first place.
@@ -490,15 +481,15 @@
             delete params.alpha;
             delete params.beta;
 
-            animation = animObject(pick(animation, this.renderer.globalAnimation));
+            anim = animObject(pick(animation, this.renderer.globalAnimation));
         
-            if (animation.duration) {
+            if (anim.duration) {
                 params = merge(params); // Don't mutate the original object
                 ca = suckOutCustom(params);
             
                 if (ca) {
                     to = ca;
-                    animation.step = function (a, fx) {
+                    anim.step = function (a, fx) {
                         function interpolate(key) {
                             return from[key] + (pick(to[key], from[key]) - from[key]) * fx.pos;
                         }
@@ -726,104 +717,103 @@
     };
 
     /**
-     * Extend the getMargins method to calculate scale of the 3D view. That is required to
+     * Calculate scale of the 3D view. That is required to
      * fit chart's 3D projection into the actual plotting area. Reported as #4933.
+     * @notice This function should ideally take the plot values instead of a chart object, 
+     *         but since the chart object is needed for perspective it is not practical. 
+     *         Possible to make both getScale and perspective more logical and also immutable.
+     * @param  {Object} chart Chart object
+     * @param  {Number} chart.plotLeft
+     * @param  {Number} chart.plotWidth
+     * @param  {Number} chart.plotTop
+     * @param  {Number} chart.plotHeight
+     * @param  {Number} depth The depth of the chart
+     * @return {Number} The scale to fit the 3D chart into the plotting area.
      */
-    Highcharts.wrap(Highcharts.Chart.prototype, 'getMargins', function (proceed) {
-        var chart = this,
-            options3d = chart.options.chart.options3d,
+    function getScale(chart, depth) {
+        var plotLeft = chart.plotLeft,
+            plotRight = chart.plotWidth + plotLeft,
+            plotTop = chart.plotTop,
+            plotBottom = chart.plotHeight + plotTop,
+            originX = plotLeft + chart.plotWidth / 2,
+            originY = plotTop + chart.plotHeight / 2,
             bbox3d = {
                 minX: Number.MAX_VALUE,
                 maxX: -Number.MAX_VALUE,
                 minY: Number.MAX_VALUE,
                 maxY: -Number.MAX_VALUE
             },
-            plotLeft = chart.plotLeft,
-            plotRight = chart.plotWidth + plotLeft,
-            plotTop = chart.plotTop,
-            plotBottom = chart.plotHeight + plotTop,
-            originX = plotLeft + chart.plotWidth / 2,
-            originY = plotTop + chart.plotHeight / 2,
-            scale = 1,
-            corners = [],
-            i;
+            corners,
+            scale = 1;
+
+        // Top left corners:
+        corners = [{
+            x: plotLeft,
+            y: plotTop,
+            z: 0
+        }, {
+            x: plotLeft,
+            y: plotTop,
+            z: depth
+        }];
+
+        // Top right corners:
+        each([0, 1], function (i) { 
+            corners.push({
+                x: plotRight,
+                y: corners[i].y,
+                z: corners[i].z
+            });
+        });
 
-        proceed.apply(this, [].slice.call(arguments, 1));
+        // All bottom corners:
+        each([0, 1, 2, 3], function (i) {
+            corners.push({
+                x: corners[i].x,
+                y: plotBottom,
+                z: corners[i].z
+            });
+        });
 
-        if (this.is3d()) {
-            if (options3d.fitToPlot === true) {
-                // Clear previous scale in case of updates:
-                chart.scale3d = 1;
-
-                // Top left corners:
-                corners = [{
-                    x: plotLeft,
-                    y: plotTop,
-                    z: 0
-                }, {
-                    x: plotLeft,
-                    y: plotTop,
-                    z: options3d.depth
-                }];
-
-                // Top right corners:
-                for (i = 0; i < 2; i++) {
-                    corners.push({
-                        x: plotRight,
-                        y: corners[i].y,
-                        z: corners[i].z
-                    });
-                }
+        // Calculate 3D corners:
+        corners = perspective(corners, chart, false);
 
-                // All bottom corners:
-                for (i = 0; i < 4; i++) {
-                    corners.push({
-                        x: corners[i].x,
-                        y: plotBottom,
-                        z: corners[i].z
-                    });
-                }
+        // Get bounding box of 3D element:
+        each(corners, function (corner) {
+            bbox3d.minX = Math.min(bbox3d.minX, corner.x);
+            bbox3d.maxX = Math.max(bbox3d.maxX, corner.x);
+            bbox3d.minY = Math.min(bbox3d.minY, corner.y);
+            bbox3d.maxY = Math.max(bbox3d.maxY, corner.y);
+        });
 
-                // Calculate 3D corners:
-                corners = perspective(corners, chart, false);
+        // Left edge:
+        if (plotLeft > bbox3d.minX) {
+            scale = Math.min(scale, 1 - Math.abs((plotLeft + originX) / (bbox3d.minX + originX)) % 1);
+        }
 
-                // Get bounding box of 3D element:
-                each(corners, function (corner) {
-                    bbox3d.minX = Math.min(bbox3d.minX, corner.x);
-                    bbox3d.maxX = Math.max(bbox3d.maxX, corner.x);
-                    bbox3d.minY = Math.min(bbox3d.minY, corner.y);
-                    bbox3d.maxY = Math.max(bbox3d.maxY, corner.y);
-                });
+        // Right edge:
+        if (plotRight < bbox3d.maxX) {
+            scale = Math.min(scale, (plotRight - originX) / (bbox3d.maxX - originX));
+        }
 
-                // Left edge:
-                if (plotLeft > bbox3d.minX) {
-                    scale = Math.min(scale, 1 - Math.abs((plotLeft + originX) / (bbox3d.minX + originX)) % 1);
-                }
+        // Top edge:
+        if (plotTop > bbox3d.minY) {
+            if (bbox3d.minY < 0) {
+                scale = Math.min(scale, (plotTop + originY) / (-bbox3d.minY + plotTop + originY));
+            } else {
+                scale = Math.min(scale, 1 - (plotTop + originY) / (bbox3d.minY + originY) % 1);
+            }
+        }
 
-                // Right edge:
-                if (plotRight < bbox3d.maxX) {
-                    scale = Math.min(scale, (plotRight - originX) / (bbox3d.maxX - originX));
-                }
+        // Bottom edge:
+        if (plotBottom < bbox3d.maxY) {
+            scale = Math.min(scale, Math.abs((plotBottom - originY) / (bbox3d.maxY - originY)));
+        }
 
-                // Top edge:
-                if (plotTop > bbox3d.minY) {
-                    if (bbox3d.minY < 0) {
-                        scale = Math.min(scale, (plotTop + originY) / (-bbox3d.minY + plotTop + originY));
-                    } else {
-                        scale = Math.min(scale, 1 - (plotTop + originY) / (bbox3d.minY + originY) % 1);
-                    }
-                }
+        return scale;
+    }
 
-                // Bottom edge:
-                if (plotBottom < bbox3d.maxY) {
-                    scale = Math.min(scale, Math.abs((plotBottom - originY) / (bbox3d.maxY - originY)));
-                }
 
-                // Set scale, used later in perspective method():
-                chart.scale3d = scale;
-            }
-        }
-    });
 
     Highcharts.wrap(Highcharts.Chart.prototype, 'isInsidePlot', function (proceed) {
         return this.is3d() || proceed.apply(this, [].slice.call(arguments, 1));
@@ -863,12 +853,15 @@
     });
 
     Highcharts.wrap(Highcharts.Chart.prototype, 'setChartSize', function (proceed) {
-        proceed.apply(this, [].slice.call(arguments, 1));
+        var chart = this,
+            options3d = chart.options.chart.options3d;
 
-        if (this.is3d()) {
-            var inverted = this.inverted,
-                clipBox = this.clipBox,
-                margin = this.margin,
+        proceed.apply(chart, [].slice.call(arguments, 1));
+
+        if (chart.is3d()) {
+            var inverted = chart.inverted,
+                clipBox = chart.clipBox,
+                margin = chart.margin,
                 x = inverted ? 'y' : 'x',
                 y = inverted ? 'x' : 'y',
                 w = inverted ? 'height' : 'width',
@@ -876,8 +869,14 @@
 
             clipBox[x] = -(margin[3] || 0);
             clipBox[y] = -(margin[0] || 0);
-            clipBox[w] = this.chartWidth + (margin[3] || 0) + (margin[1] || 0);
-            clipBox[h] = this.chartHeight + (margin[0] || 0) + (margin[2] || 0);
+            clipBox[w] = chart.chartWidth + (margin[3] || 0) + (margin[1] || 0);
+            clipBox[h] = chart.chartHeight + (margin[0] || 0) + (margin[2] || 0);
+
+            // Set scale, used later in perspective method():
+            chart.scale3d = 1; // @notice getScale uses perspective, so scale3d has to be reset.
+            if (options3d.fitToPlot === true) {
+                chart.scale3d = getScale(chart, options3d.depth);
+            }
         }
     });
 
@@ -1126,21 +1125,10 @@
         var pos = proceed.apply(this, [].slice.call(arguments, 1));
 
         // Do not do this if the chart is not 3D
-        if (!this.axis.chart.is3d()) {
-            return pos;
-        }
-
-        var newPos = perspective([this.axis.swapZ({ x: pos.x, y: pos.y, z: 0 })], this.axis.chart, false)[0];
-        newPos.x = newPos.x - (!this.axis.horiz && this.axis.opposite ? this.axis.transA : 0); //#3788
-        newPos.old = pos;
-        return newPos;
-    });
-
-    Highcharts.wrap(Highcharts.Tick.prototype, 'handleOverflow', function (proceed, xy) {
         if (this.axis.chart.is3d()) {
-            xy = xy.old;
+            pos = perspective([this.axis.swapZ({ x: pos.x, y: pos.y, z: 0 })], this.axis.chart, false)[0];
         }
-        return proceed.call(this, xy);
+        return pos;
     });
 
     Highcharts.wrap(Highcharts.Axis.prototype, 'getTitlePosition', function (proceed) {
@@ -1738,6 +1726,7 @@
 
             rawPoint.plotXold = rawPoint.plotX;
             rawPoint.plotYold = rawPoint.plotY;
+            rawPoint.plotZold = rawPoint.plotZ;
 
             rawPoint.plotX = projectedPoint.x;
             rawPoint.plotY = projectedPoint.y;