diff --git a/config.jshintrc b/config.jshintrc index 978cc985ae0..00b42024f09 100644 --- a/config.jshintrc +++ b/config.jshintrc @@ -1,4 +1,5 @@ { "node": true, + "unused": true, "predef": [ "require", "module" ] } \ No newline at end of file diff --git a/docs/01-Chart-Configuration.md b/docs/01-Chart-Configuration.md index f2be7e3c253..6ff31609266 100644 --- a/docs/01-Chart-Configuration.md +++ b/docs/01-Chart-Configuration.md @@ -189,7 +189,7 @@ var chartInstance = new Chart(ctx, { ### Tooltip Configuration -The title configuration is passed into the `options.tooltips` namespace. The global options for the chart tooltips is defined in `Chart.defaults.global.tooltips`. +The tooltip configuration is passed into the `options.tooltips` namespace. The global options for the chart tooltips is defined in `Chart.defaults.global.tooltips`. Name | Type | Default | Description --- | --- | --- | --- diff --git a/docs/03-Line-Chart.md b/docs/03-Line-Chart.md index adf1e33ae46..d4b6ea902ce 100644 --- a/docs/03-Line-Chart.md +++ b/docs/03-Line-Chart.md @@ -144,6 +144,7 @@ These are the customisation options specific to Line charts. These options are m Name | Type | Default | Description --- | --- | --- | --- showLines | Boolean | true | If false, the lines between points are not drawn +spanGaps | Boolean | false | If true, NaN data does not break the line You can override these for your `Chart` instance by passing a member `options` into the `Line` method. diff --git a/samples/line.html b/samples/line.html index a3ab0cc99d9..ffca9df3b1e 100644 --- a/samples/line.html +++ b/samples/line.html @@ -97,14 +97,14 @@ xAxes: [{ display: true, scaleLabel: { - show: true, + display: true, labelString: 'Month' } }], yAxes: [{ display: true, scaleLabel: { - show: true, + display: true, labelString: 'Value' }, ticks: { diff --git a/src/charts/Chart.Scatter.js b/src/charts/Chart.Scatter.js index 7b504535733..7ab5c5717c7 100644 --- a/src/charts/Chart.Scatter.js +++ b/src/charts/Chart.Scatter.js @@ -22,11 +22,11 @@ module.exports = function(Chart) { tooltips: { callbacks: { - title: function(tooltipItems, data) { + title: function() { // Title doesn't make sense for scatter since we format the data as a point return ''; }, - label: function(tooltipItem, data) { + label: function(tooltipItem) { return '(' + tooltipItem.xLabel + ', ' + tooltipItem.yLabel + ')'; } } diff --git a/src/controllers/controller.bar.js b/src/controllers/controller.bar.js index 28962db9876..29256cd30df 100644 --- a/src/controllers/controller.bar.js +++ b/src/controllers/controller.bar.js @@ -40,7 +40,7 @@ module.exports = function(Chart) { }, // Get the number of datasets that display bars. We use this to correctly calculate the bar width - getBarCount: function getBarCount() { + getBarCount: function() { var me = this; var barCount = 0; helpers.each(me.chart.data.datasets, function(dataset, datasetIndex) { @@ -52,14 +52,14 @@ module.exports = function(Chart) { return barCount; }, - update: function update(reset) { + update: function(reset) { var me = this; helpers.each(me.getMeta().data, function(rectangle, index) { me.updateElement(rectangle, index, reset); }, me); }, - updateElement: function updateElement(rectangle, index, reset) { + updateElement: function(rectangle, index, reset) { var me = this; var meta = me.getMeta(); var xScale = me.getScaleForId(meta.xAxisID); @@ -338,7 +338,7 @@ module.exports = function(Chart) { }; Chart.controllers.horizontalBar = Chart.controllers.bar.extend({ - updateElement: function updateElement(rectangle, index, reset, numBars) { + updateElement: function(rectangle, index, reset) { var me = this; var meta = me.getMeta(); var xScale = me.getScaleForId(meta.xAxisID); diff --git a/src/controllers/controller.bubble.js b/src/controllers/controller.bubble.js index 8dd9cf86e16..9d2d1f2c1b5 100644 --- a/src/controllers/controller.bubble.js +++ b/src/controllers/controller.bubble.js @@ -24,7 +24,7 @@ module.exports = function(Chart) { tooltips: { callbacks: { - title: function(tooltipItems, data) { + title: function() { // Title doesn't make sense for scatter since we format the data as a point return ''; }, @@ -41,7 +41,7 @@ module.exports = function(Chart) { dataElementType: Chart.elements.Point, - update: function update(reset) { + update: function(reset) { var me = this; var meta = me.getMeta(); var points = meta.data; diff --git a/src/controllers/controller.doughnut.js b/src/controllers/controller.doughnut.js index ddc1b9af4e7..159f40b3d3a 100644 --- a/src/controllers/controller.doughnut.js +++ b/src/controllers/controller.doughnut.js @@ -119,7 +119,7 @@ module.exports = function(Chart) { linkScales: helpers.noop, // Get index of the dataset in relation to the visible datasets. This allows determining the inner and outer radius correctly - getRingIndex: function getRingIndex(datasetIndex) { + getRingIndex: function(datasetIndex) { var ringIndex = 0; for (var j = 0; j < datasetIndex; ++j) { @@ -131,7 +131,7 @@ module.exports = function(Chart) { return ringIndex; }, - update: function update(reset) { + update: function(reset) { var me = this; var chart = me.chart, chartArea = chart.chartArea, @@ -189,7 +189,6 @@ module.exports = function(Chart) { chartArea = chart.chartArea, opts = chart.options, animationOpts = opts.animation, - arcOpts = opts.elements.arc, centerX = (chartArea.left + chartArea.right) / 2, centerY = (chartArea.top + chartArea.bottom) / 2, startAngle = opts.rotation, // non reset case handled later @@ -198,7 +197,6 @@ module.exports = function(Chart) { circumference = reset && animationOpts.animateRotate ? 0 : arc.hidden ? 0 : me.calculateCircumference(dataset.data[index]) * (opts.circumference / (2.0 * Math.PI)), innerRadius = reset && animationOpts.animateScale ? 0 : me.innerRadius, outerRadius = reset && animationOpts.animateScale ? 0 : me.outerRadius, - custom = arc.custom || {}, valueAtIndexOrDefault = helpers.getValueAtIndexOrDefault; helpers.extend(arc, { diff --git a/src/controllers/controller.line.js b/src/controllers/controller.line.js index a0138eed2c5..36b4d8f5497 100644 --- a/src/controllers/controller.line.js +++ b/src/controllers/controller.line.js @@ -6,6 +6,7 @@ module.exports = function(Chart) { Chart.defaults.line = { showLines: true, + spanGaps: false, hover: { mode: "label" @@ -46,7 +47,7 @@ module.exports = function(Chart) { } }, - update: function update(reset) { + update: function(reset) { var me = this; var meta = me.getMeta(); var line = meta.dataset; @@ -78,7 +79,7 @@ module.exports = function(Chart) { // The default behavior of lines is to break at null values, according // to https://github.com/chartjs/Chart.js/issues/2435#issuecomment-216718158 // This option gives linse the ability to span gaps - spanGaps: dataset.spanGaps ? dataset.spanGaps : false, + spanGaps: dataset.spanGaps ? dataset.spanGaps : options.spanGaps, tension: custom.tension ? custom.tension : helpers.getValueOrDefault(dataset.lineTension, lineElementOptions.tension), backgroundColor: custom.backgroundColor ? custom.backgroundColor : (dataset.backgroundColor || lineElementOptions.backgroundColor), borderWidth: custom.borderWidth ? custom.borderWidth : (dataset.borderWidth || lineElementOptions.borderWidth), @@ -181,7 +182,7 @@ module.exports = function(Chart) { } x = xScale.getPixelForValue(value, index, datasetIndex, me.chart.isCombo); - y = reset ? yScale.getBasePixel() : me.calculatePointY(value, index, datasetIndex, me.chart.isCombo); + y = reset ? yScale.getBasePixel() : me.calculatePointY(value, index, datasetIndex); // Utility point._xScale = xScale; @@ -206,7 +207,7 @@ module.exports = function(Chart) { }; }, - calculatePointY: function(value, index, datasetIndex, isCombo) { + calculatePointY: function(value, index, datasetIndex) { var me = this; var chart = me.chart; var meta = me.getMeta(); @@ -240,7 +241,6 @@ module.exports = function(Chart) { updateBezierControlPoints: function() { var meta = this.getMeta(); - var area = this.chart.chartArea; var points = meta.data || []; var i, ilen, point, model, controlPoints; diff --git a/src/controllers/controller.polarArea.js b/src/controllers/controller.polarArea.js index ebf88b5eae1..8b63eaf4b0e 100644 --- a/src/controllers/controller.polarArea.js +++ b/src/controllers/controller.polarArea.js @@ -105,7 +105,7 @@ module.exports = function(Chart) { linkScales: helpers.noop, - update: function update(reset) { + update: function(reset) { var me = this; var chart = me.chart; var chartArea = chart.chartArea; @@ -130,19 +130,16 @@ module.exports = function(Chart) { updateElement: function(arc, index, reset) { var me = this; var chart = me.chart; - var chartArea = chart.chartArea; var dataset = me.getDataset(); var opts = chart.options; var animationOpts = opts.animation; - var arcOpts = opts.elements.arc; - var custom = arc.custom || {}; var scale = chart.scale; var getValueAtIndexOrDefault = helpers.getValueAtIndexOrDefault; var labels = chart.data.labels; var circumference = me.calculateCircumference(dataset.data[index]); - var centerX = (chartArea.left + chartArea.right) / 2; - var centerY = (chartArea.top + chartArea.bottom) / 2; + var centerX = scale.xCenter; + var centerY = scale.yCenter; // If there is NaN data before us, we need to calculate the starting angle correctly. // We could be way more efficient here, but its unlikely that the polar area chart will have a lot of data diff --git a/src/controllers/controller.radar.js b/src/controllers/controller.radar.js index 102c3744aa3..bc963b86835 100644 --- a/src/controllers/controller.radar.js +++ b/src/controllers/controller.radar.js @@ -30,7 +30,7 @@ module.exports = function(Chart) { this.updateBezierControlPoints(); }, - update: function update(reset) { + update: function(reset) { var me = this; var meta = me.getMeta(); var line = meta.dataset; @@ -146,7 +146,7 @@ module.exports = function(Chart) { var easingDecimal = ease || 1; // Transition Point Locations - helpers.each(meta.data, function(point, index) { + helpers.each(meta.data, function(point) { point.transition(easingDecimal); }); diff --git a/src/core/core.controller.js b/src/core/core.controller.js index 2d0148b7749..bce768810ab 100644 --- a/src/core/core.controller.js +++ b/src/core/core.controller.js @@ -45,7 +45,7 @@ module.exports = function(Chart) { helpers.extend(Chart.Controller.prototype, /** @lends Chart.Controller */ { - initialize: function initialize() { + initialize: function() { var me = this; // Before init plugin notification Chart.plugins.notify('beforeInit', [me]); @@ -68,12 +68,12 @@ module.exports = function(Chart) { return me; }, - clear: function clear() { + clear: function() { helpers.clear(this.chart); return this; }, - stop: function stop() { + stop: function() { // Stops any current animation loop occuring Chart.animationService.cancelAnimation(this); return this; @@ -115,7 +115,7 @@ module.exports = function(Chart) { return me; }, - ensureScalesHaveIDs: function ensureScalesHaveIDs() { + ensureScalesHaveIDs: function() { var options = this.options; var scalesOptions = options.scales || {}; var scaleOptions = options.scale; @@ -136,7 +136,7 @@ module.exports = function(Chart) { /** * Builds a map of scale ID to scale object for future lookup. */ - buildScales: function buildScales() { + buildScales: function() { var me = this; var options = me.options; var scales = me.scales = {}; @@ -154,7 +154,7 @@ module.exports = function(Chart) { items.push({ options: options.scale, dtype: 'radialLinear', isDefault: true }); } - helpers.each(items, function(item, index) { + helpers.each(items, function(item) { var scaleOptions = item.options; var scaleType = helpers.getValueOrDefault(scaleOptions.type, item.dtype); var scaleClass = Chart.scaleService.getScaleConstructor(scaleType); @@ -186,7 +186,7 @@ module.exports = function(Chart) { Chart.layoutService.update(this, this.chart.width, this.chart.height); }, - buildOrUpdateControllers: function buildOrUpdateControllers() { + buildOrUpdateControllers: function() { var me = this; var types = []; var newControllers = []; @@ -219,7 +219,7 @@ module.exports = function(Chart) { return newControllers; }, - resetElements: function resetElements() { + resetElements: function() { var me = this; helpers.each(me.data.datasets, function(dataset, datasetIndex) { me.getDatasetMeta(datasetIndex).controller.reset(); @@ -375,7 +375,7 @@ module.exports = function(Chart) { helpers.each(me.data.datasets, function(dataset, datasetIndex) { if (me.isDatasetVisible(datasetIndex)) { var meta = me.getDatasetMeta(datasetIndex); - helpers.each(meta.data, function(element, index) { + helpers.each(meta.data, function(element) { if (element.inRange(eventPosition.x, eventPosition.y)) { elementsArray.push(element); return elementsArray; @@ -486,11 +486,11 @@ module.exports = function(Chart) { return typeof meta.hidden === 'boolean'? !meta.hidden : !this.data.datasets[datasetIndex].hidden; }, - generateLegend: function generateLegend() { + generateLegend: function() { return this.options.legendCallback(this); }, - destroy: function destroy() { + destroy: function() { var me = this; me.stop(); me.clear(); @@ -516,11 +516,11 @@ module.exports = function(Chart) { delete Chart.instances[me.id]; }, - toBase64Image: function toBase64Image() { + toBase64Image: function() { return this.chart.canvas.toDataURL.apply(this.chart.canvas, arguments); }, - initToolTip: function initToolTip() { + initToolTip: function() { var me = this; me.tooltip = new Chart.Tooltip({ _chart: me.chart, @@ -530,7 +530,7 @@ module.exports = function(Chart) { }, me); }, - bindEvents: function bindEvents() { + bindEvents: function() { var me = this; helpers.bindEvents(me, me.options.events, function(evt) { me.eventHandler(evt); diff --git a/src/core/core.datasetController.js b/src/core/core.datasetController.js index 07f787eaf2a..e9cda32a6b7 100644 --- a/src/core/core.datasetController.js +++ b/src/core/core.datasetController.js @@ -105,7 +105,7 @@ module.exports = function(Chart) { me.updateElement(element, index, true); }, - buildOrUpdateElements: function buildOrUpdateElements() { + buildOrUpdateElements: function() { // Handle the number of data points changing var meta = this.getMeta(), md = meta.data, @@ -128,7 +128,7 @@ module.exports = function(Chart) { draw: function(ease) { var easingDecimal = ease || 1; - helpers.each(this.getMeta().data, function(element, index) { + helpers.each(this.getMeta().data, function(element) { element.transition(easingDecimal).draw(); }); }, @@ -138,7 +138,6 @@ module.exports = function(Chart) { index = element._index, custom = element.custom || {}, valueOrDefault = helpers.getValueAtIndexOrDefault, - color = helpers.color, model = element._model; model.backgroundColor = custom.backgroundColor ? custom.backgroundColor : valueOrDefault(dataset.backgroundColor, index, elementOpts.backgroundColor); @@ -151,7 +150,6 @@ module.exports = function(Chart) { index = element._index, custom = element.custom || {}, valueOrDefault = helpers.getValueAtIndexOrDefault, - color = helpers.color, getHoverColor = helpers.getHoverColor, model = element._model; diff --git a/src/core/core.js b/src/core/core.js index 06b70735425..9000dbd223c 100755 --- a/src/core/core.js +++ b/src/core/core.js @@ -6,7 +6,11 @@ module.exports = function() { var Chart = function(context, config) { var me = this; var helpers = Chart.helpers; - me.config = config; + me.config = config || { + data: { + datasets: [] + } + }; // Support a jQuery'd canvas element if (context.length && context[0].getContext) { @@ -45,10 +49,7 @@ module.exports = function() { // High pixel density displays - multiply the size of the canvas height/width by the device pixel ratio, then scale. helpers.retinaScale(me); - - if (config) { - me.controller = new Chart.Controller(me); - } + me.controller = new Chart.Controller(me); // Always bind this so that if the responsive state changes we still work helpers.addResizeListener(context.canvas.parentNode, function() { diff --git a/src/core/core.layoutService.js b/src/core/core.layoutService.js index 700ecfd5315..6e649b13a7d 100644 --- a/src/core/core.layoutService.js +++ b/src/core/core.layoutService.js @@ -267,8 +267,6 @@ module.exports = function(Chart) { // Step 7 - Position the boxes var left = xPadding; var top = yPadding; - var right = 0; - var bottom = 0; helpers.each(leftBoxes.concat(topBoxes), placeBox); diff --git a/src/core/core.legend.js b/src/core/core.legend.js index 78c89c55925..4747bbad5ef 100644 --- a/src/core/core.legend.js +++ b/src/core/core.legend.js @@ -274,11 +274,10 @@ module.exports = function(Chart) { var me = this; var opts = me.options; var labelOpts = opts.labels; - var globalDefault = Chart.defaults.global, - lineDefault = globalDefault.elements.line, - legendWidth = me.width, - legendHeight = me.height, - lineWidths = me.lineWidths; + var globalDefault = Chart.defaults.global; + var lineDefault = globalDefault.elements.line; + var legendWidth = me.width; + var lineWidths = me.lineWidths; if (opts.display) { var ctx = me.ctx, @@ -373,7 +372,6 @@ module.exports = function(Chart) { cursor.line++; } } - drawLegendBox(x, y, legendItem); @@ -388,7 +386,7 @@ module.exports = function(Chart) { } else { cursor.y += itemHeight; } - + }); } }, diff --git a/src/core/core.scale.js b/src/core/core.scale.js index 93f07491352..183630f8fc4 100644 --- a/src/core/core.scale.js +++ b/src/core/core.scale.js @@ -284,9 +284,6 @@ module.exports = function(Chart) { var tickLabelFont = helpers.fontString(tickFontSize, tickFontStyle, tickFontFamily); var scaleLabelFontSize = helpers.getValueOrDefault(scaleLabelOpts.fontSize, globalDefaults.defaultFontSize); - var scaleLabelFontStyle = helpers.getValueOrDefault(scaleLabelOpts.fontStyle, globalDefaults.defaultFontStyle); - var scaleLabelFontFamily = helpers.getValueOrDefault(scaleLabelOpts.fontFamily, globalDefaults.defaultFontFamily); - var scaleLabelFont = helpers.fontString(scaleLabelFontSize, scaleLabelFontStyle, scaleLabelFontFamily); var tickMarkLength = opts.gridLines.tickMarkLength; @@ -393,7 +390,7 @@ module.exports = function(Chart) { }, // Get the correct value. NaN bad inputs, If the value type is object get the x or y based on whether we are horizontal or not - getRightValue: function getRightValue(rawValue) { + getRightValue: function(rawValue) { // Null and undefined values first if (rawValue === null || typeof(rawValue) === 'undefined') { return NaN; @@ -407,7 +404,7 @@ module.exports = function(Chart) { if ((rawValue instanceof Date) || (rawValue.isValid)) { return rawValue; } else { - return getRightValue(this.isHorizontal() ? rawValue.x : rawValue.y); + return this.getRightValue(this.isHorizontal() ? rawValue.x : rawValue.y); } } @@ -514,9 +511,7 @@ module.exports = function(Chart) { var labelRotationRadians = helpers.toRadians(me.labelRotation); var cosRotation = Math.cos(labelRotationRadians); - var sinRotation = Math.sin(labelRotationRadians); var longestRotatedLabel = me.longestLabelWidth * cosRotation; - var rotatedLabelHeight = tickFontSize * sinRotation; // Make sure we draw text in the correct color and font context.fillStyle = tickFontColor; @@ -526,11 +521,11 @@ module.exports = function(Chart) { if (isHorizontal) { skipRatio = false; - // Only calculate the skip ratio with the half width of longestRotateLabel if we got an actual rotation - // See #2584 - if (isRotated) { - longestRotatedLabel /= 2; - } + // Only calculate the skip ratio with the half width of longestRotateLabel if we got an actual rotation + // See #2584 + if (isRotated) { + longestRotatedLabel /= 2; + } if ((longestRotatedLabel + optionTicks.autoSkipPadding) * me.ticks.length > (me.width - (me.paddingLeft + me.paddingRight))) { skipRatio = 1 + Math.floor(((longestRotatedLabel + optionTicks.autoSkipPadding) * me.ticks.length) / (me.width - (me.paddingLeft + me.paddingRight))); @@ -712,7 +707,7 @@ module.exports = function(Chart) { scaleLabelY = me.top + ((me.bottom - me.top) / 2); rotation = isLeft ? -0.5 * Math.PI : 0.5 * Math.PI; } - + context.save(); context.translate(scaleLabelX, scaleLabelY); context.rotate(rotation); diff --git a/src/core/core.title.js b/src/core/core.title.js index 4e00b82b774..25abad2a743 100644 --- a/src/core/core.title.js +++ b/src/core/core.title.js @@ -111,9 +111,7 @@ module.exports = function(Chart) { beforeFit: noop, fit: function() { - var me = this, - ctx = me.ctx, valueOrDefault = helpers.getValueOrDefault, opts = me.options, globalDefaults = Chart.defaults.global, diff --git a/src/core/core.tooltip.js b/src/core/core.tooltip.js index d55dd2be050..589d4292b1a 100755 --- a/src/core/core.tooltip.js +++ b/src/core/core.tooltip.js @@ -116,9 +116,11 @@ module.exports = function(Chart) { var x = 0, y = 0; - for (i = 0, len - xPositions.length; i < len; ++i) { - x += xPositions[i]; - y += yPositions[i]; + for (i = 0; i < xPositions.length; ++i) { + if (xPositions[ i ]) { + x += xPositions[i]; + y += yPositions[i]; + } } return { @@ -328,7 +330,7 @@ module.exports = function(Chart) { return me; }, - getTooltipSize: function getTooltipSize(vm) { + getTooltipSize: function(vm) { var ctx = this._chart.ctx; var size = { @@ -391,7 +393,7 @@ module.exports = function(Chart) { return size; }, - determineAlignment: function determineAlignment(size) { + determineAlignment: function(size) { var me = this; var model = me._model; var chart = me._chart; @@ -453,7 +455,7 @@ module.exports = function(Chart) { } } }, - getBackgroundPoint: function getBackgroundPoint(vm, size) { + getBackgroundPoint: function(vm, size) { // Background Position var pt = { x: vm.x, @@ -498,7 +500,7 @@ module.exports = function(Chart) { return pt; }, - drawCaret: function drawCaret(tooltipPoint, size, opacity, caretPadding) { + drawCaret: function(tooltipPoint, size, opacity) { var vm = this._view; var ctx = this._chart.ctx; var x1, x2, x3; @@ -562,7 +564,7 @@ module.exports = function(Chart) { ctx.closePath(); ctx.fill(); }, - drawTitle: function drawTitle(pt, vm, ctx, opacity) { + drawTitle: function(pt, vm, ctx, opacity) { var title = vm.title; if (title.length) { @@ -587,7 +589,7 @@ module.exports = function(Chart) { } } }, - drawBody: function drawBody(pt, vm, ctx, opacity) { + drawBody: function(pt, vm, ctx, opacity) { var bodyFontSize = vm.bodyFontSize; var bodySpacing = vm.bodySpacing; var body = vm.body; @@ -648,7 +650,7 @@ module.exports = function(Chart) { helpers.each(vm.afterBody, fillLineOfText); pt.y -= bodySpacing; // Remove last body spacing }, - drawFooter: function drawFooter(pt, vm, ctx, opacity) { + drawFooter: function(pt, vm, ctx, opacity) { var footer = vm.footer; if (footer.length) { @@ -667,7 +669,7 @@ module.exports = function(Chart) { }); } }, - draw: function draw() { + draw: function() { var ctx = this._chart.ctx; var vm = this._view; @@ -692,7 +694,7 @@ module.exports = function(Chart) { ctx.fill(); // Draw Caret - this.drawCaret(pt, tooltipSize, opacity, vm.caretPadding); + this.drawCaret(pt, tooltipSize, opacity); // Draw Title, Body, and Footer pt.x += vm.xPadding; diff --git a/src/elements/element.arc.js b/src/elements/element.arc.js index 7b6d96a8111..e91b9c2c899 100644 --- a/src/elements/element.arc.js +++ b/src/elements/element.arc.js @@ -1,6 +1,6 @@ "use strict"; -module.exports = function(Chart, moment) { +module.exports = function(Chart) { var helpers = Chart.helpers, globalOpts = Chart.defaults.global; diff --git a/src/elements/element.rectangle.js b/src/elements/element.rectangle.js index 944d5e38a25..6bedca75539 100644 --- a/src/elements/element.rectangle.js +++ b/src/elements/element.rectangle.js @@ -2,8 +2,7 @@ module.exports = function(Chart) { - var helpers = Chart.helpers, - globalOpts = Chart.defaults.global; + var globalOpts = Chart.defaults.global; globalOpts.elements.rectangle = { backgroundColor: globalOpts.defaultColor, @@ -46,7 +45,7 @@ module.exports = function(Chart) { [rightX, vm.base] ]; - // Find first (starting) corner with fallback to 'bottom' + // Find first (starting) corner with fallback to 'bottom' var borders = ['bottom', 'left', 'top', 'right']; var startCorner = borders.indexOf(vm.borderSkipped, 0); if (startCorner === -1) @@ -72,8 +71,8 @@ module.exports = function(Chart) { }, inRange: function(mouseX, mouseY) { var vm = this._view; - return vm ? - (vm.y < vm.base ? + return vm ? + (vm.y < vm.base ? (mouseX >= vm.x - vm.width / 2 && mouseX <= vm.x + vm.width / 2) && (mouseY >= vm.y && mouseY <= vm.base) : (mouseX >= vm.x - vm.width / 2 && mouseX <= vm.x + vm.width / 2) && (mouseY >= vm.base && mouseY <= vm.y)) : false; diff --git a/src/scales/scale.category.js b/src/scales/scale.category.js index efbcbcce6f7..fc1d69eb692 100644 --- a/src/scales/scale.category.js +++ b/src/scales/scale.category.js @@ -9,7 +9,7 @@ module.exports = function(Chart) { }; var DatasetScale = Chart.Scale.extend({ - // Implement this so that + // Implement this so that determineDataLimits: function() { var me = this; me.minIndex = 0; @@ -32,13 +32,13 @@ module.exports = function(Chart) { me.max = me.chart.data.labels[me.maxIndex]; }, - buildTicks: function(index) { + buildTicks: function() { var me = this; // If we are viewing some subset of labels, slice the original array me.ticks = (me.minIndex === 0 && me.maxIndex === me.chart.data.labels.length - 1) ? me.chart.data.labels : me.chart.data.labels.slice(me.minIndex, me.maxIndex + 1); }, - getLabelForIndex: function(index, datasetIndex) { + getLabelForIndex: function(index) { return this.ticks[index]; }, diff --git a/src/scales/scale.linear.js b/src/scales/scale.linear.js index 31630c284be..2c19f71a7b7 100644 --- a/src/scales/scale.linear.js +++ b/src/scales/scale.linear.js @@ -39,7 +39,6 @@ module.exports = function(Chart) { determineDataLimits: function() { var me = this; var opts = me.options; - var tickOpts = opts.ticks; var chart = me.chart; var data = chart.data; var datasets = data.datasets; @@ -148,7 +147,7 @@ module.exports = function(Chart) { return maxTicks; }, - // Called after the ticks are built. We need + // Called after the ticks are built. We need handleDirectionalChanges: function() { if (!this.isHorizontal()) { // We are in a vertical orientation. The top value is the highest. So reverse the array @@ -159,9 +158,9 @@ module.exports = function(Chart) { return +this.getRightValue(this.chart.data.datasets[datasetIndex].data[index]); }, // Utils - getPixelForValue: function(value, index, datasetIndex, includeOffset) { + getPixelForValue: function(value) { // This must be called after fit has been run so that - // this.left, this.top, this.right, and this.bottom have been defined + // this.left, this.top, this.right, and this.bottom have been defined var me = this; var paddingLeft = me.paddingLeft; var paddingBottom = me.paddingBottom; @@ -191,8 +190,8 @@ module.exports = function(Chart) { var offset = (isHorizontal ? pixel - me.left - paddingLeft : me.bottom - paddingBottom - pixel) / innerDimension; return me.start + ((me.end - me.start) * offset); }, - getPixelForTick: function(index, includeOffset) { - return this.getPixelForValue(this.ticksAsNumbers[index], null, null, includeOffset); + getPixelForTick: function(index) { + return this.getPixelForValue(this.ticksAsNumbers[index]); } }); Chart.scaleService.registerScaleType("linear", LinearScale, defaultConfig); diff --git a/src/scales/scale.linearbase.js b/src/scales/scale.linearbase.js index 45292b812df..53beb4d06f9 100644 --- a/src/scales/scale.linearbase.js +++ b/src/scales/scale.linearbase.js @@ -53,11 +53,9 @@ module.exports = function(Chart) { buildTicks: function() { var me = this; var opts = me.options; + var ticks = me.ticks = []; var tickOpts = opts.ticks; var getValueOrDefault = helpers.getValueOrDefault; - var isHorizontal = me.isHorizontal(); - - var ticks = me.ticks = []; // Figure out what the max number of ticks we can support it is based on the size of // the axis area. For now, we say that the minimum tick spacing in pixels must be 50 diff --git a/src/scales/scale.logarithmic.js b/src/scales/scale.logarithmic.js index 3d5bddc3bcb..9c595b0ac42 100644 --- a/src/scales/scale.logarithmic.js +++ b/src/scales/scale.logarithmic.js @@ -177,10 +177,10 @@ module.exports = function(Chart) { getLabelForIndex: function(index, datasetIndex) { return +this.getRightValue(this.chart.data.datasets[datasetIndex].data[index]); }, - getPixelForTick: function(index, includeOffset) { - return this.getPixelForValue(this.tickValues[index], null, null, includeOffset); + getPixelForTick: function(index) { + return this.getPixelForValue(this.tickValues[index]); }, - getPixelForValue: function(value, index, datasetIndex, includeOffset) { + getPixelForValue: function(value) { var me = this; var innerDimension; var pixel; @@ -215,10 +215,8 @@ module.exports = function(Chart) { }, getValueForPixel: function(pixel) { var me = this; - var offset; var range = helpers.log10(me.end) - helpers.log10(me.start); - var value; - var innerDimension; + var value, innerDimension; if (me.isHorizontal()) { innerDimension = me.width - (me.paddingLeft + me.paddingRight); diff --git a/src/scales/scale.radialLinear.js b/src/scales/scale.radialLinear.js index 241069e10cd..c69974f60ae 100644 --- a/src/scales/scale.radialLinear.js +++ b/src/scales/scale.radialLinear.js @@ -164,8 +164,7 @@ module.exports = function(Chart) { xProtrusionLeft, xProtrusionRight, radiusReductionRight, - radiusReductionLeft, - maxWidthRadius; + radiusReductionLeft; this.ctx.font = pointLabeFont; for (i = 0; i < this.getValueCount(); i++) { diff --git a/src/scales/scale.time.js b/src/scales/scale.time.js old mode 100644 new mode 100755 index 1c2ef44b950..6affaebe83d --- a/src/scales/scale.time.js +++ b/src/scales/scale.time.js @@ -94,7 +94,7 @@ module.exports = function(Chart) { // these var scaleLabelMoments = []; if (me.chart.data.labels && me.chart.data.labels.length > 0) { - helpers.each(me.chart.data.labels, function(label, index) { + helpers.each(me.chart.data.labels, function(label) { var labelMoment = me.parseTime(label); if (labelMoment.isValid()) { @@ -117,7 +117,7 @@ module.exports = function(Chart) { var datasetVisible = me.chart.isDatasetVisible(datasetIndex); if (typeof dataset.data[0] === 'object' && dataset.data[0] !== null) { - helpers.each(dataset.data, function(value, index) { + helpers.each(dataset.data, function(value) { var labelMoment = me.parseTime(me.getRightValue(value)); if (labelMoment.isValid()) { @@ -154,7 +154,7 @@ module.exports = function(Chart) { me.firstTick = (me.firstTick || moment()).clone(); me.lastTick = (me.lastTick || moment()).clone(); }, - buildTicks: function(index) { + buildTicks: function() { var me = this; me.ctx.save(); @@ -309,7 +309,7 @@ module.exports = function(Chart) { return label; }, // Function to format an individual tick mark - tickFormatFunction: function tickFormatFunction(tick, index, ticks) { + tickFormatFunction: function(tick, index, ticks) { var formattedTick = tick.format(this.displayFormat); var tickOpts = this.options.ticks; var callback = helpers.getValueOrDefault(tickOpts.callback, tickOpts.userCallback); @@ -325,32 +325,31 @@ module.exports = function(Chart) { me.tickMoments = me.ticks; me.ticks = me.ticks.map(me.tickFormatFunction, me); }, - getPixelForValue: function(value, index, datasetIndex, includeOffset) { + getPixelForValue: function(value, index, datasetIndex) { var me = this; + value = moment(value); var labelMoment = value && value.isValid && value.isValid() ? value : me.getLabelMoment(datasetIndex, index); if (labelMoment) { var offset = labelMoment.diff(me.firstTick, me.tickUnit, true); - var decimal = offset / me.scaleSizeInUnits; + var decimal = offset !== 0 ? offset / me.scaleSizeInUnits : offset; if (me.isHorizontal()) { var innerWidth = me.width - (me.paddingLeft + me.paddingRight); - var valueWidth = innerWidth / Math.max(me.ticks.length - 1, 1); var valueOffset = (innerWidth * decimal) + me.paddingLeft; return me.left + Math.round(valueOffset); } else { var innerHeight = me.height - (me.paddingTop + me.paddingBottom); - var valueHeight = innerHeight / Math.max(me.ticks.length - 1, 1); var heightOffset = (innerHeight * decimal) + me.paddingTop; return me.top + Math.round(heightOffset); } } }, - getPixelForTick: function(index, includeOffset) { - return this.getPixelForValue(this.tickMoments[index], null, null, includeOffset); + getPixelForTick: function(index) { + return this.getPixelForValue(this.tickMoments[index], null, null); }, getValueForPixel: function(pixel) { var me = this; diff --git a/test/scale.time.tests.js b/test/scale.time.tests.js old mode 100644 new mode 100755 index 9966f9cc0f0..f3173e1c455 --- a/test/scale.time.tests.js +++ b/test/scale.time.tests.js @@ -391,6 +391,7 @@ describe('Time scale tests', function() { expect(xScale.getPixelForValue('', 0, 0)).toBeCloseToPixel(78); expect(xScale.getPixelForValue('', 6, 0)).toBeCloseToPixel(452); + expect(xScale.getPixelForValue('2015-01-01T20:00:00')).toBeCloseToPixel(78); expect(xScale.getValueForPixel(78)).toBeCloseToTime({ value: moment(chartInstance.data.labels[0]), @@ -435,4 +436,47 @@ describe('Time scale tests', function() { expect(xScale.getLabelForIndex(6, 0)).toBe('2015-01-10T12:00'); }); + it('should get the correct pixel for only one data in the dataset', function() { + var chart = window.acquireChart({ + type: 'line', + data: { + labels: ["2016-05-27"], + datasets: [{ + type: "line", + data: [5] + }] + }, + options: { + scales: { + xAxes: [{ + display: true, + type: "time", + time: { + displayFormats: { + "day": "YYYY-MM-DD" + } + } + }], + yAxes: [{ + type: "linear", + ticks: { + reverse: true, + min: 0, + max: 10 + } + }] + } + } + }); + + var xScale = chartInstance.scales.xScale0; + + expect(xScale.getPixelForValue('', 0, 0)).toBeCloseToPixel(78); + + expect(xScale.getValueForPixel(78)).toBeCloseToTime({ + value: moment(chartInstance.data.labels[0]), + unit: 'day', + threshold: 0.75 + }); + }); });