From: Tanner Linsley Date: Thu, 8 Jan 2015 04:45:50 +0000 (-0700) Subject: Data editable from chart config X-Git-Tag: v2.0-alpha~38^2~1 X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=359e94151c8705eecb96da2be9f0d2462574a206;p=thirdparty%2FChart.js.git Data editable from chart config --- diff --git a/src/Chart.Bar.js b/src/Chart.Bar.js index 87fb26ddc..86d5fc989 100644 --- a/src/Chart.Bar.js +++ b/src/Chart.Bar.js @@ -48,6 +48,9 @@ defaults : defaultConfig, initialize: function(data){ + // Save data as a source for updating of values & methods + this.data = data; + //Expose options as a scope variable here so we can access it in the ScaleClass var options = this.options; @@ -140,6 +143,29 @@ this.render(); }, update : function(){ + //Iterate through each of the datasets, and build this into a property of the chart + helpers.each(this.data.datasets,function(dataset,datasetIndex){ + + helpers.extend(this.datasets[datasetIndex], { + label : dataset.label || null, + fillColor : dataset.fillColor, + strokeColor : dataset.strokeColor, + }); + + helpers.each(dataset.data,function(dataPoint,index){ + helpers.extend(this.datasets[datasetIndex].bars[index], { + value : dataPoint, + label : this.data.labels[index], + datasetLabel: dataset.label, + strokeColor : dataset.strokeColor, + fillColor : dataset.fillColor, + highlightFill : dataset.highlightFill || dataset.fillColor, + highlightStroke : dataset.highlightStroke || dataset.strokeColor + }); + },this); + + },this); + this.scale.update(); // Reset any highlight colours before updating. helpers.each(this.activeElements, function(activeElement){ diff --git a/src/Chart.Doughnut.js b/src/Chart.Doughnut.js index 35de93c7f..d3786f3fb 100644 --- a/src/Chart.Doughnut.js +++ b/src/Chart.Doughnut.js @@ -46,6 +46,9 @@ //Config is automatically merged by the core of Chart.js, and is available at this.options initialize: function(data){ + // Save data as a source for updating of values & methods + this.data = data; + //Declare segments as a static property to prevent inheriting across the Chart type prototype this.segments = []; this.outerRadius = (helpers.min([this.chart.width,this.chart.height]) - this.options.segmentStrokeWidth/2)/2; @@ -118,6 +121,26 @@ },this); }, update : function(){ + + // Map new data to data points + if(this.data.length == this.segments.length){ + helpers.each(this.data, function(segment, i){ + helpers.extend(this.segments[i], { + value : segment.value, + fillColor : segment.color, + highlightColor : segment.highlight || segment.color, + showStroke : this.options.segmentShowStroke, + strokeWidth : this.options.segmentStrokeWidth, + strokeColor : this.options.segmentStrokeColor, + label : segment.label + }); + }, this); + console.log(this.data, this.segments); + } else{ + // Data size changed without properly inserting, just redraw the chart + this.initialize(this.data); + } + this.calculateTotal(this.segments); // Reset any highlight colours before updating. diff --git a/src/Chart.Line.js b/src/Chart.Line.js index 34ad85b4d..a3acb6a5d 100644 --- a/src/Chart.Line.js +++ b/src/Chart.Line.js @@ -59,6 +59,9 @@ name: "Line", defaults : defaultConfig, initialize: function(data){ + // Save data as a source for updating of values & methods + this.data = data; + //Declare the extension of the default point, to cater for the options passed in to the constructor this.PointClass = Chart.Point.extend({ strokeWidth : this.options.pointDotStrokeWidth, @@ -133,6 +136,31 @@ this.render(); }, update : function(){ + //Iterate through each of the datasets, and build this into a property of the chart + helpers.each(this.data.datasets,function(dataset,datasetIndex){ + + helpers.extend(this.datasets[datasetIndex], { + label : dataset.label || null, + fillColor : dataset.fillColor, + strokeColor : dataset.strokeColor, + pointColor : dataset.pointColor, + pointStrokeColor : dataset.pointStrokeColor, + }); + + helpers.each(dataset.data,function(dataPoint,index){ + helpers.extend(this.datasets[datasetIndex].points[index], { + value : dataPoint, + label : this.data.labels[index], + datasetLabel: dataset.label, + strokeColor : dataset.pointStrokeColor, + fillColor : dataset.pointColor, + highlightFill : dataset.pointHighlightFill || dataset.pointColor, + highlightStroke : dataset.pointHighlightStroke || dataset.pointStrokeColor + }); + },this); + + },this); + this.scale.update(); // Reset any highlight colours before updating. helpers.each(this.activeElements, function(activeElement){ diff --git a/src/Chart.PolarArea.js b/src/Chart.PolarArea.js index 4dbf2eb92..326b5a373 100644 --- a/src/Chart.PolarArea.js +++ b/src/Chart.PolarArea.js @@ -59,6 +59,9 @@ //Initialize is fired when the chart is initialized - Data is passed in as a parameter //Config is automatically merged by the core of Chart.js, and is available at this.options initialize: function(data){ + // Save data as a source for updating of values & methods + this.data = data; + this.segments = []; //Declare segment class as a chart instance specific class, so it can share props for this instance this.SegmentArc = Chart.Arc.extend({ @@ -190,6 +193,23 @@ }, update : function(){ + + // Map new data to data points + if(this.data.length == this.segments.length){ + helpers.each(this.data, function(segment, i){ + helpers.extend(this.segments[i], { + fillColor: segment.color, + highlightColor: segment.highlight || segment.color, + label: segment.label, + value: segment.value, + }); + },this); + console.log(this.data, this.segments); + } else{ + // Data size changed without properly inserting, just redraw the chart + this.initialize(this.data); + } + this.calculateTotal(this.segments); helpers.each(this.segments,function(segment){ diff --git a/src/Chart.Radar.js b/src/Chart.Radar.js index 134fd2d02..4fb593ca6 100644 --- a/src/Chart.Radar.js +++ b/src/Chart.Radar.js @@ -67,6 +67,9 @@ }, initialize: function(data){ + // Save data as a source for updating of values & methods + this.data = data; + this.PointClass = Chart.Point.extend({ strokeWidth : this.options.pointDotStrokeWidth, radius : this.options.pointDotRadius, @@ -268,6 +271,31 @@ this.update(); }, update : function(){ + //Iterate through each of the datasets, and build this into a property of the chart + helpers.each(this.data.datasets,function(dataset,datasetIndex){ + + helpers.extend(this.datasets[datasetIndex], { + label : dataset.label || null, + fillColor : dataset.fillColor, + strokeColor : dataset.strokeColor, + pointColor : dataset.pointColor, + pointStrokeColor : dataset.pointStrokeColor, + }); + + helpers.each(dataset.data,function(dataPoint,index){ + helpers.extend(this.datasets[datasetIndex].points[index], { + value : dataPoint, + label : this.data.labels[index], + datasetLabel: dataset.label, + strokeColor : dataset.pointStrokeColor, + fillColor : dataset.pointColor, + highlightFill : dataset.pointHighlightFill || dataset.pointColor, + highlightStroke : dataset.pointHighlightStroke || dataset.pointStrokeColor + }); + },this); + + },this); + this.eachPoints(function(point){ point.save(); });