| commit | author | age | ||
| 83c3f6 | 1 | # Axes |
| SP | 2 | |
| 3 | Axes are an integral part of a chart. They are used to determine how data maps to a pixel value on the chart. In a cartesian chart, there is 1 or more X axis and 1 or more Y axis to map points onto the 2 dimensional canvas. These axes are know as ['cartesian axes'](./cartesian/README.md#cartesian-axes). | |
| 4 | ||
| 5 | In a radial chart, such as a radar chart or a polar area chart, there is a single axis that maps points in the angular and radial directions. These are known as ['radial axes'](./radial/README.md#radial-axes). | |
| 6 | ||
| 7 | Scales in Chart.js >V2.0 are significantly more powerful, but also different than those of v1.0. | |
| 8 | * Multiple X & Y axes are supported. | |
| 9 | * A built-in label auto-skip feature detects would-be overlapping ticks and labels and removes every nth label to keep things displaying normally. | |
| 10 | * Scale titles are supported | |
| 11 | * New scale types can be extended without writing an entirely new chart type | |
| 12 | ||
| 13 | # Common Configuration | |
| 14 | ||
| 15 | The following properties are common to all axes provided by Chart.js | |
| 16 | ||
| 17 | | Name | Type | Default | Description | |
| 18 | | ---- | ---- | ------- | ----------- | |
| 19 | | `display` | `Boolean` | `true` | If set to `false` the axis is hidden from view. Overrides *gridLines.display*, *scaleLabel.display*, and *ticks.display*. | |
| 20 | | `callbacks` | `Object` | | Callback functions to hook into the axis lifecycle. [more...](#callbacks) | |
| 21 | | `weight` | `Number` | `0` | The weight used to sort the axis. Higher weights are further away from the chart area. | |
| 22 | ||
| 23 | ## Callbacks | |
| 24 | There are a number of config callbacks that can be used to change parameters in the scale at different points in the update process. | |
| 25 | ||
| 26 | | Name | Arguments | Description | |
| 27 | | ---- | --------- | ----------- | |
| 28 | | `beforeUpdate` | `axis` | Callback called before the update process starts. | |
| 29 | | `beforeSetDimensions` | `axis` | Callback that runs before dimensions are set. | |
| 30 | | `afterSetDimensions` | `axis` | Callback that runs after dimensions are set. | |
| 31 | | `beforeDataLimits` | `axis` | Callback that runs before data limits are determined. | |
| 32 | | `afterDataLimits` | `axis` | Callback that runs after data limits are determined. | |
| 33 | | `beforeBuildTicks` | `axis` | Callback that runs before ticks are created. | |
| 34 | | `afterBuildTicks` | `axis` | Callback that runs after ticks are created. Useful for filtering ticks. | |
| 35 | | `beforeTickToLabelConversion` | `axis` | Callback that runs before ticks are converted into strings. | |
| 36 | | `afterTickToLabelConversion` | `axis` | Callback that runs after ticks are converted into strings. | |
| 37 | | `beforeCalculateTickRotation` | `axis` | Callback that runs before tick rotation is determined. | |
| 38 | | `afterCalculateTickRotation` | `axis` | Callback that runs after tick rotation is determined. | |
| 39 | | `beforeFit` | `axis` | Callback that runs before the scale fits to the canvas. | |
| 40 | | `afterFit` | `axis` | Callback that runs after the scale fits to the canvas. | |
| 41 | | `afterUpdate` | `axis` | Callback that runs at the end of the update process. | |
| 42 | ||
| 43 | ## Updating Axis Defaults | |
| 44 | ||
| 45 | The default configuration for a scale can be easily changed using the scale service. All you need to do is to pass in a partial configuration that will be merged with the current scale default configuration to form the new default. | |
| 46 | ||
| 47 | For example, to set the minimum value of 0 for all linear scales, you would do the following. Any linear scales created after this time would now have a minimum of 0. | |
| 48 | ||
| 49 | ```javascript | |
| 50 | Chart.scaleService.updateScaleDefaults('linear', { | |
| 51 | ticks: { | |
| 52 | min: 0 | |
| 53 | } | |
| 54 | }); | |
| 55 | ``` | |
| 56 | ||
| 57 | ## Creating New Axes | |
| 58 | To create a new axis, see the [developer docs](../developers/axes.md). | |
