| Name | Type | [Scriptable](../general/options.md#scriptable-options) | [Indexable](../general/options.md#indexable-options) | Default
| ---- | ---- | :----: | :----: | ----
| [`backgroundColor`](#styling) | [`Color`](../general/colors.md) | Yes | Yes | `'rgba(0, 0, 0, 0.1)'`
-| [`base`](#general) | `number` | Yes | Yes |
+| [`base`](#general) | `number` | Yes | Yes |
| [`borderColor`](#styling) | [`Color`](../general/colors.md) | Yes | Yes | `'rgba(0, 0, 0, 0.1)'`
| [`borderSkipped`](#borderskipped) | `string` | Yes | Yes | `'start'`
| [`borderWidth`](#borderwidth) | <code>number|object</code> | Yes | Yes | `0`
## Default Options
-It is common to want to apply a configuration setting to all created bar charts. The global bar chart settings are stored in `Chart.defaults.bar`. Changing the global options only affects charts created after the change. Existing charts are not changed.
+It is common to want to apply a configuration setting to all created bar charts. The global bar chart settings are stored in `Chart.defaults.controllers.bar`. Changing the global options only affects charts created after the change. Existing charts are not changed.
## barPercentage vs categoryPercentage
## Default Options
-We can also change these default values for each Doughnut type that is created, this object is available at `Chart.defaults.doughnut`. Pie charts also have a clone of these defaults available to change at `Chart.defaults.pie`, with the only difference being `cutoutPercentage` being set to 0.
+We can also change these default values for each Doughnut type that is created, this object is available at `Chart.defaults.controllers.doughnut`. Pie charts also have a clone of these defaults available to change at `Chart.defaults.controllers.pie`, with the only difference being `cutoutPercentage` being set to 0.
## Data Structure
## Default Options
-It is common to want to apply a configuration setting to all created line charts. The global line chart settings are stored in `Chart.defaults.line`. Changing the global options only affects charts created after the change. Existing charts are not changed.
+It is common to want to apply a configuration setting to all created line charts. The global line chart settings are stored in `Chart.defaults.controllers.line`. Changing the global options only affects charts created after the change. Existing charts are not changed.
For example, to configure all line charts with `spanGaps = true` you would do:
```javascript
-Chart.defaults.line.spanGaps = true;
+Chart.defaults.controllers.line.spanGaps = true;
```
## Data Structure
## Default Options
-We can also change these default values for each PolarArea type that is created, this object is available at `Chart.defaults.polarArea`. Changing the global options only affects charts created after the change. Existing charts are not changed.
+We can also change these default values for each PolarArea type that is created, this object is available at `Chart.defaults.controllers.polarArea`. Changing the global options only affects charts created after the change. Existing charts are not changed.
For example, to configure all new polar area charts with `animateScale = false` you would do:
```javascript
-Chart.defaults.polarArea.animation.animateScale = false;
+Chart.defaults.controllers.polarArea.animation.animateScale = false;
```
## Data Structure
## Default Options
-It is common to want to apply a configuration setting to all created radar charts. The global radar chart settings are stored in `Chart.defaults.radar`. Changing the global options only affects charts created after the change. Existing charts are not changed.
+It is common to want to apply a configuration setting to all created radar charts. The global radar chart settings are stored in `Chart.defaults.controllers.radar`. Changing the global options only affects charts created after the change. Existing charts are not changed.
## Data Structure
- per dataset: dataset.*
- per chart: options[type].datasets.*
-- or globally: Chart.defaults[type].datasets.*
+- or globally: Chart.defaults.controllers[type].datasets.*
where type corresponds to the dataset type.
#### Defaults
* `global` namespace was removed from `defaults`. So `Chart.defaults.global` is now `Chart.defaults`
+* Dataset controller defaults were relocate to `controllers`. For example `Chart.defaults.line` is now `Chart.defaults.controllers.line`
* `default` prefix was removed from defaults. For example `Chart.defaults.global.defaultColor` is now `Chart.defaults.color`
* `defaultColor` was renamed to `color`
* `defaultFontColor` was renamed to `font.color`
labels: {
generateLabels: function(chart) {
// Get the default label list
- var original = Chart.defaults.pie.legend.labels.generateLabels;
+ var original = Chart.defaults.controllers.pie.legend.labels.generateLabels;
var labels = original.call(this, chart);
// Build an array of colors used in the datasets of the chart
</script>
</body>
-</html>
\ No newline at end of file
+</html>
import {mergeIf, merge, _merger} from '../helpers/helpers.core';
export function getIndexAxis(type, options) {
- const typeDefaults = defaults[type] || {};
+ const typeDefaults = defaults.controllers[type] || {};
const datasetDefaults = typeDefaults.datasets || {};
const typeOptions = options[type] || {};
const datasetOptions = typeOptions.datasets || {};
function mergeScaleConfig(config, options) {
options = options || {};
- const chartDefaults = defaults[config.type] || {scales: {}};
+ const chartDefaults = defaults.controllers[config.type] || {scales: {}};
const configScales = options.scales || {};
const chartIndexAxis = getIndexAxis(config.type, options);
const firstIDs = Object.create(null);
config.data.datasets.forEach(dataset => {
const type = dataset.type || config.type;
const indexAxis = dataset.indexAxis || getIndexAxis(type, options);
- const datasetDefaults = defaults[type] || {};
+ const datasetDefaults = defaults.controllers[type] || {};
const defaultScaleOptions = datasetDefaults.scales || {};
Object.keys(defaultScaleOptions).forEach(defaultID => {
const axis = getAxisFromDefaultScaleID(defaultID, indexAxis);
function mergeConfig(...args/* config objects ... */) {
return merge(Object.create(null), args, {
merger(key, target, source, options) {
- if (key !== 'scales' && key !== 'scale') {
+ if (key !== 'scales' && key !== 'scale' && key !== 'controllers') {
_merger(key, target, source, options);
}
}
function includeDefaults(options, type) {
return mergeConfig(
defaults,
- defaults[type],
+ defaults.controllers[type],
options || {});
}
meta.controller.updateIndex(i);
meta.controller.linkScales();
} else {
- const controllerDefaults = defaults[type];
+ const controllerDefaults = defaults.controllers[type];
const ControllerClass = registry.getController(type);
Object.assign(ControllerClass.prototype, {
dataElementType: registry.getElement(controllerDefaults.dataElementType),
import Animations from './core.animations';
+import defaults from './core.defaults';
import {isObject, merge, _merger, isArray, valueOrDefault, mergeIf, resolveObjectKey, _capitalize} from '../helpers/helpers.core';
import {listenArrayEvents, unlistenArrayEvents} from '../helpers/helpers.collection';
import {resolve} from '../helpers/helpers.options';
configure() {
const me = this;
me._config = merge(Object.create(null), [
- me.chart.options[me._type].datasets,
+ defaults.controllers[me._type].datasets,
+ me.chart.options[me._type]?.datasets,
me.getDataset(),
], {
merger(key, target, source) {
*/
export class Registry {
constructor() {
- this.controllers = new TypedRegistry(DatasetController, '');
+ this.controllers = new TypedRegistry(DatasetController, 'controllers');
this.elements = new TypedRegistry(Element, 'elements');
this.plugins = new TypedRegistry(Object, 'plugins');
this.scales = new TypedRegistry(Scale, 'scales');
var chart = window.acquireChart(this.config);
var meta = chart.getDatasetMeta(0);
var xScale = chart.scales[meta.xAxisID];
- var options = Chart.defaults.bar.datasets;
+ var options = Chart.defaults.controllers.bar.datasets;
var categoryPercentage = options.categoryPercentage;
var barPercentage = options.barPercentage;
expected = barThickness;
} else {
var scale = chart.scales.x;
- var options = Chart.defaults.bar.datasets;
+ var options = Chart.defaults.controllers.bar.datasets;
var categoryPercentage = options.categoryPercentage;
var barPercentage = options.barPercentage;
var tickInterval = scale.getPixelForTick(1) - scale.getPixelForTick(0);
describe('dataset global defaults', function() {
beforeEach(function() {
- this._defaults = Chart.helpers.clone(Chart.defaults.line.datasets);
+ this._defaults = Chart.helpers.clone(Chart.defaults.controllers.line.datasets);
});
afterEach(function() {
- Chart.defaults.line.datasets = this._defaults;
+ Chart.defaults.controllers.line.datasets = this._defaults;
delete this._defaults;
});
it('should utilize the dataset global default options', function() {
- Chart.defaults.line.datasets = Chart.defaults.line.datasets || {};
+ Chart.defaults.controllers.line.datasets = Chart.defaults.controllers.line.datasets || {};
- Chart.helpers.merge(Chart.defaults.line.datasets, {
+ Chart.helpers.merge(Chart.defaults.controllers.line.datasets, {
spanGaps: true,
lineTension: 0.231,
backgroundColor: '#add',
});
it('should be overriden by user-supplied values', function() {
- Chart.defaults.line.datasets = Chart.defaults.line.datasets || {};
+ Chart.defaults.controllers.line.datasets = Chart.defaults.controllers.line.datasets || {};
- Chart.helpers.merge(Chart.defaults.line.datasets, {
+ Chart.helpers.merge(Chart.defaults.controllers.line.datasets, {
spanGaps: true,
lineTension: 0.231
});
it('should initialize config with default interaction options', function() {
var callback = function() {};
var defaults = Chart.defaults;
- var defaultMode = defaults.line.interaction.mode;
+ var defaultMode = defaults.controllers.line.interaction.mode;
defaults.hover.onHover = callback;
- defaults.line.spanGaps = true;
- defaults.line.interaction.mode = 'test';
+ defaults.controllers.line.spanGaps = true;
+ defaults.controllers.line.interaction.mode = 'test';
var chart = acquireChart({
type: 'line'
var options = chart.options;
expect(options.font.size).toBe(defaults.font.size);
- expect(options.showLine).toBe(defaults.line.showLine);
+ expect(options.showLine).toBe(defaults.controllers.line.showLine);
expect(options.spanGaps).toBe(true);
expect(options.hover.onHover).toBe(callback);
expect(options.hover.mode).toBe('test');
defaults.hover.onHover = null;
- defaults.line.spanGaps = false;
- defaults.line.interaction.mode = defaultMode;
+ defaults.controllers.line.spanGaps = false;
+ defaults.controllers.line.interaction.mode = defaultMode;
});
it('should initialize config with default hover options', function() {
var defaults = Chart.defaults;
defaults.hover.onHover = callback;
- defaults.line.spanGaps = true;
- defaults.line.hover.mode = 'test';
+ defaults.controllers.line.spanGaps = true;
+ defaults.controllers.line.hover.mode = 'test';
var chart = acquireChart({
type: 'line'
var options = chart.options;
expect(options.font.size).toBe(defaults.font.size);
- expect(options.showLine).toBe(defaults.line.showLine);
+ expect(options.showLine).toBe(defaults.controllers.line.showLine);
expect(options.spanGaps).toBe(true);
expect(options.hover.onHover).toBe(callback);
expect(options.hover.mode).toBe('test');
defaults.hover.onHover = null;
- defaults.line.spanGaps = false;
- delete defaults.line.hover.mode;
+ defaults.controllers.line.spanGaps = false;
+ delete defaults.controllers.line.hover.mode;
});
it('should override default options', function() {
var defaults = Chart.defaults;
defaults.hover.onHover = callback;
- defaults.line.hover.mode = 'x-axis';
- defaults.line.spanGaps = true;
+ defaults.controllers.line.hover.mode = 'x-axis';
+ defaults.controllers.line.spanGaps = true;
var chart = acquireChart({
type: 'line',
expect(options.title.position).toBe('bottom');
defaults.hover.onHover = null;
- delete defaults.line.hover.mode;
- defaults.line.spanGaps = false;
+ delete defaults.controllers.line.hover.mode;
+ defaults.controllers.line.spanGaps = false;
});
it('should override axis positions that are incorrect', function() {
expect(chart.scales.x.options._jasmineCheck).toBeDefined();
expect(chart.scales.y.options._jasmineCheck).toBeDefined();
- expect(Chart.defaults.line._jasmineCheck).not.toBeDefined();
+ expect(Chart.defaults.controllers.line._jasmineCheck).not.toBeDefined();
expect(Chart.defaults._jasmineCheck).not.toBeDefined();
expect(Chart.defaults.scales.linear._jasmineCheck).not.toBeDefined();
expect(Chart.defaults.scales.category._jasmineCheck).not.toBeDefined();
CustomController.prototype = Object.create(Chart.controllers.line.prototype);
CustomController.prototype.constructor = CustomController;
CustomController.id = 'myline';
- CustomController.defaults = Chart.defaults.line;
+ CustomController.defaults = Chart.defaults.controllers.line;
Chart.register(CustomController);
expect(Chart.registry.getController('myline')).toEqual(CustomController);
- expect(Chart.defaults.myline).toEqual(CustomController.defaults);
+ expect(Chart.defaults.controllers.myline).toEqual(CustomController.defaults);
Chart.unregister(CustomController);
});
Chart.register(CustomController);
expect(Chart.registry.getController('custom')).toEqual(CustomController);
- expect(Chart.defaults.custom).toEqual(CustomController.defaults);
+ expect(Chart.defaults.controllers.custom).toEqual(CustomController.defaults);
Chart.unregister(CustomController);
expect(function() {
Chart.registry.getController('custom');
}).toThrow(new Error('"custom" is not a registered controller.'));
- expect(Chart.defaults.custom).not.toBeDefined();
+ expect(Chart.defaults.controllers.custom).not.toBeDefined();
});
it('should handle an ES6 scale extension', function() {
expect(function() {
Chart.registry.getScale('es6Scale');
}).toThrow(new Error('"es6Scale" is not a registered scale.'));
- expect(Chart.defaults.custom).not.toBeDefined();
+ expect(Chart.defaults.controllers.custom).not.toBeDefined();
});
it('should handle an ES6 element extension', function() {
Chart.registry.addControllers(customExtension);
expect(Chart.registry.getController('custom')).toEqual(customExtension);
- expect(Chart.defaults.custom).toEqual(customExtension.defaults);
+ expect(Chart.defaults.controllers.custom).toEqual(customExtension.defaults);
Chart.registry.removeControllers(customExtension);
expect(function() {
Chart.registry.getController('custom');
}).toThrow(new Error('"custom" is not a registered controller.'));
- expect(Chart.defaults.custom).not.toBeDefined();
+ expect(Chart.defaults.controllers.custom).not.toBeDefined();
});
it('as scale', function() {
});
it('should not register anything that would collide with existing defaults', function() {
+ Chart.defaults.controllers.test = {test: true};
class testController extends Chart.DatasetController {}
- testController.id = 'events';
+ testController.id = 'test';
expect(function() {
Chart.register(testController);
- }).toThrow(new Error('Can not register "events", because "defaults.events" would collide with existing defaults'));
+ }).toThrow(new Error('Can not register "test", because "defaults.controllers.test" would collide with existing defaults'));
+ delete Chart.defaults.controllers.test;
});
describe('should handle multiple items', function() {
describe('Doughnut Chart', function() {
it('should return correct tooltip strings', function() {
- var config = Chart.defaults.doughnut;
+ var config = Chart.defaults.controllers.doughnut;
var chart = window.acquireChart({
type: 'doughnut',
data: {
});
it('should return correct tooltip string for a multiline label', function() {
- var config = Chart.defaults.doughnut;
+ var config = Chart.defaults.controllers.doughnut;
var chart = window.acquireChart({
type: 'doughnut',
data: {
});
it('should return correct legend label objects', function() {
- var config = Chart.defaults.doughnut;
+ var config = Chart.defaults.controllers.doughnut;
var chart = window.acquireChart({
type: 'doughnut',
data: {
});
it('should hide the correct arc when a legend item is clicked', function() {
- var config = Chart.defaults.doughnut;
+ var config = Chart.defaults.controllers.doughnut;
var chart = window.acquireChart({
type: 'doughnut',
data: {
describe('Polar Area Chart', function() {
it('should return correct tooltip strings', function() {
- var config = Chart.defaults.polarArea;
+ var config = Chart.defaults.controllers.polarArea;
var chart = window.acquireChart({
type: 'polarArea',
data: {
});
it('should return correct legend label objects', function() {
- var config = Chart.defaults.polarArea;
+ var config = Chart.defaults.controllers.polarArea;
var chart = window.acquireChart({
type: 'polarArea',
data: {
});
it('should hide the correct arc when a legend item is clicked', function() {
- var config = Chart.defaults.polarArea;
+ var config = Chart.defaults.controllers.polarArea;
var chart = window.acquireChart({
type: 'polarArea',
data: {
});
it('should use default "chart" aspect ratio for render and display sizes', function() {
- var ratio = Chart.defaults.doughnut.aspectRatio;
- Chart.defaults.doughnut.aspectRatio = 1;
+ var ratio = Chart.defaults.controllers.doughnut.aspectRatio;
+ Chart.defaults.controllers.doughnut.aspectRatio = 1;
var chart = acquireChart({
type: 'doughnut',
}
});
- Chart.defaults.doughnut.aspectRatio = ratio;
+ Chart.defaults.controllers.doughnut.aspectRatio = ratio;
expect(chart).toBeChartOfSize({
dw: 425, dh: 425,