You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: docs/axes/README.md
+3-3Lines changed: 3 additions & 3 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -10,7 +10,7 @@ Scales in Chart.js >v2.0 are significantly more powerful, but also different tha
10
10
* Scale titles are supported.
11
11
* New scale types can be extended without writing an entirely new chart type.
12
12
13
-
# Common Configuration
13
+
##Common Configuration
14
14
15
15
The following properties are common to all axes provided by Chart.js.
16
16
@@ -20,7 +20,7 @@ The following properties are common to all axes provided by Chart.js.
20
20
| `callbacks` | `object` | | Callback functions to hook into the axis lifecycle. [more...](#callbacks)
21
21
| `weight` | `number` | `0` | The weight used to sort the axis. Higher weights are further away from the chart area.
22
22
23
-
## Callbacks
23
+
###Callbacks
24
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
25
26
26
| Name | Arguments | Description
@@ -40,7 +40,7 @@ There are a number of config callbacks that can be used to change parameters in
40
40
| `afterFit` | `axis` | Callback that runs after the scale fits to the canvas.
41
41
| `afterUpdate` | `axis` | Callback that runs at the end of the update process.
42
42
43
-
## Updating Axis Defaults
43
+
###Updating Axis Defaults
44
44
45
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.
The following options are common to all cartesian axes but do not apply to other axes.
26
26
27
27
| Name | Type | Default | Description
@@ -34,7 +34,7 @@ The following options are common to all cartesian axes but do not apply to other
34
34
| `mirror` | `boolean` | `false` | Flips tick labels around axis, displaying the labels inside the chart instead of outside. *Note: Only applicable to vertical scales.*
35
35
| `padding` | `number` | `10` | 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.
36
36
37
-
## Axis ID
37
+
###Axis ID
38
38
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.
39
39
40
40
```javascript
@@ -63,7 +63,7 @@ var myChart = new Chart(ctx, {
63
63
});
64
64
```
65
65
66
-
# Creating Multiple Axes
66
+
##Creating Multiple Axes
67
67
68
68
With cartesian axes, it is possible to create multiple X and Y axes. To do so, you can add multiple configuration objects to the `xAxes` and `yAxes` properties. When adding new axes, it is important to ensure that you specify the type of the new axes as default types are **not** used in this case.
Bar charts can be configured into stacked bar charts by changing the settings on the X and Y axes to enable stacking. Stacked bar charts can be used to show how one data series is made up of a number of smaller pieces.
212
212
@@ -227,15 +227,13 @@ var stackedBar = new Chart(ctx, {
227
227
});
228
228
```
229
229
230
-
## Dataset Properties
231
-
232
230
The following dataset properties are specific to stacked bar charts.
233
231
234
232
| Name | Type | Description
235
233
| ---- | ---- | -----------
236
234
| `stack` | `string` | The ID of the group to which this dataset belongs to (when stacked, each group will be a separate stack).
237
235
238
-
# Horizontal Bar Chart
236
+
##Horizontal Bar Chart
239
237
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.
240
238
{% chartjs %}
241
239
{
@@ -288,7 +286,7 @@ var myBarChart = new Chart(ctx, {
288
286
});
289
287
```
290
288
291
-
## Config Options
289
+
###Config Options
292
290
The configuration options for the horizontal bar chart are the same as for the [bar chart](#scale-configuration). However, any options specified on the x axis in a bar chart, are applied to the y axis in a horizontal bar chart.
293
291
294
292
The default horizontal bar configuration is specified in `Chart.defaults.horizontalBar`.
Copy file name to clipboardExpand all lines: docs/charts/line.md
+6-6Lines changed: 6 additions & 6 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -190,7 +190,7 @@ data: [{
190
190
191
191
This alternate is used for sparse datasets, such as those in [scatter charts](./scatter.md#scatter-chart). Each data point is specified using an object containing `x` and `y` properties.
192
192
193
-
# Stacked Area Chart
193
+
##Stacked Area Chart
194
194
195
195
Line charts can be configured into stacked area charts by changing the settings on the y axis to enable stacking. Stacked area charts can be used to show how one data trend is made up of a number of smaller pieces.
196
196
@@ -208,17 +208,17 @@ var stackedLine = new Chart(ctx, {
208
208
});
209
209
```
210
210
211
-
# High Performance Line Charts
211
+
##High Performance Line Charts
212
212
213
213
When charting a lot of data, the chart render time may start to get quite large. In that case, the following strategies can be used to improve performance.
214
214
215
-
## Data Decimation
215
+
###Data Decimation
216
216
217
217
Decimating your data will achieve the best results. When there is a lot of data to display on the graph, it doesn't make sense to show tens of thousands of data points on a graph that is only a few hundred pixels wide.
218
218
219
219
There are many approaches to data decimation and selection of an algorithm will depend on your data and the results you want to achieve. For instance, [min/max](https://digital.ni.com/public.nsf/allkb/F694FFEEA0ACF282862576020075F784) decimation will preserve peaks in your data but could require up to 4 points for each pixel. This type of decimation would work well for a very noisy signal where you need to see data peaks.
220
220
221
-
## Disable Bezier Curves
221
+
###Disable Bezier Curves
222
222
223
223
If you are drawing lines on your chart, disabling bezier curves will improve render times since drawing a straight line is more performant than a bezier curve.
224
224
@@ -238,7 +238,7 @@ new Chart(ctx, {
238
238
});
239
239
```
240
240
241
-
## Disable Line Drawing
241
+
###Disable Line Drawing
242
242
243
243
If you have a lot of data points, it can be more performant to disable rendering of the line for a dataset and only draw points. Doing this means that there is less to draw on the canvas which will improve render performance.
244
244
@@ -258,7 +258,7 @@ new Chart(ctx, {
258
258
});
259
259
```
260
260
261
-
## Disable Animations
261
+
###Disable Animations
262
262
263
263
If your charts have long render times, it is a good idea to disable animations. Doing so will mean that the chart needs to only be rendered once during an update instead of multiple times. This will have the effect of reducing CPU usage and improving general page performance.
Copy file name to clipboardExpand all lines: docs/developers/contributing.md
+3-3Lines changed: 3 additions & 3 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -9,11 +9,11 @@ New contributions to the library are welcome, but we ask that you please follow
9
9
- Avoid breaking changes unless there is an upcoming major release, which are infrequent. We encourage people to write plugins for most new advanced features, and care a lot about backwards compatibility.
10
10
- We strongly prefer new methods to be added as private whenever possible. A method can be made private either by making a top-level `function` outside of a class or by prefixing it with `_` and adding `@private` JSDoc if inside a class. Public APIs take considerable time to review and become locked once implemented as we have limited ability to change them without breaking backwards compatibility. Private APIs allow the flexibility to address unforeseen cases.
11
11
12
-
# Joining the project
12
+
##Joining the project
13
13
14
14
Active committers and contributors are invited to introduce yourself and request commit access to this project. We have a very active Slack community that you can join [here](https://chartjs-slack.herokuapp.com/). If you think you can help, we'd love to have you!
15
15
16
-
# Building and Testing
16
+
##Building and Testing
17
17
18
18
Chart.js uses <ahref="https://gulpjs.com/"target="_blank">gulp</a> to build the library into a single JavaScript file.
19
19
@@ -42,7 +42,7 @@ The following commands are now available from the repository root:
42
42
43
43
More information can be found in [gulpfile.js](https://github.com/chartjs/Chart.js/blob/master/gulpfile.js).
44
44
45
-
# Bugs and Issues
45
+
##Bugs and Issues
46
46
47
47
Please report these on the GitHub page - at <ahref="https://github.com/chartjs/Chart.js"target="_blank">github.com/chartjs/Chart.js</a>. Please do not use issues for support requests. For help using Chart.js, please take a look at the [`chartjs`](https://stackoverflow.com/questions/tagged/chartjs) tag on Stack Overflow.
@@ -38,18 +39,18 @@ You can download the latest version of [Chart.js on GitHub](https://github.com/c
38
39
39
40
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.
40
41
41
-
# Selecting the Correct Build
42
+
##Selecting the Correct Build
42
43
43
44
Chart.js provides two different builds for you to choose: **Stand-Alone Build**, **Bundled Build**.
44
45
45
-
## Stand-Alone Build
46
+
###Stand-Alone Build
46
47
Files:
47
48
*`dist/Chart.js`
48
49
*`dist/Chart.min.js`
49
50
50
51
The stand-alone build includes Chart.js as well as the color parsing library. If this version is used, you are required to include [Moment.js](https://momentjs.com/) before Chart.js for the functionality of the time axis.
0 commit comments