* [Usage](getting-started/usage.md)
* [General](general/README.md)
* [Responsive](general/responsive.md)
+ * [Pixel Ratio](general/device-pixel-ratio.md)
* [Interactions](general/interactions/README.md)
* [Events](general/interactions/events.md)
* [Modes](general/interactions/modes.md)
data: {
datasets: [{
data: [20, 50, 100, 75, 25, 0],
- label: 'Left dataset'
+ label: 'Left dataset',
// This binds the dataset to the left y axis
yAxisID: 'left-y-axis'
}, {
- data: [0.1, 0.5, 1.0, 2.0, 1.5, 0]
- label: 'Right dataset'
+ data: [0.1, 0.5, 1.0, 2.0, 1.5, 0],
+ label: 'Right dataset',
// This binds the dataset to the right y axis
yAxisID: 'right-y-axis',
Given the number of axis range settings, it is important to understand how they all interact with each other.
-The `suggestedMax` and `suggestedMin` settings only change the data values that are used to scale the axis. These are useful for extending the range of the axis while maintaing the auto fit behaviour.
+The `suggestedMax` and `suggestedMin` settings only change the data values that are used to scale the axis. These are useful for extending the range of the axis while maintaining the auto fit behaviour.
```javascript
let minDataValue = Math.min(mostNegativeValue, options.ticks.suggestedMin);
scales: {
yAxes: [{
ticks: {
- suggestedMin: 50
+ suggestedMin: 50,
suggestedMax: 100
}
}]
Given the number of axis range settings, it is important to understand how they all interact with each other.
-The `suggestedMax` and `suggestedMin` settings only change the data values that are used to scale the axis. These are useful for extending the range of the axis while maintaing the auto fit behaviour.
+The `suggestedMax` and `suggestedMin` settings only change the data values that are used to scale the axis. These are useful for extending the range of the axis while maintaining the auto fit behaviour.
```javascript
let minDataValue = Math.min(mostNegativeValue, options.ticks.suggestedMin);
options: {
scale: {
ticks: {
- suggestedMin: 50
+ suggestedMin: 50,
suggestedMax: 100
}
}
| `fontSize` | `Number` | `12` | Font size for the tick labels.
| `fontStyle` | `String` | `'normal'` | Font style for the tick labels, follows CSS font-style options (i.e. normal, italic, oblique, initial, inherit).
| `reverse` | `Boolean` | `false` | Reverses order of tick labels.
-| `minor` | `object` | `{}` | Minor ticks configuration. Ommited options are inherited from options above.
-| `major` | `object` | `{}` | Major ticks configuration. Ommited options are inherited from options above.
+| `minor` | `object` | `{}` | Minor ticks configuration. Omitted options are inherited from options above.
+| `major` | `object` | `{}` | Major ticks configuration. Omitted options are inherited from options above.
## Minor Tick Configuration
The minorTick configuration is nested under the ticks configuration in the `minor` key. It defines options for the minor tick marks that are generated by the axis. Omitted options are inherited from `ticks` configuration.
data: [20, 10]
```
-When the `data` array is an array of numbers, the x axis is generally a [category](../axes/cartesian/category.md#Category Axis). The points are placed onto the axis using their position in the array. When a line chart is created with a category axis, the `labels` property of the data object must be specified.
+When the `data` array is an array of numbers, the x axis is generally a [category](../axes/cartesian/category.md#category-cartesian-axis). The points are placed onto the axis using their position in the array. When a line chart is created with a category axis, the `labels` property of the data object must be specified.
### Point[]
| `footerFontSize` | `Number` | `12` | Footer font size
| `footerFontStyle` | `String` | `'bold'` | Footer font style
| `footerFontColor` | `Color` | `'#fff'` | Footer font color
-| `footerSpacing` | `Number` | `2` | Spacing to add to top and bottom of each fotter line.
+| `footerSpacing` | `Number` | `2` | Spacing to add to top and bottom of each footer line.
| `footerMarginTop` | `Number` | `6` | Margin to add before drawing the footer.
| `xPadding` | `Number` | `6` | Padding to add on left and right of tooltip.
| `yPadding` | `Number` | `6` | Padding to add on top and bottom of tooltip.
// Get the pixel (x coordinate for horizontal axis, y coordinate for vertical axis) for a given value
// @param index: index into the ticks array
- // @param includeOffset: if true, get the pixel halway between the given tick and the next
+ // @param includeOffset: if true, get the pixel halfway between the given tick and the next
getPixelForTick: function(index, includeOffset) {},
// Get the pixel (x coordinate for horizontal axis, y coordinate for vertical axis) for a given value
// @param value : the value to get the pixel for
// @param index : index into the data array of the value
// @param datasetIndex : index of the dataset the value comes from
- // @param includeOffset : if true, get the pixel halway between the given tick and the next
+ // @param includeOffset : if true, get the pixel halfway between the given tick and the next
getPixelForValue: function(value, index, datasetIndex, includeOffset) {}
// Get the value for a given pixel (x coordinate for horizontal axis, y coordinate for vertical axis)
It's that easy to get started using Chart.js! From here you can explore the many options that can help you customise your charts with scales, tooltips, labels, colors, custom actions, and much more.
-There are many examples of Chart.js that are available in the `/samples` folder of `Chart.js.zip` that is attatched to every [release](https://github.com/chartjs/Chart.js/releases).
\ No newline at end of file
+There are many examples of Chart.js that are available in the `/samples` folder of `Chart.js.zip` that is attached to every [release](https://github.com/chartjs/Chart.js/releases).
\ No newline at end of file
You can download the latest version of [Chart.js on GitHub](https://github.com/chartjs/Chart.js/releases/latest).
-If you download or clone the repository, you must [build](../developers/contributing.md#building-chartjs) Chart.js to generate the dist files. Chart.js no longer comes with prebuilt release versions, so an alternative option to downloading the repo is **strongly** advised.
+If you download or clone the repository, you must [build](../developers/contributing.md#building-and-testing) Chart.js to generate the dist files. Chart.js no longer comes with prebuilt release versions, so an alternative option to downloading the repo is **strongly** advised.
# Selecting the Correct Build
projects / thirdparty / Chart.js.git / commitdiff
