}
});
- this.datasets = [];
-
//Set up tooltip events on the chart
if (this.options.showTooltips){
helpers.bindEvents(this, this.options.tooltipEvents, function(evt){
ctx : this.chart.ctx
});
- //Iterate through each of the datasets, and build this into a property of the chart
- helpers.each(data.datasets,function(dataset,datasetIndex){
-
- var datasetObject = {
- label : dataset.label || null,
- fillColor : dataset.fillColor,
- strokeColor : dataset.strokeColor,
- bars : []
- };
-
- this.datasets.push(datasetObject);
-
+ //Create a new point for each piece of data
+ helpers.each(this.data.datasets,function(dataset,datasetIndex){
+ dataset.metaData = [];
helpers.each(dataset.data,function(dataPoint,index){
- //Add a new point for each piece of data, passing any required data to draw.
- datasetObject.bars.push(new this.BarClass({
- value : dataPoint,
- label : data.labels[index],
- datasetLabel: dataset.label,
- strokeColor : dataset.strokeColor,
- fillColor : dataset.fillColor,
- highlightFill : dataset.highlightFill || dataset.fillColor,
- highlightStroke : dataset.highlightStroke || dataset.strokeColor
- }));
+ dataset.metaData.push(new this.BarClass());
},this);
-
},this);
- this.buildScale(data.labels);
-
- this.BarClass.prototype.base = this.scale.endPoint;
this.eachBars(function(bar, index, datasetIndex){
helpers.extend(bar, {
- width : this.scale.calculateBarWidth(this.datasets.length),
- x: this.scale.calculateBarX(this.datasets.length, datasetIndex, index),
- y: this.scale.endPoint
+ value : this.data.datasets[datasetIndex].data[index],
+ label : this.data.labels[index],
+ datasetLabel: this.data.datasets[datasetIndex].label,
+ strokeColor : this.data.datasets[datasetIndex].strokeColor,
+ fillColor : this.data.datasets[datasetIndex].fillColor,
+ highlightFill : this.data.datasets[datasetIndex].highlightFill || this.data.datasets[datasetIndex].fillColor,
+ highlightStroke : this.data.datasets[datasetIndex].highlightStroke || this.data.datasets[datasetIndex].strokeColor
});
bar.save();
}, this);
+ this.buildScale(data.labels);
+ this.BarClass.prototype.base = this.scale.endPoint;
+
+ this.update();
+
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,
- });
+ //Create a new point for each piece of data
+ helpers.each(this.data.datasets,function(dataset,datasetIndex){
+ dataset.metaData = dataset.metaData || [];
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
- });
+ dataset.metaData[index] = dataset.metaData[index] || new this.BarClass();
},this);
-
},this);
+ this.eachBars(function(bar, index, datasetIndex){
+ helpers.extend(bar, {
+ width : this.scale.calculateBarWidth(this.data.datasets.length),
+ x: this.scale.calculateBarX(this.data.datasets.length, datasetIndex, index),
+ y: this.scale.endPoint,
+ value : this.data.datasets[datasetIndex].data[index],
+ label : this.data.labels[index],
+ datasetLabel: this.data.datasets[datasetIndex].label,
+ strokeColor : this.data.datasets[datasetIndex].strokeColor,
+ fillColor : this.data.datasets[datasetIndex].fillColor,
+ highlightFill : this.data.datasets[datasetIndex].highlightFill || this.data.datasets[datasetIndex].fillColor,
+ highlightStroke : this.data.datasets[datasetIndex].highlightStroke || this.data.datasets[datasetIndex].strokeColor
+ });
+ bar.save();
+ }, this);
+
this.scale.update();
- // Reset any highlight colours before updating.
- helpers.each(this.activeElements, function(activeElement){
- activeElement.restore(['fillColor', 'strokeColor']);
- });
- this.eachBars(function(bar){
- bar.save();
- });
this.render();
},
eachBars : function(callback){
- helpers.each(this.datasets,function(dataset, datasetIndex){
- helpers.each(dataset.bars, callback, this, datasetIndex);
+ helpers.each(this.data.datasets,function(dataset, datasetIndex){
+ helpers.each(dataset.metaData, callback, this, datasetIndex);
},this);
},
getBarsAtEvent : function(e){
},
barIndex;
- for (var datasetIndex = 0; datasetIndex < this.datasets.length; datasetIndex++) {
- for (barIndex = 0; barIndex < this.datasets[datasetIndex].bars.length; barIndex++) {
- if (this.datasets[datasetIndex].bars[barIndex].inRange(eventPosition.x,eventPosition.y)){
- helpers.each(this.datasets, datasetIterator);
+ for (var datasetIndex = 0; datasetIndex < this.data.datasets.length; datasetIndex++) {
+ for (barIndex = 0; barIndex < this.data.datasets[datasetIndex].bars.length; barIndex++) {
+ if (this.data.datasets[datasetIndex].bars[barIndex].inRange(eventPosition.x,eventPosition.y)){
+ helpers.each(this.data.datasets, datasetIterator);
return barsArray;
}
}
//Map the values array for each of the datasets
helpers.each(valuesArray,function(value,datasetIndex){
//Add a new point for each piece of data, passing any required data to draw.
- this.datasets[datasetIndex].bars.push(new this.BarClass({
+ this.data.datasets[datasetIndex].bars.push(new this.BarClass({
value : value,
label : label,
- datasetLabel: this.datasets[datasetIndex].label,
- x: this.scale.calculateBarX(this.datasets.length, datasetIndex, this.scale.valuesCount+1),
+ datasetLabel: this.data.datasets[datasetIndex].label,
+ x: this.scale.calculateBarX(this.data.datasets.length, datasetIndex, this.scale.valuesCount+1),
y: this.scale.endPoint,
- width : this.scale.calculateBarWidth(this.datasets.length),
+ width : this.scale.calculateBarWidth(this.data.datasets.length),
base : this.scale.endPoint,
- strokeColor : this.datasets[datasetIndex].strokeColor,
- fillColor : this.datasets[datasetIndex].fillColor
+ strokeColor : this.data.datasets[datasetIndex].strokeColor,
+ fillColor : this.data.datasets[datasetIndex].fillColor
}));
},this);
removeData : function(){
this.scale.removeXLabel();
//Then re-render the chart.
- helpers.each(this.datasets,function(dataset){
+ helpers.each(this.data.datasets,function(dataset){
dataset.bars.shift();
},this);
this.update();
this.scale.draw(easingDecimal);
//Draw all the bars for each dataset
- helpers.each(this.datasets,function(dataset,datasetIndex){
- helpers.each(dataset.bars,function(bar,index){
- if (bar.hasValue()){
- bar.base = this.scale.endPoint;
- //Transition then draw
- bar.transition({
- x : this.scale.calculateBarX(this.datasets.length, datasetIndex, index),
- y : this.scale.calculateY(bar.value),
- width : this.scale.calculateBarWidth(this.datasets.length)
- }, easingDecimal).draw();
- }
- },this);
-
- },this);
+ this.eachBars(function(bar, index, datasetIndex){
+ if (bar.hasValue()){
+ bar.base = this.scale.endPoint;
+ //Transition then draw
+ bar.transition({
+ x : this.scale.calculateBarX(this.data.datasets.length, datasetIndex, index),
+ y : this.scale.calculateY(bar.value),
+ width : this.scale.calculateBarWidth(this.data.datasets.length)
+ }, easingDecimal).draw();
+ bar.save();
+ }
+ }, this);
}
});
numberOfSteps = minSteps;
stepValue = graphRange / numberOfSteps;
}
-
return {
steps : numberOfSteps,
stepValue : stepValue,
}
if (ChartElements.length > 0){
// If we have multiple datasets, show a MultiTooltip for all of the data points at that index
- if (this.datasets && this.datasets.length > 1) {
+ if (this.data.datasets && this.data.datasets.length > 1) {
var dataArray,
dataIndex;
- for (var i = this.datasets.length - 1; i >= 0; i--) {
- dataArray = this.datasets[i].points || this.datasets[i].bars || this.datasets[i].segments;
+ for (var i = this.data.datasets.length - 1; i >= 0; i--) {
+ dataArray = this.data.datasets[i].points || this.data.datasets[i].bars || this.data.datasets[i].segments;
dataIndex = indexOf(dataArray, ChartElements[0]);
if (dataIndex !== -1){
break;
yMax,
xMin,
yMin;
- helpers.each(this.datasets, function(dataset){
+ helpers.each(this.data.datasets, function(dataset){
dataCollection = dataset.points || dataset.bars || dataset.segments;
if (dataCollection[dataIndex] && dataCollection[dataIndex].hasValue()){
Elements.push(dataCollection[dataIndex]);
//Include any colour information about the element
tooltipLabels.push(helpers.template(this.options.multiTooltipTemplate, element));
tooltipColors.push({
- fill: element._saved.fillColor || element.fillColor,
- stroke: element._saved.strokeColor || element.strokeColor
+ fill: element._vm.fillColor || element.fillColor,
+ stroke: element._vm.strokeColor || element.strokeColor
});
}, this);
initialize : function(){},
restore : function(props){
if (!props){
- extend(this,this._saved);
+ extend(this,this._vm);
} else {
each(props,function(key){
- this[key] = this._saved[key];
+ this[key] = this._vm[key];
},this);
}
return this;
},
save : function(){
- this._saved = clone(this);
- delete this._saved._saved;
+ this._vm = clone(this);
+ delete this._vm._vm;
return this;
},
update : function(newProps){
each(newProps,function(value,key){
- this._saved[key] = this[key];
+ this._vm[key] = this[key];
this[key] = value;
},this);
return this;
},
transition : function(props,ease){
each(props,function(value,key){
- this[key] = ((value - this._saved[key]) * ease) + this._saved[key];
+ this._vm[key] = ((value - this._vm[key]) * ease) + this._vm[key];
},this);
return this;
},
Chart.Rectangle = Chart.Element.extend({
draw : function(){
+
+ var vm = this._vm;
+
var ctx = this.ctx,
- halfWidth = this.width/2,
- leftX = this.x - halfWidth,
- rightX = this.x + halfWidth,
- top = this.base - (this.base - this.y),
- halfStroke = this.strokeWidth / 2;
+ halfWidth = vm.width/2,
+ leftX = vm.x - halfWidth,
+ rightX = vm.x + halfWidth,
+ top = this.base - (this.base - vm.y),
+ halfStroke = vm.strokeWidth / 2;
// Canvas doesn't allow us to stroke inside the width so we can
// adjust the sizes to fit if we're setting a stroke on the line
- if (this.showStroke){
+ if (vm.showStroke){
leftX += halfStroke;
rightX -= halfStroke;
top += halfStroke;
ctx.beginPath();
- ctx.fillStyle = this.fillColor;
- ctx.strokeStyle = this.strokeColor;
- ctx.lineWidth = this.strokeWidth;
+ ctx.fillStyle = vm.fillColor;
+ ctx.strokeStyle = vm.strokeColor;
+ ctx.lineWidth = vm.strokeWidth;
// It'd be nice to keep this class totally generic to any rectangle
// and simply specify which border to miss out.
ctx.lineTo(rightX, top);
ctx.lineTo(rightX, this.base);
ctx.fill();
- if (this.showStroke){
+ if (vm.showStroke){
ctx.stroke();
}
},
height : function(){
- return this.base - this.y;
+ return this.base - vm.y;
},
inRange : function(chartX,chartY){
- return (chartX >= this.x - this.width/2 && chartX <= this.x + this.width/2) && (chartY >= this.y && chartY <= this.base);
+ return (chartX >= vm.x - vm.width/2 && chartX <= vm.x + vm.width/2) && (chartY >= vm.y && chartY <= this.base);
}
});
projects / thirdparty / Chart.js.git / commitdiff
