Remove global from defaults (#6893)

This commit is contained in:
Jukka Kurkela
2020-01-03 21:07:38 +02:00
committed by Evert Timberg
parent 099e552e6d
commit f4792306e0
50 changed files with 478 additions and 498 deletions

View File

@@ -166,7 +166,7 @@ If the `steppedLine` value is set to anything other than false, `lineTension` wi
## Configuration Options
The line chart defines the following configuration options. These options are merged with the global chart configuration options, `Chart.defaults.global`, to form the options passed to the chart.
The line chart defines the following configuration options. These options are merged with the global chart configuration options, `Chart.defaults`, to form the options passed to the chart.
| Name | Type | Default | Description
| ---- | ---- | ------- | -----------

View File

@@ -155,7 +155,7 @@ The interaction with each point can be controlled with the following properties:
## Configuration Options
The radar chart defines the following configuration options. These options are merged with the global chart configuration options, `Chart.defaults.global`, to form the options passed to the chart.
The radar chart defines the following configuration options. These options are merged with the global chart configuration options, `Chart.defaults`, to form the options passed to the chart.
| Name | Type | Default | Description
| ---- | ---- | ------- | -----------

View File

@@ -6,12 +6,12 @@ The configuration is used to change how the chart behaves. There are properties
This concept was introduced in Chart.js 1.0 to keep configuration [DRY](https://en.wikipedia.org/wiki/Don%27t_repeat_yourself), and allow for changing options globally across chart types, avoiding the need to specify options for each instance, or the default for a particular chart type.
Chart.js merges the options object passed to the chart with the global configuration using chart type defaults and scales defaults appropriately. This way you can be as specific as you would like in your individual chart configuration, while still changing the defaults for all chart types where applicable. The global general options are defined in `Chart.defaults.global`. The defaults for each chart type are discussed in the documentation for that chart type.
Chart.js merges the options object passed to the chart with the global configuration using chart type defaults and scales defaults appropriately. This way you can be as specific as you would like in your individual chart configuration, while still changing the defaults for all chart types where applicable. The global general options are defined in `Chart.defaults`. The defaults for each chart type are discussed in the documentation for that chart type.
The following example would set the hover mode to 'nearest' for all charts where this was not overridden by the chart type defaults or the options passed to the constructor on creation.
```javascript
Chart.defaults.global.hover.mode = 'nearest';
Chart.defaults.hover.mode = 'nearest';
// Hover mode is set to nearest because it was not overridden here
var chartHoverModeNearest = new Chart(ctx, {
@@ -38,7 +38,7 @@ Options may be configured directly on the dataset. The dataset options can be ch
- per dataset: dataset.*
- per chart: options.datasets[type].*
- or globally: Chart.defaults.global.datasets[type].*
- or globally: Chart.defaults.datasets[type].*
where type corresponds to the dataset type.
@@ -48,7 +48,7 @@ The following example would set the `showLine` option to 'false' for all line da
```javascript
// Do not show lines for all datasets by default
Chart.defaults.global.datasets.line.showLine = false;
Chart.defaults.datasets.line.showLine = false;
// This chart would show a line only for the third dataset
var chart = new Chart(ctx, {

View File

@@ -4,7 +4,7 @@ Chart.js animates charts out of the box. A number of options are provided to con
## Animation Configuration
The following animation options are available. The global options for are defined in `Chart.defaults.global.animation`.
The following animation options are available. The global options for are defined in `Chart.defaults.animation`.
| Name | Type | Default | Description
| ---- | ---- | ------- | -----------

View File

@@ -4,16 +4,16 @@ While chart types provide settings to configure the styling of each dataset, you
## Global Configuration
The element options can be specified per chart or globally. The global options for elements are defined in `Chart.defaults.global.elements`. For example, to set the border width of all bar charts globally you would do:
The element options can be specified per chart or globally. The global options for elements are defined in `Chart.defaults.elements`. For example, to set the border width of all bar charts globally you would do:
```javascript
Chart.defaults.global.elements.rectangle.borderWidth = 2;
Chart.defaults.elements.rectangle.borderWidth = 2;
```
## Point Configuration
Point elements are used to represent the points in a line, radar or bubble chart.
Global point options: `Chart.defaults.global.elements.point`.
Global point options: `Chart.defaults.elements.point`.
| Name | Type | Default | Description
| ---- | ---- | ------- | -----------
@@ -46,7 +46,7 @@ If the value is an image, that image is drawn on the canvas using [drawImage](ht
## Line Configuration
Line elements are used to represent the line in a line chart.
Global line options: `Chart.defaults.global.elements.line`.
Global line options: `Chart.defaults.elements.line`.
| Name | Type | Default | Description
| ---- | ---- | ------- | -----------
@@ -59,14 +59,14 @@ Global line options: `Chart.defaults.global.elements.line`.
| `borderDashOffset` | `number` | `0.0` | Line dash offset. See [MDN](https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/lineDashOffset).
| `borderJoinStyle` | `string` | `'miter'` | Line join style. See [MDN](https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/lineJoin).
| `capBezierPoints` | `boolean` | `true` | `true` to keep Bézier control inside the chart, `false` for no restriction.
| `cubicInterpolationMode` | `string` | `'default'` | Interpolation mode to apply. [See more...](../charts/line.md#cubicinterpolationmode)
| `cubicInterpolationMode` | `string` | `'default'` | Interpolation mode to apply. [See more...](../charts/line.md#cubicinterpolationmode)
| `fill` | <code>boolean&#124;string</code> | `true` | How to fill the area under the line. See [area charts](../charts/area.md#filling-modes).
| `stepped` | `boolean` | `false` | `true` to show the line as a stepped line (`tension` will be ignored).
## Rectangle Configuration
Rectangle elements are used to represent the bars in a bar chart.
Global rectangle options: `Chart.defaults.global.elements.rectangle`.
Global rectangle options: `Chart.defaults.elements.rectangle`.
| Name | Type | Default | Description
| ---- | ---- | ------- | -----------
@@ -78,7 +78,7 @@ Global rectangle options: `Chart.defaults.global.elements.rectangle`.
## Arc Configuration
Arcs are used in the polar area, doughnut and pie charts.
Global arc options: `Chart.defaults.global.elements.arc`.
Global arc options: `Chart.defaults.elements.arc`.
| Name | Type | Default | Description
| ---- | ---- | ------- | -----------

View File

@@ -1,6 +1,6 @@
# Layout Configuration
The layout configuration is passed into the `options.layout` namespace. The global options for the chart layout is defined in `Chart.defaults.global.layout`.
The layout configuration is passed into the `options.layout` namespace. The global options for the chart layout is defined in `Chart.defaults.layout`.
| Name | Type | Default | Description
| ---- | ---- | ------- | -----------

View File

@@ -4,7 +4,7 @@ The chart legend displays data about the datasets that are appearing on the char
## Configuration options
The legend configuration is passed into the `options.legend` namespace. The global options for the chart legend is defined in `Chart.defaults.global.legend`.
The legend configuration is passed into the `options.legend` namespace. The global options for the chart legend is defined in `Chart.defaults.legend`.
| Name | Type | Default | Description
| ---- | ---- | ------- | -----------
@@ -138,7 +138,7 @@ function(e, legendItem) {
Lets say we wanted instead to link the display of the first two datasets. We could change the click handler accordingly.
```javascript
var defaultLegendClickHandler = Chart.defaults.global.legend.onClick;
var defaultLegendClickHandler = Chart.defaults.legend.onClick;
var newLegendClickHandler = function (e, legendItem) {
var index = legendItem.datasetIndex;

View File

@@ -3,7 +3,7 @@
The chart title defines text to draw at the top of the chart.
## Title Configuration
The title configuration is passed into the `options.title` namespace. The global options for the chart title is defined in `Chart.defaults.global.title`.
The title configuration is passed into the `options.title` namespace. The global options for the chart title is defined in `Chart.defaults.title`.
| Name | Type | Default | Description
| ---- | ---- | ------- | -----------

View File

@@ -2,7 +2,7 @@
## Tooltip Configuration
The tooltip 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.tooltips`.
| Name | Type | Default | Description
| ---- | ---- | ------- | -----------

View File

@@ -83,7 +83,7 @@ Chart.defaults.derivedBubble = Chart.defaults.bubble;
// Sets the default dataset config for 'derivedBubble' to be the same as the bubble dataset defaults.
// It looks like a bug exists when the dataset defaults don't exist
Chart.defaults.global.datasets.derivedBubble = Chart.defaults.global.datasets.bubble;
Chart.defaults.datasets.derivedBubble = Chart.defaults.datasets.bubble;
// I think the recommend using Chart.controllers.bubble.extend({ extensions here });
var custom = Chart.controllers.bubble.extend({

View File

@@ -1,6 +1,6 @@
# Colors
When supplying colors to Chart options, you can use a number of formats. You can specify the color as a string in hexadecimal, RGB, or HSL notations. If a color is needed, but not specified, Chart.js will use the global default color. This color is stored at `Chart.defaults.global.defaultColor`. It is initially set to `'rgba(0, 0, 0, 0.1)'`.
When supplying colors to Chart options, you can use a number of formats. You can specify the color as a string in hexadecimal, RGB, or HSL notations. If a color is needed, but not specified, Chart.js will use the global default color. This color is stored at `Chart.defaults.color`. It is initially set to `'rgba(0, 0, 0, 0.1)'`.
You can also pass a [CanvasGradient](https://developer.mozilla.org/en-US/docs/Web/API/CanvasGradient) object. You will need to create this before passing to the chart, but using it you can achieve some interesting effects.

View File

@@ -1,11 +1,11 @@
# Fonts
There are 4 special global settings that can change all of the fonts on the chart. These options are in `Chart.defaults.global`. The global font settings only apply when more specific options are not included in the config.
There are 4 special global settings that can change all of the fonts on the chart. These options are in `Chart.defaults`. The global font settings only apply when more specific options are not included in the config.
For example, in this chart the text will all be red except for the labels in the legend.
```javascript
Chart.defaults.global.defaultFontColor = 'red';
Chart.defaults.fontColor = 'red';
let chart = new Chart(ctx, {
type: 'line',
data: data,
@@ -22,10 +22,10 @@ let chart = new Chart(ctx, {
| Name | Type | Default | Description
| ---- | ---- | ------- | -----------
| `defaultFontColor` | `Color` | `'#666'` | Default font color for all text.
| `defaultFontFamily` | `string` | `"'Helvetica Neue', 'Helvetica', 'Arial', sans-serif"` | Default font family for all text.
| `defaultFontSize` | `number` | `12` | Default font size (in px) for text. Does not apply to radialLinear scale point labels.
| `defaultFontStyle` | `string` | `'normal'` | Default font style. Does not apply to tooltip title or footer. Does not apply to chart title.
| `fontColor` | `Color` | `'#666'` | Default font color for all text.
| `fontFamily` | `string` | `"'Helvetica Neue', 'Helvetica', 'Arial', sans-serif"` | Default font family for all text.
| `fontSize` | `number` | `12` | Default font size (in px) for text. Does not apply to radialLinear scale point labels.
| `fontStyle` | `string` | `'normal'` | Default font style. Does not apply to tooltip title or footer. Does not apply to chart title.
## Missing Fonts

View File

@@ -1,6 +1,6 @@
# Interactions
The hover configuration is passed into the `options.hover` namespace. The global hover configuration is at `Chart.defaults.global.hover`. To configure which events trigger chart interactions, see [events](./events.md#events).
The hover configuration is passed into the `options.hover` namespace. The global hover configuration is at `Chart.defaults.hover`. To configure which events trigger chart interactions, see [events](./events.md#events).
| Name | Type | Default | Description
| ---- | ---- | ------- | -----------

View File

@@ -30,6 +30,17 @@ Chart.js 3.0 introduces a number of breaking changes. Chart.js 2.0 was released
* The `hover` property of scriptable options `context` object was renamed to `active` to align it with the datalabels plugin.
* The `zeroLine*` options of axes were removed. Use scriptable scale options instead.
## Defaults
* `global` namespace was removed from `defaults`. So `Chart.defaults.global` is now `Chart.defaults`
* `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 `fontColor`
* `defaultFontFamily` was renamed to `fontFamily`
* `defaultFontSize` was renamed to `fontSize`
* `defaultFontStyle` was renamed to `fontStyle`
* `defaultLineHeight` was renamed to `lineHeight`
### Options
* `scales.[x/y]Axes` arrays were removed. Scales are now configured directly to `options.scales` object with the object key being the scale Id.

View File

@@ -71,7 +71,7 @@
}
};
}
return Chart.defaults.global.animation;
return Chart.defaults.animation;
},
elements: {
point: {

View File

@@ -38,7 +38,7 @@
<canvas id="chart"></canvas>
</div>
<script>
Chart.defaults.global.pointHitDetectionRadius = 1;
Chart.defaults.pointHitDetectionRadius = 1;
var customTooltips = function(tooltip) {
// Tooltip Element

View File

@@ -43,7 +43,7 @@
</div>
<script>
Chart.defaults.global.tooltips.custom = function(tooltip) {
Chart.default.tooltips.custom = function(tooltip) {
// Tooltip Element
var tooltipEl = document.getElementById('chartjs-tooltip');

View File

@@ -26,16 +26,14 @@ defaults._set('bar', {
}
});
defaults._set('global', {
datasets: {
bar: {
categoryPercentage: 0.8,
barPercentage: 0.9,
animation: {
numbers: {
type: 'number',
properties: ['x', 'y', 'base', 'width', 'height']
}
defaults._set('datasets', {
bar: {
categoryPercentage: 0.8,
barPercentage: 0.9,
animation: {
numbers: {
type: 'number',
properties: ['x', 'y', 'base', 'width', 'height']
}
}
}

View File

@@ -36,12 +36,10 @@ defaults._set('horizontalBar', {
}
});
defaults._set('global', {
datasets: {
horizontalBar: {
categoryPercentage: 0.8,
barPercentage: 0.9
}
defaults._set('datasets', {
horizontalBar: {
categoryPercentage: 0.8,
barPercentage: 0.9
}
});

View File

@@ -27,11 +27,9 @@ defaults._set('scatter', {
}
});
defaults._set('global', {
datasets: {
scatter: {
showLine: false
}
defaults._set('datasets', {
scatter: {
showLine: false
}
});

View File

@@ -5,27 +5,25 @@ import Animation from './core.animation';
import defaults from '../core/core.defaults';
import {noop, extend, isObject} from '../helpers/helpers.core';
defaults._set('global', {
animation: {
duration: 1000,
easing: 'easeOutQuart',
active: {
duration: 400
},
resize: {
duration: 0
},
numbers: {
type: 'number',
properties: ['x', 'y', 'borderWidth', 'radius', 'tension']
},
colors: {
type: 'color',
properties: ['borderColor', 'backgroundColor']
},
onProgress: noop,
onComplete: noop
}
defaults._set('animation', {
duration: 1000,
easing: 'easeOutQuart',
active: {
duration: 400
},
resize: {
duration: 0
},
numbers: {
type: 'number',
properties: ['x', 'y', 'borderWidth', 'radius', 'tension']
},
colors: {
type: 'color',
properties: ['borderColor', 'backgroundColor']
},
onProgress: noop,
onComplete: noop
});
function copyOptions(target, values) {

View File

@@ -13,25 +13,6 @@ import Tooltip from './core.tooltip';
const valueOrDefault = helpers.valueOrDefault;
defaults._set('global', {
elements: {},
events: [
'mousemove',
'mouseout',
'click',
'touchstart',
'touchmove'
],
hover: {
onHover: null,
mode: 'nearest',
intersect: true
},
onClick: null,
maintainAspectRatio: true,
responsive: true
});
function mergeScaleConfig(config, options) {
options = options || {};
const chartDefaults = defaults[config.type] || {scales: {}};
@@ -103,7 +84,7 @@ function initConfig(config) {
const scaleConfig = mergeScaleConfig(config, config.options);
config.options = mergeConfig(
defaults.global,
defaults,
defaults[config.type],
config.options || {});
@@ -126,7 +107,7 @@ function updateConfig(chart) {
const scaleConfig = mergeScaleConfig(chart.config, newOptions);
newOptions = mergeConfig(
defaults.global,
defaults,
defaults[chart.config.type],
newOptions);

View File

@@ -1,26 +1,36 @@
'use strict';
var helpers = require('../helpers/helpers.core');
import {merge} from '../helpers/helpers.core';
export default {
color: 'rgba(0,0,0,0.1)',
elements: {},
events: [
'mousemove',
'mouseout',
'click',
'touchstart',
'touchmove'
],
fontColor: '#666',
fontFamily: "'Helvetica Neue', 'Helvetica', 'Arial', sans-serif",
fontSize: 12,
fontStyle: 'normal',
lineHeight: 1.2,
hover: {
onHover: null,
mode: 'nearest',
intersect: true
},
maintainAspectRatio: true,
onClick: null,
responsive: true,
showLines: true,
var defaults = {
/**
* @private
*/
_set: function(scope, values) {
return helpers.merge(this[scope] || (this[scope] = {}), values);
return merge(this[scope] || (this[scope] = {}), values);
}
};
// 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',
defaultFontFamily: "'Helvetica Neue', 'Helvetica', 'Arial', sans-serif",
defaultFontSize: 12,
defaultFontStyle: 'normal',
defaultLineHeight: 1.2,
showLines: true
});
module.exports = defaults;

View File

@@ -198,14 +198,12 @@ function placeBoxes(boxes, chartArea, params) {
chartArea.y = y;
}
defaults._set('global', {
layout: {
padding: {
top: 0,
right: 0,
bottom: 0,
left: 0
}
defaults._set('layout', {
padding: {
top: 0,
right: 0,
bottom: 0,
left: 0
}
});

View File

@@ -3,9 +3,7 @@
var defaults = require('./core.defaults');
var helpers = require('../helpers/index');
defaults._set('global', {
plugins: {}
});
defaults._set('plugins', {});
/**
* The plugin service singleton
@@ -144,7 +142,7 @@ module.exports = {
}
if (opts === true) {
opts = helpers.clone(defaults.global.plugins[id]);
opts = helpers.clone(defaults.plugins[id]);
}
plugins.push(plugin);

View File

@@ -200,7 +200,7 @@ function parseFontOptions(options, nestedOpts) {
fontStyle: valueOrDefault(nestedOpts.fontStyle, options.fontStyle),
lineHeight: valueOrDefault(nestedOpts.lineHeight, options.lineHeight)
}), {
color: resolve([nestedOpts.fontColor, options.fontColor, defaults.global.defaultFontColor])
color: resolve([nestedOpts.fontColor, options.fontColor, defaults.fontColor])
});
}
@@ -1307,7 +1307,7 @@ class Scale extends Element {
return;
}
var scaleLabelFontColor = valueOrDefault(scaleLabel.fontColor, defaults.global.defaultFontColor);
var scaleLabelFontColor = valueOrDefault(scaleLabel.fontColor, defaults.fontColor);
var scaleLabelFont = helpers.options._parseFont(scaleLabel);
var scaleLabelPadding = helpers.options.toPadding(scaleLabel.padding);
var halfLineHeight = scaleLabelFont.lineHeight / 2;

View File

@@ -8,106 +8,104 @@ const Animations = require('./core.animations');
const valueOrDefault = helpers.valueOrDefault;
const getRtlHelper = helpers.rtl.getRtlAdapter;
defaults._set('global', {
tooltips: {
enabled: true,
custom: null,
mode: 'nearest',
position: 'average',
intersect: true,
backgroundColor: 'rgba(0,0,0,0.8)',
titleFontStyle: 'bold',
titleSpacing: 2,
titleMarginBottom: 6,
titleFontColor: '#fff',
titleAlign: 'left',
bodySpacing: 2,
bodyFontColor: '#fff',
bodyAlign: 'left',
footerFontStyle: 'bold',
footerSpacing: 2,
footerMarginTop: 6,
footerFontColor: '#fff',
footerAlign: 'left',
yPadding: 6,
xPadding: 6,
caretPadding: 2,
caretSize: 5,
cornerRadius: 6,
multiKeyBackground: '#fff',
displayColors: true,
borderColor: 'rgba(0,0,0,0)',
borderWidth: 0,
animation: {
duration: 400,
easing: 'easeOutQuart',
numbers: {
type: 'number',
properties: ['x', 'y', 'width', 'height'],
},
opacity: {
easing: 'linear',
duration: 200
}
defaults._set('tooltips', {
enabled: true,
custom: null,
mode: 'nearest',
position: 'average',
intersect: true,
backgroundColor: 'rgba(0,0,0,0.8)',
titleFontStyle: 'bold',
titleSpacing: 2,
titleMarginBottom: 6,
titleFontColor: '#fff',
titleAlign: 'left',
bodySpacing: 2,
bodyFontColor: '#fff',
bodyAlign: 'left',
footerFontStyle: 'bold',
footerSpacing: 2,
footerMarginTop: 6,
footerFontColor: '#fff',
footerAlign: 'left',
yPadding: 6,
xPadding: 6,
caretPadding: 2,
caretSize: 5,
cornerRadius: 6,
multiKeyBackground: '#fff',
displayColors: true,
borderColor: 'rgba(0,0,0,0)',
borderWidth: 0,
animation: {
duration: 400,
easing: 'easeOutQuart',
numbers: {
type: 'number',
properties: ['x', 'y', 'width', 'height'],
},
callbacks: {
// Args are: (tooltipItems, data)
beforeTitle: helpers.noop,
title: function(tooltipItems, data) {
var title = '';
var labels = data.labels;
var labelCount = labels ? labels.length : 0;
if (tooltipItems.length > 0) {
var item = tooltipItems[0];
if (item.label) {
title = item.label;
} else if (labelCount > 0 && item.index < labelCount) {
title = labels[item.index];
}
}
return title;
},
afterTitle: helpers.noop,
// Args are: (tooltipItems, data)
beforeBody: helpers.noop,
// Args are: (tooltipItem, data)
beforeLabel: helpers.noop,
label: function(tooltipItem, data) {
var label = data.datasets[tooltipItem.datasetIndex].label || '';
if (label) {
label += ': ';
}
if (!helpers.isNullOrUndef(tooltipItem.value)) {
label += tooltipItem.value;
}
return label;
},
labelColor: function(tooltipItem, chart) {
var meta = chart.getDatasetMeta(tooltipItem.datasetIndex);
var options = meta.controller.getStyle(tooltipItem.index);
return {
borderColor: options.borderColor,
backgroundColor: options.backgroundColor
};
},
labelTextColor: function() {
return this.options.bodyFontColor;
},
afterLabel: helpers.noop,
// Args are: (tooltipItems, data)
afterBody: helpers.noop,
// Args are: (tooltipItems, data)
beforeFooter: helpers.noop,
footer: helpers.noop,
afterFooter: helpers.noop
opacity: {
easing: 'linear',
duration: 200
}
},
callbacks: {
// Args are: (tooltipItems, data)
beforeTitle: helpers.noop,
title: function(tooltipItems, data) {
var title = '';
var labels = data.labels;
var labelCount = labels ? labels.length : 0;
if (tooltipItems.length > 0) {
var item = tooltipItems[0];
if (item.label) {
title = item.label;
} else if (labelCount > 0 && item.index < labelCount) {
title = labels[item.index];
}
}
return title;
},
afterTitle: helpers.noop,
// Args are: (tooltipItems, data)
beforeBody: helpers.noop,
// Args are: (tooltipItem, data)
beforeLabel: helpers.noop,
label: function(tooltipItem, data) {
var label = data.datasets[tooltipItem.datasetIndex].label || '';
if (label) {
label += ': ';
}
if (!helpers.isNullOrUndef(tooltipItem.value)) {
label += tooltipItem.value;
}
return label;
},
labelColor: function(tooltipItem, chart) {
var meta = chart.getDatasetMeta(tooltipItem.datasetIndex);
var options = meta.controller.getStyle(tooltipItem.index);
return {
borderColor: options.borderColor,
backgroundColor: options.backgroundColor
};
},
labelTextColor: function() {
return this.options.bodyFontColor;
},
afterLabel: helpers.noop,
// Args are: (tooltipItems, data)
afterBody: helpers.noop,
// Args are: (tooltipItems, data)
beforeFooter: helpers.noop,
footer: helpers.noop,
afterFooter: helpers.noop
}
});
@@ -233,21 +231,20 @@ function createTooltipItem(chart, item) {
* @param options {object} the tooltip options
*/
function resolveOptions(options) {
var globalDefaults = defaults.global;
options = helpers.extend({}, globalDefaults.tooltips, options);
options = helpers.extend({}, defaults.tooltips, options);
options.bodyFontFamily = valueOrDefault(options.bodyFontFamily, globalDefaults.defaultFontFamily);
options.bodyFontStyle = valueOrDefault(options.bodyFontStyle, globalDefaults.defaultFontStyle);
options.bodyFontSize = valueOrDefault(options.bodyFontSize, globalDefaults.defaultFontSize);
options.bodyFontFamily = valueOrDefault(options.bodyFontFamily, defaults.fontFamily);
options.bodyFontStyle = valueOrDefault(options.bodyFontStyle, defaults.fontStyle);
options.bodyFontSize = valueOrDefault(options.bodyFontSize, defaults.fontSize);
options.titleFontFamily = valueOrDefault(options.titleFontFamily, globalDefaults.defaultFontFamily);
options.titleFontStyle = valueOrDefault(options.titleFontStyle, globalDefaults.defaultFontStyle);
options.titleFontSize = valueOrDefault(options.titleFontSize, globalDefaults.defaultFontSize);
options.titleFontFamily = valueOrDefault(options.titleFontFamily, defaults.fontFamily);
options.titleFontStyle = valueOrDefault(options.titleFontStyle, defaults.fontStyle);
options.titleFontSize = valueOrDefault(options.titleFontSize, defaults.fontSize);
options.footerFontFamily = valueOrDefault(options.footerFontFamily, globalDefaults.defaultFontFamily);
options.footerFontStyle = valueOrDefault(options.footerFontStyle, globalDefaults.defaultFontStyle);
options.footerFontSize = valueOrDefault(options.footerFontSize, globalDefaults.defaultFontSize);
options.footerFontFamily = valueOrDefault(options.footerFontFamily, defaults.fontFamily);
options.footerFontStyle = valueOrDefault(options.footerFontStyle, defaults.fontStyle);
options.footerFontSize = valueOrDefault(options.footerFontSize, defaults.fontSize);
return options;
}

View File

@@ -5,14 +5,12 @@ import Element from '../core/core.element';
import {getAngleFromPoint} from '../helpers/helpers.math';
const TAU = Math.PI * 2;
defaults._set('global', {
elements: {
arc: {
backgroundColor: defaults.global.defaultColor,
borderColor: '#fff',
borderWidth: 2,
borderAlign: 'center'
}
defaults._set('elements', {
arc: {
backgroundColor: defaults.color,
borderColor: '#fff',
borderWidth: 2,
borderAlign: 'center'
}
});

View File

@@ -7,22 +7,20 @@ import {_computeSegments, _boundSegments} from '../helpers/helpers.segment';
import {_steppedLineTo, _bezierCurveTo} from '../helpers/helpers.canvas';
import {_updateBezierControlPoints} from '../helpers/helpers.curve';
const defaultColor = defaults.global.defaultColor;
const defaultColor = defaults.color;
defaults._set('global', {
elements: {
line: {
tension: 0.4,
backgroundColor: defaultColor,
borderWidth: 3,
borderColor: defaultColor,
borderCapStyle: 'butt',
borderDash: [],
borderDashOffset: 0.0,
borderJoinStyle: 'miter',
capBezierPoints: true,
fill: true
}
defaults._set('elements', {
line: {
tension: 0.4,
backgroundColor: defaultColor,
borderWidth: 3,
borderColor: defaultColor,
borderCapStyle: 'butt',
borderDash: [],
borderDashOffset: 0.0,
borderJoinStyle: 'miter',
capBezierPoints: true,
fill: true
}
});

View File

@@ -4,21 +4,19 @@ import defaults from '../core/core.defaults';
import Element from '../core/core.element';
import helpers from '../helpers';
const defaultColor = defaults.global.defaultColor;
const defaultColor = defaults.color;
defaults._set('global', {
elements: {
point: {
radius: 3,
pointStyle: 'circle',
backgroundColor: defaultColor,
borderColor: defaultColor,
borderWidth: 1,
// Hover
hitRadius: 1,
hoverRadius: 4,
hoverBorderWidth: 1
}
defaults._set('elements', {
point: {
radius: 3,
pointStyle: 'circle',
backgroundColor: defaultColor,
borderColor: defaultColor,
borderWidth: 1,
// Hover
hitRadius: 1,
hoverRadius: 4,
hoverBorderWidth: 1
}
});

View File

@@ -4,16 +4,14 @@ import defaults from '../core/core.defaults';
import Element from '../core/core.element';
import helpers from '../helpers';
const defaultColor = defaults.global.defaultColor;
const defaultColor = defaults.color;
defaults._set('global', {
elements: {
rectangle: {
backgroundColor: defaultColor,
borderColor: defaultColor,
borderSkipped: 'bottom',
borderWidth: 0
}
defaults._set('elements', {
rectangle: {
backgroundColor: defaultColor,
borderColor: defaultColor,
borderSkipped: 'bottom',
borderWidth: 0
}
});

View File

@@ -90,13 +90,12 @@ export function toPadding(value) {
* @private
*/
export function _parseFont(options) {
var globalDefaults = defaults.global;
var size = valueOrDefault(options.fontSize, globalDefaults.defaultFontSize);
var size = valueOrDefault(options.fontSize, defaults.fontSize);
var font = {
family: valueOrDefault(options.fontFamily, globalDefaults.defaultFontFamily),
lineHeight: toLineHeight(valueOrDefault(options.lineHeight, globalDefaults.defaultLineHeight), size),
family: valueOrDefault(options.fontFamily, defaults.fontFamily),
lineHeight: toLineHeight(valueOrDefault(options.lineHeight, defaults.lineHeight), size),
size: size,
style: valueOrDefault(options.fontStyle, globalDefaults.defaultFontStyle),
style: valueOrDefault(options.fontStyle, defaults.fontStyle),
weight: null,
string: ''
};

View File

@@ -13,11 +13,9 @@ import {clipArea, unclipArea} from '../helpers/helpers.canvas';
import {valueOrDefault, isFinite, isArray, extend} from '../helpers/helpers.core';
import {_normalizeAngle} from '../helpers/helpers.math';
defaults._set('global', {
plugins: {
filler: {
propagate: true
}
defaults._set('plugins', {
filler: {
propagate: true
}
});
@@ -436,7 +434,7 @@ export default {
const {line, target, scale} = meta;
const lineOpts = line.options;
const fillOption = lineOpts.fill;
const color = lineOpts.backgroundColor || defaults.global.defaultColor;
const color = lineOpts.backgroundColor || defaults.color;
const {above = color, below = color} = fillOption || {};
if (target && line.points.length) {
clipArea(ctx, area);

View File

@@ -8,71 +8,69 @@ const layouts = require('../core/core.layouts');
const getRtlHelper = helpers.rtl.getRtlAdapter;
const valueOrDefault = helpers.valueOrDefault;
defaults._set('global', {
legend: {
display: true,
position: 'top',
align: 'center',
fullWidth: true,
reverse: false,
weight: 1000,
defaults._set('legend', {
display: true,
position: 'top',
align: 'center',
fullWidth: true,
reverse: false,
weight: 1000,
// a callback that will handle
onClick: function(e, legendItem) {
var index = legendItem.datasetIndex;
var ci = this.chart;
var meta = ci.getDatasetMeta(index);
// a callback that will handle
onClick: function(e, legendItem) {
var index = legendItem.datasetIndex;
var ci = this.chart;
var meta = ci.getDatasetMeta(index);
// See controller.isDatasetVisible comment
meta.hidden = meta.hidden === null ? !ci.data.datasets[index].hidden : null;
// See controller.isDatasetVisible comment
meta.hidden = meta.hidden === null ? !ci.data.datasets[index].hidden : null;
// We hid a dataset ... rerender the chart
ci.update();
},
// We hid a dataset ... rerender the chart
ci.update();
},
onHover: null,
onLeave: null,
onHover: null,
onLeave: null,
labels: {
boxWidth: 40,
padding: 10,
// Generates labels shown in the legend
// Valid properties to return:
// text : text to display
// fillStyle : fill of coloured box
// strokeStyle: stroke of coloured box
// hidden : if this legend item refers to a hidden item
// lineCap : cap style for line
// lineDash
// lineDashOffset :
// lineJoin :
// lineWidth :
generateLabels: function(chart) {
var datasets = chart.data.datasets;
var options = chart.options.legend || {};
var usePointStyle = options.labels && options.labels.usePointStyle;
labels: {
boxWidth: 40,
padding: 10,
// Generates labels shown in the legend
// Valid properties to return:
// text : text to display
// fillStyle : fill of coloured box
// strokeStyle: stroke of coloured box
// hidden : if this legend item refers to a hidden item
// lineCap : cap style for line
// lineDash
// lineDashOffset :
// lineJoin :
// lineWidth :
generateLabels: function(chart) {
var datasets = chart.data.datasets;
var options = chart.options.legend || {};
var usePointStyle = options.labels && options.labels.usePointStyle;
return chart._getSortedDatasetMetas().map(function(meta) {
var style = meta.controller.getStyle(usePointStyle ? 0 : undefined);
return chart._getSortedDatasetMetas().map(function(meta) {
var style = meta.controller.getStyle(usePointStyle ? 0 : undefined);
return {
text: datasets[meta.index].label,
fillStyle: style.backgroundColor,
hidden: !meta.visible,
lineCap: style.borderCapStyle,
lineDash: style.borderDash,
lineDashOffset: style.borderDashOffset,
lineJoin: style.borderJoinStyle,
lineWidth: style.borderWidth,
strokeStyle: style.borderColor,
pointStyle: style.pointStyle,
rotation: style.rotation,
return {
text: datasets[meta.index].label,
fillStyle: style.backgroundColor,
hidden: !meta.visible,
lineCap: style.borderCapStyle,
lineDash: style.borderDash,
lineDashOffset: style.borderDashOffset,
lineJoin: style.borderJoinStyle,
lineWidth: style.borderWidth,
strokeStyle: style.borderColor,
pointStyle: style.pointStyle,
rotation: style.rotation,
// Below is extra data used for toggling the datasets
datasetIndex: meta.index
};
}, this);
}
// Below is extra data used for toggling the datasets
datasetIndex: meta.index
};
}, this);
}
}
});
@@ -333,9 +331,8 @@ class Legend extends Element {
var me = this;
var opts = me.options;
var labelOpts = opts.labels;
var globalDefaults = defaults.global;
var defaultColor = globalDefaults.defaultColor;
var lineDefault = globalDefaults.elements.line;
var defaultColor = defaults.color;
var lineDefault = defaults.elements.line;
var legendHeight = me.height;
var columnHeights = me.columnHeights;
var legendWidth = me.width;
@@ -347,7 +344,7 @@ class Legend extends Element {
var rtlHelper = getRtlHelper(opts.rtl, me.left, me.minSize.width);
var ctx = me.ctx;
var fontColor = valueOrDefault(labelOpts.fontColor, globalDefaults.defaultFontColor);
var fontColor = valueOrDefault(labelOpts.fontColor, defaults.fontColor);
var labelFont = helpers.options._parseFont(labelOpts);
var fontSize = labelFont.size;
var cursor;
@@ -602,7 +599,7 @@ module.exports = {
var legend = chart.legend;
if (legendOpts) {
helpers.mergeIf(legendOpts, defaults.global.legend);
helpers.mergeIf(legendOpts, defaults.legend);
if (legend) {
layouts.configure(chart, legend, legendOpts);

View File

@@ -5,16 +5,14 @@ const Element = require('../core/core.element');
const helpers = require('../helpers/index');
const layouts = require('../core/core.layouts');
defaults._set('global', {
title: {
display: false,
fontStyle: 'bold',
fullWidth: true,
padding: 10,
position: 'top',
text: '',
weight: 2000 // by default greater than legend (1000) to be above
}
defaults._set('title', {
display: false,
fontStyle: 'bold',
fullWidth: true,
padding: 10,
position: 'top',
text: '',
weight: 2000 // by default greater than legend (1000) to be above
});
/**
@@ -148,7 +146,7 @@ class Title extends Element {
var right = me.right;
var maxWidth, titleX, titleY;
ctx.fillStyle = helpers.valueOrDefault(opts.fontColor, defaults.global.defaultFontColor); // render in correct colour
ctx.fillStyle = helpers.valueOrDefault(opts.fontColor, defaults.fontColor); // render in correct colour
ctx.font = fontOpts.string;
// Horizontal
@@ -221,7 +219,7 @@ module.exports = {
var titleBlock = chart.titleBlock;
if (titleOpts) {
helpers.mergeIf(titleOpts, defaults.global.title);
helpers.mergeIf(titleOpts, defaults.title);
if (titleBlock) {
layouts.configure(chart, titleBlock, titleOpts);

View File

@@ -182,7 +182,7 @@ class LogarithmicScale extends Scale {
if (start === 0) {
start = me._getFirstTickValue(me.minNotZero);
offset = valueOrDefault(me.options.ticks.fontSize, defaults.global.defaultFontSize) / me._length;
offset = valueOrDefault(me.options.ticks.fontSize, defaults.fontSize) / me._length;
}
me._startValue = log10(start);

View File

@@ -64,7 +64,7 @@ function getTickBackdropHeight(opts) {
var tickOpts = opts.ticks;
if (tickOpts.display && opts.display) {
return valueOrDefault(tickOpts.fontSize, defaults.global.defaultFontSize) + tickOpts.backdropPaddingY * 2;
return valueOrDefault(tickOpts.fontSize, defaults.fontSize) + tickOpts.backdropPaddingY * 2;
}
return 0;
}
@@ -236,7 +236,7 @@ function drawPointLabels(scale) {
var pointLabelPosition = scale.getPointPosition(i, outerDistance + extra + 5);
// Keep this in loop since we may support array properties here
var pointLabelFontColor = valueAtIndexOrDefault(pointLabelOpts.fontColor, i, defaults.global.defaultFontColor);
var pointLabelFontColor = valueAtIndexOrDefault(pointLabelOpts.fontColor, i, defaults.fontColor);
ctx.fillStyle = pointLabelFontColor;
var angleRadians = scale.getIndexAngle(i);
@@ -486,7 +486,7 @@ class RadialLinearScale extends LinearScaleBase {
var startAngle = me.getIndexAngle(0);
var tickFont = helpers.options._parseFont(tickOpts);
var tickFontColor = valueOrDefault(tickOpts.fontColor, defaults.global.defaultFontColor);
var tickFontColor = valueOrDefault(tickOpts.fontColor, defaults.fontColor);
var offset, width;
ctx.save();

View File

@@ -735,7 +735,7 @@ class TimeScale extends Scale {
const angle = toRadians(me.isHorizontal() ? ticksOpts.maxRotation : ticksOpts.minRotation);
const cosRotation = Math.cos(angle);
const sinRotation = Math.sin(angle);
const tickFontSize = valueOrDefault(ticksOpts.fontSize, defaults.global.defaultFontSize);
const tickFontSize = valueOrDefault(ticksOpts.fontSize, defaults.fontSize);
return {
w: (tickLabelWidth * cosRotation) + (tickFontSize * sinRotation),

View File

@@ -1343,7 +1343,7 @@ describe('Chart.controllers.bar', function() {
var chart = window.acquireChart(this.config);
var meta = chart.getDatasetMeta(0);
var xScale = chart.scales[meta.xAxisID];
var options = Chart.defaults.global.datasets.bar;
var options = Chart.defaults.datasets.bar;
var categoryPercentage = options.categoryPercentage;
var barPercentage = options.barPercentage;
@@ -1517,7 +1517,7 @@ describe('Chart.controllers.bar', function() {
expected = barThickness;
} else {
var scale = chart.scales.x;
var options = Chart.defaults.global.datasets.bar;
var options = Chart.defaults.datasets.bar;
var categoryPercentage = options.categoryPercentage;
var barPercentage = options.barPercentage;
var tickInterval = scale.getPixelForTick(1) - scale.getPixelForTick(0);

View File

@@ -141,8 +141,8 @@ describe('Chart.controllers.bubble', function() {
expect(meta.data[i].x).toBeCloseToPixel(expected.x);
expect(meta.data[i].y).toBeCloseToPixel(expected.y);
expect(meta.data[i].options).toEqual(jasmine.objectContaining({
backgroundColor: Chart.defaults.global.defaultColor,
borderColor: Chart.defaults.global.defaultColor,
backgroundColor: Chart.defaults.color,
borderColor: Chart.defaults.color,
borderWidth: 1,
hitRadius: 1,
radius: expected.r

View File

@@ -559,18 +559,18 @@ describe('Chart.controllers.line', function() {
describe('dataset global defaults', function() {
beforeEach(function() {
this._defaults = Chart.helpers.clone(Chart.defaults.global.datasets.line);
this._defaults = Chart.helpers.clone(Chart.defaults.datasets.line);
});
afterEach(function() {
Chart.defaults.global.datasets.line = this._defaults;
Chart.defaults.datasets.line = this._defaults;
delete this._defaults;
});
it('should utilize the dataset global default options', function() {
Chart.defaults.global.datasets.line = Chart.defaults.global.datasets.line || {};
Chart.defaults.datasets.line = Chart.defaults.datasets.line || {};
Chart.helpers.merge(Chart.defaults.global.datasets.line, {
Chart.helpers.merge(Chart.defaults.datasets.line, {
spanGaps: true,
lineTension: 0.231,
backgroundColor: '#add',
@@ -611,9 +611,9 @@ describe('Chart.controllers.line', function() {
});
it('should be overriden by user-supplied values', function() {
Chart.defaults.global.datasets.line = Chart.defaults.global.datasets.line || {};
Chart.defaults.datasets.line = Chart.defaults.datasets.line || {};
Chart.helpers.merge(Chart.defaults.global.datasets.line, {
Chart.helpers.merge(Chart.defaults.datasets.line, {
spanGaps: true,
lineTension: 0.231
});

View File

@@ -100,9 +100,9 @@ describe('Chart.controllers.radar', function() {
tension: 0.1,
},
point: {
backgroundColor: Chart.defaults.global.defaultColor,
backgroundColor: Chart.defaults.color,
borderWidth: 1,
borderColor: Chart.defaults.global.defaultColor,
borderColor: Chart.defaults.color,
hitRadius: 1,
hoverRadius: 4,
hoverBorderWidth: 1,
@@ -143,9 +143,9 @@ describe('Chart.controllers.radar', function() {
expect(meta.data[i].controlPointNextX).toBeCloseToPixel(expected.cpnx);
expect(meta.data[i].controlPointNextY).toBeCloseToPixel(expected.cpny);
expect(meta.data[i].options).toEqual(jasmine.objectContaining({
backgroundColor: Chart.defaults.global.defaultColor,
backgroundColor: Chart.defaults.color,
borderWidth: 1,
borderColor: Chart.defaults.global.defaultColor,
borderColor: Chart.defaults.color,
hitRadius: 1,
radius: 3,
pointStyle: 'circle',
@@ -168,9 +168,9 @@ describe('Chart.controllers.radar', function() {
expect(meta.data[i].controlPointNextX).toBeCloseToPixel(expected.cpnx);
expect(meta.data[i].controlPointNextY).toBeCloseToPixel(expected.cpny);
expect(meta.data[i].options).toEqual(jasmine.objectContaining({
backgroundColor: Chart.defaults.global.defaultColor,
backgroundColor: Chart.defaults.color,
borderWidth: 1,
borderColor: Chart.defaults.global.defaultColor,
borderColor: Chart.defaults.color,
hitRadius: 1,
radius: 3,
pointStyle: 'circle',

View File

@@ -66,7 +66,7 @@ describe('Chart', function() {
var callback = function() {};
var defaults = Chart.defaults;
defaults.global.hover.onHover = callback;
defaults.hover.onHover = callback;
defaults.line.spanGaps = true;
defaults.line.hover.mode = 'x-axis';
@@ -75,13 +75,13 @@ describe('Chart', function() {
});
var options = chart.options;
expect(options.defaultFontSize).toBe(defaults.global.defaultFontSize);
expect(options.fontSize).toBe(defaults.fontSize);
expect(options.showLines).toBe(defaults.line.showLines);
expect(options.spanGaps).toBe(true);
expect(options.hover.onHover).toBe(callback);
expect(options.hover.mode).toBe('x-axis');
defaults.global.hover.onHover = null;
defaults.hover.onHover = null;
defaults.line.spanGaps = false;
defaults.line.hover.mode = 'index';
});
@@ -90,7 +90,7 @@ describe('Chart', function() {
var callback = function() {};
var defaults = Chart.defaults;
defaults.global.hover.onHover = callback;
defaults.hover.onHover = callback;
defaults.line.hover.mode = 'x-axis';
defaults.line.spanGaps = true;
@@ -108,12 +108,12 @@ describe('Chart', function() {
});
var options = chart.options;
expect(options.showLines).toBe(defaults.global.showLines);
expect(options.showLines).toBe(defaults.showLines);
expect(options.spanGaps).toBe(false);
expect(options.hover.mode).toBe('dataset');
expect(options.title.position).toBe('bottom');
defaults.global.hover.onHover = null;
defaults.hover.onHover = null;
defaults.line.hover.mode = 'index';
defaults.line.spanGaps = false;
});
@@ -297,7 +297,7 @@ describe('Chart', function() {
expect(chart.scales.y.options._jasmineCheck).toBeDefined();
expect(Chart.defaults.line._jasmineCheck).not.toBeDefined();
expect(Chart.defaults.global._jasmineCheck).not.toBeDefined();
expect(Chart.defaults._jasmineCheck).not.toBeDefined();
expect(Chart.scaleService.defaults.linear._jasmineCheck).not.toBeDefined();
expect(Chart.scaleService.defaults.category._jasmineCheck).not.toBeDefined();
});

View File

@@ -306,7 +306,7 @@ describe('Chart.plugins', function() {
it('should call plugins with default options when plugin options is TRUE', function() {
var plugin = {id: 'a', hook: function() {}};
Chart.defaults.global.plugins.a = {a: 42};
Chart.defaults.plugins.a = {a: 42};
Chart.plugins.register(plugin);
var chart = window.acquireChart({
@@ -324,14 +324,14 @@ describe('Chart.plugins', function() {
expect(plugin.hook).toHaveBeenCalled();
expect(plugin.hook.calls.first().args[1]).toEqual({a: 42});
delete Chart.defaults.global.plugins.a;
delete Chart.defaults.plugins.a;
});
it('should call plugins with default options if plugin config options is undefined', function() {
var plugin = {id: 'a', hook: function() {}};
Chart.defaults.global.plugins.a = {a: 'foobar'};
Chart.defaults.plugins.a = {a: 'foobar'};
Chart.plugins.register(plugin);
spyOn(plugin, 'hook');
@@ -342,7 +342,7 @@ describe('Chart.plugins', function() {
expect(plugin.hook).toHaveBeenCalled();
expect(plugin.hook.calls.first().args[1]).toEqual({a: 'foobar'});
delete Chart.defaults.global.plugins.a;
delete Chart.defaults.plugins.a;
});
// https://github.com/chartjs/Chart.js/issues/5111#issuecomment-355934167

View File

@@ -19,11 +19,11 @@ describe('Core.Tooltip', function() {
value: '20'
};
var label = Chart.defaults.global.tooltips.callbacks.label(tooltipItem, data);
var label = Chart.defaults.tooltips.callbacks.label(tooltipItem, data);
expect(label).toBe('20');
data.datasets[0].label = 'My dataset';
label = Chart.defaults.global.tooltips.callbacks.label(tooltipItem, data);
label = Chart.defaults.tooltips.callbacks.label(tooltipItem, data);
expect(label).toBe('My dataset: 20');
});
});
@@ -78,7 +78,7 @@ describe('Core.Tooltip', function() {
// Check and see if tooltip was displayed
var tooltip = chart.tooltip;
var globalDefaults = Chart.defaults.global;
var defaults = Chart.defaults;
expect(tooltip.options.xPadding).toEqual(6);
expect(tooltip.options.yPadding).toEqual(6);
@@ -88,19 +88,19 @@ describe('Core.Tooltip', function() {
expect(tooltip.options).toEqual(jasmine.objectContaining({
// Body
bodyFontColor: '#fff',
bodyFontFamily: globalDefaults.defaultFontFamily,
bodyFontStyle: globalDefaults.defaultFontStyle,
bodyFontFamily: defaults.fontFamily,
bodyFontStyle: defaults.fontStyle,
bodyAlign: 'left',
bodyFontSize: globalDefaults.defaultFontSize,
bodyFontSize: defaults.fontSize,
bodySpacing: 2,
}));
expect(tooltip.options).toEqual(jasmine.objectContaining({
// Title
titleFontColor: '#fff',
titleFontFamily: globalDefaults.defaultFontFamily,
titleFontFamily: defaults.fontFamily,
titleFontStyle: 'bold',
titleFontSize: globalDefaults.defaultFontSize,
titleFontSize: defaults.fontSize,
titleAlign: 'left',
titleSpacing: 2,
titleMarginBottom: 6,
@@ -109,9 +109,9 @@ describe('Core.Tooltip', function() {
expect(tooltip.options).toEqual(jasmine.objectContaining({
// Footer
footerFontColor: '#fff',
footerFontFamily: globalDefaults.defaultFontFamily,
footerFontFamily: defaults.fontFamily,
footerFontStyle: 'bold',
footerFontSize: globalDefaults.defaultFontSize,
footerFontSize: defaults.fontSize,
footerAlign: 'left',
footerSpacing: 2,
footerMarginTop: 6,
@@ -145,11 +145,11 @@ describe('Core.Tooltip', function() {
afterBody: [],
footer: [],
labelColors: [{
borderColor: globalDefaults.defaultColor,
backgroundColor: globalDefaults.defaultColor
borderColor: defaults.color,
backgroundColor: defaults.color
}, {
borderColor: globalDefaults.defaultColor,
backgroundColor: globalDefaults.defaultColor
borderColor: defaults.color,
backgroundColor: defaults.color
}]
}));
@@ -254,7 +254,7 @@ describe('Core.Tooltip', function() {
// Check and see if tooltip was displayed
var tooltip = chart.tooltip;
var globalDefaults = Chart.defaults.global;
var defaults = Chart.defaults;
expect(tooltip.options.xPadding).toEqual(6);
expect(tooltip.options.yPadding).toEqual(6);
@@ -264,19 +264,19 @@ describe('Core.Tooltip', function() {
expect(tooltip.options).toEqual(jasmine.objectContaining({
// Body
bodyFontColor: '#fff',
bodyFontFamily: globalDefaults.defaultFontFamily,
bodyFontStyle: globalDefaults.defaultFontStyle,
bodyFontFamily: defaults.fontFamily,
bodyFontStyle: defaults.fontStyle,
bodyAlign: 'left',
bodyFontSize: globalDefaults.defaultFontSize,
bodyFontSize: defaults.fontSize,
bodySpacing: 2,
}));
expect(tooltip.options).toEqual(jasmine.objectContaining({
// Title
titleFontColor: '#fff',
titleFontFamily: globalDefaults.defaultFontFamily,
titleFontFamily: defaults.fontFamily,
titleFontStyle: 'bold',
titleFontSize: globalDefaults.defaultFontSize,
titleFontSize: defaults.fontSize,
titleAlign: 'left',
titleSpacing: 2,
titleMarginBottom: 6,
@@ -285,9 +285,9 @@ describe('Core.Tooltip', function() {
expect(tooltip.options).toEqual(jasmine.objectContaining({
// Footer
footerFontColor: '#fff',
footerFontFamily: globalDefaults.defaultFontFamily,
footerFontFamily: defaults.fontFamily,
footerFontStyle: 'bold',
footerFontSize: globalDefaults.defaultFontSize,
footerFontSize: defaults.fontSize,
footerAlign: 'left',
footerSpacing: 2,
footerMarginTop: 6,
@@ -318,8 +318,8 @@ describe('Core.Tooltip', function() {
footer: [],
labelTextColors: ['#fff'],
labelColors: [{
borderColor: globalDefaults.defaultColor,
backgroundColor: globalDefaults.defaultColor
borderColor: defaults.color,
backgroundColor: defaults.color
}]
}));
@@ -409,7 +409,7 @@ describe('Core.Tooltip', function() {
// Check and see if tooltip was displayed
var tooltip = chart.tooltip;
var globalDefaults = Chart.defaults.global;
var defaults = Chart.defaults;
expect(tooltip.options.xPadding).toEqual(6);
expect(tooltip.options.yPadding).toEqual(6);
@@ -419,19 +419,19 @@ describe('Core.Tooltip', function() {
expect(tooltip.options).toEqual(jasmine.objectContaining({
// Body
bodyFontColor: '#fff',
bodyFontFamily: globalDefaults.defaultFontFamily,
bodyFontStyle: globalDefaults.defaultFontStyle,
bodyFontFamily: defaults.fontFamily,
bodyFontStyle: defaults.fontStyle,
bodyAlign: 'left',
bodyFontSize: globalDefaults.defaultFontSize,
bodyFontSize: defaults.fontSize,
bodySpacing: 2,
}));
expect(tooltip.options).toEqual(jasmine.objectContaining({
// Title
titleFontColor: '#fff',
titleFontFamily: globalDefaults.defaultFontFamily,
titleFontFamily: defaults.fontFamily,
titleFontStyle: 'bold',
titleFontSize: globalDefaults.defaultFontSize,
titleFontSize: defaults.fontSize,
titleAlign: 'left',
titleSpacing: 2,
titleMarginBottom: 6,
@@ -440,9 +440,9 @@ describe('Core.Tooltip', function() {
expect(tooltip.options).toEqual(jasmine.objectContaining({
// Footer
footerFontColor: '#fff',
footerFontFamily: globalDefaults.defaultFontFamily,
footerFontFamily: defaults.fontFamily,
footerFontStyle: 'bold',
footerFontSize: globalDefaults.defaultFontSize,
footerFontSize: defaults.fontSize,
footerAlign: 'left',
footerSpacing: 2,
footerMarginTop: 6,
@@ -476,11 +476,11 @@ describe('Core.Tooltip', function() {
footer: ['beforeFooter', 'footer', 'afterFooter'],
labelTextColors: ['labelTextColor', 'labelTextColor'],
labelColors: [{
borderColor: globalDefaults.defaultColor,
backgroundColor: globalDefaults.defaultColor
borderColor: defaults.color,
backgroundColor: defaults.color
}, {
borderColor: globalDefaults.defaultColor,
backgroundColor: globalDefaults.defaultColor
borderColor: defaults.color,
backgroundColor: defaults.color
}]
}));
@@ -535,7 +535,7 @@ describe('Core.Tooltip', function() {
// Check and see if tooltip was displayed
var tooltip = chart.tooltip;
var globalDefaults = Chart.defaults.global;
var defaults = Chart.defaults;
expect(tooltip).toEqual(jasmine.objectContaining({
// Positioning
@@ -557,11 +557,11 @@ describe('Core.Tooltip', function() {
afterBody: [],
footer: [],
labelColors: [{
borderColor: globalDefaults.defaultColor,
backgroundColor: globalDefaults.defaultColor
borderColor: defaults.color,
backgroundColor: defaults.color
}, {
borderColor: globalDefaults.defaultColor,
backgroundColor: globalDefaults.defaultColor
borderColor: defaults.color,
backgroundColor: defaults.color
}]
}));
@@ -614,7 +614,7 @@ describe('Core.Tooltip', function() {
// Check and see if tooltip was displayed
var tooltip = chart.tooltip;
var globalDefaults = Chart.defaults.global;
var defaults = Chart.defaults;
expect(tooltip).toEqual(jasmine.objectContaining({
// Positioning
@@ -636,11 +636,11 @@ describe('Core.Tooltip', function() {
afterBody: [],
footer: [],
labelColors: [{
borderColor: globalDefaults.defaultColor,
backgroundColor: globalDefaults.defaultColor
borderColor: defaults.color,
backgroundColor: defaults.color
}, {
borderColor: globalDefaults.defaultColor,
backgroundColor: globalDefaults.defaultColor
borderColor: defaults.color,
backgroundColor: defaults.color
}]
}));
@@ -694,7 +694,7 @@ describe('Core.Tooltip', function() {
// Check and see if tooltip was displayed
var tooltip = chart.tooltip;
var globalDefaults = Chart.defaults.global;
var defaults = Chart.defaults;
expect(tooltip).toEqual(jasmine.objectContaining({
// Positioning
@@ -716,11 +716,11 @@ describe('Core.Tooltip', function() {
afterBody: [],
footer: [],
labelColors: [{
borderColor: globalDefaults.defaultColor,
backgroundColor: globalDefaults.defaultColor
borderColor: defaults.color,
backgroundColor: defaults.color
}, {
borderColor: globalDefaults.defaultColor,
backgroundColor: globalDefaults.defaultColor
borderColor: defaults.color,
backgroundColor: defaults.color
}]
}));
@@ -777,7 +777,7 @@ describe('Core.Tooltip', function() {
// Check and see if tooltip was displayed
var tooltip = chart.tooltip;
var globalDefaults = Chart.defaults.global;
var defaults = Chart.defaults;
expect(tooltip).toEqual(jasmine.objectContaining({
// Positioning
@@ -795,8 +795,8 @@ describe('Core.Tooltip', function() {
afterBody: [],
footer: [],
labelColors: [{
borderColor: globalDefaults.defaultColor,
backgroundColor: globalDefaults.defaultColor
borderColor: defaults.color,
backgroundColor: defaults.color
}]
}));
});
@@ -1176,7 +1176,7 @@ describe('Core.Tooltip', function() {
// Check and see if tooltip was displayed
var tooltip = chart.tooltip;
var globalDefaults = Chart.defaults.global;
var defaults = Chart.defaults;
expect(tooltip.options.xPadding).toEqual(6);
expect(tooltip.options.yPadding).toEqual(6);
@@ -1186,19 +1186,19 @@ describe('Core.Tooltip', function() {
expect(tooltip.options).toEqual(jasmine.objectContaining({
// Body
bodyFontColor: '#fff',
bodyFontFamily: globalDefaults.defaultFontFamily,
bodyFontStyle: globalDefaults.defaultFontStyle,
bodyFontFamily: defaults.fontFamily,
bodyFontStyle: defaults.fontStyle,
bodyAlign: 'left',
bodyFontSize: globalDefaults.defaultFontSize,
bodyFontSize: defaults.fontSize,
bodySpacing: 2,
}));
expect(tooltip.options).toEqual(jasmine.objectContaining({
// Title
titleFontColor: '#fff',
titleFontFamily: globalDefaults.defaultFontFamily,
titleFontFamily: defaults.fontFamily,
titleFontStyle: 'bold',
titleFontSize: globalDefaults.defaultFontSize,
titleFontSize: defaults.fontSize,
titleAlign: 'left',
titleSpacing: 2,
titleMarginBottom: 6,
@@ -1207,9 +1207,9 @@ describe('Core.Tooltip', function() {
expect(tooltip.options).toEqual(jasmine.objectContaining({
// Footer
footerFontColor: '#fff',
footerFontFamily: globalDefaults.defaultFontFamily,
footerFontFamily: defaults.fontFamily,
footerFontStyle: 'bold',
footerFontSize: globalDefaults.defaultFontSize,
footerFontSize: defaults.fontSize,
footerAlign: 'left',
footerSpacing: 2,
footerMarginTop: 6,
@@ -1243,17 +1243,17 @@ describe('Core.Tooltip', function() {
footer: ['beforeFooter', 'newline', 'footer', 'newline', 'afterFooter', 'newline'],
labelTextColors: ['labelTextColor', 'labelTextColor'],
labelColors: [{
borderColor: globalDefaults.defaultColor,
backgroundColor: globalDefaults.defaultColor
borderColor: defaults.color,
backgroundColor: defaults.color
}, {
borderColor: globalDefaults.defaultColor,
backgroundColor: globalDefaults.defaultColor
borderColor: defaults.color,
backgroundColor: defaults.color
}]
}));
});
describe('text align', function() {
var globalDefaults = Chart.defaults.global;
var defaults = Chart.defaults;
var makeView = function(title, body, footer) {
return {
// Positioning
@@ -1270,26 +1270,26 @@ describe('Core.Tooltip', function() {
// Body
bodyFontColor: '#fff',
bodyFontFamily: globalDefaults.defaultFontFamily,
bodyFontStyle: globalDefaults.defaultFontStyle,
bodyFontFamily: defaults.fontFamily,
bodyFontStyle: defaults.fontStyle,
bodyAlign: body,
bodyFontSize: globalDefaults.defaultFontSize,
bodyFontSize: defaults.fontSize,
bodySpacing: 2,
// Title
titleFontColor: '#fff',
titleFontFamily: globalDefaults.defaultFontFamily,
titleFontFamily: defaults.fontFamily,
titleFontStyle: 'bold',
titleFontSize: globalDefaults.defaultFontSize,
titleFontSize: defaults.fontSize,
titleAlign: title,
titleSpacing: 2,
titleMarginBottom: 6,
// Footer
footerFontColor: '#fff',
footerFontFamily: globalDefaults.defaultFontFamily,
footerFontFamily: defaults.fontFamily,
footerFontStyle: 'bold',
footerFontSize: globalDefaults.defaultFontSize,
footerFontSize: defaults.fontSize,
footerAlign: footer,
footerSpacing: 2,
footerMarginTop: 6,

View File

@@ -70,14 +70,17 @@ describe('Chart.helpers.options', function() {
var parseFont = options._parseFont;
it ('should return a font with default values', function() {
var global = Chart.defaults.global;
const fontFamily = Chart.defaults.fontFamily;
const fontSize = Chart.defaults.fontSize;
const fontStyle = Chart.defaults.fontStyle;
const lineHeight = Chart.defaults.lineHeight;
Chart.defaults.global = {
defaultFontFamily: 'foobar',
defaultFontSize: 42,
defaultFontStyle: 'xxxyyy',
defaultLineHeight: 1.5
};
Chart.helpers.extend(Chart.defaults, {
fontFamily: 'foobar',
fontSize: 42,
fontStyle: 'xxxyyy',
lineHeight: 1.5
});
expect(parseFont({})).toEqual({
family: 'foobar',
@@ -88,7 +91,12 @@ describe('Chart.helpers.options', function() {
weight: null
});
Chart.defaults.global = global;
Chart.helpers.extend(Chart.defaults, {
fontFamily,
fontSize,
fontStyle,
lineHeight
});
});
it ('should return a font with given values', function() {
expect(parseFont({
@@ -106,9 +114,10 @@ describe('Chart.helpers.options', function() {
});
});
it('should return null as a font string if fontSize or fontFamily are missing', function() {
var global = Chart.defaults.global;
Chart.defaults.global = {};
const fontFamily = Chart.defaults.fontFamily;
const fontSize = Chart.defaults.fontSize;
delete Chart.defaults.fontFamily;
delete Chart.defaults.fontSize;
expect(parseFont({
fontStyle: 'italic',
@@ -119,19 +128,19 @@ describe('Chart.helpers.options', function() {
fontFamily: 'serif'
}).string).toBeNull();
Chart.defaults.global = global;
Chart.defaults.fontFamily = fontFamily;
Chart.defaults.fontSize = fontSize;
});
it('fontStyle should be optional for font strings', function() {
var global = Chart.defaults.global;
Chart.defaults.global = {};
const fontStyle = Chart.defaults.fontStyle;
delete Chart.defaults.fontStyle;
expect(parseFont({
fontSize: 12,
fontFamily: 'serif'
}).string).toBe('12px serif');
Chart.defaults.global = global;
Chart.defaults.fontStyle = fontStyle;
});
});

View File

@@ -3,7 +3,7 @@ describe('Legend block tests', function() {
describe('auto', jasmine.fixture.specs('plugin.legend'));
it('should have the correct default config', function() {
expect(Chart.defaults.global.legend).toEqual({
expect(Chart.defaults.legend).toEqual({
display: true,
position: 'top',
align: 'center',
@@ -591,7 +591,7 @@ describe('Legend block tests', function() {
chart.options.legend = {};
chart.update();
expect(chart.legend).not.toBe(undefined);
expect(chart.legend.options).toEqual(jasmine.objectContaining(Chart.defaults.global.legend));
expect(chart.legend.options).toEqual(jasmine.objectContaining(Chart.defaults.legend));
});
});

View File

@@ -4,7 +4,7 @@ var Title = Chart.plugins.getAll().find(p => p.id === 'title')._element;
describe('Title block tests', function() {
it('Should have the correct default config', function() {
expect(Chart.defaults.global.title).toEqual({
expect(Chart.defaults.title).toEqual({
display: false,
position: 'top',
fullWidth: true,
@@ -18,7 +18,7 @@ describe('Title block tests', function() {
it('should update correctly', function() {
var chart = {};
var options = Chart.helpers.clone(Chart.defaults.global.title);
var options = Chart.helpers.clone(Chart.defaults.title);
options.text = 'My title';
var title = new Title({
@@ -47,7 +47,7 @@ describe('Title block tests', function() {
it('should update correctly when vertical', function() {
var chart = {};
var options = Chart.helpers.clone(Chart.defaults.global.title);
var options = Chart.helpers.clone(Chart.defaults.title);
options.text = 'My title';
options.position = 'left';
@@ -77,7 +77,7 @@ describe('Title block tests', function() {
it('should have the correct size when there are multiple lines of text', function() {
var chart = {};
var options = Chart.helpers.clone(Chart.defaults.global.title);
var options = Chart.helpers.clone(Chart.defaults.title);
options.text = ['line1', 'line2'];
options.position = 'left';
options.display = true;
@@ -100,7 +100,7 @@ describe('Title block tests', function() {
var chart = {};
var context = window.createMockContext();
var options = Chart.helpers.clone(Chart.defaults.global.title);
var options = Chart.helpers.clone(Chart.defaults.title);
options.text = 'My title';
var title = new Title({
@@ -152,7 +152,7 @@ describe('Title block tests', function() {
var chart = {};
var context = window.createMockContext();
var options = Chart.helpers.clone(Chart.defaults.global.title);
var options = Chart.helpers.clone(Chart.defaults.title);
options.text = 'My title';
options.position = 'left';
@@ -322,7 +322,7 @@ describe('Title block tests', function() {
chart.options.title = {};
chart.update();
expect(chart.titleBlock).not.toBe(undefined);
expect(chart.titleBlock.options).toEqual(jasmine.objectContaining(Chart.defaults.global.title));
expect(chart.titleBlock.options).toEqual(jasmine.objectContaining(Chart.defaults.title));
});
});
});

View File

@@ -1135,7 +1135,7 @@ describe('Logarithmic Scale tests', function() {
var scale = chart.scales[axisID];
var firstTick = setup.firstTick;
var lastTick = setup.lastTick;
var fontSize = chart.options.defaultFontSize;
var fontSize = chart.options.fontSize;
var start = chart.chartArea[axis.start];
var end = chart.chartArea[axis.end];
var sign = scale.isHorizontal() ? 1 : -1;

View File

@@ -55,7 +55,7 @@ function acquireChart(config, options) {
config.options = config.options || {};
config.options.animation = config.options.animation === undefined ? false : config.options.animation;
config.options.responsive = config.options.responsive === undefined ? false : config.options.responsive;
config.options.defaultFontFamily = config.options.defaultFontFamily || 'Arial';
config.options.fontFamily = config.options.fontFamily || 'Arial';
wrapper.appendChild(canvas);
window.document.body.appendChild(wrapper);