Default configuration

Every chart created in Chart.js comes previously configured with default properties. You can always override these properties in the options object when creating a new Chart instance, but you can also override them for all or for many of your charts, by setting the properties directly in the Chart.defaults object.

For example, the default line tension is 0.4 for any kind of chart. If you want all your charts to use only straight lines and have scales beginning at zero, you can make all pages load a defaults.js file that declares the following defaults:

Charts.defaults.global.elements.line.tension = 0;
Charts.defaults.scales.ticks.beginAtZero = true;

If you want to have only curved lines in the radar charts, you can override the property for all radar charts (but not any other kind of chart) using the following:

Charts.defaults.radar.elements.line.tension = 0.4;

Then, if you have a specific line chart where you would prefer to use curved lines, you can again override the property when you create the chart instance, using its options configuration object:

const chart = new Chart("my-chart", {     type: 'line', data: {...},
options: {
elements: {
line: {
tension: 0
//overrides Charts.defaults.global.elements.line.tension
}
}
}
});

Some options can even be configured for a specific dataset within a chart, which is the case with line tension. If you use lineTension: 0.3 for a specific dataset in the datasets array, only the line corresponding to that dataset will exhibit the new tension:

datasets: [{
data: [1,2,1],
lineTension: 0.3
}]

The order is significant, and so is the hierarchy. Properties set in a more specific context will almost always override the values set in a more general context. And any global properties should be set before instantiating a chart. In the next sections, we will explore options that can be defined at different configuration levels, their object structure, and their default values.

..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset