]> git.ipfire.org Git - thirdparty/Chart.js.git/commitdiff
Improve core and polar area 2671/head
authorEvert Timberg <evert.timberg+github@gmail.com>
Tue, 31 May 2016 01:55:58 +0000 (21:55 -0400)
committerEvert Timberg <evert.timberg+github@gmail.com>
Tue, 31 May 2016 01:55:58 +0000 (21:55 -0400)
src/controllers/controller.polarArea.js
src/core/core.js

index 372ede3f3a0beb131ea15eba96fc97e0930dc2ea..0577fbeed3bdc5c242b44cb8124823bbd82a7ddf 100644 (file)
@@ -109,7 +109,7 @@ module.exports = function(Chart) {
                        var _this = this;
                        var chart = _this.chart;
                        var chartArea = chart.chartArea;
-                       var meta = this.getMeta();
+                       var meta = _this.getMeta();
                        var opts = chart.options;
                        var arcOpts = opts.elements.arc;
                        var minSize = Math.min(chartArea.right - chartArea.left, chartArea.bottom - chartArea.top);
@@ -154,24 +154,12 @@ module.exports = function(Chart) {
                                }
                        }
 
-                       var distance = arc.hidden? 0 : scale.getDistanceFromCenterForValue(dataset.data[index]);
-                       var startAngle = (-0.5 * Math.PI) + (circumference * visibleCount);
-                       var endAngle = startAngle + (arc.hidden? 0 : circumference);
-
-                       var resetModel = {
-                               x: centerX,
-                               y: centerY,
-                               innerRadius: 0,
-                               outerRadius: animationOpts.animateScale ? 0 : scale.getDistanceFromCenterForValue(dataset.data[index]),
-                               startAngle: animationOpts.animateRotate ? Math.PI * -0.5 : startAngle,
-                               endAngle: animationOpts.animateRotate ? Math.PI * -0.5 : endAngle,
-
-                               backgroundColor: custom.backgroundColor ? custom.backgroundColor : getValueAtIndexOrDefault(dataset.backgroundColor, index, arcOpts.backgroundColor),
-                               borderWidth: custom.borderWidth ? custom.borderWidth : getValueAtIndexOrDefault(dataset.borderWidth, index, arcOpts.borderWidth),
-                               borderColor: custom.borderColor ? custom.borderColor : getValueAtIndexOrDefault(dataset.borderColor, index, arcOpts.borderColor),
+                       var negHalfPI = -0.5 * Math.PI;
+                       var distance = arc.hidden ? 0 : scale.getDistanceFromCenterForValue(dataset.data[index]);
+                       var startAngle = (negHalfPI) + (circumference * visibleCount);
+                       var endAngle = startAngle + (arc.hidden ? 0 : circumference);
 
-                               label: getValueAtIndexOrDefault(labels, index, labels[index])
-                       };
+                       var resetRadius = animationOpts.animateScale ? 0 : scale.getDistanceFromCenterForValue(dataset.data[index]);
 
                        helpers.extend(arc, {
                                // Utility
@@ -180,22 +168,20 @@ module.exports = function(Chart) {
                                _scale: scale,
 
                                // Desired view properties
-                               _model: reset ? resetModel : {
+                               _model: {
                                        x: centerX,
                                        y: centerY,
                                        innerRadius: 0,
-                                       outerRadius: distance,
-                                       startAngle: startAngle,
-                                       endAngle: endAngle,
-
-                                       backgroundColor: custom.backgroundColor ? custom.backgroundColor : getValueAtIndexOrDefault(dataset.backgroundColor, index, arcOpts.backgroundColor),
-                                       borderWidth: custom.borderWidth ? custom.borderWidth : getValueAtIndexOrDefault(dataset.borderWidth, index, arcOpts.borderWidth),
-                                       borderColor: custom.borderColor ? custom.borderColor : getValueAtIndexOrDefault(dataset.borderColor, index, arcOpts.borderColor),
-
+                                       outerRadius: reset ? resetRadius : distance,
+                                       startAngle: reset && animationOpts.animateRotate ? negHalfPI : startAngle,
+                                       endAngle: reset && animationOpts.animateRotate ? negHalfPI : endAngle,
                                        label: getValueAtIndexOrDefault(labels, index, labels[index])
                                }
                        });
 
+                       // Apply border and fill style
+                       _this.removeHoverStyle(arc);
+
                        arc.pivot();
                },
 
index 5bbdc5db6f233c94291520d995ed93bee7b2f776..569969b4250c160922c82b8aec207c0600ad166f 100755 (executable)
@@ -4,7 +4,9 @@ module.exports = function() {
 
        //Occupy the global variable of Chart, and create a simple base class
        var Chart = function(context, config) {
-               this.config = config;
+               var me = this;
+               var helpers = Chart.helpers;
+               me.config = config;
 
                // Support a jQuery'd canvas element
                if (context.length && context[0].getContext) {
@@ -16,45 +18,44 @@ module.exports = function() {
                        context = context.getContext("2d");
                }
 
-               this.ctx = context;
-               this.canvas = context.canvas;
+               me.ctx = context;
+               me.canvas = context.canvas;
 
                // Figure out what the size of the chart will be.
                // If the canvas has a specified width and height, we use those else
                // we look to see if the canvas node has a CSS width and height.
                // If there is still no height, fill the parent container
-               this.width = context.canvas.width || parseInt(Chart.helpers.getStyle(context.canvas, 'width')) || Chart.helpers.getMaximumWidth(context.canvas);
-               this.height = context.canvas.height || parseInt(Chart.helpers.getStyle(context.canvas, 'height')) || Chart.helpers.getMaximumHeight(context.canvas);
+               me.width = context.canvas.width || parseInt(helpers.getStyle(context.canvas, 'width'), 10) || helpers.getMaximumWidth(context.canvas);
+               me.height = context.canvas.height || parseInt(helpers.getStyle(context.canvas, 'height'), 10) || helpers.getMaximumHeight(context.canvas);
 
-               this.aspectRatio = this.width / this.height;
+               me.aspectRatio = me.width / me.height;
 
-               if (isNaN(this.aspectRatio) || isFinite(this.aspectRatio) === false) {
+               if (isNaN(me.aspectRatio) || isFinite(me.aspectRatio) === false) {
                        // If the canvas has no size, try and figure out what the aspect ratio will be.
                        // Some charts prefer square canvases (pie, radar, etc). If that is specified, use that
                        // else use the canvas default ratio of 2
-                       this.aspectRatio = config.aspectRatio !== undefined ? config.aspectRatio : 2;
+                       me.aspectRatio = config.aspectRatio !== undefined ? config.aspectRatio : 2;
                }
 
                // Store the original style of the element so we can set it back
-               this.originalCanvasStyleWidth = context.canvas.style.width;
-               this.originalCanvasStyleHeight = context.canvas.style.height;
+               me.originalCanvasStyleWidth = context.canvas.style.width;
+               me.originalCanvasStyleHeight = context.canvas.style.height;
 
                // High pixel density displays - multiply the size of the canvas height/width by the device pixel ratio, then scale.
-               Chart.helpers.retinaScale(this);
+               helpers.retinaScale(me);
 
                if (config) {
-                       this.controller = new Chart.Controller(this);
+                       me.controller = new Chart.Controller(me);
                }
 
                // Always bind this so that if the responsive state changes we still work
-               var _this = this;
-               Chart.helpers.addResizeListener(context.canvas.parentNode, function() {
-                       if (_this.controller && _this.controller.config.options.responsive) {
-                               _this.controller.resize();
+               helpers.addResizeListener(context.canvas.parentNode, function() {
+                       if (me.controller && me.controller.config.options.responsive) {
+                               me.controller.resize();
                        }
                });
 
-               return this.controller ? this.controller : this;
+               return me.controller ? me.controller : me;
 
        };