Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Implement per-dataset type (default and per-chart) options #5999

Merged
merged 11 commits into from May 6, 2019
37 changes: 37 additions & 0 deletions docs/configuration/README.md
Expand Up @@ -31,3 +31,40 @@ var chartDifferentHoverMode = new Chart(ctx, {
}
});
```

## Dataset Configuration

Options may be configured directly on the dataset. The dataset options can be changed at 3 different levels and are evaluated with the following priority:

- per dataset: dataset.*
- per chart: options.datasets[type].*
- or globally: Chart.defaults.global.datasets[type].*

where type corresponds to the dataset type.

*Note:* dataset options take precedence over element options.

The following example would set the `showLine` option to 'false' for all line datasets except for those overridden by options passed to the dataset on creation.

```javascript
// Do not show lines for all datasets by default
Chart.defaults.global.datasets.line.showLine = false;

// This chart would show a line only for the third dataset
var chart = new Chart(ctx, {
type: 'line',
data: {
datasets: [{
data: [0, 0],
}, {
data: [0, 1]
}, {
data: [1, 0],
showLine: true // overrides the `line` dataset default
}, {
type: 'scatter', // 'line' dataset default does not affect this dataset since it's a 'scatter'
data: [1, 1]
}]
}
});
```
3 changes: 2 additions & 1 deletion src/controllers/controller.bar.js
Expand Up @@ -382,6 +382,7 @@ module.exports = DatasetController.extend({
var chart = me.chart;
var datasets = chart.data.datasets;
var dataset = datasets[me.index];
var datasetOpts = me._config;
var custom = rectangle.custom || {};
var options = chart.options.elements.rectangle;
var values = {};
Expand All @@ -406,7 +407,7 @@ module.exports = DatasetController.extend({
key = keys[i];
values[key] = resolve([
custom[key],
dataset[key],
datasetOpts[key],
options[key]
], context, index);
}
Expand Down
3 changes: 2 additions & 1 deletion src/controllers/controller.bubble.js
Expand Up @@ -127,6 +127,7 @@ module.exports = DatasetController.extend({
var chart = me.chart;
var datasets = chart.data.datasets;
var dataset = datasets[me.index];
var datasetOpts = me._config;
var custom = point.custom || {};
var options = chart.options.elements.point;
var data = dataset.data[index];
Expand Down Expand Up @@ -158,7 +159,7 @@ module.exports = DatasetController.extend({
key = keys[i];
values[key] = resolve([
custom[key],
dataset[key],
datasetOpts[key],
options[key]
], context, index);
}
Expand Down
10 changes: 8 additions & 2 deletions src/controllers/controller.doughnut.js
Expand Up @@ -305,7 +305,12 @@ module.exports = DatasetController.extend({

for (i = 0, ilen = arcs.length; i < ilen; ++i) {
arc = arcs[i];
options = controller ? controller._resolveElementOptions(arc, i) : arc._options;
if (controller) {
controller._configure();
kurkle marked this conversation as resolved.
Show resolved Hide resolved
options = controller._resolveElementOptions(arc, i);
} else {
options = arc._options;
}
if (options.borderAlign !== 'inner') {
borderWidth = options.borderWidth;
hoverWidth = options.hoverBorderWidth;
Expand Down Expand Up @@ -343,6 +348,7 @@ module.exports = DatasetController.extend({
var me = this;
var chart = me.chart;
var dataset = me.getDataset();
var datasetOpts = me._config;
var custom = arc.custom || {};
var options = chart.options.elements.arc;
var values = {};
Expand Down Expand Up @@ -370,7 +376,7 @@ module.exports = DatasetController.extend({
key = keys[i];
values[key] = resolve([
custom[key],
dataset[key],
datasetOpts[key],
options[key]
], context, index);
}
Expand Down
25 changes: 12 additions & 13 deletions src/controllers/controller.line.js
Expand Up @@ -29,10 +29,6 @@ defaults._set('line', {
}
});

function lineEnabled(dataset, options) {
return valueOrDefault(dataset.showLine, options.showLines);
}

module.exports = DatasetController.extend({

datasetElementType: elements.Line,
Expand All @@ -44,9 +40,10 @@ 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 showLine = me._showLine = valueOrDefault(me._config.showLine, options.showLines);
var i, ilen;

// Update Line
Expand Down Expand Up @@ -132,6 +129,7 @@ module.exports = DatasetController.extend({
var me = this;
var chart = me.chart;
var dataset = chart.data.datasets[me.index];
var datasetOpts = me._config;
var custom = element.custom || {};
var options = chart.options.elements.point;
var values = {};
Expand Down Expand Up @@ -164,8 +162,8 @@ module.exports = DatasetController.extend({
key = keys[i];
values[key] = resolve([
custom[key],
dataset[ELEMENT_OPTIONS[key]],
dataset[key],
datasetOpts[ELEMENT_OPTIONS[key]],
datasetOpts[key],
options[key]
], context, index);
}
Expand All @@ -181,6 +179,7 @@ module.exports = DatasetController.extend({
var chart = me.chart;
var datasetIndex = me.index;
var dataset = chart.data.datasets[datasetIndex];
var datasetOpts = me._config;
var custom = element.custom || {};
var options = chart.options;
var elementOptions = options.elements.line;
Expand Down Expand Up @@ -210,17 +209,17 @@ module.exports = DatasetController.extend({
key = keys[i];
values[key] = resolve([
custom[key],
dataset[key],
datasetOpts[key],
elementOptions[key]
], context);
}

// 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 = valueOrDefault(dataset.lineTension, elementOptions.tension);
values.steppedLine = resolve([custom.steppedLine, dataset.steppedLine, elementOptions.stepped]);
values.spanGaps = valueOrDefault(datasetOpts.spanGaps, options.spanGaps);
values.tension = valueOrDefault(datasetOpts.lineTension, elementOptions.tension);
values.steppedLine = resolve([custom.steppedLine, datasetOpts.steppedLine, elementOptions.stepped]);

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

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

helpers.canvas.clipArea(chart.ctx, {
Expand Down
3 changes: 2 additions & 1 deletion src/controllers/controller.polarArea.js
Expand Up @@ -248,6 +248,7 @@ module.exports = DatasetController.extend({
var me = this;
var chart = me.chart;
var dataset = me.getDataset();
var datasetOpts = me._config;
var custom = arc.custom || {};
var options = chart.options.elements.arc;
var values = {};
Expand Down Expand Up @@ -275,7 +276,7 @@ module.exports = DatasetController.extend({
key = keys[i];
values[key] = resolve([
custom[key],
dataset[key],
datasetOpts[key],
options[key]
], context, index);
}
Expand Down
8 changes: 5 additions & 3 deletions src/controllers/controller.radar.js
Expand Up @@ -109,6 +109,7 @@ module.exports = DatasetController.extend({
var me = this;
var chart = me.chart;
var dataset = chart.data.datasets[me.index];
var datasetOpts = me._config;
var custom = element.custom || {};
var options = chart.options.elements.point;
var values = {};
Expand Down Expand Up @@ -141,8 +142,8 @@ module.exports = DatasetController.extend({
key = keys[i];
values[key] = resolve([
custom[key],
dataset[ELEMENT_OPTIONS[key]],
dataset[key],
datasetOpts[ELEMENT_OPTIONS[key]],
datasetOpts[key],
options[key]
], context, index);
}
Expand All @@ -157,6 +158,7 @@ module.exports = DatasetController.extend({
var me = this;
var chart = me.chart;
var dataset = chart.data.datasets[me.index];
var datasetOpts = me._config;
var custom = element.custom || {};
var options = chart.options.elements.line;
var values = {};
Expand All @@ -177,7 +179,7 @@ module.exports = DatasetController.extend({
key = keys[i];
values[key] = resolve([
custom[key],
dataset[key],
datasetOpts[key],
options[key]
]);
}
Expand Down
10 changes: 8 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,13 @@ defaults._set('scatter', {
}
});

defaults._set('global', {
benmccann marked this conversation as resolved.
Show resolved Hide resolved
datasets: {
scatter: {
showLine: false
}
}
});

// Scatter charts use line controllers
module.exports = LineController;
2 changes: 1 addition & 1 deletion src/core/core.controller.js
Expand Up @@ -567,7 +567,7 @@ helpers.extend(Chart.prototype, /** @lends Chart */ {
return;
}

meta.controller.update();
meta.controller._update();

plugins.notify(me, 'afterDatasetUpdate', [args]);
},
Expand Down
27 changes: 26 additions & 1 deletion src/core/core.datasetController.js
Expand Up @@ -100,6 +100,7 @@ helpers.extend(DatasetController.prototype, {
me.index = datasetIndex;
me.linkScales();
me.addElements();
me._type = me.getMeta().type;
},

updateIndex: function(datasetIndex) {
Expand Down Expand Up @@ -160,7 +161,7 @@ helpers.extend(DatasetController.prototype, {
},

reset: function() {
this.update(true);
this._update(true);
},

/**
Expand Down Expand Up @@ -236,6 +237,30 @@ helpers.extend(DatasetController.prototype, {
me.resyncElements();
},

/**
* Returns the merged user-supplied and default dataset-level options
* @private
*/
_configure: function() {
benmccann marked this conversation as resolved.
Show resolved Hide resolved
var me = this;
benmccann marked this conversation as resolved.
Show resolved Hide resolved
me._config = helpers.merge({}, [
me.chart.options.datasets[me._type],
me.getDataset(),
], {
merger: function(key, target, source) {
if (key !== '_meta' && key !== 'data') {
helpers._merger(key, target, source);
}
}
});
},

_update: function(reset) {
var me = this;
me._configure();
me.update(reset);
},

update: helpers.noop,

transition: function(easingValue) {
Expand Down
2 changes: 2 additions & 0 deletions src/core/core.defaults.js
Expand Up @@ -11,6 +11,8 @@ var defaults = {
}
};

// TODO(v3): remove 'global' from namespace. all default are global and
// there's inconsistency around which options are under 'global'
defaults._set('global', {
defaultColor: 'rgba(0,0,0,0.1)',
defaultFontColor: '#666',
Expand Down