-
Notifications
You must be signed in to change notification settings - Fork 11.9k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Introduce scriptable options (bubble chart) (#4671)
New `options.resolve` helper that determines the final value to use from an array of input values (fallback) and a given context and/or index. For now, only the bubble chart support scriptable options, see documentation for details. Add scriptable options documentation and update the bubble chart dataset properties table with their scriptable and indexable capabilities and default values. Also move point style description under the element configuration section.
- Loading branch information
1 parent
46c3b24
commit 872dfec
Showing
15 changed files
with
617 additions
and
249 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,9 +1,10 @@ | ||
# General Chart.js Configuration | ||
# General Configuration | ||
|
||
These sections describe general configuration options that can apply elsewhere in the documentation. | ||
These sections describe general configuration options that can apply elsewhere in the documentation. | ||
|
||
* [Colors](./colors.md) defines acceptable color values | ||
* [Font](./fonts.md) defines various font options | ||
* [Interactions](./interactions/README.md) defines options that reflect how hovering chart elements works | ||
* [Responsive](./responsive.md) defines responsive chart options that apply to all charts. | ||
* [Device Pixel Ratio](./device-pixel-ratio.md) defines the ratio between display pixels and rendered pixels | ||
* [Device Pixel Ratio](./device-pixel-ratio.md) defines the ratio between display pixels and rendered pixels. | ||
* [Interactions](./interactions/README.md) defines options that reflect how hovering chart elements works. | ||
* [Options](./options.md) scriptable and indexable options syntax. | ||
* [Colors](./colors.md) defines acceptable color values. | ||
* [Font](./fonts.md) defines various font options. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,45 @@ | ||
# Options | ||
|
||
## Scriptable Options | ||
|
||
Scriptable options also accept a function which is called for each data and that takes the unique argument `context` representing contextual information (see [option context](options.md#option-context)). | ||
|
||
Example: | ||
|
||
```javascript | ||
color: function(context) { | ||
return context.data < 0 ? 'red' : // draw negative values in red | ||
index%2 ? 'blue' : 'green'; // else, alternate values in blue and green | ||
} | ||
``` | ||
|
||
> **Note:** scriptable options are only supported by a few bubble chart options. | ||
## Indexable Options | ||
|
||
Indexable options also accept an array in which each item corresponds to the element at the same index. Note that this method requires to provide as many items as data, so, in most cases, using a [function](#scriptable-options) is more appropriated if supported. | ||
|
||
Example: | ||
|
||
```javascript | ||
color: [ | ||
'red', // color for data at index 0 | ||
'blue', // color for data at index 1 | ||
'green', // color for data at index 2 | ||
'black', // color for data at index 3 | ||
//... | ||
] | ||
``` | ||
|
||
## Option Context | ||
|
||
The option context is used to give contextual information when resolving options and currently only applies to [scriptable options](#scriptable-options). | ||
|
||
The context object contains the following properties: | ||
|
||
- `chart`: the associated chart | ||
- `dataIndex`: index of the current data | ||
- `dataset`: dataset at index `datasetIndex` | ||
- `datasetIndex`: index of the current dataset | ||
|
||
**Important**: since the context can represent different types of entities (dataset, data, etc.), some properties may be `undefined` so be sure to test any context property before using it. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.