]> git.ipfire.org Git - thirdparty/Chart.js.git/commitdiff
Make a start on sparse data for line charts
authorNick Downie <hello@nickdownie.com>
Tue, 8 Jul 2014 21:40:32 +0000 (22:40 +0100)
committerNick Downie <hello@nickdownie.com>
Tue, 8 Jul 2014 21:40:32 +0000 (22:40 +0100)
src/Chart.Line.js

index ff99d5e554b07ebc0b48d068923f415e706c7614..08160153174042be44bd2ed765726ad1ebe1ba24 100644 (file)
 
 
                                helpers.each(dataset.data,function(dataPoint,index){
-                                       //Best way to do this? or in draw sequence...?
-                                       if (helpers.isNumber(dataPoint)){
                                        //Add a new point for each piece of data, passing any required data to draw.
-                                               datasetObject.points.push(new this.PointClass({
-                                                       value : dataPoint,
-                                                       label : data.labels[index],
-                                                       datasetLabel: dataset.label,
-                                                       strokeColor : dataset.pointStrokeColor,
-                                                       fillColor : dataset.pointColor,
-                                                       highlightFill : dataset.pointHighlightFill || dataset.pointColor,
-                                                       highlightStroke : dataset.pointHighlightStroke || dataset.pointStrokeColor
-                                               }));
-                                       }
+                                       datasetObject.points.push(new this.PointClass({
+                                               value : dataPoint,
+                                               label : data.labels[index],
+                                               datasetLabel: dataset.label,
+                                               strokeColor : dataset.pointStrokeColor,
+                                               fillColor : dataset.pointColor,
+                                               highlightFill : dataset.pointHighlightFill || dataset.pointColor,
+                                               highlightStroke : dataset.pointHighlightStroke || dataset.pointStrokeColor
+                                       }));
                                },this);
 
                                this.buildScale(data.labels);
                        //Map the values array for each of the datasets
 
                        helpers.each(valuesArray,function(value,datasetIndex){
-                                       if (helpers.isNumber(value)){
-                                       //Add a new point for each piece of data, passing any required data to draw.
-                                               this.datasets[datasetIndex].points.push(new this.PointClass({
-                                                       value : value,
-                                                       label : label,
-                                                       x: this.scale.calculateX(this.scale.valuesCount+1),
-                                                       y: this.scale.endPoint,
-                                                       strokeColor : this.datasets[datasetIndex].pointStrokeColor,
-                                                       fillColor : this.datasets[datasetIndex].pointColor
-                                               }));
-                                       }
+                               //Add a new point for each piece of data, passing any required data to draw.
+                               this.datasets[datasetIndex].points.push(new this.PointClass({
+                                       value : value,
+                                       label : label,
+                                       x: this.scale.calculateX(this.scale.valuesCount+1),
+                                       y: this.scale.endPoint,
+                                       strokeColor : this.datasets[datasetIndex].pointStrokeColor,
+                                       fillColor : this.datasets[datasetIndex].pointColor
+                               }));
                        },this);
 
                        this.scale.addXLabel(label);
                                //We can use this extra loop to calculate the control points of this dataset also in this loop
 
                                helpers.each(dataset.points,function(point,index){
-                                       point.transition({
-                                               y : this.scale.calculateY(point.value),
-                                               x : this.scale.calculateX(index)
-                                       }, easingDecimal);
+                                       if (helpers.isNumber(point.value)){
+                                               point.transition({
+                                                       y : this.scale.calculateY(point.value),
+                                                       x : this.scale.calculateX(index)
+                                               }, easingDecimal);
+                                       }
 
                                },this);
 
                                ctx.strokeStyle = dataset.strokeColor;
                                ctx.beginPath();
                                helpers.each(dataset.points,function(point,index){
-                                       if (index>0){
-                                               if(this.options.bezierCurve){
-                                                       ctx.bezierCurveTo(
-                                                               dataset.points[index-1].controlPoints.outer.x,
-                                                               dataset.points[index-1].controlPoints.outer.y,
-                                                               point.controlPoints.inner.x,
-                                                               point.controlPoints.inner.y,
-                                                               point.x,
-                                                               point.y
-                                                       );
+                                       if (helpers.isNumber(point.value)){
+                                               if (index>0){
+                                                       if(this.options.bezierCurve){
+                                                               ctx.bezierCurveTo(
+                                                                       dataset.points[index-1].controlPoints.outer.x,
+                                                                       dataset.points[index-1].controlPoints.outer.y,
+                                                                       point.controlPoints.inner.x,
+                                                                       point.controlPoints.inner.y,
+                                                                       point.x,
+                                                                       point.y
+                                                               );
+                                                       }
+                                                       else{
+                                                               ctx.lineTo(point.x,point.y);
+                                                       }
+
                                                }
                                                else{
-                                                       ctx.lineTo(point.x,point.y);
+                                                       ctx.moveTo(point.x,point.y);
                                                }
-
-                                       }
-                                       else{
-                                               ctx.moveTo(point.x,point.y);
                                        }
                                },this);
                                ctx.stroke();
                                //A little inefficient double looping, but better than the line
                                //lagging behind the point positions
                                helpers.each(dataset.points,function(point){
-                                       point.draw();
+                                       if (helpers.isNumber(point.value)){
+                                               point.draw();
+                                       }
                                });
 
                        },this);