]> git.ipfire.org Git - thirdparty/Chart.js.git/commitdiff
Add documentation about default scales (#9173)
authorJukka Kurkela <jukka.kurkela@gmail.com>
Fri, 28 May 2021 11:37:21 +0000 (14:37 +0300)
committerGitHub <noreply@github.com>
Fri, 28 May 2021 11:37:21 +0000 (07:37 -0400)
docs/axes/index.md

index 838f5fe8d4dd0ada9f7cf76b9a60f642945e5d6c..88000388d080d6529a08a5acc6ec74f95e37fb34 100644 (file)
@@ -11,6 +11,86 @@ Scales in Chart.js >v2.0 are significantly more powerful, but also different tha
 * Scale titles are supported.
 * New scale types can be extended without writing an entirely new chart type.
 
+## Default scales
+
+The default `scaleId`'s for carterian charts are `'x'` and `'y'`. For radial charts: `'r'`.
+Each dataset is mapped to a scale for each axis (x, y or r) it requires. The scaleId's that a dataset is mapped to, is determined by the `xAxisID`, `yAxisID` or `rAxisID`.
+If the ID for an axis is not specified, first scale for that axis is used. If no scale for an axis is found, a new scale is created.
+
+Some examples:
+
+The following chart will have `'x'` and `'y'` scales:
+
+```js
+let chart = new Chart(ctx, {
+  type: 'line'
+});
+```
+
+The following chart will have scales `'x'` and `'myScale'`:
+
+```js
+let chart = new Chart(ctx, {
+  type: 'bar',
+  data: {
+    datasets: [{
+      data: [1, 2, 3]
+    }]
+  },
+  options: {
+    scales: {
+      myScale: {
+        type: 'logarithmic',
+        position: 'right', // `axis` is determined by the position as `'y'`
+      }
+    }
+  }
+});
+```
+
+The following chart will have scales `'xAxis'` and `'yAxis'`:
+
+```js
+let chart = new Chart(ctx, {
+  type: 'bar',
+  data: {
+    datasets: [{
+      yAxisID: 'yAxis'
+    }]
+  },
+  options: {
+    scales: {
+      xAxis: {
+        // The axis for this scale is determined from the first letter of the id as `'x'`
+        // It is recommended to specify `position` and / or `axis` explicitly.
+        type: 'time',
+      }
+    }
+  }
+});
+```
+
+The following chart will have `'r'` scale:
+
+```js
+let chart = new Chart(ctx, {
+  type: 'radar'
+});
+```
+
+The following chart will have `'myScale'` scale:
+
+```js
+let chart = new Chart(ctx, {
+  type: 'radar',
+  scales: {
+    myScale: {
+      axis: 'r'
+    }
+  }
+});
+```
+
 ## Common Configuration
 
 !!!include(axes/_common.md)!!!