Convert axis options from arrays to objects (#6773)

* Convert axis options from arrays to objects

* Updated all chart type defaults
* Throw errors when axis type or position are not specified
* Avoid raising unnecessary errors when merging options into the default configs

* Fix additional tests

* Ensure scale defaults are set if type is not explicitly defined

* Another step

* Include `scale` as `firstIDs.r`

* update docs

* Update for buildOrUpdateScales

* Update migration guide

* Add test back
This commit is contained in:
Jukka Kurkela 2019-11-22 01:46:49 +02:00 committed by Evert Timberg
parent 18e3bc0624
commit ce74eb76a1
211 changed files with 1909 additions and 2128 deletions

View File

@ -43,9 +43,9 @@ var myChart = new Chart(ctx, {
}, },
options: { options: {
scales: { scales: {
yAxes: [{ y: {
beginAtZero: true beginAtZero: true
}] }
} }
} }
}); });

View File

@ -38,7 +38,8 @@ The following options are common to all cartesian axes but do not apply to other
| `padding` | `number` | `0` | Padding between the tick label and the axis. When set on a vertical axis, this applies in the horizontal (X) direction. When set on a horizontal axis, this applies in the vertical (Y) direction. | `padding` | `number` | `0` | Padding between the tick label and the axis. When set on a vertical axis, this applies in the horizontal (X) direction. When set on a horizontal axis, this applies in the vertical (Y) direction.
### Axis ID ### Axis ID
The properties `dataset.xAxisID` or `dataset.yAxisID` have to match the scale properties `scales.xAxes.id` or `scales.yAxes.id`. This is especially needed if multi-axes charts are used.
The properties `dataset.xAxisID` or `dataset.yAxisID` have to match to `scales` property. This is especially needed if multi-axes charts are used.
```javascript ```javascript
var myChart = new Chart(ctx, { var myChart = new Chart(ctx, {
@ -54,11 +55,10 @@ var myChart = new Chart(ctx, {
}, },
options: { options: {
scales: { scales: {
yAxes: [{ 'first-y-axis': {
id: 'first-y-axis',
type: 'linear' type: 'linear'
}, { },
id: 'second-y-axis', 'second-y-axis': {
type: 'linear' type: 'linear'
}] }]
} }
@ -93,12 +93,11 @@ var myChart = new Chart(ctx, {
}, },
options: { options: {
scales: { scales: {
yAxes: [{ 'left-y-axis': {
id: 'left-y-axis',
type: 'linear', type: 'linear',
position: 'left' position: 'left'
}, { },
id: 'right-y-axis', 'right-y-axis': {
type: 'linear', type: 'linear',
position: 'right' position: 'right'
}] }]

View File

@ -25,10 +25,10 @@ let chart = new Chart(ctx, {
data: ... data: ...
options: { options: {
scales: { scales: {
xAxes: [{ x: {
type: 'category', type: 'category',
labels: ['January', 'February', 'March', 'April', 'May', 'June'] labels: ['January', 'February', 'March', 'April', 'May', 'June']
}] }
} }
} }
}); });
@ -58,9 +58,9 @@ let chart = new Chart(ctx, {
}, },
options: { options: {
scales: { scales: {
xAxes: [{ x: {
min: 'March' min: 'March'
}] }
} }
} }
}); });

View File

@ -45,10 +45,10 @@ let chart = new Chart(ctx, {
}, },
options: { options: {
scales: { scales: {
yAxes: [{ y: {
suggestedMin: 50, suggestedMin: 50,
suggestedMax: 100 suggestedMax: 100
}] }
} }
} }
}); });
@ -65,13 +65,13 @@ This example sets up a chart with a y axis that creates ticks at `0, 0.5, 1, 1.5
```javascript ```javascript
let options = { let options = {
scales: { scales: {
yAxes: [{ y: {
max: 5, max: 5,
min: 0, min: 0,
ticks: { ticks: {
stepSize: 0.5 stepSize: 0.5
} }
}] }
} }
}; };
``` ```

View File

@ -67,18 +67,19 @@ var chart = new Chart(ctx, {
data: data, data: data,
options: { options: {
scales: { scales: {
xAxes: [{ x: {
type: 'time', type: 'time',
time: { time: {
unit: 'month' unit: 'month'
} }
}] }
} }
} }
}); });
``` ```
### Display Formats ### Display Formats
The following display formats are used to configure how different time units are formed into strings for the axis tick marks. See [Moment.js](https://momentjs.com/docs/#/displaying/format/) for the allowable format strings. The following display formats are used to configure how different time units are formed into strings for the axis tick marks. See [Moment.js](https://momentjs.com/docs/#/displaying/format/) for the allowable format strings.
Name | Default | Example Name | Default | Example
@ -101,14 +102,14 @@ var chart = new Chart(ctx, {
data: data, data: data,
options: { options: {
scales: { scales: {
xAxes: [{ x: {
type: 'time', type: 'time',
time: { time: {
displayFormats: { displayFormats: {
quarter: 'MMM YYYY' quarter: 'MMM YYYY'
} }
} }
}] }
} }
} }
}); });
@ -127,10 +128,10 @@ var chart = new Chart(ctx, {
data: data, data: data,
options: { options: {
scales: { scales: {
xAxes: [{ x: {
type: 'time', type: 'time',
distribution: 'series' distribution: 'series'
}] }
} }
} }
}); });

View File

@ -31,14 +31,14 @@ var chart = new Chart(ctx, {
data: data, data: data,
options: { options: {
scales: { scales: {
yAxes: [{ y: {
ticks: { ticks: {
// Include a dollar sign in the ticks // Include a dollar sign in the ticks
callback: function(value, index, values) { callback: function(value, index, values) {
return '$' + value; return '$' + value;
} }
} }
}] }
} }
} }
}); });

View File

@ -41,9 +41,9 @@ A bar chart provides a way of showing data values represented as vertical bars.
}, },
"options": { "options": {
"scales": { "scales": {
"yAxes": [{ "y": {
"beginAtZero": true "beginAtZero": true
}] }
} }
} }
} }
@ -160,7 +160,9 @@ data: {
}] }]
}; };
``` ```
### barThickness ### barThickness
If this value is a number, it is applied to the width of each bar, in pixels. When this is enforced, `barPercentage` and `categoryPercentage` are ignored. If this value is a number, it is applied to the width of each bar, in pixels. When this is enforced, `barPercentage` and `categoryPercentage` are ignored.
If set to `'flex'`, the base sample widths are calculated automatically based on the previous and following samples so that they take the full available widths without overlap. Then, bars are sized using `barPercentage` and `categoryPercentage`. There is no gap when the percentage options are 1. This mode generates bars with different widths when data are not evenly spaced. If set to `'flex'`, the base sample widths are calculated automatically based on the previous and following samples so that they take the full available widths without overlap. Then, bars are sized using `barPercentage` and `categoryPercentage`. There is no gap when the percentage options are 1. This mode generates bars with different widths when data are not evenly spaced.
@ -168,6 +170,7 @@ If set to `'flex'`, the base sample widths are calculated automatically based on
If not set (default), the base sample widths are calculated using the smallest interval that prevents bar overlapping, and bars are sized using `barPercentage` and `categoryPercentage`. This mode always generates bars equally sized. If not set (default), the base sample widths are calculated using the smallest interval that prevents bar overlapping, and bars are sized using `barPercentage` and `categoryPercentage`. This mode always generates bars equally sized.
## Scale Configuration ## Scale Configuration
The bar chart sets unique default values for the following configuration from the associated `scale` options: The bar chart sets unique default values for the following configuration from the associated `scale` options:
| Name | Type | Default | Description | Name | Type | Default | Description
@ -180,16 +183,17 @@ The bar chart sets unique default values for the following configuration from th
```javascript ```javascript
options = { options = {
scales: { scales: {
xAxes: [{ x: {
gridLines: { gridLines: {
offsetGridLines: true offsetGridLines: true
} }
}] }
} }
}; };
``` ```
### offsetGridLines ### offsetGridLines
If true, the bars for a particular data point fall between the grid lines. The grid line will move to the left by one half of the tick interval, which is the space between the grid lines. If false, the grid line will go right down the middle of the bars. This is set to true for a category scale in a bar chart while false for other scales or chart types by default. If true, the bars for a particular data point fall between the grid lines. The grid line will move to the left by one half of the tick interval, which is the space between the grid lines. If false, the grid line will go right down the middle of the bars. This is set to true for a category scale in a bar chart while false for other scales or chart types by default.
## Default Options ## Default Options
@ -249,12 +253,12 @@ var stackedBar = new Chart(ctx, {
data: data, data: data,
options: { options: {
scales: { scales: {
xAxes: [{ x: {
stacked: true stacked: true
}], },
yAxes: [{ y: {
stacked: true stacked: true
}] }
} }
} }
}); });
@ -267,6 +271,7 @@ The following dataset properties are specific to stacked bar charts.
| `stack` | `string` | The ID of the group to which this dataset belongs to (when stacked, each group will be a separate stack). | `stack` | `string` | The ID of the group to which this dataset belongs to (when stacked, each group will be a separate stack).
## Horizontal Bar Chart ## Horizontal Bar Chart
A horizontal bar chart is a variation on a vertical bar chart. It is sometimes used to show trend data, and the comparison of multiple data sets side by side. A horizontal bar chart is a variation on a vertical bar chart. It is sometimes used to show trend data, and the comparison of multiple data sets side by side.
{% chartjs %} {% chartjs %}
{ {
@ -300,9 +305,9 @@ A horizontal bar chart is a variation on a vertical bar chart. It is sometimes u
}, },
"options": { "options": {
"scales": { "scales": {
"xAxes": [{ "x": {
"beginAtZero": true "beginAtZero": true
}] }
} }
} }
} }

View File

@ -211,9 +211,9 @@ var stackedLine = new Chart(ctx, {
data: data, data: data,
options: { options: {
scales: { scales: {
yAxes: [{ y: {
stacked: true stacked: true
}] }
} }
} }
}); });

View File

@ -61,9 +61,9 @@ At this point we have a chart rendering how we'd like. It's important to note th
}, },
"options": { "options": {
"scales": { "scales": {
"yAxes": [{ "y": {
"beginAtZero": true "beginAtZero": true
}] }
} }
} }
} }

View File

@ -22,10 +22,10 @@ var scatterChart = new Chart(ctx, {
}, },
options: { options: {
scales: { scales: {
xAxes: [{ x: {
type: 'linear', type: 'linear',
position: 'bottom' position: 'bottom'
}] }
} }
} }
}); });

View File

@ -24,9 +24,9 @@ var lineChart = new Chart(ctx, {
type: 'line', type: 'line',
options: { options: {
scales: { scales: {
yAxes: [{ y: {
type: 'myScale' // this is the same key that was passed to the registerScaleType function type: 'myScale' // this is the same key that was passed to the registerScaleType function
}] }
} }
} }
}); });

View File

@ -45,12 +45,12 @@ function updateConfigAsNewObject(chart) {
text: 'Chart.js' text: 'Chart.js'
}, },
scales: { scales: {
xAxes: [{ x: {
display: true display: true
}], },
yAxes: [{ y: {
display: true display: true
}] }
} }
}; };
chart.update(); chart.update();
@ -64,30 +64,29 @@ Variables referencing any one from `chart.scales` would be lost after updating s
```javascript ```javascript
function updateScales(chart) { function updateScales(chart) {
var xScale = chart.scales['x-axis-0']; var xScale = chart.scales.x;
var yScale = chart.scales['y-axis-0']; var yScale = chart.scales.y;
chart.options.scales = { chart.options.scales = {
xAxes: [{ newId: {
id: 'newId',
display: true display: true
}], },
yAxes: [{ y: {
display: true, display: true,
type: 'logarithmic' type: 'logarithmic'
}] }
}; };
chart.update(); chart.update();
// need to update the reference // need to update the reference
xScale = chart.scales['newId']; xScale = chart.scales.newId;
yScale = chart.scales['y-axis-0']; yScale = chart.scales.y;
} }
``` ```
You can also update a specific scale either by specifying its index or id. You can also update a specific scale either by its id.
```javascript ```javascript
function updateScale(chart) { function updateScale(chart) {
chart.options.scales.yAxes[0] = { chart.options.scales.y = {
type: 'logarithmic' type: 'logarithmic'
}; };
chart.update(); chart.update();

View File

@ -53,9 +53,9 @@ var myChart = new Chart(ctx, {
}, },
options: { options: {
scales: { scales: {
yAxes: [{ y: {
beginAtZero: true beginAtZero: true
}] }
} }
} }
}); });

View File

@ -33,20 +33,21 @@ Chart.js 3.0 introduces a number of breaking changes. Chart.js 2.0 was released
### Options ### Options
* The dataset option `tension` was renamed to `lineTension` * The dataset option `tension` was renamed to `lineTension`
* `scales.[x/y]Axes` arrays were removed. Scales are now configured directly to `options.scales` object with the object key being the scale Id.
* `scales.[x/y]Axes.barPercentage` was moved to dataset option `barPercentage` * `scales.[x/y]Axes.barPercentage` was moved to dataset option `barPercentage`
* `scales.[x/y]Axes.barThickness` was moved to dataset option `barThickness` * `scales.[x/y]Axes.barThickness` was moved to dataset option `barThickness`
* `scales.[x/y]Axes.categoryPercentage` was moved to dataset option `categoryPercentage` * `scales.[x/y]Axes.categoryPercentage` was moved to dataset option `categoryPercentage`
* `scales.[x/y]Axes.minBarLength` was moved to dataset option `minBarLength` * `scales.[x/y]Axes.minBarLength` was moved to dataset option `minBarLength`
* `scales.[x/y]Axes.maxBarThickness` was moved to dataset option `maxBarThickness` * `scales.[x/y]Axes.maxBarThickness` was moved to dataset option `maxBarThickness`
* `scales.[x/y]Axes.ticks.beginAtZero` was renamed to `scales.[x/y]Axes.beginAtZero` * `scales.[x/y]Axes.ticks.beginAtZero` was renamed to `scales[id].beginAtZero`
* `scales.[x/y]Axes.ticks.max` was renamed to `scales.[x/y]Axes.max` * `scales.[x/y]Axes.ticks.max` was renamed to `scales[id].max`
* `scales.[x/y]Axes.ticks.min` was renamed to `scales.[x/y]Axes.min` * `scales.[x/y]Axes.ticks.min` was renamed to `scales[id].min`
* `scales.[x/y]Axes.ticks.reverse` was renamed to `scales.[x/y]Axes.reverse` * `scales.[x/y]Axes.ticks.reverse` was renamed to `scales[id].reverse`
* `scales.[x/y]Axes.ticks.suggestedMax` was renamed to `scales.[x/y]Axes.suggestedMax` * `scales.[x/y]Axes.ticks.suggestedMax` was renamed to `scales[id].suggestedMax`
* `scales.[x/y]Axes.ticks.suggestedMin` was renamed to `scales.[x/y]Axes.suggestedMin` * `scales.[x/y]Axes.ticks.suggestedMin` was renamed to `scales[id].suggestedMin`
* `scales.[x/y]Axes.time.format` was renamed to `scales.[x/y]Axes.time.parser` * `scales.[x/y]Axes.time.format` was renamed to `scales[id].time.parser`
* `scales.[x/y]Axes.time.max` was renamed to `scales.[x/y]Axes.max` * `scales.[x/y]Axes.time.max` was renamed to `scales[id].max`
* `scales.[x/y]Axes.time.min` was renamed to `scales.[x/y]Axes.min` * `scales.[x/y]Axes.time.min` was renamed to `scales[id].min`
## Developer migration ## Developer migration

View File

@ -59,12 +59,12 @@
} }
}, },
scales: { scales: {
xAxes: [{ x: {
ticks: { ticks: {
autoSkip: false, autoSkip: false,
maxRotation: 0 maxRotation: 0
} }
}] }
} }
}; };

View File

@ -114,9 +114,9 @@
} }
}, },
scales: { scales: {
yAxes: [{ y: {
stacked: true stacked: true,
}] }
}, },
plugins: { plugins: {
filler: { filler: {

View File

@ -98,19 +98,19 @@
mode: 'index' mode: 'index'
}, },
scales: { scales: {
xAxes: [{ x: {
scaleLabel: { scaleLabel: {
display: true, display: true,
labelString: 'Month' labelString: 'Month'
} }
}], },
yAxes: [{ y: {
stacked: true, stacked: true,
scaleLabel: { scaleLabel: {
display: true, display: true,
labelString: 'Value' labelString: 'Value'
} }
}] }
} }
} }
}; };

View File

@ -33,7 +33,7 @@
window.chartColors.purple, window.chartColors.purple,
window.chartColors.red window.chartColors.red
], ],
yAxisID: 'y-axis-1', yAxisID: 'y',
data: [ data: [
randomScalingFactor(), randomScalingFactor(),
randomScalingFactor(), randomScalingFactor(),
@ -46,7 +46,7 @@
}, { }, {
label: 'Dataset 2', label: 'Dataset 2',
backgroundColor: window.chartColors.grey, backgroundColor: window.chartColors.grey,
yAxisID: 'y-axis-2', yAxisID: 'y1',
data: [ data: [
randomScalingFactor(), randomScalingFactor(),
randomScalingFactor(), randomScalingFactor(),
@ -75,20 +75,19 @@
intersect: true intersect: true
}, },
scales: { scales: {
yAxes: [{ y: {
type: 'linear', // only linear but allow scale type registration. This allows extensions to exist solely for log scale for instance type: 'linear',
display: true, display: true,
position: 'left', position: 'left',
id: 'y-axis-1', },
}, { y1: {
type: 'linear', // only linear but allow scale type registration. This allows extensions to exist solely for log scale for instance type: 'linear',
display: true, display: true,
position: 'right', position: 'right',
id: 'y-axis-2',
gridLines: { gridLines: {
drawOnChartArea: false drawOnChartArea: false
} }
}], },
} }
} }
}); });

View File

@ -80,12 +80,12 @@
}, },
responsive: true, responsive: true,
scales: { scales: {
xAxes: [{ x: {
stacked: true, stacked: true,
}], },
yAxes: [{ y: {
stacked: true stacked: true
}] }
} }
} }
}); });

View File

@ -77,12 +77,12 @@
}, },
responsive: true, responsive: true,
scales: { scales: {
xAxes: [{ x: {
stacked: true, stacked: true,
}], },
yAxes: [{ y: {
stacked: true stacked: true
}] }
} }
} }
}); });

View File

@ -76,20 +76,20 @@
intersect: true intersect: true
}, },
scales: { scales: {
xAxes: [{ x: {
display: true, display: true,
scaleLabel: { scaleLabel: {
display: true, display: true,
labelString: 'Month' labelString: 'Month'
} }
}], },
yAxes: [{ y: {
display: true, display: true,
scaleLabel: { scaleLabel: {
display: true, display: true,
labelString: 'Value' labelString: 'Value'
} }
}] }
} }
} }
}; };

View File

@ -64,21 +64,21 @@
mode: 'index' mode: 'index'
}, },
scales: { scales: {
xAxes: [{ x: {
display: true, display: true,
scaleLabel: { scaleLabel: {
display: true display: true
} }
}], },
yAxes: [{ y: {
display: true, display: true,
scaleLabel: { scaleLabel: {
display: true, display: true,
labelString: 'Value' labelString: 'Value'
}, },
suggestedMin: -10, suggestedMin: -10,
suggestedMax: 200, suggestedMax: 200
}] }
} }
} }
}; };

View File

@ -83,20 +83,20 @@
intersect: true intersect: true
}, },
scales: { scales: {
xAxes: [{ x: {
display: true, display: true,
scaleLabel: { scaleLabel: {
display: true, display: true,
labelString: 'Month' labelString: 'Month'
} }
}], },
yAxes: [{ y: {
display: true, display: true,
scaleLabel: { scaleLabel: {
display: true, display: true,
labelString: 'Value' labelString: 'Value'
} }
}] }
} }
} }
}; };

View File

@ -36,7 +36,7 @@
randomScalingFactor(), randomScalingFactor(),
randomScalingFactor() randomScalingFactor()
], ],
yAxisID: 'y-axis-1', yAxisID: 'y',
}, { }, {
label: 'My Second dataset', label: 'My Second dataset',
borderColor: window.chartColors.blue, borderColor: window.chartColors.blue,
@ -51,7 +51,7 @@
randomScalingFactor(), randomScalingFactor(),
randomScalingFactor() randomScalingFactor()
], ],
yAxisID: 'y-axis-2' yAxisID: 'y1'
}] }]
}; };
@ -69,22 +69,21 @@
text: 'Chart.js Line Chart - Multi Axis' text: 'Chart.js Line Chart - Multi Axis'
}, },
scales: { scales: {
yAxes: [{ y: {
type: 'linear', // only linear but allow scale type registration. This allows extensions to exist solely for log scale for instance type: 'linear', // only linear but allow scale type registration. This allows extensions to exist solely for log scale for instance
display: true, display: true,
position: 'left', position: 'left',
id: 'y-axis-1', },
}, { y1: {
type: 'linear', // only linear but allow scale type registration. This allows extensions to exist solely for log scale for instance type: 'linear', // only linear but allow scale type registration. This allows extensions to exist solely for log scale for instance
display: true, display: true,
position: 'right', position: 'right',
id: 'y-axis-2',
// grid line settings // grid line settings
gridLines: { gridLines: {
drawOnChartArea: false, // only want the grid lines for one axis to show up drawOnChartArea: false, // only want the grid lines for one axis to show up
}, },
}], },
} }
} }
}); });

View File

@ -97,20 +97,20 @@
mode: 'index' mode: 'index'
}, },
scales: { scales: {
xAxes: [{ x: {
display: true, display: true,
scaleLabel: { scaleLabel: {
display: true, display: true,
labelString: 'Month' labelString: 'Month'
} }
}], },
yAxes: [{ y: {
display: true, display: true,
scaleLabel: { scaleLabel: {
display: true, display: true,
labelString: 'Value' labelString: 'Value'
} }
}] }
}, },
title: { title: {
display: true, display: true,

View File

@ -67,20 +67,20 @@
mode: 'index' mode: 'index'
}, },
scales: { scales: {
xAxes: [{ x: {
display: true, display: true,
scaleLabel: { scaleLabel: {
display: true, display: true,
labelString: 'Month' labelString: 'Month'
} }
}], },
yAxes: [{ y: {
display: true, display: true,
scaleLabel: { scaleLabel: {
display: true, display: true,
labelString: 'Value' labelString: 'Value'
}, },
}] }
} }
} }
}; };

View File

@ -24,8 +24,8 @@
var scatterChartData = { var scatterChartData = {
datasets: [{ datasets: [{
label: 'My First dataset', label: 'My First dataset',
xAxisID: 'x-axis-1', xAxisID: 'x',
yAxisID: 'y-axis-1', yAxisID: 'y',
borderColor: window.chartColors.red, borderColor: window.chartColors.red,
backgroundColor: color(window.chartColors.red).alpha(0.2).rgbString(), backgroundColor: color(window.chartColors.red).alpha(0.2).rgbString(),
data: [{ data: [{
@ -52,8 +52,8 @@
}] }]
}, { }, {
label: 'My Second dataset', label: 'My Second dataset',
xAxisID: 'x-axis-1', xAxisID: 'x',
yAxisID: 'y-axis-2', yAxisID: 'y2',
borderColor: window.chartColors.blue, borderColor: window.chartColors.blue,
backgroundColor: color(window.chartColors.blue).alpha(0.2).rgbString(), backgroundColor: color(window.chartColors.blue).alpha(0.2).rgbString(),
data: [{ data: [{
@ -95,26 +95,25 @@
text: 'Chart.js Scatter Chart - Multi Axis' text: 'Chart.js Scatter Chart - Multi Axis'
}, },
scales: { scales: {
xAxes: [{ x: {
position: 'bottom', position: 'bottom',
}], },
yAxes: [{ y: {
type: 'linear', // only linear but allow scale type registration. This allows extensions to exist solely for log scale for instance type: 'linear', // only linear but allow scale type registration. This allows extensions to exist solely for log scale for instance
display: true, display: true,
position: 'left', position: 'left'
id: 'y-axis-1', },
}, { y2: {
type: 'linear', // only linear but allow scale type registration. This allows extensions to exist solely for log scale for instance type: 'linear', // only linear but allow scale type registration. This allows extensions to exist solely for log scale for instance
display: true, display: true,
position: 'right', position: 'right',
reverse: true, reverse: true,
id: 'y-axis-2',
// grid line settings // grid line settings
gridLines: { gridLines: {
drawOnChartArea: false, // only want the grid lines for one axis to show up drawOnChartArea: false, // only want the grid lines for one axis to show up
}, }
}], }
} }
} }
}); });

View File

@ -99,20 +99,20 @@
text: 'Chart.js Line Chart' text: 'Chart.js Line Chart'
}, },
scales: { scales: {
xAxes: [{ x: {
display: true, display: true,
scaleLabel: { scaleLabel: {
display: true, display: true,
labelString: 'Month' labelString: 'Month'
} }
}], },
yAxes: [{ y: {
display: true, display: true,
scaleLabel: { scaleLabel: {
display: true, display: true,
labelString: 'Value' labelString: 'Value'
} }
}] }
} }
} }
}; };

View File

@ -68,20 +68,20 @@
} }
}, },
scales: { scales: {
xAxes: [{ x: {
display: true, display: true,
scaleLabel: { scaleLabel: {
display: true, display: true,
labelString: 'Month' labelString: 'Month'
} }
}], },
yAxes: [{ y: {
display: true, display: true,
scaleLabel: { scaleLabel: {
display: true, display: true,
labelString: 'Value' labelString: 'Value'
} }
}] }
}, },
title: { title: {
display: true, display: true,

View File

@ -69,20 +69,20 @@
position: legendPosition, position: legendPosition,
}, },
scales: { scales: {
xAxes: [{ x: {
display: true, display: true,
scaleLabel: { scaleLabel: {
display: true, display: true,
labelString: 'Month' labelString: 'Month'
} }
}], },
yAxes: [{ y: {
display: true, display: true,
scaleLabel: { scaleLabel: {
display: true, display: true,
labelString: 'Value' labelString: 'Value'
} }
}] }
}, },
title: { title: {
display: true, display: true,

View File

@ -64,7 +64,7 @@
text: 'Chart.js Line Chart - X-Axis Filter' text: 'Chart.js Line Chart - X-Axis Filter'
}, },
scales: { scales: {
xAxes: [{ x: {
display: true, display: true,
ticks: { ticks: {
callback: function(dataLabel, index) { callback: function(dataLabel, index) {
@ -72,11 +72,11 @@
return index % 2 === 0 ? dataLabel : ''; return index % 2 === 0 ? dataLabel : '';
} }
} }
}], },
yAxes: [{ y: {
display: true, display: true,
beginAtZero: false beginAtZero: false
}] }
} }
} }
}; };

View File

@ -55,17 +55,17 @@
text: title text: title
}, },
scales: { scales: {
xAxes: [{ x: {
gridLines: gridlines gridLines: gridlines
}], },
yAxes: [{ y: {
gridLines: gridlines, gridLines: gridlines,
min: 0, min: 0,
max: 100, max: 100,
ticks: { ticks: {
stepSize: 10 stepSize: 10
} }
}] }
} }
} }
}; };

View File

@ -44,7 +44,7 @@
text: 'Grid Line Settings' text: 'Grid Line Settings'
}, },
scales: { scales: {
yAxes: [{ y: {
gridLines: { gridLines: {
drawBorder: false, drawBorder: false,
color: ['pink', 'red', 'orange', 'yellow', 'green', 'blue', 'indigo', 'purple'] color: ['pink', 'red', 'orange', 'yellow', 'green', 'blue', 'indigo', 'purple']
@ -54,7 +54,7 @@
ticks: { ticks: {
stepSize: 10 stepSize: 10
} }
}] }
} }
} }
}; };

View File

@ -44,13 +44,13 @@
text: 'Min and Max Settings' text: 'Min and Max Settings'
}, },
scales: { scales: {
yAxes: [{ y: {
// the data minimum used for determining the ticks is Math.min(dataMin, suggestedMin) // the data minimum used for determining the ticks is Math.min(dataMin, suggestedMin)
suggestedMin: 10, suggestedMin: 10,
// the data maximum used for determining the ticks is Math.max(dataMax, suggestedMax) // the data maximum used for determining the ticks is Math.max(dataMax, suggestedMax)
suggestedMax: 50 suggestedMax: 50
}] }
} }
} }
}; };

View File

@ -44,10 +44,10 @@
text: 'Min and Max Settings' text: 'Min and Max Settings'
}, },
scales: { scales: {
yAxes: [{ y: {
min: 10, min: 10,
max: 50 max: 50
}] }
} }
} }
}; };

View File

@ -81,14 +81,14 @@
intersect: true intersect: true
}, },
scales: { scales: {
xAxes: [{ x: {
display: true, display: true,
scaleLabel: { scaleLabel: {
display: true, display: true,
labelString: 'Month' labelString: 'Month'
} }
}], },
yAxes: [{ y: {
display: true, display: true,
scaleLabel: { scaleLabel: {
display: true, display: true,
@ -100,7 +100,7 @@
// forces step size to be 5 units // forces step size to be 5 units
stepSize: 5 stepSize: 5
} }
}] }
} }
} }
}; };

View File

@ -65,13 +65,13 @@
text: 'Chart.js Line Chart - Logarithmic' text: 'Chart.js Line Chart - Logarithmic'
}, },
scales: { scales: {
xAxes: [{ x: {
display: true, display: true,
}], },
yAxes: [{ y: {
display: true, display: true,
type: 'logarithmic', type: 'logarithmic',
}] }
} }
} }
}; };

View File

@ -133,7 +133,7 @@
text: 'Chart.js Scatter Chart - Logarithmic X-Axis' text: 'Chart.js Scatter Chart - Logarithmic X-Axis'
}, },
scales: { scales: {
xAxes: [{ x: {
type: 'logarithmic', type: 'logarithmic',
position: 'bottom', position: 'bottom',
ticks: { ticks: {
@ -149,8 +149,8 @@
labelString: 'Frequency', labelString: 'Frequency',
display: true, display: true,
} }
}], },
yAxes: [{ y: {
type: 'linear', type: 'linear',
ticks: { ticks: {
userCallback: function(tick) { userCallback: function(tick) {
@ -161,7 +161,7 @@
labelString: 'Voltage', labelString: 'Voltage',
display: true display: true
} }
}] }
} }
} }
}); });

View File

@ -39,14 +39,14 @@
text: 'Chart with Non Numeric Y Axis' text: 'Chart with Non Numeric Y Axis'
}, },
scales: { scales: {
xAxes: [{ x: {
display: true, display: true,
scaleLabel: { scaleLabel: {
display: true, display: true,
labelString: 'Month' labelString: 'Month'
} }
}], },
yAxes: [{ y: {
type: 'category', type: 'category',
position: 'left', position: 'left',
display: true, display: true,
@ -55,7 +55,7 @@
labelString: 'Request State' labelString: 'Request State'
}, },
reverse: true reverse: true
}] }
} }
} }
}; };

View File

@ -73,14 +73,14 @@
text: 'Chart.js Combo Time Scale' text: 'Chart.js Combo Time Scale'
}, },
scales: { scales: {
xAxes: [{ x: {
type: 'time', type: 'time',
display: true, display: true,
offset: true, offset: true,
time: { time: {
unit: 'day' unit: 'day'
} }
}], },
}, },
} }
}; };

View File

@ -115,7 +115,7 @@
duration: 0 duration: 0
}, },
scales: { scales: {
xAxes: [{ x: {
type: 'time', type: 'time',
distribution: 'series', distribution: 'series',
offset: true, offset: true,
@ -156,8 +156,9 @@
lastMajor = currMajor; lastMajor = currMajor;
} }
} }
}], },
yAxes: [{ y: {
type: 'linear',
gridLines: { gridLines: {
drawBorder: false drawBorder: false
}, },
@ -165,7 +166,7 @@
display: true, display: true,
labelString: 'Closing price ($)' labelString: 'Closing price ($)'
} }
}] }
}, },
tooltips: { tooltips: {
intersect: false, intersect: false,

View File

@ -82,7 +82,7 @@
text: 'Chart.js Time Point Data' text: 'Chart.js Time Point Data'
}, },
scales: { scales: {
xAxes: [{ x: {
type: 'time', type: 'time',
display: true, display: true,
scaleLabel: { scaleLabel: {
@ -95,14 +95,14 @@
fontColor: '#FF0000' fontColor: '#FF0000'
} }
} }
}], },
yAxes: [{ y: {
display: true, display: true,
scaleLabel: { scaleLabel: {
display: true, display: true,
labelString: 'value' labelString: 'value'
} }
}] }
} }
} }
}; };

View File

@ -103,7 +103,7 @@
text: 'Chart.js Time Scale' text: 'Chart.js Time Scale'
}, },
scales: { scales: {
xAxes: [{ x: {
type: 'time', type: 'time',
time: { time: {
parser: timeFormat, parser: timeFormat,
@ -114,13 +114,13 @@
display: true, display: true,
labelString: 'Date' labelString: 'Date'
} }
}], },
yAxes: [{ y: {
scaleLabel: { scaleLabel: {
display: true, display: true,
labelString: 'value' labelString: 'value'
} }
}] }
}, },
} }
}; };

View File

@ -67,13 +67,13 @@
text: 'Chart.js Line Chart - ' + type text: 'Chart.js Line Chart - ' + type
}, },
scales: { scales: {
xAxes: [{ x: {
display: true, display: true,
}], },
yAxes: [{ y: {
display: true, display: true,
type: type type: type
}] }
} }
} }
}; };
@ -86,7 +86,7 @@
document.getElementById('toggleScale').addEventListener('click', function() { document.getElementById('toggleScale').addEventListener('click', function() {
type = type === 'linear' ? 'logarithmic' : 'linear'; type = type === 'linear' ? 'logarithmic' : 'linear';
window.myLine.options.title.text = 'Chart.js Line Chart - ' + type; window.myLine.options.title.text = 'Chart.js Line Chart - ' + type;
window.myLine.options.scales.yAxes[0] = { window.myLine.options.scales.y = {
display: true, display: true,
type: type type: type
}; };

View File

@ -79,20 +79,20 @@
intersect: true intersect: true
}, },
scales: { scales: {
xAxes: [{ x: {
display: true, display: true,
scaleLabel: { scaleLabel: {
show: true, show: true,
labelString: 'Month' labelString: 'Month'
} }
}], },
yAxes: [{ y: {
display: true, display: true,
scaleLabel: { scaleLabel: {
show: true, show: true,
labelString: 'Value' labelString: 'Value'
} }
}] }
} }
} }
}; };

View File

@ -13,17 +13,16 @@ defaults._set('bar', {
}, },
scales: { scales: {
xAxes: [{ x: {
type: 'category', type: 'category',
offset: true, offset: true,
gridLines: { gridLines: {
offsetGridLines: true offsetGridLines: true
} }
}], },
y: {
yAxes: [{ type: 'linear',
type: 'linear' }
}]
} }
}); });
@ -221,13 +220,13 @@ module.exports = DatasetController.extend({
_parseObjectData: function(meta, data, start, count) { _parseObjectData: function(meta, data, start, count) {
const iScale = meta.iScale; const iScale = meta.iScale;
const vScale = meta.vScale; const vScale = meta.vScale;
const vProp = vScale._getAxis(); const vProp = vScale.axis;
const parsed = []; const parsed = [];
let i, ilen, item, obj, value; let i, ilen, item, obj, value;
for (i = start, ilen = start + count; i < ilen; ++i) { for (i = start, ilen = start + count; i < ilen; ++i) {
obj = data[i]; obj = data[i];
item = {}; item = {};
item[iScale.id] = iScale._parseObject(obj, iScale._getAxis(), i); item[iScale.id] = iScale._parseObject(obj, iScale.axis, i);
value = obj[vProp]; value = obj[vProp];
if (helpers.isArray(value)) { if (helpers.isArray(value)) {
parseFloatBar(value, item, vScale, i); parseFloatBar(value, item, vScale, i);

View File

@ -10,16 +10,14 @@ var resolve = helpers.options.resolve;
defaults._set('bubble', { defaults._set('bubble', {
scales: { scales: {
xAxes: [{ x: {
type: 'linear', // bubble should probably use a linear scale by default
position: 'bottom',
id: 'x-axis-0' // need an ID so datasets can reference the scale
}],
yAxes: [{
type: 'linear', type: 'linear',
position: 'left', position: 'bottom'
id: 'y-axis-0' },
}] y: {
type: 'linear',
position: 'left'
}
}, },
tooltips: { tooltips: {

View File

@ -10,19 +10,18 @@ defaults._set('horizontalBar', {
}, },
scales: { scales: {
xAxes: [{ x: {
type: 'linear', type: 'linear',
position: 'bottom' position: 'bottom'
}], },
y: {
yAxes: [{
type: 'category', type: 'category',
position: 'left', position: 'left',
offset: true, offset: true,
gridLines: { gridLines: {
offsetGridLines: true offsetGridLines: true
} }
}] }
}, },
elements: { elements: {

View File

@ -18,14 +18,12 @@ defaults._set('line', {
}, },
scales: { scales: {
xAxes: [{ x: {
type: 'category', type: 'category',
id: 'x-axis-0' },
}], y: {
yAxes: [{
type: 'linear', type: 'linear',
id: 'y-axis-0' },
}]
} }
}); });

View File

@ -8,17 +8,19 @@ var helpers = require('../helpers/index');
var resolve = helpers.options.resolve; var resolve = helpers.options.resolve;
defaults._set('polarArea', { defaults._set('polarArea', {
scale: { scales: {
type: 'radialLinear', r: {
angleLines: { type: 'radialLinear',
display: false angleLines: {
}, display: false
beginAtZero: true, },
gridLines: { beginAtZero: true,
circular: true gridLines: {
}, circular: true
pointLabels: { },
display: false pointLabels: {
display: false
}
} }
}, },
@ -123,14 +125,14 @@ module.exports = DatasetController.extend({
* @private * @private
*/ */
_getIndexScaleId: function() { _getIndexScaleId: function() {
return this.chart.scale.id; return this._cachedMeta.rAxisID;
}, },
/** /**
* @private * @private
*/ */
_getValueScaleId: function() { _getValueScaleId: function() {
return this.chart.scale.id; return this._cachedMeta.rAxisID;
}, },
update: function(reset) { update: function(reset) {
@ -181,7 +183,7 @@ module.exports = DatasetController.extend({
const dataset = me.getDataset(); const dataset = me.getDataset();
const opts = chart.options; const opts = chart.options;
const animationOpts = opts.animation; const animationOpts = opts.animation;
const scale = chart.scale; const scale = chart.scales.r;
const centerX = scale.xCenter; const centerX = scale.xCenter;
const centerY = scale.yCenter; const centerY = scale.yCenter;
var i; var i;

View File

@ -9,8 +9,10 @@ var valueOrDefault = helpers.valueOrDefault;
defaults._set('radar', { defaults._set('radar', {
spanGaps: false, spanGaps: false,
scale: { scales: {
type: 'radialLinear' r: {
type: 'radialLinear',
}
}, },
elements: { elements: {
line: { line: {
@ -67,14 +69,14 @@ module.exports = DatasetController.extend({
* @private * @private
*/ */
_getIndexScaleId: function() { _getIndexScaleId: function() {
return this.chart.scale.id; return this._cachedMeta.rAxisID;
}, },
/** /**
* @private * @private
*/ */
_getValueScaleId: function() { _getValueScaleId: function() {
return this.chart.scale.id; return this._cachedMeta.rAxisID;
}, },
/** /**
@ -122,7 +124,7 @@ module.exports = DatasetController.extend({
updateElements: function(points, start, count, reset) { updateElements: function(points, start, count, reset) {
const me = this; const me = this;
const dataset = me.getDataset(); const dataset = me.getDataset();
const scale = me.chart.scale; const scale = me.chart.scales.r;
var i; var i;
for (i = start; i < start + count; i++) { for (i = start; i < start + count; i++) {

View File

@ -5,16 +5,14 @@ var defaults = require('../core/core.defaults');
defaults._set('scatter', { defaults._set('scatter', {
scales: { scales: {
xAxes: [{ x: {
id: 'x-axis-1', // need an ID so datasets can reference the scale type: 'linear',
type: 'linear', // scatter should not use a category axis
position: 'bottom' position: 'bottom'
}], },
yAxes: [{ y: {
id: 'y-axis-1',
type: 'linear', type: 'linear',
position: 'left' position: 'left'
}] }
}, },
tooltips: { tooltips: {

View File

@ -35,44 +35,46 @@ defaults._set('global', {
responsiveAnimationDuration: 0 responsiveAnimationDuration: 0
}); });
/** function mergeScaleConfig(config, options) {
* Recursively merge the given config objects representing the `scales` option options = options || {};
* by incorporating scale defaults in `xAxes` and `yAxes` array items, then const chartDefaults = defaults[config.type] || {scales: {}};
* returns a deep copy of the result, thus doesn't alter inputs. const configScales = options.scales || {};
*/ const firstIDs = {};
function mergeScaleConfig(/* config objects ... */) { const scales = {};
return helpers.merge({}, [].slice.call(arguments), {
merger: function(key, target, source, options) {
if (key === 'xAxes' || key === 'yAxes') {
var slen = source[key].length;
var i, type, scale;
if (!target[key]) { // First figure out first scale id's per axis.
target[key] = []; // Note: for now, axis is determined from first letter of scale id!
} Object.entries(configScales).forEach(([id, scale]) => {
const axis = id[0];
for (i = 0; i < slen; ++i) { firstIDs[axis] = firstIDs[axis] || id;
scale = source[key][i]; scales[id] = helpers.mergeIf({}, [scale, chartDefaults.scales[axis]]);
type = valueOrDefault(scale.type, key === 'xAxes' ? 'category' : 'linear');
if (i >= target[key].length) {
target[key].push({});
}
if (!target[key][i].type || (scale.type && scale.type !== target[key][i].type)) {
// new/untyped scale or type changed: let's apply the new defaults
// then merge source scale to correctly overwrite the defaults.
helpers.merge(target[key][i], [scaleService.getScaleDefaults(type), scale]);
} else {
// scales type are the same
helpers.merge(target[key][i], scale);
}
}
} else {
helpers._merger(key, target, source, options);
}
}
}); });
// Backward compatibility
if (options.scale) {
scales[options.scale.id || 'r'] = helpers.mergeIf({}, [options.scale, chartDefaults.scales.r]);
firstIDs.r = firstIDs.r || options.scale.id || 'r';
}
// Then merge dataset defaults to scale configs
config.data.datasets.forEach(dataset => {
const datasetDefaults = defaults[dataset.type || config.type] || {scales: {}};
Object.entries(datasetDefaults.scales || {}).forEach(([defaultID, defaultScaleOptions]) => {
const id = dataset[defaultID + 'AxisID'] || firstIDs[defaultID] || defaultID;
scales[id] = scales[id] || {};
helpers.mergeIf(scales[id], [
configScales[id],
defaultScaleOptions
]);
});
});
// apply scale defaults, if not overridden by dataset defaults
Object.values(scales).forEach(scale => {
helpers.mergeIf(scale, scaleService.getScaleDefaults(scale.type));
});
return scales;
} }
/** /**
@ -83,16 +85,7 @@ function mergeScaleConfig(/* config objects ... */) {
function mergeConfig(/* config objects ... */) { function mergeConfig(/* config objects ... */) {
return helpers.merge({}, [].slice.call(arguments), { return helpers.merge({}, [].slice.call(arguments), {
merger: function(key, target, source, options) { merger: function(key, target, source, options) {
var tval = target[key] || {}; if (key !== 'scales' && key !== 'scale') {
var sval = source[key];
if (key === 'scales') {
// scale config merging is complex. Add our own function here for that
target[key] = mergeScaleConfig(tval, sval);
} else if (key === 'scale') {
// used in polar area & radar charts since there is only one scale
target[key] = helpers.merge(tval, [scaleService.getScaleDefaults(sval.type), sval]);
} else {
helpers._merger(key, target, source, options); helpers._merger(key, target, source, options);
} }
} }
@ -104,15 +97,19 @@ function initConfig(config) {
// Do NOT use mergeConfig for the data object because this method merges arrays // Do NOT use mergeConfig for the data object because this method merges arrays
// and so would change references to labels and datasets, preventing data updates. // and so would change references to labels and datasets, preventing data updates.
var data = config.data = config.data || {}; const data = config.data = config.data || {};
data.datasets = data.datasets || []; data.datasets = data.datasets || [];
data.labels = data.labels || []; data.labels = data.labels || [];
const scaleConfig = mergeScaleConfig(config, config.options);
config.options = mergeConfig( config.options = mergeConfig(
defaults.global, defaults.global,
defaults[config.type], defaults[config.type],
config.options || {}); config.options || {});
config.options.scales = scaleConfig;
return config; return config;
} }
@ -131,12 +128,16 @@ function updateConfig(chart) {
layouts.removeBox(chart, scale); layouts.removeBox(chart, scale);
}); });
const scaleConfig = mergeScaleConfig(chart.config, newOptions);
newOptions = mergeConfig( newOptions = mergeConfig(
defaults.global, defaults.global,
defaults[chart.config.type], defaults[chart.config.type],
newOptions); newOptions);
chart.options = chart.config.options = newOptions; chart.options = chart.config.options = newOptions;
chart.options.scales = scaleConfig;
chart._animationsDisabled = isAnimationDisabled(newOptions); chart._animationsDisabled = isAnimationDisabled(newOptions);
chart.ensureScalesHaveIDs(); chart.ensureScalesHaveIDs();
chart.buildOrUpdateScales(); chart.buildOrUpdateScales();
@ -146,19 +147,6 @@ function updateConfig(chart) {
chart.tooltip.initialize(); chart.tooltip.initialize();
} }
function nextAvailableScaleId(axesOpts, prefix, index) {
var id;
var hasId = function(obj) {
return obj.id === id;
};
do {
id = prefix + index++;
} while (helpers.findIndex(axesOpts, hasId) >= 0);
return id;
}
function positionIsHorizontal(position) { function positionIsHorizontal(position) {
return position === 'top' || position === 'bottom'; return position === 'top' || position === 'bottom';
} }
@ -310,16 +298,8 @@ helpers.extend(Chart.prototype, /** @lends Chart */ {
var scalesOptions = options.scales || {}; var scalesOptions = options.scales || {};
var scaleOptions = options.scale; var scaleOptions = options.scale;
helpers.each(scalesOptions.xAxes, function(xAxisOptions, index) { helpers.each(scalesOptions, function(axisOptions, axisID) {
if (!xAxisOptions.id) { axisOptions.id = axisID;
xAxisOptions.id = nextAvailableScaleId(scalesOptions.xAxes, 'x-axis-', index);
}
});
helpers.each(scalesOptions.yAxes, function(yAxisOptions, index) {
if (!yAxisOptions.id) {
yAxisOptions.id = nextAvailableScaleId(scalesOptions.yAxes, 'y-axis-', index);
}
}); });
if (scaleOptions) { if (scaleOptions) {
@ -342,24 +322,20 @@ helpers.extend(Chart.prototype, /** @lends Chart */ {
if (options.scales) { if (options.scales) {
items = items.concat( items = items.concat(
(options.scales.xAxes || []).map(function(xAxisOptions) { Object.entries(options.scales).map(function(entry) {
return {options: xAxisOptions, dtype: 'category', dposition: 'bottom'}; var axisID = entry[0];
}), var axisOptions = entry[1];
(options.scales.yAxes || []).map(function(yAxisOptions) { var isRadial = axisID.charAt(0).toLowerCase === 'r';
return {options: yAxisOptions, dtype: 'linear', dposition: 'left'}; var isHorizontal = axisID.charAt(0).toLowerCase() === 'x';
return {
options: axisOptions,
dposition: isRadial ? 'chartArea' : isHorizontal ? 'bottom' : 'left',
dtype: isRadial ? 'radialLinear' : isHorizontal ? 'category' : 'linear'
};
}) })
); );
} }
if (options.scale) {
items.push({
options: options.scale,
dtype: 'radialLinear',
isDefault: true,
dposition: 'chartArea'
});
}
helpers.each(items, function(item) { helpers.each(items, function(item) {
var scaleOptions = item.options; var scaleOptions = item.options;
var id = scaleOptions.id; var id = scaleOptions.id;
@ -391,6 +367,8 @@ helpers.extend(Chart.prototype, /** @lends Chart */ {
scales[scale.id] = scale; scales[scale.id] = scale;
} }
scale.axis = scale.options.position === 'chartArea' ? 'r' : scale.isHorizontal() ? 'x' : 'y';
// parse min/max value, so we can properly determine min/max for other scales // parse min/max value, so we can properly determine min/max for other scales
scale._userMin = scale._parse(scale.options.min); scale._userMin = scale._parse(scale.options.min);
scale._userMax = scale._parse(scale.options.max); scale._userMax = scale._parse(scale.options.max);

View File

@ -175,15 +175,6 @@ function getStackKey(indexScale, valueScale, meta) {
return indexScale.id + '.' + valueScale.id + '.' + meta.stack + '.' + meta.type; return indexScale.id + '.' + valueScale.id + '.' + meta.stack + '.' + meta.type;
} }
function getFirstScaleId(chart, axis) {
var scalesOpts = chart.options.scales;
var scale = chart.options.scale;
var scaleId = scale && scale.id;
var prop = axis + 'Axes';
return (scalesOpts && scalesOpts[prop] && scalesOpts[prop].length && scalesOpts[prop][0].id) || scaleId;
}
function getUserBounds(scale) { function getUserBounds(scale) {
var {min, max, minDefined, maxDefined} = scale._getUserBounds(); var {min, max, minDefined, maxDefined} = scale._getUserBounds();
return { return {
@ -230,6 +221,13 @@ function updateStacks(controller, parsed) {
} }
} }
function getFirstScaleId(chart, axis) {
const scales = chart.scales;
return Object.keys(scales).filter(key => {
return scales[key].axis === axis;
}).shift();
}
// Base class for all dataset controllers (line, bar, etc) // Base class for all dataset controllers (line, bar, etc)
var DatasetController = function(chart, datasetIndex) { var DatasetController = function(chart, datasetIndex) {
this.initialize(chart, datasetIndex); this.initialize(chart, datasetIndex);
@ -300,10 +298,13 @@ helpers.extend(DatasetController.prototype, {
const chart = me.chart; const chart = me.chart;
const meta = me._cachedMeta; const meta = me._cachedMeta;
const dataset = me.getDataset(); const dataset = me.getDataset();
const xid = meta.xAxisID = dataset.xAxisID || getFirstScaleId(chart, 'x'); const xid = meta.xAxisID = dataset.xAxisID || getFirstScaleId(chart, 'x');
const yid = meta.yAxisID = dataset.yAxisID || getFirstScaleId(chart, 'y'); const yid = meta.yAxisID = dataset.yAxisID || getFirstScaleId(chart, 'y');
const rid = meta.rAxisID = dataset.rAxisID || getFirstScaleId(chart, 'r');
meta.xScale = me.getScaleForId(xid); meta.xScale = me.getScaleForId(xid);
meta.yScale = me.getScaleForId(yid); meta.yScale = me.getScaleForId(yid);
meta.rScale = me.getScaleForId(rid);
meta.iScale = me._getIndexScale(); meta.iScale = me._getIndexScale();
meta.vScale = me._getValueScale(); meta.vScale = me._getValueScale();
}, },

View File

@ -1388,13 +1388,6 @@ class Scale extends Element {
}]; }];
} }
/**
* @private
*/
_getAxis() {
return this.isHorizontal() ? 'x' : 'y';
}
/** /**
* Returns visible dataset metas that are attached to this scale * Returns visible dataset metas that are attached to this scale
* @param {string} [type] - if specified, also filter by dataset type * @param {string} [type] - if specified, also filter by dataset type
@ -1403,7 +1396,7 @@ class Scale extends Element {
_getMatchingVisibleMetas(type) { _getMatchingVisibleMetas(type) {
var me = this; var me = this;
var metas = me.chart._getSortedVisibleDatasetMetas(); var metas = me.chart._getSortedVisibleDatasetMetas();
var axisID = me._getAxis() + 'AxisID'; var axisID = me.axis + 'AxisID';
var result = []; var result = [];
var i, ilen, meta; var i, ilen, meta;

View File

@ -428,7 +428,7 @@ module.exports = {
visible: chart.isDatasetVisible(i), visible: chart.isDatasetVisible(i),
fill: decodeFill(el, i, count), fill: decodeFill(el, i, count),
chart: chart, chart: chart,
scale: meta.controller.getScaleForId(meta.yAxisID) || chart.scale, scale: meta.yScale || meta.rScale,
el: el el: el
}; };
} }

View File

@ -38,8 +38,8 @@ module.exports = {
} }
}, },
scales: { scales: {
xAxes: [{display: false}], x: {display: false},
yAxes: [{display: false}] y: {display: false}
} }
} }
}, },

View File

@ -36,13 +36,11 @@ module.exports = {
} }
}, },
scales: { scales: {
xAxes: [{display: false}], x: {display: false},
yAxes: [ y: {
{ display: false,
display: false, beginAtZero: true
beginAtZero: true }
}
]
} }
} }
}, },

View File

@ -24,8 +24,8 @@ module.exports = {
} }
}, },
scales: { scales: {
xAxes: [{display: false}], x: {display: false},
yAxes: [{display: false}] y: {display: false}
} }
} }
}, },

View File

@ -16,7 +16,7 @@
"legend": false, "legend": false,
"title": false, "title": false,
"scales": { "scales": {
"xAxes": [{ "x": {
"type": "time", "type": "time",
"offset": true, "offset": true,
"display": false, "display": false,
@ -26,11 +26,11 @@
"ticks": { "ticks": {
"source": "labels" "source": "labels"
} }
}], },
"yAxes": [{ "y": {
"display": false, "display": false,
"beginAtZero": true "beginAtZero": true
}] }
} }
} }
}, },

View File

@ -16,7 +16,7 @@
"legend": false, "legend": false,
"title": false, "title": false,
"scales": { "scales": {
"xAxes": [{ "x": {
"type": "time", "type": "time",
"offset": true, "offset": true,
"display": false, "display": false,
@ -26,11 +26,11 @@
"ticks": { "ticks": {
"source": "labels" "source": "labels"
} }
}], },
"yAxes": [{ "y": {
"display": false, "display": false,
"beginAtZero": true "beginAtZero": true
}] }
} }
} }
}, },

View File

@ -16,9 +16,10 @@
"legend": false, "legend": false,
"title": false, "title": false,
"scales": { "scales": {
"xAxes": [{ "x": {
"type": "time", "type": "time",
"display": false, "display": false,
"offset": false,
"time": { "time": {
"parser": "YYYY" "parser": "YYYY"
}, },
@ -26,11 +27,11 @@
"ticks": { "ticks": {
"source": "labels" "source": "labels"
} }
}], },
"yAxes": [{ "y": {
"display": false, "display": false,
"beginAtZero": true "beginAtZero": true
}] }
} }
} }
}, },

View File

@ -16,20 +16,21 @@
"legend": false, "legend": false,
"title": false, "title": false,
"scales": { "scales": {
"xAxes": [{ "x": {
"type": "time", "type": "time",
"display": false, "display": false,
"offset": false,
"time": { "time": {
"parser": "YYYY" "parser": "YYYY"
}, },
"ticks": { "ticks": {
"source": "labels" "source": "labels"
} }
}], },
"yAxes": [{ "y": {
"display": false, "display": false,
"beginAtZero": true "beginAtZero": true
}] }
} }
} }
}, },

View File

@ -16,20 +16,21 @@
"legend": false, "legend": false,
"title": false, "title": false,
"scales": { "scales": {
"xAxes": [{ "x": {
"type": "time", "type": "time",
"display": false, "display": false,
"offset": false,
"time": { "time": {
"parser": "YYYY" "parser": "YYYY"
}, },
"ticks": { "ticks": {
"source": "labels" "source": "labels"
} }
}], },
"yAxes": [{ "y": {
"display": false, "display": false,
"beginAtZero": true "beginAtZero": true
}] }
} }
} }
}, },

View File

@ -16,20 +16,21 @@
"legend": false, "legend": false,
"title": false, "title": false,
"scales": { "scales": {
"xAxes": [{ "x": {
"type": "time", "type": "time",
"display": false, "display": false,
"offset": false,
"time": { "time": {
"parser": "YYYY" "parser": "YYYY"
}, },
"ticks": { "ticks": {
"source": "labels" "source": "labels"
} }
}], },
"yAxes": [{ "y": {
"display": false, "display": false,
"beginAtZero": true "beginAtZero": true
}] }
} }
} }
}, },

View File

@ -15,20 +15,21 @@
"legend": false, "legend": false,
"title": false, "title": false,
"scales": { "scales": {
"xAxes": [{ "x": {
"type": "time", "type": "time",
"display": false, "display": false,
"offset": false,
"time": { "time": {
"parser": "YYYY" "parser": "YYYY"
}, },
"ticks": { "ticks": {
"source": "labels" "source": "labels"
} }
}], },
"yAxes": [{ "y": {
"display": false, "display": false,
"beginAtZero": true "beginAtZero": true
}] }
} }
} }
}, },

View File

@ -25,20 +25,21 @@
} }
}, },
"scales": { "scales": {
"xAxes": [{ "x": {
"type": "time", "type": "time",
"display": false, "display": false,
"offset": false,
"time": { "time": {
"parser": "YYYY" "parser": "YYYY"
}, },
"ticks": { "ticks": {
"source": "labels" "source": "labels"
} }
}], },
"yAxes": [{ "y": {
"display": false, "display": false,
"beginAtZero": true "beginAtZero": true
}] }
} }
} }
}, },

View File

@ -25,20 +25,21 @@
} }
}, },
"scales": { "scales": {
"xAxes": [{ "x": {
"type": "time", "type": "time",
"display": false, "display": false,
"offset": false,
"time": { "time": {
"parser": "YYYY-MM" "parser": "YYYY-MM"
}, },
"ticks": { "ticks": {
"source": "labels" "source": "labels"
} }
}], },
"yAxes": [{ "y": {
"display": false, "display": false,
"beginAtZero": true "beginAtZero": true
}] }
} }
} }
}, },

View File

@ -25,7 +25,7 @@
} }
}, },
"scales": { "scales": {
"xAxes": [{ "x": {
"type": "time", "type": "time",
"offset": true, "offset": true,
"display": false, "display": false,
@ -35,11 +35,11 @@
"ticks": { "ticks": {
"source": "labels" "source": "labels"
} }
}], },
"yAxes": [{ "y": {
"display": false, "display": false,
"beginAtZero": true "beginAtZero": true
}] }
} }
} }
}, },

View File

@ -24,7 +24,7 @@
"legend": false, "legend": false,
"title": false, "title": false,
"scales": { "scales": {
"xAxes": [{ "x": {
"type": "time", "type": "time",
"offset": true, "offset": true,
"stacked": true, "stacked": true,
@ -35,12 +35,12 @@
"ticks": { "ticks": {
"source": "labels" "source": "labels"
} }
}], },
"yAxes": [{ "y": {
"display": false, "display": false,
"stacked": true, "stacked": true,
"beginAtZero": true "beginAtZero": true
}] }
} }
} }
}, },

View File

@ -19,7 +19,7 @@
"legend": false, "legend": false,
"title": false, "title": false,
"scales": { "scales": {
"xAxes": [{ "x": {
"type": "time", "type": "time",
"offset": true, "offset": true,
"display": false, "display": false,
@ -29,11 +29,11 @@
"ticks": { "ticks": {
"source": "labels" "source": "labels"
} }
}], },
"yAxes": [{ "y": {
"display": false, "display": false,
"beginAtZero": true "beginAtZero": true
}] }
} }
} }
}, },

View File

@ -25,9 +25,10 @@
} }
}, },
"scales": { "scales": {
"xAxes": [{ "x": {
"type": "time", "type": "time",
"display": false, "display": false,
"offset": false,
"time": { "time": {
"parser": "YYYY" "parser": "YYYY"
}, },
@ -35,11 +36,11 @@
"ticks": { "ticks": {
"source": "labels" "source": "labels"
} }
}], },
"yAxes": [{ "y": {
"display": false, "display": false,
"beginAtZero": true "beginAtZero": true
}] }
} }
} }
}, },

View File

@ -15,20 +15,21 @@
"legend": false, "legend": false,
"title": false, "title": false,
"scales": { "scales": {
"xAxes": [{ "x": {
"type": "time", "type": "time",
"display": false, "display": false,
"offset": false,
"time": { "time": {
"parser": "YYYY" "parser": "YYYY"
}, },
"ticks": { "ticks": {
"source": "labels" "source": "labels"
} }
}], },
"yAxes": [{ "y": {
"display": false, "display": false,
"beginAtZero": true "beginAtZero": true
}] }
} }
} }
}, },

View File

@ -15,9 +15,10 @@
"legend": false, "legend": false,
"title": false, "title": false,
"scales": { "scales": {
"xAxes": [{ "x": {
"type": "time", "type": "time",
"display": false, "display": false,
"offset": false,
"time": { "time": {
"parser": "YYYY" "parser": "YYYY"
}, },
@ -25,11 +26,11 @@
"ticks": { "ticks": {
"source": "labels" "source": "labels"
} }
}], },
"yAxes": [{ "y": {
"display": false, "display": false,
"beginAtZero": true "beginAtZero": true
}] }
} }
} }
}, },

View File

@ -25,22 +25,23 @@
} }
}, },
"scales": { "scales": {
"xAxes": [{ "x": {
"type": "time", "type": "time",
"stacked": true, "stacked": true,
"display": false, "display": false,
"offset": false,
"time": { "time": {
"parser": "YYYY" "parser": "YYYY"
}, },
"ticks": { "ticks": {
"source": "labels" "source": "labels"
} }
}], },
"yAxes": [{ "y": {
"display": false, "display": false,
"stacked": true, "stacked": true,
"beginAtZero": true "beginAtZero": true
}] }
} }
} }
}, },

View File

@ -40,8 +40,8 @@ module.exports = {
} }
}, },
scales: { scales: {
xAxes: [{display: false}], x: {display: false},
yAxes: [{display: false}] y: {display: false}
} }
} }
}, },

View File

@ -38,13 +38,11 @@ module.exports = {
} }
}, },
scales: { scales: {
xAxes: [{display: false}], x: {display: false},
yAxes: [ y: {
{ display: false,
display: false, beginAtZero: true
beginAtZero: true }
}
]
} }
} }
}, },

View File

@ -26,8 +26,8 @@ module.exports = {
} }
}, },
scales: { scales: {
xAxes: [{display: false}], x: {display: false},
yAxes: [{display: false}] y: {display: false}
} }
} }
}, },

View File

@ -41,8 +41,8 @@ module.exports = {
} }
}, },
scales: { scales: {
xAxes: [{display: false}], x: {display: false},
yAxes: [{display: false}] y: {display: false}
} }
} }
}, },

View File

@ -39,13 +39,11 @@ module.exports = {
} }
}, },
scales: { scales: {
xAxes: [{display: false}], x: {display: false},
yAxes: [ y: {
{ display: false,
display: false, beginAtZero: true
beginAtZero: true }
}
]
} }
} }
}, },

View File

@ -42,8 +42,8 @@ module.exports = {
} }
}, },
scales: { scales: {
xAxes: [{display: false}], x: {display: false},
yAxes: [{display: false}] y: {display: false}
} }
} }
}, },

View File

@ -42,8 +42,8 @@ module.exports = {
} }
}, },
scales: { scales: {
xAxes: [{display: false}], x: {display: false},
yAxes: [{display: false}] y: {display: false}
} }
} }
}, },

View File

@ -40,8 +40,8 @@ module.exports = {
} }
}, },
scales: { scales: {
xAxes: [{display: false}], x: {display: false},
yAxes: [{display: false}] y: {display: false}
} }
} }
}, },

View File

@ -35,8 +35,8 @@ module.exports = {
} }
}, },
scales: { scales: {
xAxes: [{display: false}], x: {display: false},
yAxes: [{display: false}] y: {display: false}
} }
} }
}, },

View File

@ -28,8 +28,8 @@ module.exports = {
} }
}, },
scales: { scales: {
xAxes: [{display: false}], x: {display: false},
yAxes: [{display: false}] y: {display: false}
} }
} }
}, },

View File

@ -33,13 +33,11 @@ module.exports = {
} }
}, },
scales: { scales: {
xAxes: [{display: false}], x: {display: false},
yAxes: [ y: {
{ display: false,
display: false, beginAtZero: true
beginAtZero: true }
}
]
} }
} }
}, },

View File

@ -31,13 +31,11 @@ module.exports = {
} }
}, },
scales: { scales: {
xAxes: [{display: false}], x: {display: false},
yAxes: [ y: {
{ display: false,
display: false, beginAtZero: true
beginAtZero: true }
}
]
} }
} }
}, },

View File

@ -26,8 +26,8 @@ module.exports = {
} }
}, },
scales: { scales: {
xAxes: [{display: false}], x: {display: false},
yAxes: [{display: false}] y: {display: false}
} }
} }
}, },

View File

@ -28,8 +28,8 @@ module.exports = {
} }
}, },
scales: { scales: {
xAxes: [{display: false}], x: {display: false},
yAxes: [{display: false, min: -10, max: 10}] y: {display: false, min: -10, max: 10}
} }
} }
}, },

View File

@ -18,8 +18,8 @@ module.exports = {
legend: false, legend: false,
title: false, title: false,
scales: { scales: {
xAxes: [{display: false}], x: {display: false},
yAxes: [{display: false}] y: {display: false}
} }
} }
}, },

View File

@ -18,8 +18,8 @@ module.exports = {
legend: false, legend: false,
title: false, title: false,
scales: { scales: {
xAxes: [{display: false, min: 0}], x: {display: false, min: 0},
yAxes: [{display: false, stacked: true}] y: {display: false, stacked: true}
} }
} }
}, },

View File

@ -18,8 +18,8 @@ module.exports = {
legend: false, legend: false,
title: false, title: false,
scales: { scales: {
xAxes: [{display: false, stacked: true}], x: {display: false, stacked: true},
yAxes: [{display: false, min: 0}] y: {display: false, min: 0}
} }
} }
}, },

View File

@ -18,14 +18,14 @@
"title": false, "title": false,
"legend": false, "legend": false,
"scales": { "scales": {
"xAxes": [{ "x": {
"display": false, "display": false,
"min": -8, "min": -8,
"max": 12 "max": 12
}], },
"yAxes": [{ "y": {
"display": false "display": false
}] }
} }
} }
}, },

View File

@ -18,16 +18,16 @@
"title": false, "title": false,
"legend": false, "legend": false,
"scales": { "scales": {
"xAxes": [{ "x": {
"display": false, "display": false,
"stacked": true "stacked": true
}], },
"yAxes": [{ "y": {
"display": false, "display": false,
"stacked": true, "stacked": true,
"min": -8, "min": -8,
"max": 12 "max": 12
}] }
} }
} }
}, },

View File

@ -18,16 +18,16 @@
"title": false, "title": false,
"legend": false, "legend": false,
"scales": { "scales": {
"xAxes": [{ "x": {
"display": false, "display": false,
"stacked": true, "stacked": true,
"min": -8, "min": -8,
"max": 12 "max": 12
}], },
"yAxes": [{ "y": {
"display": false, "display": false,
"stacked": true "stacked": true
}] }
} }
} }
}, },

View File

@ -18,14 +18,14 @@
"title": false, "title": false,
"legend": false, "legend": false,
"scales": { "scales": {
"xAxes": [{ "x": {
"display": false, "display": false,
"min": -8, "min": -8,
"max": 12 "max": 12
}], },
"yAxes": [{ "y": {
"display": false "display": false
}] }
} }
} }
}, },

View File

@ -28,8 +28,8 @@ module.exports = {
} }
}, },
scales: { scales: {
xAxes: [{display: false}], x: {display: false},
yAxes: [{display: false}] y: {display: false}
} }
} }
}, },

View File

@ -19,15 +19,15 @@
"legend": false, "legend": false,
"title": false, "title": false,
"scales": { "scales": {
"xAxes": [{ "x": {
"display": false, "display": false,
"stacked": true "stacked": true
}], },
"yAxes": [{ "y": {
"display": false, "display": false,
"stacked": true, "stacked": true,
"beginAtZero": true "beginAtZero": true
}] }
} }
} }
}, },

View File

@ -22,15 +22,15 @@
"legend": false, "legend": false,
"title": false, "title": false,
"scales": { "scales": {
"xAxes": [{ "x": {
"display": false, "display": false,
"stacked": true "stacked": true
}], },
"yAxes": [{ "y": {
"display": false, "display": false,
"stacked": true, "stacked": true,
"beginAtZero": true "beginAtZero": true
}] }
} }
} }
}, },

View File

@ -14,15 +14,15 @@ module.exports = {
options: { options: {
legend: false, legend: false,
scales: { scales: {
xAxes: [{ticks: {display: false}}], x: {ticks: {display: false}},
yAxes: [{ y: {
min: 8, min: 8,
max: 25, max: 25,
beginAtZero: true, beginAtZero: true,
ticks: { ticks: {
display: false display: false
} }
}] }
} }
} }
}, },

Some files were not shown because too many files have changed in this diff Show More