+++ /dev/null
-(function() {
- "use strict";
-
- var root = this,
- Chart = root.Chart,
- helpers = Chart.helpers;
-
-
- Chart.defaults.bar = {
- hover: {
- mode: "label"
- },
-
- scales: {
- xAxes: [{
- type: "category",
- categorySpacing: 10,
- spacing: 1,
-
- // grid line settings
- gridLines: {
- offsetGridLines: true,
- },
- }],
- yAxes: [{
- type: "linear",
- }],
- },
- };
-
- // Chart.Type.extend({
- // name: "Bar",
- // defaults: defaultConfig,
- // initialize: function() {
- // this.elementController = new Chart.RectangularElementController(this);
- // this.canvasController = new Chart.RectangularCanvasController(this, this.elementController);
-
- // //Create a new bar for each piece of data
- // helpers.each(this.data.datasets, function(dataset, datasetIndex) {
- // helpers.each(dataset.data, function(dataPoint, index) {
- // this.elementController.addRectangle(dataset, datasetIndex, index);
- // }, this);
-
- // // The bar chart only supports a single x axis because the x axis is always a category axis
- // dataset.xAxisID = this.options.scales.xAxes[0].id;
-
- // if (!dataset.yAxisID) {
- // dataset.yAxisID = this.options.scales.yAxes[0].id;
- // }
- // }, this);
-
- // this.canvasController.initialize();
- // },
- // draw: function(ease) {
-
- // var easingDecimal = ease || 1;
- // this.clear();
-
- // // Draw all the scales
- // helpers.each(this.scales, function(scale) {
- // scale.draw(this.chartArea);
- // }, this);
-
- // //Draw all the bars for each dataset
- // this.eachElement(function(bar, index, datasetIndex) {
- // bar.transition(easingDecimal).draw();
- // }, this);
-
- // // Finally draw the tooltip
- // this.tooltip.transition(easingDecimal).draw();
- // },
- // });
-
-
-}).call(this);
+++ /dev/null
-(function() {
- "use strict";
-
- var root = this,
- Chart = root.Chart,
- helpers = Chart.helpers;
-
- var defaultConfig = {
- hover: {
- mode: "label"
- },
-
- scales: {
- xAxes: [{
- type: "category",
- }],
- yAxes: [{
- type: "linear",
- }],
- },
- };
-
-
- Chart.Type.extend({
- name: "Line",
- defaults: defaultConfig,
- initialize: function() {
-
- 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.elementController.addLine(dataset, datasetIndex);
-
- helpers.each(dataset.data, function(dataPoint, 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
- if (!dataset.xAxisID) {
- dataset.xAxisID = this.options.scales.xAxes[0].id;
- }
-
- if (!dataset.yAxisID) {
- dataset.yAxisID = this.options.scales.yAxes[0].id;
- }
- }, this);
-
- this.canvasController.initialize();
- },
- draw: function(ease) {
-
- var easingDecimal = ease || 1;
- this.clear();
-
- // Draw all the scales
- helpers.each(this.scales, function(scale) {
- scale.draw(this.chartArea);
- }, this);
-
- // reverse for-loop for proper stacking
- for (var i = this.data.datasets.length - 1; i >= 0; i--) {
-
- var dataset = this.data.datasets[i];
-
- // Transition Point Locations
- helpers.each(dataset.metaData, function(point, index) {
- point.transition(easingDecimal);
- }, this);
-
- // Transition and Draw the line
- dataset.metaDataset.transition(easingDecimal).draw();
-
- // Draw the points
- helpers.each(dataset.metaData, function(point) {
- point.draw();
- });
- }
-
- // Finally draw the tooltip
- this.tooltip.transition(easingDecimal).draw();
- },
- });
-}).call(this);
Chart = root.Chart,
helpers = Chart.helpers;
+ Chart.defaults.bar = {
+ hover: {
+ mode: "label"
+ },
+
+ scales: {
+ xAxes: [{
+ type: "category",
+ categorySpacing: 10,
+ spacing: 1,
+
+ // grid line settings
+ gridLines: {
+ offsetGridLines: true,
+ },
+ }],
+ yAxes: [{
+ type: "linear",
+ }],
+ },
+ };
+
Chart.controllers.bar = function(chart, datasetIndex) {
this.initialize.call(this, chart, datasetIndex);
};
+ setHoverStyle: function(rectangle) {
+ var dataset = this.chart.data.datasets[rectangle._datasetIndex];
+ var index = rectangle._index;
-
-
-
-
- // eachLine: function eachLine(callback) {
- // helpers.each(this.chart.data.datasets, function(dataset, datasetIndex) {
- // if (dataset.metaDataset && dataset.metaDataset instanceof Chart.Line) {
- // callback.call(this, dataset, datasetIndex);
- // }
- // }, this);
- // },
-
- // addLine: function addLine(dataset, datasetIndex) {
- // if (dataset) {
- // dataset.metaDataset = new Chart.Line({
- // _chart: this.chart.chart,
- // _datasetIndex: datasetIndex,
- // _points: dataset.metaData,
- // });
- // }
- // },
-
- // addPoint: function addPoint(dataset, datasetIndex, index) {
- // if (dataset) {
- // dataset.metaData = dataset.metaData || new Array(this.chart.data.datasets[datasetIndex].data.length);
-
- // if (index < dataset.metaData.length) {
- // dataset.metaData[index] = new Chart.Point({
- // _datasetIndex: datasetIndex,
- // _index: index,
- // _chart: this.chart.chart,
- // _model: {
- // x: 0,
- // y: 0,
- // },
- // });
- // }
- // }
- // },
-
-
-
- // resetElements: function resetElements() {
- // helpers.each(this.chart.data.datasets, function(dataset, datasetIndex) {
- // // All elements must be the same type for the given dataset so we are fine to check just the first one
- // if (dataset.metaData[0] instanceof Chart.Point) {
- // // Have points. Update all of them
- // this.resetDatasetPoints(dataset, datasetIndex);
- // } else if (dataset.metaData[0] instanceof Chart.Rectangle) {
- // // Have rectangles (bars)
- // this.resetDatasetRectangles(dataset, datasetIndex);
- // }
- // }, this);
- // },
-
- // resetDatasetPoints: function resetDatasetPoints(dataset, datasetIndex) {
- // helpers.each(dataset.metaData, function(point, index) {
- // var xScale = this.getScaleForId(this.chart.data.datasets[datasetIndex].xAxisID);
- // var yScale = this.getScaleForId(this.chart.data.datasets[datasetIndex].yAxisID);
-
- // var yScalePoint;
-
- // if (yScale.min < 0 && yScale.max < 0) {
- // // all less than 0. use the top
- // yScalePoint = yScale.getPixelForValue(yScale.max);
- // } else if (yScale.min > 0 && yScale.max > 0) {
- // yScalePoint = yScale.getPixelForValue(yScale.min);
- // } else {
- // yScalePoint = yScale.getPixelForValue(0);
- // }
-
- // helpers.extend(point, {
- // // Utility
- // _chart: this.chart.chart, //WTF
- // _xScale: xScale,
- // _yScale: yScale,
- // _datasetIndex: datasetIndex,
- // _index: index,
-
- // // Desired view properties
- // _model: {
- // x: xScale.getPointPixelForValue(this.chart.data.datasets[datasetIndex].data[index], index, datasetIndex),
- // y: yScalePoint,
- // },
- // });
-
- // this.updatePointElementAppearance(point, datasetIndex, index);
- // }, this);
-
- // this.updateBezierControlPoints(dataset);
- // },
-
- // resetDatasetRectangles: function resetDatasetRectangles(dataset, datasetIndex) {
-
- // },
-
- // resetElementAppearance: function(element, datasetIndex, index) {
- // if (element instanceof Chart.Point) {
- // this.updatePointElementAppearance(element, datasetIndex, index);
- // } else if (element instanceof Chart.Rectangle) {
- // this.updateRectangleElementAppearance(element, datasetIndex, index);
- // }
- // },
-
- // updateElements: function updateElements() {
- // // Update the lines
- // this.updateLines();
-
- // helpers.each(this.chart.data.datasets, function(dataset, datasetIndex) {
- // // All elements must be the same type for the given dataset so we are fine to check just the first one
- // if (dataset.metaData[0] instanceof Chart.Point) {
- // // Have points. Update all of them
- // this.updatePoints(dataset, datasetIndex);
- // } else if (dataset.metaData[0] instanceof Chart.Rectangle) {
- // // Have rectangles (bars)
- // this.updateRectangles(dataset, datasetIndex);
- // }
- // }, this);
- // },
-
- // updateLines: function updateLines() {
- // this.eachLine(function(dataset, datasetIndex) {
- // var yScale = this.getScaleForId(dataset.yAxisID);
- // var scaleBase;
-
- // if (yScale.min < 0 && yScale.max < 0) {
- // scaleBase = yScale.getPixelForValue(yScale.max);
- // } else if (yScale.min > 0 && yScale.max > 0) {
- // scaleBase = yScale.getPixelForValue(yScale.min);
- // } else {
- // scaleBase = yScale.getPixelForValue(0);
- // }
-
- // helpers.extend(dataset.metaDataset, {
- // // Utility
- // _scale: yScale,
- // _datasetIndex: datasetIndex,
- // // Data
- // _children: dataset.metaData,
- // // 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,
- // // Scale
- // scaleTop: yScale.top,
- // scaleBottom: yScale.bottom,
- // scaleZero: scaleBase,
- // },
- // });
-
- // dataset.metaDataset.pivot();
- // });
- // },
-
- // updatePoints: function updatePoints(dataset, datasetIndex) {
- // helpers.each(dataset.metaData, function(point, index) {
- // var xScale = this.getScaleForId(this.chart.data.datasets[datasetIndex].xAxisID);
- // var yScale = this.getScaleForId(this.chart.data.datasets[datasetIndex].yAxisID);
-
- // helpers.extend(point, {
- // // Utility
- // _chart: this.chart.chart,
- // _xScale: xScale,
- // _yScale: yScale,
- // _datasetIndex: datasetIndex,
- // _index: index,
-
- // // 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),
- // },
- // });
-
- // this.updatePointElementAppearance(point, datasetIndex, index);
- // }, this);
-
- // this.updateBezierControlPoints(dataset);
- // },
-
- // updatePointElementAppearance: function updatePointElementAppearance(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,
-
- // // 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),
- // });
- // },
-
-
- // setElementHoverStyle: function setElementHoverStyle(element) {
- // if (element instanceof Chart.Point) {
- // this.setPointHoverStyle(element);
- // } else if (element instanceof Chart.Rectangle) {
- // this.setRectangleHoverStyle(element);
- // }
- // },
-
- // setPointHoverStyle: function setPointHoverStyle(point) {
- // var dataset = this.chart.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.chart.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);
- // },
-
- // setHoverStyle: function(rectangle) {
- // var dataset = this.chart.data.datasets[rectangle._datasetIndex];
- // var index = rectangle._index;
-
- // rectangle._model.backgroundColor = rectangle.custom && rectangle.custom.hoverBackgroundColor ? rectangle.custom.hoverBackgroundColor : helpers.getValueAtIndexOrDefault(dataset.hoverBackgroundColor, index, helpers.color(rectangle._model.backgroundColor).saturate(0.5).darken(0.1).rgbString());
- // rectangle._model.borderColor = rectangle.custom && rectangle.custom.hoverBorderColor ? rectangle.custom.hoverBorderColor : helpers.getValueAtIndexOrDefault(dataset.hoverBorderColor, index, helpers.color(rectangle._model.borderColor).saturate(0.5).darken(0.1).rgbString());
- // rectangle._model.borderWidth = rectangle.custom && rectangle.custom.hoverBorderWidth ? rectangle.custom.hoverBorderWidth : helpers.getValueAtIndexOrDefault(dataset.borderWidth, index, rectangle._model.borderWidth);
- // },
-
- // updateBezierControlPoints: function updateBezierControlPoints(dataset) {
- // // Update control points for the bezier curve
- // helpers.each(dataset.metaData, function(point, index) {
- // var controlPoints = helpers.splineCurve(
- // this.previousPoint(dataset.metaData, index)._model,
- // point._model,
- // this.nextPoint(dataset.metaData, index)._model,
- // point._model.tension
- // );
-
- // point._model.controlPointPreviousX = controlPoints.previous.x;
- // point._model.controlPointNextX = controlPoints.next.x;
-
- // // 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;
- // } 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;
- // } else {
- // point._model.controlPointPreviousY = controlPoints.previous.y;
- // }
-
- // // Now pivot the point for animation
- // point.pivot();
- // }, this);
- // },
-
- getElementsAtEvent: function(e) {
- var elementsArray = [],
- eventPosition = helpers.getRelativePosition(e),
- datasetIterator = function(dataset) {
- elementsArray.push(dataset.metaData[elementIndex]);
- },
- elementIndex;
-
- for (var datasetIndex = 0; datasetIndex < this.chart.data.datasets.length; datasetIndex++) {
- for (elementIndex = 0; elementIndex < this.chart.data.datasets[datasetIndex].metaData.length; elementIndex++) {
- if (this.chart.data.datasets[datasetIndex].metaData[elementIndex].inGroupRange(eventPosition.x, eventPosition.y)) {
- helpers.each(this.chart.data.datasets, datasetIterator);
- }
- }
- }
-
- return elementsArray.length ? elementsArray : [];
+ rectangle._model.backgroundColor = rectangle.custom && rectangle.custom.hoverBackgroundColor ? rectangle.custom.hoverBackgroundColor : helpers.getValueAtIndexOrDefault(dataset.hoverBackgroundColor, index, helpers.color(rectangle._model.backgroundColor).saturate(0.5).darken(0.1).rgbString());
+ rectangle._model.borderColor = rectangle.custom && rectangle.custom.hoverBorderColor ? rectangle.custom.hoverBorderColor : helpers.getValueAtIndexOrDefault(dataset.hoverBorderColor, index, helpers.color(rectangle._model.borderColor).saturate(0.5).darken(0.1).rgbString());
+ rectangle._model.borderWidth = rectangle.custom && rectangle.custom.hoverBorderWidth ? rectangle.custom.hoverBorderWidth : helpers.getValueAtIndexOrDefault(dataset.borderWidth, index, rectangle._model.borderWidth);
},
- // // 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
- getElementAtEvent: function(e) {
- var element = [];
- var eventPosition = helpers.getRelativePosition(e);
-
- for (var datasetIndex = 0; datasetIndex < this.chart.data.datasets.length; ++datasetIndex) {
- for (var elementIndex = 0; elementIndex < this.chart.data.datasets[datasetIndex].metaData.length; ++elementIndex) {
- if (this.chart.data.datasets[datasetIndex].metaData[elementIndex].inRange(eventPosition.x, eventPosition.y)) {
- element.push(this.chart.data.datasets[datasetIndex].metaData[elementIndex]);
- return element;
- }
- }
- }
+ removeHoverStyle: function(rectangle) {
+ // TODO
+ }
- return [];
- },
});
(function() {
"use strict";
+ return;
+
var root = this,
Chart = root.Chart,
//Cache a local reference to Chart.helpers
var location = helpers.getRelativePosition(e);
this.eachElement(function(slice, index) {
- if (slice.inGroupRange(location.x, location.y)) {
+ if (slice.inLabelRange(location.x, location.y)) {
elements.push(slice);
}
}, this);
Chart = root.Chart,
helpers = Chart.helpers;
+ Chart.defaults.line = {
+ hover: {
+ mode: "label"
+ },
+
+ scales: {
+ xAxes: [{
+ type: "category",
+ }],
+ yAxes: [{
+ type: "linear",
+ }],
+ },
+ };
+
+
Chart.controllers.line = function(chart, datasetIndex) {
this.initialize.call(this, chart, datasetIndex);
};
});
},
+ setHoverStyle: function(point) {
+ // Point
+ var dataset = this.chart.data.datasets[point._datasetIndex];
+ var index = point._index;
-
-
-
-
-
-
- // eachLine: function eachLine(callback) {
- // helpers.each(this.chart.data.datasets, function(dataset, datasetIndex) {
- // if (dataset.metaDataset && dataset.metaDataset instanceof Chart.Line) {
- // callback.call(this, dataset, datasetIndex);
- // }
- // }, this);
- // },
-
- // addPoint: function addPoint(dataset, datasetIndex, index) {
- // if (dataset) {
- // dataset.metaData = dataset.metaData || new Array(this.chart.data.datasets[datasetIndex].data.length);
-
- // if (index < dataset.metaData.length) {
- // dataset.metaData[index] = new Chart.Point({
- // _datasetIndex: datasetIndex,
- // _index: index,
- // _chart: this.chart.chart,
- // _model: {
- // x: 0,
- // y: 0,
- // },
- // });
- // }
- // }
- // },
-
-
-
- // resetElements: function resetElements() {
- // helpers.each(this.chart.data.datasets, function(dataset, datasetIndex) {
- // // All elements must be the same type for the given dataset so we are fine to check just the first one
- // if (dataset.metaData[0] instanceof Chart.Point) {
- // // Have points. Update all of them
- // this.resetDatasetPoints(dataset, datasetIndex);
- // } else if (dataset.metaData[0] instanceof Chart.Rectangle) {
- // // Have rectangles (lines)
- // this.resetDatasetRectangles(dataset, datasetIndex);
- // }
- // }, this);
- // },
-
- // resetDatasetPoints: function resetDatasetPoints(dataset, datasetIndex) {
- // helpers.each(dataset.metaData, function(point, index) {
- // var xScale = this.getScaleForId(this.chart.data.datasets[datasetIndex].xAxisID);
- // var yScale = this.getScaleForId(this.chart.data.datasets[datasetIndex].yAxisID);
-
- // var yScalePoint;
-
- // if (yScale.min < 0 && yScale.max < 0) {
- // // all less than 0. use the top
- // yScalePoint = yScale.getPixelForValue(yScale.max);
- // } else if (yScale.min > 0 && yScale.max > 0) {
- // yScalePoint = yScale.getPixelForValue(yScale.min);
- // } else {
- // yScalePoint = yScale.getPixelForValue(0);
- // }
-
- // helpers.extend(point, {
- // // Utility
- // _chart: this.chart.chart, //WTF
- // _xScale: xScale,
- // _yScale: yScale,
- // _datasetIndex: datasetIndex,
- // _index: index,
-
- // // Desired view properties
- // _model: {
- // x: xScale.getPointPixelForValue(this.chart.data.datasets[datasetIndex].data[index], index, datasetIndex),
- // y: yScalePoint,
- // },
- // });
-
- // this.updatePointElementAppearance(point, datasetIndex, index);
- // }, this);
-
- // this.updateBezierControlPoints(dataset);
- // },
-
- // resetDatasetRectangles: function resetDatasetRectangles(dataset, datasetIndex) {
-
- // },
-
- // resetElementAppearance: function(element, datasetIndex, index) {
- // if (element instanceof Chart.Point) {
- // this.updatePointElementAppearance(element, datasetIndex, index);
- // } else if (element instanceof Chart.Rectangle) {
- // this.updateRectangleElementAppearance(element, datasetIndex, index);
- // }
- // },
-
- // updateElements: function updateElements() {
- // // Update the lines
- // this.updateLines();
-
- // helpers.each(this.chart.data.datasets, function(dataset, datasetIndex) {
- // // All elements must be the same type for the given dataset so we are fine to check just the first one
- // if (dataset.metaData[0] instanceof Chart.Point) {
- // // Have points. Update all of them
- // this.updatePoints(dataset, datasetIndex);
- // } else if (dataset.metaData[0] instanceof Chart.Rectangle) {
- // // Have rectangles (lines)
- // this.updateRectangles(dataset, datasetIndex);
- // }
- // }, this);
- // },
-
-
- // setElementHoverStyle: function setElementHoverStyle(element) {
- // if (element instanceof Chart.Point) {
- // this.setPointHoverStyle(element);
- // } else if (element instanceof Chart.Rectangle) {
- // this.setRectangleHoverStyle(element);
- // }
- // },
-
- // setPointHoverStyle: function setPointHoverStyle(point) {
- // var dataset = this.chart.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.chart.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);
- // },
-
- // setHoverStyle: function(rectangle) {
- // var dataset = this.chart.data.datasets[rectangle._datasetIndex];
- // var index = rectangle._index;
-
- // rectangle._model.backgroundColor = rectangle.custom && rectangle.custom.hoverBackgroundColor ? rectangle.custom.hoverBackgroundColor : helpers.getValueAtIndexOrDefault(dataset.hoverBackgroundColor, index, helpers.color(rectangle._model.backgroundColor).saturate(0.5).darken(0.1).rgbString());
- // rectangle._model.borderColor = rectangle.custom && rectangle.custom.hoverBorderColor ? rectangle.custom.hoverBorderColor : helpers.getValueAtIndexOrDefault(dataset.hoverBorderColor, index, helpers.color(rectangle._model.borderColor).saturate(0.5).darken(0.1).rgbString());
- // rectangle._model.borderWidth = rectangle.custom && rectangle.custom.hoverBorderWidth ? rectangle.custom.hoverBorderWidth : helpers.getValueAtIndexOrDefault(dataset.borderWidth, index, rectangle._model.borderWidth);
- // },
-
- getElementsAtEvent: function(e) {
- var elementsArray = [],
- eventPosition = helpers.getRelativePosition(e),
- datasetIterator = function(dataset) {
- elementsArray.push(dataset.metaData[elementIndex]);
- },
- elementIndex;
-
- for (var datasetIndex = 0; datasetIndex < this.chart.data.datasets.length; datasetIndex++) {
- for (elementIndex = 0; elementIndex < this.chart.data.datasets[datasetIndex].metaData.length; elementIndex++) {
- if (this.chart.data.datasets[datasetIndex].metaData[elementIndex].inGroupRange(eventPosition.x, eventPosition.y)) {
- helpers.each(this.chart.data.datasets, datasetIterator);
- }
- }
- }
-
- return elementsArray.length ? elementsArray : [];
+ point._model.radius = point.custom && point.custom.radius ? point.custom.radius : helpers.getValueAtIndexOrDefault(dataset.pointHoverRadius, index, this.chart.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);
},
- // // 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
- getElementAtEvent: function(e) {
- var element = [];
- var eventPosition = helpers.getRelativePosition(e);
-
- for (var datasetIndex = 0; datasetIndex < this.chart.data.datasets.length; ++datasetIndex) {
- for (var elementIndex = 0; elementIndex < this.chart.data.datasets[datasetIndex].metaData.length; ++elementIndex) {
- if (this.chart.data.datasets[datasetIndex].metaData[elementIndex].inRange(eventPosition.x, eventPosition.y)) {
- element.push(this.chart.data.datasets[datasetIndex].metaData[elementIndex]);
- return element;
- }
- }
- }
+ removeHoverStyle: function(point) {
+ // TODO
+ }
- return [];
- },
});
(function() {
"use strict";
+ return;
+
var root = this,
Chart = root.Chart,
//Cache a local reference to Chart.helpers
var location = helpers.getRelativePosition(e);
this.eachElement(function(slice, index) {
- if (slice.inGroupRange(location.x, location.y)) {
+ if (slice.inLabelRange(location.x, location.y)) {
elements.push(slice);
}
}, this);
(function() {
"use strict";
+ return;
+
var root = this,
Chart = root.Chart,
helpers = Chart.helpers;
this.scale.calculateRange();
this.scale.generateTicks();
this.scale.buildYLabels();
-
+
Chart.scaleService.fitScalesForChart(this, this.chart.width, this.chart.height);
// Update the lines
(function() {
"use strict";
+ return;
+
var root = this,
Chart = root.Chart,
helpers = Chart.helpers;
},
buildControllers: function() {
- this.eachDataset(function(dataset, datasetIndex) {
+ helpers.each(this.data.datasets, function(dataset, datasetIndex) {
var type = dataset.type || this.config.type;
if (dataset.controller) {
dataset.controller.updateIndex(datasetIndex);
return;
}
dataset.controller = new Chart.controllers[type](this, datasetIndex);
- });
+ }, this);
},
resetElements: function resetElements() {
- this.eachDataset(function(dataset, datasetIndex) {
+ helpers.each(this.data.datasets, function(dataset, datasetIndex) {
dataset.controller.reset();
- });
+ }, this);
},
update: function update(animationDuration) {
// This will loop through any data and do the appropriate element update for the type
Chart.scaleService.fitScalesForChart(this, this.chart.width, this.chart.height);
- this.eachDataset(function(dataset, datasetIndex) {
+ helpers.each(this.data.datasets, function(dataset, datasetIndex) {
dataset.controller.update();
- });
+ }, this);
this.render(animationDuration);
},
-
-
- eachValue: function eachValue(callback) {
- helpers.each(this.data.datasets, function(dataset, datasetIndex) {
- helpers.each(dataset.data, callback, this, datasetIndex);
- }, this);
- },
-
- eachElement: function eachElement(callback) {
- helpers.each(this.data.datasets, function(dataset, datasetIndex) {
- helpers.each(dataset.metaData, callback, this, dataset.metaData, datasetIndex);
- }, this);
- },
-
- eachDataset: function eachDataset(callback) {
- helpers.each(this.data.datasets, callback, this);
- },
-
- // 2 helper functions to get next/previous elements in datasets
- nextElement: function nextElement(datasets, index, loop) {
- if (this.loop) {
- return dataset[index + 1] || dataset[0];
- }
- return datasets[index + 1] || datasets[index];
- },
- previousElement: function previousElement(datasets, index, loop) {
- if (this.loop) {
- return dataset[index - 1] || dataset[dataset.length - 1];
- }
- return datasets[index - 1] || datasets[index];
- },
-
// 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 draw
- getElementAtEvent: function getElementAtEvent(e) {
+ getElementAtEvent: function(e) {
- var element = [];
var eventPosition = helpers.getRelativePosition(e);
+ var element = [];
- for (var datasetIndex = 0; datasetIndex < this.data.datasets.length; ++datasetIndex) {
- for (var elementIndex = 0; elementIndex < this.data.datasets[datasetIndex].metaData.length; ++elementIndex) {
- if (this.data.datasets[datasetIndex].metaData[elementIndex].inRange(eventPosition.x, eventPosition.y)) {
- element.push(this.data.datasets[datasetIndex].metaData[elementIndex]);
+ helpers.each(this.data.datasets, function(dataset, datasetIndex) {
+ helpers.each(dataset.metaData, function(element, index) {
+ if (this.chart.data.datasets[datasetIndex].metaData[elementIndex].inRange(eventPosition.x, eventPosition.y)) {
+ element.push(this.chart.data.datasets[datasetIndex].metaData[elementIndex]);
return element;
}
- }
- }
+ }, this);
+ }, this);
return [];
},
- getElementsAtEvent: function getElementsAtEvent(e) {
-
- var elementsArray = [],
- eventPosition = helpers.getRelativePosition(e),
- datasetIterator = function(dataset) {
- elementsArray.push(dataset.metaData[elementIndex]);
- },
- elementIndex;
+ getElementsAtEvent: function(e) {
+ var eventPosition = helpers.getRelativePosition(e);
+ var elementsArray = [];
- for (var datasetIndex = 0; datasetIndex < this.data.datasets.length; datasetIndex++) {
- for (elementIndex = 0; elementIndex < this.data.datasets[datasetIndex].metaData.length; elementIndex++) {
- if (this.data.datasets[datasetIndex].metaData[elementIndex].inGroupRange(eventPosition.x, eventPosition.y)) {
- helpers.each(this.data.datasets, datasetIterator);
+ helpers.each(this.data.datasets, function(dataset, datasetIndex) {
+ helpers.each(dataset.metaData, function(element, index) {
+ if (element.inRange(eventPosition.x, eventPosition.y)) {
+ elementsArray.push(element);
}
- }
- }
+ }, this);
+ }, this);
- return elementsArray.length ? elementsArray : [];
+ return elementsArray;
},
- getDatasetAtEvent: function getDatasetAtEvent(e) {
-
- var elementsArray = [],
- eventPosition = helpers.getRelativePosition(e),
- datasetIterator = function(dataset) {
- elementsArray.push(dataset.metaData[elementIndex]);
- },
- elementIndex;
+ getDatasetAtEvent: function(e) {
+ var eventPosition = helpers.getRelativePosition(e);
+ var elementsArray = [];
- for (var datasetIndex = 0; datasetIndex < this.data.datasets.length; datasetIndex++) {
- for (elementIndex = 0; elementIndex < this.data.datasets[datasetIndex].metaData.length; elementIndex++) {
- if (this.data.datasets[datasetIndex].metaData[elementIndex].inGroupRange(eventPosition.x, eventPosition.y)) {
- helpers.each(this.data.datasets, datasetIterator);
+ for (var datasetIndex = 0; datasetIndex < this.chart.data.datasets.length; datasetIndex++) {
+ for (elementIndex = 0; elementIndex < this.chart.data.datasets[datasetIndex].metaData.length; elementIndex++) {
+ if (this.chart.data.datasets[datasetIndex].metaData[elementIndex].inLabelRange(eventPosition.x, eventPosition.y)) {
+ helpers.each(this.chart.data.datasets, datasetIterator);
}
}
}
this.active = function() {
switch (this.options.hover.mode) {
case 'single':
- return this.elementController.getElementAtEvent(e);
+ return this.getElementAtEvent(e);
case 'label':
- return this.elementController.getElementsAtEvent(e);
+ return this.getElementsAtEvent(e);
case 'dataset':
- return this.elementController.getDatasetAtEvent(e);
+ return this.getDatasetAtEvent(e);
default:
return e;
}
if (this.lastActive.length) {
switch (this.options.hover.mode) {
case 'single':
- this.elementController.resetElementAppearance(this.lastActive[0], this.lastActive[0]._datasetIndex, this.lastActive[0]._index);
+ this.data.datasets[this.lastActive[0]._datasetIndex].controller.removeHoverStyle(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.resetElementAppearance(this.lastActive[i], this.lastActive[i]._datasetIndex, this.lastActive[i]._index);
+ this.data.datasets[this.lastActive[0]._datasetIndex].controller.removeHoverStyle(this.lastActive[i], this.lastActive[i]._datasetIndex, this.lastActive[i]._index);
}
break;
case 'dataset':
if (this.active.length && this.options.hover.mode) {
switch (this.options.hover.mode) {
case 'single':
- this.elementController.setElementHoverStyle(this.active[0]);
+ this.data.datasets[this.active[0]._datasetIndex].controller.setHoverStyle(this.active[0]);
break;
case 'label':
for (var i = 0; i < this.active.length; i++) {
- this.elementController.setElementHoverStyle(this.active[i]);
+ this.data.datasets[this.active[0]._datasetIndex].controller.setHoverStyle(this.active[i]);
}
break;
case 'dataset':
};
Chart.Arc = Chart.Element.extend({
- inGroupRange: function(mouseX) {
+ inLabelRange: function(mouseX) {
var vm = this._view;
if (vm) {
var hoverRange = vm.hitRadius + vm.radius;
return ((Math.pow(mouseX - vm.x, 2) + Math.pow(mouseY - vm.y, 2)) < Math.pow(hoverRange, 2));
},
- inGroupRange: function(mouseX) {
+ inLabelRange: function(mouseX) {
var vm = this._view;
if (vm) {
return (mouseX >= vm.x - vm.width / 2 && mouseX <= vm.x + vm.width / 2) && (mouseY >= vm.base && mouseY <= vm.y);
}
},
- inGroupRange: function(mouseX) {
+ inLabelRange: function(mouseX) {
var vm = this._view;
return (mouseX >= vm.x - vm.width / 2 && mouseX <= vm.x + vm.width / 2);
},