Mirrors/Chart.js
2
0
Fork 0
mirror of https://github.com/chartjs/Chart.js.git synced 2026-03-24 00:56:51 +01:00
Code Issues Packages Projects Releases Wiki Activity

Fix the broken scatter chart. Introduced the concept of a canvas controller that goes along with the element controller.

Browse Source
This commit is contained in:
Evert Timberg
2015-06-14 13:00:09 -04:00
parent 9751e8f5b1
commit 68ae02263b
4 changed files with 83 additions and 68 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
src/charts/chart.line.js
View File

@@ -26,14 +26,15 @@
defaults: defaultConfig,
initialize: function() {
this.controller = new Chart.RectangularElementController(this);
this.elementController = new Chart.RectangularElementController(this);
this.canvasController = new Chart.RectangularCanvasController(this, this.elementController);
// Create a new line and its points for each dataset and piece of data
helpers.each(this.data.datasets, function(dataset, datasetIndex) {
this.controller.addLine(dataset, datasetIndex);
this.elementController.addLine(dataset, datasetIndex);
helpers.each(dataset.data, function(dataPoint, index) {
this.controller.addPoint(dataset, datasetIndex, index);
this.elementController.addPoint(dataset, datasetIndex, index);
}, this);
// The line chart onlty supports a single x axis because the x axis is always a dataset axis
@@ -46,7 +47,7 @@
}
}, this);
this.__super__.initialize.call(this);
this.canvasController.initialize();
},
draw: function(ease) {

60
src/charts/chart.rectangularbase.js
View File

@@ -13,68 +13,10 @@
Chart.Type.extend({
name: "RectangularBase",
defaults: defaultConfig,
initialize: function() {
// Events
helpers.bindEvents(this, this.options.events, this.events);
// Build and fit the scale. Needs to happen after the axis IDs have been set
this.buildScales();
// Create tooltip instance exclusively for this chart with some defaults.
this.tooltip = new Chart.Tooltip({
_chart: this.chart,
_data: this.data,
_options: this.options,
}, this);
// Need to fit scales before we reset elements.
Chart.scaleService.fitScalesForChart(this, this.chart.width, this.chart.height);
// Reset so that we animation from the baseline
this.resetElements();
// Update that shiz
this.update();
},
resetElements: function() {
this.controller.resetElements();
},
update: function(animationDuration) {
Chart.scaleService.fitScalesForChart(this, this.chart.width, this.chart.height);
this.controller.updateElements();
this.canvasController.update();
this.render(animationDuration);
},
buildScales: function() {
// Map of scale ID to scale object so we can lookup later
this.scales = {};
// Build the x axes
helpers.each(this.options.scales.xAxes, function(xAxisOptions) {
var ScaleClass = Chart.scaleService.getScaleConstructor(xAxisOptions.type);
var scale = new ScaleClass({
ctx: this.chart.ctx,
options: xAxisOptions,
data: this.data,
id: xAxisOptions.id,
});
this.scales[scale.id] = scale;
}, this);
// Build the y axes
helpers.each(this.options.scales.yAxes, function(yAxisOptions) {
var ScaleClass = Chart.scaleService.getScaleConstructor(yAxisOptions.type);
var scale = new ScaleClass({
ctx: this.chart.ctx,
options: yAxisOptions,
data: this.data,
id: yAxisOptions.id,
});
this.scales[scale.id] = scale;
}, this);
},
draw: helpers.noop,
events: function(e) {

73
src/controllers/controller.canvas.rectangular.js Normal file
View File

@@ -0,0 +1,73 @@
(function() {
"use strict";
var root = this,
Chart = root.Chart,
helpers = Chart.helpers;
Chart.RectangularCanvasController = function(chart, elementController) {
this.chart = chart;
this.elementController = elementController;
};
Chart.RectangularCanvasController.prototype.initialize = function() {
this.bindEvents();
this.buildScales();
// Need to fit scales before we reset elements.
Chart.scaleService.fitScalesForChart(this.chart, this.chart.chart.width, this.chart.chart.height);
this.elementController.resetElements();
this.initToolTip();
this.chart.update();
};
Chart.RectangularCanvasController.prototype.bindEvents = function() {
helpers.bindEvents(this.chart, this.chart.options.events, this.chart.events);
};
Chart.RectangularCanvasController.prototype.initToolTip = function() {
this.chart.tooltip = new Chart.Tooltip({
_chart: this.chart.chart,
_data: this.chart.data,
_options: this.chart.options,
}, this);
};
Chart.RectangularCanvasController.prototype.buildScales = function() {
// Map of scale ID to scale object so we can lookup later
this.chart.scales = {};
// Build the x axes
helpers.each(this.chart.options.scales.xAxes, function(xAxisOptions) {
var ScaleClass = Chart.scaleService.getScaleConstructor(xAxisOptions.type);
var scale = new ScaleClass({
ctx: this.chart.chart.ctx,
options: xAxisOptions,
data: this.chart.data,
id: xAxisOptions.id,
});
this.chart.scales[scale.id] = scale;
}, this);
// Build the y axes
helpers.each(this.chart.options.scales.yAxes, function(yAxisOptions) {
var ScaleClass = Chart.scaleService.getScaleConstructor(yAxisOptions.type);
var scale = new ScaleClass({
ctx: this.chart.chart.ctx,
options: yAxisOptions,
data: this.chart.data,
id: yAxisOptions.id,
});
this.chart.scales[scale.id] = scale;
}, this);
};
Chart.RectangularCanvasController.prototype.update = function() {
Chart.scaleService.fitScalesForChart(this.chart, this.chart.chart.width, this.chart.chart.height);
this.elementController.updateElements();
};
}).call(this);

9
src/core/core.js
View File

@@ -285,7 +285,9 @@
ChartElement.extend = inherits;
if (extensions) extend(ChartElement.prototype, extensions);
if (extensions) {
extend(ChartElement.prototype, extensions);
}
ChartElement.__super__ = parent.prototype;
@@ -1102,12 +1104,9 @@
//Copy the prototype object of the this class
ChartType.prototype = clone(parent.prototype);
ChartType.prototype.__super__ = clone(parent.prototype);
//Now overwrite some of the properties in the base class with the new extensions
extend(ChartType.prototype, extensions);
ChartType.extend = Chart.Type.extend;
if (extensions.name || parent.prototype.name) {