Skip to content

Commit

Permalink
Pre-release version bump to beta.4
Browse files Browse the repository at this point in the history
  • Loading branch information
nnnick committed Aug 17, 2014
1 parent 7eec283 commit 8b840ce
Show file tree
Hide file tree
Showing 4 changed files with 106 additions and 49 deletions.
145 changes: 101 additions & 44 deletions Chart.js
@@ -1,7 +1,7 @@
/*!
* Chart.js
* http://chartjs.org/
* Version: 1.0.1-beta.3
* Version: 1.0.1-beta.4
*
* Copyright 2014 Nick Downie
* Released under the MIT license
Expand Down Expand Up @@ -217,6 +217,41 @@
return -1;
}
},
where = helpers.where = function(collection, filterCallback){
var filtered = [];

helpers.each(collection, function(item){
if (filterCallback(item)){
filtered.push(item);
}
});

return filtered;
},
findNextWhere = helpers.findNextWhere = function(arrayToSearch, filterCallback, startIndex){
// Default to start of the array
if (!startIndex){
startIndex = -1;
}
for (var i = startIndex + 1; i < arrayToSearch.length; i++) {
var currentItem = arrayToSearch[i];
if (filterCallback(currentItem)){
return currentItem;
}
};
},
findPreviousWhere = helpers.findPreviousWhere = function(arrayToSearch, filterCallback, startIndex){
// Default to end of the array
if (!startIndex){
startIndex = arrayToSearch.length;
}
for (var i = startIndex - 1; i >= 0; i--) {
var currentItem = arrayToSearch[i];
if (filterCallback(currentItem)){
return currentItem;
}
};
},
inherits = helpers.inherits = function(extensions){
//Basic javascript inheritance based on the model created in Backbone.js
var parent = this;
Expand Down Expand Up @@ -407,11 +442,10 @@
//Javascript micro templating by John Resig - source at http://ejohn.org/blog/javascript-micro-templating/
template = helpers.template = function(templateString, valuesObject){
// If templateString is function rather than string-template - call the function for valuesObject
if(templateString instanceof Function)
{
if(templateString instanceof Function){
return templateString(valuesObject);
}
}

var cache = {};
function tmpl(str, data){
// Figure out if we're getting a template, or if we need to
Expand Down Expand Up @@ -718,7 +752,7 @@
var ctx = chart.ctx,
width = chart.canvas.width,
height = chart.canvas.height;
//console.log(width + " x " + height);

if (window.devicePixelRatio) {
ctx.canvas.style.width = width + "px";
ctx.canvas.style.height = height + "px";
Expand Down Expand Up @@ -1102,6 +1136,7 @@
// ctx.fill();

// ctx.moveTo(this.controlPoints.inner.x,this.controlPoints.inner.y);
// ctx.lineTo(this.x, this.y);
// ctx.lineTo(this.controlPoints.outer.x,this.controlPoints.outer.y);
// ctx.stroke();

Expand Down Expand Up @@ -2637,39 +2672,64 @@

var ctx = this.chart.ctx;

// Some helper methods for getting the next/prev points
var hasValue = function(item){
return item.value !== null;
},
nextPoint = function(point, collection, index){
return helpers.findNextWhere(collection, hasValue, index) || point;
},
previousPoint = function(point, collection, index){
return helpers.findPreviousWhere(collection, hasValue, index) || point;
};

this.scale.draw(easingDecimal);


helpers.each(this.datasets,function(dataset){
var pointsWithValues = helpers.where(dataset.points, hasValue);

//Transition each point first so that the line and point drawing isn't out of sync
//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){
helpers.each(dataset.points, function(point, index){
if (point.hasValue()){
point.transition({
y : this.scale.calculateY(point.value),
x : this.scale.calculateX(index)
}, easingDecimal);
}

},this);


// Control points need to be calculated in a seperate loop, because we need to know the current x/y of the point
// This would cause issues when there is no animation, because the y of the next point would be 0, so beziers would be skewed
if (this.options.bezierCurve){
helpers.each(dataset.points,function(point,index){
//If we're at the start or end, we don't have a previous/next point
//By setting the tension to 0 here, the curve will transition to straight at the end
if (index === 0){
point.controlPoints = helpers.splineCurve(point,point,dataset.points[index+1],0);
helpers.each(pointsWithValues, function(point, index){
var tension = (index > 0 && index < pointsWithValues.length - 1) ? this.options.bezierCurveTension : 0;
point.controlPoints = helpers.splineCurve(
previousPoint(point, pointsWithValues, index),
point,
nextPoint(point, pointsWithValues, index),
tension
);

// Prevent the bezier going outside of the bounds of the graph

// Cap puter bezier handles to the upper/lower scale bounds
if (point.controlPoints.outer.y > this.scale.endPoint){
point.controlPoints.outer.y = this.scale.endPoint;
}
else if (index >= dataset.points.length-1){
point.controlPoints = helpers.splineCurve(dataset.points[index-1],point,point,0);
else if (point.controlPoints.outer.y < this.scale.startPoint){
point.controlPoints.outer.y = this.scale.startPoint;
}
else{
point.controlPoints = helpers.splineCurve(dataset.points[index-1],point,dataset.points[index+1],this.options.bezierCurveTension);

// Cap inner bezier handles to the upper/lower scale bounds
if (point.controlPoints.inner.y > this.scale.endPoint){
point.controlPoints.inner.y = this.scale.endPoint;
}
else if (point.controlPoints.inner.y < this.scale.startPoint){
point.controlPoints.inner.y = this.scale.startPoint;
}
},this);
}
Expand All @@ -2679,36 +2739,36 @@
ctx.lineWidth = this.options.datasetStrokeWidth;
ctx.strokeStyle = dataset.strokeColor;
ctx.beginPath();
helpers.each(dataset.points,function(point,index){
if (point.hasValue()){
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);
}

helpers.each(pointsWithValues, function(point, index){
if (index === 0){
ctx.moveTo(point.x, point.y);
}
else{
if(this.options.bezierCurve){
var previous = previousPoint(point, pointsWithValues, index);

ctx.bezierCurveTo(
previous.controlPoints.outer.x,
previous.controlPoints.outer.y,
point.controlPoints.inner.x,
point.controlPoints.inner.y,
point.x,
point.y
);
}
else{
ctx.moveTo(point.x,point.y);
ctx.lineTo(point.x,point.y);
}
}
},this);
ctx.stroke();
}, this);

ctx.stroke();

if (this.options.datasetFill){
if (this.options.datasetFill && pointsWithValues.length > 0){
//Round off the line by going to the base of the chart, back to the start, then fill.
ctx.lineTo(dataset.points[dataset.points.length-1].x, this.scale.endPoint);
ctx.lineTo(this.scale.calculateX(0), this.scale.endPoint);
ctx.lineTo(pointsWithValues[pointsWithValues.length - 1].x, this.scale.endPoint);
ctx.lineTo(pointsWithValues[0].x, this.scale.endPoint);
ctx.fillStyle = dataset.fillColor;
ctx.closePath();
ctx.fill();
Expand All @@ -2717,12 +2777,9 @@
//Now draw the points over the line
//A little inefficient double looping, but better than the line
//lagging behind the point positions
helpers.each(dataset.points,function(point){
if (point.hasValue()){
point.draw();
}
helpers.each(pointsWithValues,function(point){
point.draw();
});

},this);
}
});
Expand Down
6 changes: 3 additions & 3 deletions Chart.min.js

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion bower.json
@@ -1,6 +1,6 @@
{
"name": "Chart.js",
"version": "1.0.1-beta.3",
"version": "1.0.1-beta.4",
"description": "Simple HTML5 Charts using the canvas element",
"homepage": "https://github.com/nnnick/Chart.js",
"author": "nnnick",
Expand Down
2 changes: 1 addition & 1 deletion package.json
Expand Up @@ -2,7 +2,7 @@
"name": "chart.js",
"homepage": "http://www.chartjs.org",
"description": "Simple HTML5 charts using the canvas element.",
"version": "1.0.1-beta.3",
"version": "1.0.1-beta.4",
"main": "Chart.js",
"repository": {
"type": "git",
Expand Down

0 comments on commit 8b840ce

Please sign in to comment.