'./src/controllers/**',
'./src/scales/**',
'./src/elements/**',
- './src/charts/chart.rectangularbase.js', // need this before the other chart types
'./src/charts/**',
'./src/**',
'./node_modules/color/dist/color.min.js'
};
- Chart.types.RectangularBase.extend({
+ Chart.Type.extend({
name: "Line",
defaults: defaultConfig,
initialize: function() {
+++ /dev/null
-(function() {
- "use strict";
-
- var root = this,
- Chart = root.Chart,
- helpers = Chart.helpers;
-
- var defaultConfig = {
-
- };
-
- // Rectangular base class that derives into line & bar charts
- Chart.Type.extend({
- name: "RectangularBase",
- defaults: defaultConfig,
- update: function(animationDuration) {
- this.canvasController.update();
- this.render(animationDuration);
- },
- draw: helpers.noop,
- events: function(e) {
-
- this.lastActive = this.lastActive || [];
-
- // Find Active Elements
- if (e.type == 'mouseout') {
- this.active = [];
- } else {
- this.active = function() {
- switch (this.options.hover.mode) {
- case 'single':
- return this.getElementAtEvent(e);
- case 'label':
- return this.getElementsAtEvent(e);
- case 'dataset':
- return this.getDatasetAtEvent(e);
- default:
- return e;
- }
- }.call(this);
- }
-
- // On Hover hook
- if (this.options.hover.onHover) {
- this.options.hover.onHover.call(this, this.active);
- }
-
- if (e.type == 'mouseup' || e.type == 'click') {
- if (this.options.onClick) {
- this.options.onClick.call(this, e, this.active);
- }
- }
-
- var dataset;
- var index;
- // Remove styling for last active (even if it may still be active)
- if (this.lastActive.length) {
- switch (this.options.hover.mode) {
- case 'single':
- dataset = this.data.datasets[this.lastActive[0]._datasetIndex];
- index = this.lastActive[0]._index;
-
- this.lastActive[0]._model.radius = this.lastActive[0].custom && this.lastActive[0].custom.radius ? this.lastActive[0].custom.radius : helpers.getValueAtIndexOrDefault(dataset.radius, index, this.options.elements.point.radius);
- this.lastActive[0]._model.backgroundColor = this.lastActive[0].custom && this.lastActive[0].custom.backgroundColor ? this.lastActive[0].custom.backgroundColor : helpers.getValueAtIndexOrDefault(dataset.pointBackgroundColor, index, this.options.elements.point.backgroundColor);
- this.lastActive[0]._model.borderColor = this.lastActive[0].custom && this.lastActive[0].custom.borderColor ? this.lastActive[0].custom.borderColor : helpers.getValueAtIndexOrDefault(dataset.pointBorderColor, index, this.options.elements.point.borderColor);
- this.lastActive[0]._model.borderWidth = this.lastActive[0].custom && this.lastActive[0].custom.borderWidth ? this.lastActive[0].custom.borderWidth : helpers.getValueAtIndexOrDefault(dataset.pointBorderWidth, index, this.options.elements.point.borderWidth);
- break;
- case 'label':
- for (var i = 0; i < this.lastActive.length; i++) {
- dataset = this.data.datasets[this.lastActive[i]._datasetIndex];
- index = this.lastActive[i]._index;
-
- this.lastActive[i]._model.radius = this.lastActive[i].custom && this.lastActive[i].custom.radius ? this.lastActive[i].custom.radius : helpers.getValueAtIndexOrDefault(dataset.radius, index, this.options.elements.point.radius);
- this.lastActive[i]._model.backgroundColor = this.lastActive[i].custom && this.lastActive[i].custom.backgroundColor ? this.lastActive[i].custom.backgroundColor : helpers.getValueAtIndexOrDefault(dataset.pointBackgroundColor, index, this.options.elements.point.backgroundColor);
- this.lastActive[i]._model.borderColor = this.lastActive[i].custom && this.lastActive[i].custom.borderColor ? this.lastActive[i].custom.borderColor : helpers.getValueAtIndexOrDefault(dataset.pointBorderColor, index, this.options.elements.point.borderColor);
- this.lastActive[i]._model.borderWidth = this.lastActive[i].custom && this.lastActive[i].custom.borderWidth ? this.lastActive[i].custom.borderWidth : helpers.getValueAtIndexOrDefault(dataset.pointBorderWidth, index, this.options.elements.point.borderWidth);
- }
- break;
- case 'dataset':
- break;
- default:
- // Don't change anything
- }
- }
-
- // Built in hover styling
- if (this.active.length && this.options.hover.mode) {
- switch (this.options.hover.mode) {
- case 'single':
- dataset = this.data.datasets[this.active[0]._datasetIndex];
- index = this.active[0]._index;
-
- this.active[0]._model.radius = this.active[0].custom && this.active[0].custom.radius ? this.active[0].custom.radius : helpers.getValueAtIndexOrDefault(dataset.pointHoverRadius, index, this.options.elements.point.hoverRadius);
- this.active[0]._model.backgroundColor = this.active[0].custom && this.active[0].custom.hoverBackgroundColor ? this.active[0].custom.hoverBackgroundColor : helpers.getValueAtIndexOrDefault(dataset.pointHoverBackgroundColor, index, helpers.color(this.active[0]._model.backgroundColor).saturate(0.5).darken(0.1).rgbString());
- this.active[0]._model.borderColor = this.active[0].custom && this.active[0].custom.hoverBorderColor ? this.active[0].custom.hoverBorderColor : helpers.getValueAtIndexOrDefault(dataset.pointHoverBorderColor, index, helpers.color(this.active[0]._model.borderColor).saturate(0.5).darken(0.1).rgbString());
- this.active[0]._model.borderWidth = this.active[0].custom && this.active[0].custom.hoverBorderWidth ? this.active[0].custom.hoverBorderWidth : helpers.getValueAtIndexOrDefault(dataset.pointBorderWidth, index, this.active[0]._model.borderWidth);
- break;
- case 'label':
- for (var i = 0; i < this.active.length; i++) {
- dataset = this.data.datasets[this.active[i]._datasetIndex];
- index = this.active[i]._index;
-
- this.active[i]._model.radius = this.active[i].custom && this.active[i].custom.radius ? this.active[i].custom.radius : helpers.getValueAtIndexOrDefault(dataset.pointHoverRadius, index, this.options.elements.point.hoverRadius);
- this.active[i]._model.backgroundColor = this.active[i].custom && this.active[i].custom.hoverBackgroundColor ? this.active[i].custom.hoverBackgroundColor : helpers.getValueAtIndexOrDefault(dataset.pointHoverBackgroundColor, index, helpers.color(this.active[i]._model.backgroundColor).saturate(0.5).darken(0.1).rgbString());
- this.active[i]._model.borderColor = this.active[i].custom && this.active[i].custom.hoverBorderColor ? this.active[i].custom.hoverBorderColor : helpers.getValueAtIndexOrDefault(dataset.pointHoverBorderColor, index, helpers.color(this.active[i]._model.borderColor).saturate(0.5).darken(0.1).rgbString());
- this.active[i]._model.borderWidth = this.active[i].custom && this.active[i].custom.hoverBorderWidth ? this.active[i].custom.hoverBorderWidth : helpers.getValueAtIndexOrDefault(dataset.pointBorderWidth, index, this.active[i]._model.borderWidth);
- }
- break;
- case 'dataset':
- break;
- default:
- // Don't change anything
- }
- }
-
-
- // Built in Tooltips
- if (this.options.tooltips.enabled) {
-
- // The usual updates
- this.tooltip.initialize();
-
- // Active
- if (this.active.length) {
- this.tooltip._model.opacity = 1;
-
- helpers.extend(this.tooltip, {
- _active: this.active,
- });
-
- this.tooltip.update();
- } else {
- // Inactive
- this.tooltip._model.opacity = 0;
- }
- }
-
-
- // Hover animations
- this.tooltip.pivot();
-
- if (!this.animating) {
- var changed;
-
- helpers.each(this.active, function(element, index) {
- if (element !== this.lastActive[index]) {
- changed = true;
- }
- }, this);
-
- // If entering, leaving, or changing elements, animate the change via pivot
- if ((!this.lastActive.length && this.active.length) ||
- (this.lastActive.length && !this.active.length) ||
- (this.lastActive.length && this.active.length && changed)) {
-
- this.stop();
- this.render(this.options.hover.animationDuration);
- }
- }
-
- // Remember Last Active
- this.lastActive = this.active;
- return this;
- },
- });
-
-
-}).call(this);
helpers = Chart.helpers;
Chart.RectangularCanvasController = function(chart, elementController) {
- this.chart = chart;
+ this.chartInstance = chart;
this.elementController = elementController;
};
this.buildScales();
// Need to fit scales before we reset elements.
- Chart.scaleService.fitScalesForChart(this.chart, this.chart.chart.width, this.chart.chart.height);
+ Chart.scaleService.fitScalesForChart(this.chartInstance, this.chartInstance.chart.width, this.chartInstance.chart.height);
this.elementController.resetElements();
this.initToolTip();
- this.chart.update();
+ this.chartInstance.update();
};
Chart.RectangularCanvasController.prototype.bindEvents = function() {
- helpers.bindEvents(this.chart, this.chart.options.events, this.chart.events);
+ helpers.bindEvents(this.chartInstance, this.chartInstance.options.events, function(evt) {
+ // this will be the chart instance
+ this.canvasController.eventHandler(evt);
+ });
+ };
+
+ Chart.RectangularCanvasController.prototype.eventHandler = function(e) {
+ this.lastActive = this.lastActive || [];
+
+ // Find Active Elements
+ if (e.type == 'mouseout') {
+ this.active = [];
+ } else {
+ this.active = function() {
+ switch (this.chartInstance.options.hover.mode) {
+ case 'single':
+ return this.elementController.getElementAtEvent(e);
+ case 'label':
+ return this.elementController.getElementsAtEvent(e);
+ case 'dataset':
+ return this.elementController.getDatasetAtEvent(e);
+ default:
+ return e;
+ }
+ }.call(this);
+ }
+
+ // On Hover hook
+ if (this.chartInstance.options.hover.onHover) {
+ this.chartInstance.options.hover.onHover.call(this.chartInstance, this.active);
+ }
+
+ if (e.type == 'mouseup' || e.type == 'click') {
+ if (this.chartInstance.options.onClick) {
+ this.chartInstance.options.onClick.call(this, e, this.active);
+ }
+ }
+
+ var dataset;
+ var index;
+ // Remove styling for last active (even if it may still be active)
+ if (this.lastActive.length) {
+ switch (this.chartInstance.options.hover.mode) {
+ case 'single':
+ this.elementController.updatePointElementAppearance(this.lastActive[0], this.lastActive[0]._datasetIndex, this.lastActive[0]._index);
+ break;
+ case 'label':
+ for (var i = 0; i < this.lastActive.length; i++) {
+ this.elementController.updatePointElementAppearance(this.lastActive[i], this.lastActive[i]._datasetIndex, this.lastActive[i]._index);
+ }
+ break;
+ case 'dataset':
+ break;
+ default:
+ // Don't change anything
+ }
+ }
+
+ // Built in hover styling
+ if (this.active.length && this.chartInstance.options.hover.mode) {
+ switch (this.chartInstance.options.hover.mode) {
+ case 'single':
+ this.elementController.setPointHoverStyle(this.active[0]);
+ break;
+ case 'label':
+ for (var i = 0; i < this.active.length; i++) {
+ this.elementController.setPointHoverStyle(this.active[i]);
+ }
+ break;
+ case 'dataset':
+ break;
+ default:
+ // Don't change anything
+ }
+ }
+
+
+ // Built in Tooltips
+ if (this.chartInstance.options.tooltips.enabled) {
+
+ // The usual updates
+ this.chartInstance.tooltip.initialize();
+
+ // Active
+ if (this.active.length) {
+ this.chartInstance.tooltip._model.opacity = 1;
+
+ helpers.extend(this.chartInstance.tooltip, {
+ _active: this.active,
+ });
+
+ this.chartInstance.tooltip.update();
+ } else {
+ // Inactive
+ this.chartInstance.tooltip._model.opacity = 0;
+ }
+ }
+
+ // Hover animations
+ this.chartInstance.tooltip.pivot();
+
+ if (!this.chartInstance.animating) {
+ var changed;
+
+ helpers.each(this.active, function(element, index) {
+ if (element !== this.lastActive[index]) {
+ changed = true;
+ }
+ }, this);
+
+ // If entering, leaving, or changing elements, animate the change via pivot
+ if ((!this.lastActive.length && this.active.length) ||
+ (this.lastActive.length && !this.active.length) ||
+ (this.lastActive.length && this.active.length && changed)) {
+
+ this.chartInstance.stop();
+ this.chartInstance.render(this.chartInstance.options.hover.animationDuration);
+ }
+ }
+
+ // Remember Last Active
+ this.lastActive = this.active;
+ return this;
};
Chart.RectangularCanvasController.prototype.initToolTip = function() {
- this.chart.tooltip = new Chart.Tooltip({
- _chart: this.chart.chart,
- _data: this.chart.data,
- _options: this.chart.options,
+ this.chartInstance.tooltip = new Chart.Tooltip({
+ _chart: this.chartInstance.chart,
+ _data: this.chartInstance.data,
+ _options: this.chartInstance.options,
}, this);
};
Chart.RectangularCanvasController.prototype.buildScales = function() {
// Map of scale ID to scale object so we can lookup later
- this.chart.scales = {};
+ this.chartInstance.scales = {};
// Build the x axes
- helpers.each(this.chart.options.scales.xAxes, function(xAxisOptions) {
+ helpers.each(this.chartInstance.options.scales.xAxes, function(xAxisOptions) {
var ScaleClass = Chart.scaleService.getScaleConstructor(xAxisOptions.type);
var scale = new ScaleClass({
- ctx: this.chart.chart.ctx,
+ ctx: this.chartInstance.chart.ctx,
options: xAxisOptions,
- data: this.chart.data,
+ data: this.chartInstance.data,
id: xAxisOptions.id,
});
- this.chart.scales[scale.id] = scale;
+ this.chartInstance.scales[scale.id] = scale;
}, this);
// Build the y axes
- helpers.each(this.chart.options.scales.yAxes, function(yAxisOptions) {
+ helpers.each(this.chartInstance.options.scales.yAxes, function(yAxisOptions) {
var ScaleClass = Chart.scaleService.getScaleConstructor(yAxisOptions.type);
var scale = new ScaleClass({
- ctx: this.chart.chart.ctx,
+ ctx: this.chartInstance.chart.ctx,
options: yAxisOptions,
- data: this.chart.data,
+ data: this.chartInstance.data,
id: yAxisOptions.id,
});
- this.chart.scales[scale.id] = scale;
+ this.chartInstance.scales[scale.id] = scale;
}, this);
};
Chart.RectangularCanvasController.prototype.update = function() {
- Chart.scaleService.fitScalesForChart(this.chart, this.chart.chart.width, this.chart.chart.height);
+ Chart.scaleService.fitScalesForChart(this.chartInstance, this.chartInstance.chart.width, this.chartInstance.chart.height);
this.elementController.updateElements();
};
}).call(this);
helpers = Chart.helpers;
Chart.RectangularElementController = function(chart) {
- this.chart = chart;
+ this.chartInstance = chart;
};
Chart.RectangularElementController.prototype.getScaleForId = function getScaleForId(scaleID) {
- return this.chart.scales[scaleID];
+ return this.chartInstance.scales[scaleID];
};
// 2 helper functions to get points in collections
};
Chart.RectangularElementController.prototype.eachLine = function eachLine(callback) {
- helpers.each(this.chart.data.datasets, function(dataset, datasetIndex) {
+ helpers.each(this.chartInstance.data.datasets, function(dataset, datasetIndex) {
callback.call(this, dataset, datasetIndex)
}, this);
};
Chart.RectangularElementController.prototype.eachPoint = function eachPoint(callback) {
- helpers.each(this.chart.data.datasets, function(dataset, datasetIndex) {
+ helpers.each(this.chartInstance.data.datasets, function(dataset, datasetIndex) {
helpers.each(dataset.metaData, callback, this, dataset.metaData, datasetIndex);
}, this);
};
Chart.RectangularElementController.prototype.addLine = function addLine(dataset, datasetIndex) {
if (dataset) {
dataset.metaDataset = new Chart.Line({
- _chart: this.chart.chart,
+ _chart: this.chartInstance.chart,
_datasetIndex: datasetIndex,
_points: dataset.metaData,
});
Chart.RectangularElementController.prototype.addPoint = function addPoint(dataset, datasetIndex, index) {
if (dataset) {
- dataset.metaData = dataset.metaData || new Array(this.chart.data.datasets[datasetIndex].data.length);
+ dataset.metaData = dataset.metaData || new Array(this.chartInstance.data.datasets[datasetIndex].data.length);
if (index < dataset.metaData.length) {
dataset.metaData[index] = new Chart.Point({
_datasetIndex: datasetIndex,
_index: index,
- _chart: this.chart.chart,
+ _chart: this.chartInstance.chart,
_model: {
x: 0,
y: 0,
Chart.RectangularElementController.prototype.resetPoints = function() {
this.eachPoint(function(point, index, dataset, datasetIndex) {
- var xScale = this.getScaleForId(this.chart.data.datasets[datasetIndex].xAxisID);
- var yScale = this.getScaleForId(this.chart.data.datasets[datasetIndex].yAxisID);
+ var xScale = this.getScaleForId(this.chartInstance.data.datasets[datasetIndex].xAxisID);
+ var yScale = this.getScaleForId(this.chartInstance.data.datasets[datasetIndex].yAxisID);
var yScalePoint;
helpers.extend(point, {
// Utility
- _chart: this.chart.chart, //WTF
+ _chart: this.chartInstance.chart, //WTF
_xScale: xScale,
_yScale: yScale,
_datasetIndex: datasetIndex,
// Desired view properties
_model: {
- x: xScale.getPointPixelForValue(this.chart.data.datasets[datasetIndex].data[index], index, datasetIndex),
+ x: xScale.getPointPixelForValue(this.chartInstance.data.datasets[datasetIndex].data[index], index, datasetIndex),
y: yScalePoint,
},
});
// Model
_model: {
// Appearance
- tension: dataset.metaDataset.custom && dataset.metaDataset.custom.tension ? dataset.metaDataset.custom.tension : (dataset.tension || this.chart.options.elements.line.tension),
- backgroundColor: dataset.metaDataset.custom && dataset.metaDataset.custom.backgroundColor ? dataset.metaDataset.custom.backgroundColor : (dataset.backgroundColor || this.chart.options.elements.line.backgroundColor),
- borderWidth: dataset.metaDataset.custom && dataset.metaDataset.custom.borderWidth ? dataset.metaDataset.custom.borderWidth : (dataset.borderWidth || this.chart.options.elements.line.borderWidth),
- borderColor: dataset.metaDataset.custom && dataset.metaDataset.custom.borderColor ? dataset.metaDataset.custom.borderColor : (dataset.borderColor || this.chart.options.elements.line.borderColor),
- fill: dataset.metaDataset.custom && dataset.metaDataset.custom.fill ? dataset.metaDataset.custom.fill : (dataset.fill !== undefined ? dataset.fill : this.chart.options.elements.line.fill),
- skipNull: dataset.skipNull !== undefined ? dataset.skipNull : this.chart.options.elements.line.skipNull,
- drawNull: dataset.drawNull !== undefined ? dataset.drawNull : this.chart.options.elements.line.drawNull,
+ tension: dataset.metaDataset.custom && dataset.metaDataset.custom.tension ? dataset.metaDataset.custom.tension : (dataset.tension || this.chartInstance.options.elements.line.tension),
+ backgroundColor: dataset.metaDataset.custom && dataset.metaDataset.custom.backgroundColor ? dataset.metaDataset.custom.backgroundColor : (dataset.backgroundColor || this.chartInstance.options.elements.line.backgroundColor),
+ borderWidth: dataset.metaDataset.custom && dataset.metaDataset.custom.borderWidth ? dataset.metaDataset.custom.borderWidth : (dataset.borderWidth || this.chartInstance.options.elements.line.borderWidth),
+ borderColor: dataset.metaDataset.custom && dataset.metaDataset.custom.borderColor ? dataset.metaDataset.custom.borderColor : (dataset.borderColor || this.chartInstance.options.elements.line.borderColor),
+ fill: dataset.metaDataset.custom && dataset.metaDataset.custom.fill ? dataset.metaDataset.custom.fill : (dataset.fill !== undefined ? dataset.fill : this.chartInstance.options.elements.line.fill),
+ skipNull: dataset.skipNull !== undefined ? dataset.skipNull : this.chartInstance.options.elements.line.skipNull,
+ drawNull: dataset.drawNull !== undefined ? dataset.drawNull : this.chartInstance.options.elements.line.drawNull,
// Scale
scaleTop: yScale.top,
scaleBottom: yScale.bottom,
Chart.RectangularElementController.prototype.updatePoints = function() {
this.eachPoint(function(point, index, dataset, datasetIndex) {
- var xScale = this.getScaleForId(this.chart.data.datasets[datasetIndex].xAxisID);
- var yScale = this.getScaleForId(this.chart.data.datasets[datasetIndex].yAxisID);
+ var xScale = this.getScaleForId(this.chartInstance.data.datasets[datasetIndex].xAxisID);
+ var yScale = this.getScaleForId(this.chartInstance.data.datasets[datasetIndex].yAxisID);
helpers.extend(point, {
// Utility
- _chart: this.chart.chart,
+ _chart: this.chartInstance.chart,
_xScale: xScale,
_yScale: yScale,
_datasetIndex: datasetIndex,
// Desired view properties
_model: {
- x: xScale.getPointPixelForValue(this.chart.data.datasets[datasetIndex].data[index], index, datasetIndex),
- y: yScale.getPointPixelForValue(this.chart.data.datasets[datasetIndex].data[index], index, datasetIndex),
+ x: xScale.getPointPixelForValue(this.chartInstance.data.datasets[datasetIndex].data[index], index, datasetIndex),
+ y: yScale.getPointPixelForValue(this.chartInstance.data.datasets[datasetIndex].data[index], index, datasetIndex),
},
});
Chart.RectangularElementController.prototype.updatePointElementAppearance = function(point, datasetIndex, index) {
helpers.extend(point._model, {
// Appearance
- tension: point.custom && point.custom.tension ? point.custom.tension : this.chart.options.elements.line.tension,
- radius: point.custom && point.custom.radius ? point.custom.radius : helpers.getValueAtIndexOrDefault(this.chart.data.datasets[datasetIndex].radius, index, this.chart.options.elements.point.radius),
- backgroundColor: point.custom && point.custom.backgroundColor ? point.custom.backgroundColor : helpers.getValueAtIndexOrDefault(this.chart.data.datasets[datasetIndex].pointBackgroundColor, index, this.chart.options.elements.point.backgroundColor),
- borderColor: point.custom && point.custom.borderColor ? point.custom.borderColor : helpers.getValueAtIndexOrDefault(this.chart.data.datasets[datasetIndex].pointBorderColor, index, this.chart.options.elements.point.borderColor),
- borderWidth: point.custom && point.custom.borderWidth ? point.custom.borderWidth : helpers.getValueAtIndexOrDefault(this.chart.data.datasets[datasetIndex].pointBorderWidth, index, this.chart.options.elements.point.borderWidth),
- skip: this.chart.data.datasets[datasetIndex].data[index] === null,
+ tension: point.custom && point.custom.tension ? point.custom.tension : this.chartInstance.options.elements.line.tension,
+ radius: point.custom && point.custom.radius ? point.custom.radius : helpers.getValueAtIndexOrDefault(this.chartInstance.data.datasets[datasetIndex].radius, index, this.chartInstance.options.elements.point.radius),
+ backgroundColor: point.custom && point.custom.backgroundColor ? point.custom.backgroundColor : helpers.getValueAtIndexOrDefault(this.chartInstance.data.datasets[datasetIndex].pointBackgroundColor, index, this.chartInstance.options.elements.point.backgroundColor),
+ borderColor: point.custom && point.custom.borderColor ? point.custom.borderColor : helpers.getValueAtIndexOrDefault(this.chartInstance.data.datasets[datasetIndex].pointBorderColor, index, this.chartInstance.options.elements.point.borderColor),
+ borderWidth: point.custom && point.custom.borderWidth ? point.custom.borderWidth : helpers.getValueAtIndexOrDefault(this.chartInstance.data.datasets[datasetIndex].pointBorderWidth, index, this.chartInstance.options.elements.point.borderWidth),
+ skip: this.chartInstance.data.datasets[datasetIndex].data[index] === null,
// Tooltip
- hitRadius: point.custom && point.custom.hitRadius ? point.custom.hitRadius : helpers.getValueAtIndexOrDefault(this.chart.data.datasets[datasetIndex].hitRadius, index, this.chart.options.elements.point.hitRadius),
+ hitRadius: point.custom && point.custom.hitRadius ? point.custom.hitRadius : helpers.getValueAtIndexOrDefault(this.chartInstance.data.datasets[datasetIndex].hitRadius, index, this.chartInstance.options.elements.point.hitRadius),
});
};
+ Chart.RectangularElementController.prototype.setPointHoverStyle = function(point) {
+ var dataset = this.chartInstance.data.datasets[point._datasetIndex];
+ var index = point._index;
+
+ point._model.radius = point.custom && point.custom.radius ? point.custom.radius : helpers.getValueAtIndexOrDefault(dataset.pointHoverRadius, index, this.chartInstance.options.elements.point.hoverRadius);
+ point._model.backgroundColor = point.custom && point.custom.hoverBackgroundColor ? point.custom.hoverBackgroundColor : helpers.getValueAtIndexOrDefault(dataset.pointHoverBackgroundColor, index, helpers.color(point._model.backgroundColor).saturate(0.5).darken(0.1).rgbString());
+ point._model.borderColor = point.custom && point.custom.hoverBorderColor ? point.custom.hoverBorderColor : helpers.getValueAtIndexOrDefault(dataset.pointHoverBorderColor, index, helpers.color(point._model.borderColor).saturate(0.5).darken(0.1).rgbString());
+ point._model.borderWidth = point.custom && point.custom.hoverBorderWidth ? point.custom.hoverBorderWidth : helpers.getValueAtIndexOrDefault(dataset.pointBorderWidth, index, point._model.borderWidth);
+ };
+
Chart.RectangularElementController.prototype.updateBezierControlPoints = function updateBezierControlPoints() {
// Update control points for the bezier curve
this.eachPoint(function(point, index, dataset, datasetIndex) {
// Prevent the bezier going outside of the bounds of the graph
// Cap puter bezier handles to the upper/lower scale bounds
- if (controlPoints.next.y > this.chart.chartArea.bottom) {
- point._model.controlPointNextY = this.chart.chartArea.bottom;
- } else if (controlPoints.next.y < this.chart.chartArea.top) {
- point._model.controlPointNextY = this.chart.chartArea.top;
+ if (controlPoints.next.y > this.chartInstance.chartArea.bottom) {
+ point._model.controlPointNextY = this.chartInstance.chartArea.bottom;
+ } else if (controlPoints.next.y < this.chartInstance.chartArea.top) {
+ point._model.controlPointNextY = this.chartInstance.chartArea.top;
} else {
point._model.controlPointNextY = controlPoints.next.y;
}
// Cap inner bezier handles to the upper/lower scale bounds
- if (controlPoints.previous.y > this.chart.chartArea.bottom) {
- point._model.controlPointPreviousY = this.chart.chartArea.bottom;
- } else if (controlPoints.previous.y < this.chart.chartArea.top) {
- point._model.controlPointPreviousY = this.chart.chartArea.top;
+ if (controlPoints.previous.y > this.chartInstance.chartArea.bottom) {
+ point._model.controlPointPreviousY = this.chartInstance.chartArea.bottom;
+ } else if (controlPoints.previous.y < this.chartInstance.chartArea.top) {
+ point._model.controlPointPreviousY = this.chartInstance.chartArea.top;
} else {
point._model.controlPointPreviousY = controlPoints.previous.y;
}
}, this);
};
+ Chart.RectangularElementController.prototype.getElementsAtEvent = function(e) {
+ var elementsArray = [],
+ eventPosition = helpers.getRelativePosition(e),
+ datasetIterator = function(dataset) {
+ elementsArray.push(dataset.metaData[elementIndex]);
+ },
+ elementIndex;
+
+ for (var datasetIndex = 0; datasetIndex < this.chartInstance.data.datasets.length; datasetIndex++) {
+ for (elementIndex = 0; elementIndex < this.chartInstance.data.datasets[datasetIndex].metaData.length; elementIndex++) {
+ if (this.chartInstance.data.datasets[datasetIndex].metaData[elementIndex].inGroupRange(eventPosition.x, eventPosition.y)) {
+ helpers.each(this.chartInstance.data.datasets, datasetIterator);
+ }
+ }
+ }
+
+ return elementsArray.length ? elementsArray : [];
+ };
+
+ // Get the single element that was clicked on
+ // @return : An object containing the dataset index and element index of the matching element. Also contains the rectangle that was drawn
+ Chart.RectangularElementController.prototype.getElementAtEvent = function(e) {
+ var element = [];
+ var eventPosition = helpers.getRelativePosition(e);
+
+ for (var datasetIndex = 0; datasetIndex < this.chartInstance.data.datasets.length; ++datasetIndex) {
+ for (var elementIndex = 0; elementIndex < this.chartInstance.data.datasets[datasetIndex].metaData.length; ++elementIndex) {
+ if (this.chartInstance.data.datasets[datasetIndex].metaData[elementIndex].inRange(eventPosition.x, eventPosition.y)) {
+ element.push(this.chartInstance.data.datasets[datasetIndex].metaData[elementIndex]);
+ return element;
+ }
+ }
+ }
+
+ return [];
+ };
+
}).call(this);
return this;
},
- redraw: noop,
+ update: function(animationDuration) {
+ this.canvasController.update();
+ this.render(animationDuration);
+ },
render: function(duration) {
if (this.options.animation.duration !== 0 || duration) {