Skip to content

Commit

Permalink
Per-controller options to fix mixed charts
Browse files Browse the repository at this point in the history
  • Loading branch information
benmccann committed Jan 29, 2019
1 parent 17f6fd2 commit 3c0bad6
Show file tree
Hide file tree
Showing 6 changed files with 113 additions and 17 deletions.
30 changes: 17 additions & 13 deletions src/controllers/controller.line.js
Expand Up @@ -10,9 +10,6 @@ var resolve = helpers.options.resolve;
var isPointInArea = helpers.canvas._isPointInArea;

defaults._set('line', {
showLines: true,
spanGaps: false,

hover: {
mode: 'label'
},
Expand All @@ -29,9 +26,12 @@ defaults._set('line', {
}
});

function lineEnabled(dataset, options) {
return valueOrDefault(dataset.showLine, options.showLines);
}
defaults._set('datasets', {
line: {
showLine: true,
spanGaps: false
}
});

module.exports = DatasetController.extend({

Expand All @@ -44,9 +44,11 @@ module.exports = DatasetController.extend({
var meta = me.getMeta();
var line = meta.dataset;
var points = meta.data || [];
var options = me.chart.options;
var scale = me.getScaleForId(meta.yAxisID);
var dataset = me.getDataset();
var showLine = lineEnabled(dataset, me.chart.options);
var datasetDefaults = me._defaults();
var showLine = me._showLine = resolve([dataset.showLine, options.showLines, datasetDefaults.showLine]);
var i, ilen;

// Update Line
Expand Down Expand Up @@ -181,6 +183,7 @@ module.exports = DatasetController.extend({
var dataset = chart.data.datasets[me.index];
var custom = element.custom || {};
var options = chart.options;
var datasetDefaults = me._defaults();
var elementOptions = options.elements.line;
var values = {};
var i, ilen, key;
Expand All @@ -202,16 +205,17 @@ module.exports = DatasetController.extend({
values[key] = resolve([
custom[key],
dataset[key],
elementOptions[key]
elementOptions[key],
datasetDefaults[key]
]);
}

// 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 lines the ability to span gaps
values.spanGaps = valueOrDefault(dataset.spanGaps, options.spanGaps);
values.tension = resolve([custom.tension, dataset.lineTension, elementOptions.tension]);
values.steppedLine = resolve([custom.steppedLine, dataset.steppedLine, elementOptions.stepped]);
values.spanGaps = valueOrDefault(dataset.spanGaps, options.spanGaps, datasetDefaults.spanGaps);
values.tension = resolve([custom.tension, dataset.lineTension, elementOptions.tension, datasetDefaults.tension]);
values.steppedLine = resolve([custom.steppedLine, dataset.steppedLine, elementOptions.stepped, datasetDefaults.steppedLine]);

return values;
},
Expand Down Expand Up @@ -311,11 +315,11 @@ module.exports = DatasetController.extend({
var meta = me.getMeta();
var points = meta.data || [];
var area = chart.chartArea;
var ilen = points.length;
var halfBorderWidth;
var i = 0;
var ilen = points.length;

if (lineEnabled(me.getDataset(), chart.options)) {
if (me._showLine) {
halfBorderWidth = (meta.dataset._model.borderWidth || 0) / 2;

helpers.canvas.clipArea(chart.ctx, {
Expand Down
8 changes: 6 additions & 2 deletions src/controllers/controller.scatter.js
Expand Up @@ -21,8 +21,6 @@ defaults._set('scatter', {
}]
},

showLines: false,

tooltips: {
callbacks: {
title: function() {
Expand All @@ -35,5 +33,11 @@ defaults._set('scatter', {
}
});

defaults._set('datasets', {
scatter: {
showLine: false
}
});

// Scatter charts use line controllers
module.exports = LineController;
11 changes: 11 additions & 0 deletions src/core/core.datasetController.js
@@ -1,5 +1,6 @@
'use strict';

var defaults = require('../core/core.defaults');
var helpers = require('../helpers/index');

var resolve = helpers.options.resolve;
Expand Down Expand Up @@ -100,6 +101,7 @@ helpers.extend(DatasetController.prototype, {
me.index = datasetIndex;
me.linkScales();
me.addElements();
me._type = me.getMeta().type;
},

updateIndex: function(datasetIndex) {
Expand Down Expand Up @@ -234,6 +236,15 @@ helpers.extend(DatasetController.prototype, {
me.resyncElements();
},

/**
* Returns the default dataset-level options
* @private
*/
_defaults: function() {
var me = this;
return defaults.datasets[me._type] || {};
},

update: helpers.noop,

transition: function(easingValue) {
Expand Down
3 changes: 1 addition & 2 deletions src/core/core.defaults.js
Expand Up @@ -17,8 +17,7 @@ defaults._set('global', {
defaultFontFamily: "'Helvetica Neue', 'Helvetica', 'Arial', sans-serif",
defaultFontSize: 12,
defaultFontStyle: 'normal',
defaultLineHeight: 1.2,
showLines: true
defaultLineHeight: 1.2
});

module.exports = defaults;
55 changes: 55 additions & 0 deletions test/specs/controller.line.tests.js
Expand Up @@ -573,6 +573,61 @@ describe('Chart.controllers.line', function() {
expect(meta.dataset._model.borderWidth).toBe(0.55);
});

it('should fall back to the dataset default spanGaps option', function() {
var chart = window.acquireChart({
type: 'line',
data: {
datasets: [{
data: [0, 0],
label: 'dataset1'
}],
labels: ['label1', 'label2']
}
});

var meta = chart.getDatasetMeta(0);

expect(meta.dataset._model.spanGaps).toBe(false);
});

it('should obey the global spanGaps option', function() {
var chart = window.acquireChart({
type: 'line',
data: {
datasets: [{
data: [0, 0],
label: 'dataset1'
}],
labels: ['label1', 'label2']
},
options: {
spanGaps: true
}
});

var meta = chart.getDatasetMeta(0);

expect(meta.dataset._model.spanGaps).toBe(true);
});

it('should obey the dataset spanGaps option', function() {
var chart = window.acquireChart({
type: 'line',
data: {
datasets: [{
data: [0, 0],
label: 'dataset1',
spanGaps: true
}],
labels: ['label1', 'label2']
}
});

var meta = chart.getDatasetMeta(0);

expect(meta.dataset._model.spanGaps).toBe(true);
});

it('should handle number of data point changes in update', function() {
var chart = window.acquireChart({
type: 'line',
Expand Down
23 changes: 23 additions & 0 deletions test/specs/controller.scatter.test.js
Expand Up @@ -47,5 +47,28 @@ describe('Chart.controllers.scatter', function() {
expect(meta.dataset.draw.calls.count()).toBe(0);
expect(meta.data[0].draw.calls.count()).toBe(1);
});

it('should draw a line if true', function() {
var chart = window.acquireChart({
type: 'scatter',
data: {
datasets: [{
data: [{x: 10, y: 15}],
showLine: true,
label: 'dataset1'
}],
},
options: {}
});

var meta = chart.getDatasetMeta(0);
spyOn(meta.dataset, 'draw');
spyOn(meta.data[0], 'draw');

chart.update();

expect(meta.dataset.draw.calls.count()).toBe(1);
expect(meta.data[0].draw.calls.count()).toBe(1);
});
});
});

0 comments on commit 3c0bad6

Please sign in to comment.