Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix typos and minor doc issues #6020

Merged
merged 6 commits into from Jan 29, 2019
Merged
Show file tree
Hide file tree
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
6 changes: 3 additions & 3 deletions docs/README.md
Expand Up @@ -14,11 +14,11 @@ In this example, we create a bar chart for a single dataset and render that in o
```html
<canvas id="myChart" width="400" height="400"></canvas>
<script>
var ctx = document.getElementById("myChart").getContext('2d');
var ctx = document.getElementById('myChart').getContext('2d');
var myChart = new Chart(ctx, {
type: 'bar',
data: {
labels: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"],
labels: ['Red', 'Blue', 'Yellow', 'Green', 'Purple', 'Orange'],
datasets: [{
label: '# of Votes',
data: [12, 19, 3, 5, 2, 3],
Expand All @@ -45,7 +45,7 @@ var myChart = new Chart(ctx, {
scales: {
yAxes: [{
ticks: {
beginAtZero:true
beginAtZero: true
}
}]
}
Expand Down
2 changes: 1 addition & 1 deletion docs/axes/README.md
Expand Up @@ -16,7 +16,7 @@ The following properties are common to all axes provided by Chart.js.

| Name | Type | Default | Description
| ---- | ---- | ------- | -----------
| `display` | `Boolean`/`String` | `true` | Controls the axis global visibility (visible when `true`, hidden when `false`). When `display: 'auto'`, the axis is visible only if at least one associated dataset is visible.
| `display` | `Boolean/String` | `true` | Controls the axis global visibility (visible when `true`, hidden when `false`). When `display: 'auto'`, the axis is visible only if at least one associated dataset is visible.
| `callbacks` | `Object` | | Callback functions to hook into the axis lifecycle. [more...](#callbacks)
| `weight` | `Number` | `0` | The weight used to sort the axis. Higher weights are further away from the chart area.

Expand Down
4 changes: 2 additions & 2 deletions docs/axes/cartesian/README.md
Expand Up @@ -12,7 +12,7 @@ Axes that follow a cartesian grid are known as 'Cartesian Axes'. Cartesian axes
All of the included cartesian axes support a number of common options.

| Name | Type | Default | Description
| -----| ---- | --------| -----------
| ---- | ---- | ------- | -----------
| `type` | `String` | | Type of scale being employed. Custom scales can be created and registered with a string key. This allows changing the type of an axis for a chart.
| `position` | `String` | | Position of the axis in the chart. Possible values are: `'top'`, `'left'`, `'bottom'`, `'right'`
| `offset` | `Boolean` | `false` | If true, extra space is added to the both edges and the axis is scaled to fit into the chart area. This is set to `true` for a category scale in a bar chart by default.
Expand All @@ -25,7 +25,7 @@ All of the included cartesian axes support a number of common options.
The following options are common to all cartesian axes but do not apply to other axes.

| Name | Type | Default | Description
| -----| ---- | --------| -----------
| ---- | ---- | ------- | -----------
| `autoSkip` | `Boolean` | `true` | If true, automatically calculates how many labels that can be shown and hides labels accordingly. Turn it off to show all labels no matter what.
| `autoSkipPadding` | `Number` | `0` | Padding between the ticks on the horizontal axis when `autoSkip` is enabled. *Note: Only applicable to horizontal scales.*
| `labelOffset` | `Number` | `0` | Distance in pixels to offset the label from the centre point of the tick (in the x direction for the x axis, and the y direction for the y axis). *Note: this can cause labels at the edges to be cropped by the edge of the canvas*
Expand Down
10 changes: 5 additions & 5 deletions docs/axes/cartesian/category.md
Expand Up @@ -14,7 +14,7 @@ let chart = new Chart(ctx, {
data: {
labels: ['January', 'February', 'March', 'April', 'May', 'June'],
datasets: ...
},
}
});
```
As part of axis definition:
Expand All @@ -27,7 +27,7 @@ let chart = new Chart(ctx, {
scales: {
xAxes: [{
type: 'category',
labels: ['January', 'February', 'March', 'April', 'May', 'June'],
labels: ['January', 'February', 'March', 'April', 'May', 'June']
}]
}
}
Expand All @@ -39,8 +39,8 @@ let chart = new Chart(ctx, {
The category scale provides the following options for configuring tick marks. They are nested in the `ticks` sub object. These options extend the [common tick configuration](README.md#tick-configuration).

| Name | Type | Default | Description
| -----| ---- | --------| -----------
| `labels` | `Array[String]` | - | An array of labels to display.
| ---- | ---- | ------- | -----------
| `labels` | `String[]` | - | An array of labels to display.
| `min` | `String` | | The minimum item to display. [more...](#min-max-configuration)
| `max` | `String` | | The maximum item to display. [more...](#min-max-configuration)

Expand All @@ -54,7 +54,7 @@ let chart = new Chart(ctx, {
datasets: [{
data: [10, 20, 30, 40, 50, 60]
}],
labels: ['January', 'February', 'March', 'April', 'May', 'June'],
labels: ['January', 'February', 'March', 'April', 'May', 'June']
},
options: {
scales: {
Expand Down
6 changes: 3 additions & 3 deletions docs/axes/cartesian/linear.md
Expand Up @@ -7,7 +7,7 @@ The linear scale is use to chart numerical data. It can be placed on either the
The following options are provided by the linear scale. They are all located in the `ticks` sub options. These options extend the [common tick configuration](README.md#tick-configuration).

| Name | Type | Default | Description
| -----| ---- | --------| -----------
| ---- | ---- | ------- | -----------
| `beginAtZero` | `Boolean` | | if true, scale will include 0 if it is not already included.
| `min` | `Number` | | User defined minimum number for the scale, overrides minimum value from data. [more...](#axis-range-settings)
| `max` | `Number` | | User defined maximum number for the scale, overrides maximum value from data. [more...](#axis-range-settings)
Expand Down Expand Up @@ -56,7 +56,7 @@ let chart = new Chart(ctx, {
In contrast to the `suggested*` settings, the `min` and `max` settings set explicit ends to the axes. When these are set, some data points may not be visible.

## Step Size
If set, the scale ticks will be enumerated by multiple of stepSize, having one tick per increment. If not set, the ticks are labeled automatically using the nice numbers algorithm.
If set, the scale ticks will be enumerated by multiple of `stepSize`, having one tick per increment. If not set, the ticks are labeled automatically using the nice numbers algorithm.

This example sets up a chart with a y axis that creates ticks at `0, 0.5, 1, 1.5, 2, 2.5, 3, 3.5, 4, 4.5, 5`.

Expand All @@ -72,4 +72,4 @@ let options = {
}]
}
};
```
```
4 changes: 2 additions & 2 deletions docs/axes/cartesian/logarithmic.md
Expand Up @@ -7,6 +7,6 @@ The logarithmic scale is use to chart numerical data. It can be placed on either
The following options are provided by the logarithmic scale. They are all located in the `ticks` sub options. These options extend the [common tick configuration](README.md#tick-configuration).

| Name | Type | Default | Description
| -----| ---- | --------| -----------
| ---- | ---- | ------- | -----------
| `min` | `Number` | | User defined minimum number for the scale, overrides minimum value from data.
| `max` | `Number` | | User defined maximum number for the scale, overrides maximum value from data.
| `max` | `Number` | | User defined maximum number for the scale, overrides maximum value from data.
68 changes: 34 additions & 34 deletions docs/axes/cartesian/time.md
Expand Up @@ -26,17 +26,17 @@ When providing data for the time scale, Chart.js supports all of the formats tha
The following options are provided by the time scale. You may also set options provided by the [common tick configuration](README.md#tick-configuration).

| Name | Type | Default | Description
| -----| ---- | --------| -----------
| `distribution` | `String` | `linear` | How data is plotted. [more...](#scale-distribution)
| `bounds` | `String` | `data` | Determines the scale bounds. [more...](#scale-bounds)
| `ticks.source` | `String` | `auto` | How ticks are generated. [more...](#ticks-source)
| ---- | ---- | ------- | -----------
| `distribution` | `String` | `'linear'` | How data is plotted. [more...](#scale-distribution)
| `bounds` | `String` | `'data'` | Determines the scale bounds. [more...](#scale-bounds)
| `ticks.source` | `String` | `'auto'` | How ticks are generated. [more...](#ticks-source)
| `time.displayFormats` | `Object` | | Sets how different time units are displayed. [more...](#display-formats)
| `time.isoWeekday` | `Boolean` | `false` | If true and the unit is set to 'week', then the first day of the week will be Monday. Otherwise, it will be Sunday.
| `time.max` | [Time](#date-formats) | | If defined, this will override the data maximum.
| `time.min` | [Time](#date-formats) | | If defined, this will override the data minimum.
| `time.parser` | `String/Function` | | Custom parser for dates. [more...](#parser)
| `time.round` | `String` | `false` | If defined, dates will be rounded to the start of this unit. See [Time Units](#time-units) below for the allowed units.
| `time.tooltipFormat` | `String` | | The moment js format string to use for the tooltip.
| `time.tooltipFormat` | `String` | | The Moment.js format string to use for the tooltip.
| `time.unit` | `String` | `false` | If defined, will force the unit to be a certain type. See [Time Units](#time-units) section below for details.
| `time.stepSize` | `Number` | `1` | The number of units between grid lines.
| `time.minUnit` | `String` | `'millisecond'` | The minimum display format to be used for a time unit.
Expand All @@ -45,15 +45,15 @@ The following options are provided by the time scale. You may also set options p

The following time measurements are supported. The names can be passed as strings to the `time.unit` config option to force a certain unit.

* millisecond
* second
* minute
* hour
* day
* week
* month
* quarter
* year
* `'millisecond'`
* `'second'`
* `'minute'`
* `'hour'`
* `'day'`
* `'week'`
* `'month'`
* `'quarter'`
* `'year'`

For example, to create a chart with a time scale that always displayed units per month, the following config could be used.

Expand All @@ -71,25 +71,25 @@ var chart = new Chart(ctx, {
}]
}
}
})
});
```

### Display Formats
The following display formats are used to configure how different time units are formed into strings for the axis tick marks. See [moment.js](https://momentjs.com/docs/#/displaying/format/) for the allowable format strings.
The following display formats are used to configure how different time units are formed into strings for the axis tick marks. See [Moment.js](https://momentjs.com/docs/#/displaying/format/) for the allowable format strings.

Name | Default | Example
--- | --- | ---
millisecond | 'h:mm:ss.SSS a' | 11:20:01.123 AM
second | 'h:mm:ss a' | 11:20:01 AM
minute | 'h:mm a' | 11:20 AM
hour | 'hA' | 11AM
day | 'MMM D' | Sep 4
week | 'll' | Sep 4 2015
month | 'MMM YYYY' | Sep 2015
quarter | '[Q]Q - YYYY' | Q3 - 2015
year | 'YYYY' | 2015

For example, to set the display format for the 'quarter' unit to show the month and year, the following config would be passed to the chart constructor.
`millisecond` | `'h:mm:ss.SSS a'` | `'11:20:01.123 AM'`
`second` | `'h:mm:ss a'` | `'11:20:01 AM'`
`minute` | `'h:mm a'` | `'11:20 AM'`
`hour` | `'hA'` | `'11AM'`
`day` | `'MMM D'` | `'Sep 4'`
`week` | `'ll'` | `'Sep 4 2015'`
`month` | `'MMM YYYY'` | `'Sep 2015'`
`quarter` | `'[Q]Q - YYYY'` | `'Q3 - 2015'`
`year` | `'YYYY'` | `'2015'`

For example, to set the display format for the `quarter` unit to show the month and year, the following config would be passed to the chart constructor.

```javascript
var chart = new Chart(ctx, {
Expand All @@ -107,7 +107,7 @@ var chart = new Chart(ctx, {
}]
}
}
})
});
```

### Scale Distribution
Expand All @@ -129,15 +129,15 @@ var chart = new Chart(ctx, {
}]
}
}
})
});
```

### Scale Bounds

The `bounds` property controls the scale boundary strategy (bypassed by min/max time options).
The `bounds` property controls the scale boundary strategy (bypassed by `min`/`max` time options).

* `'data'`: make sure data are fully visible, labels outside are removed
* `'ticks'`: make sure ticks are fully visible, data outside are truncated
* `'data'`: makes sure data are fully visible, labels outside are removed
* `'ticks'`: makes sure ticks are fully visible, data outside are truncated

### Ticks Source

Expand All @@ -148,6 +148,6 @@ The `ticks.source` property controls the ticks generation.
* `'labels'`: generates ticks from user given `data.labels` values ONLY

### Parser
If this property is defined as a string, it is interpreted as a custom format to be used by moment to parse the date.
If this property is defined as a string, it is interpreted as a custom format to be used by Moment.js to parse the date.

If this is a function, it must return a moment.js object given the appropriate data value.
If this is a function, it must return a Moment.js object given the appropriate data value.
2 changes: 1 addition & 1 deletion docs/axes/labelling.md
Expand Up @@ -7,7 +7,7 @@ When creating a chart, you want to tell the viewer what data they are viewing. T
The scale label configuration is nested under the scale configuration in the `scaleLabel` key. It defines options for the scale title. Note that this only applies to cartesian axes.

| Name | Type | Default | Description
| -----| ---- | --------| -----------
| ---- | ---- | ------- | -----------
| `display` | `Boolean` | `false` | If true, display the axis title.
| `labelString` | `String` | `''` | The text for the title. (i.e. "# of People" or "Response Choices").
| `lineHeight` | `Number/String` | `1.2` | Height of an individual line of text (see [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/line-height)).
Expand Down
2 changes: 1 addition & 1 deletion docs/axes/radial/README.md
Expand Up @@ -2,4 +2,4 @@

Radial axes are used specifically for the radar and polar area chart types. These axes overlay the chart area, rather than being positioned on one of the edges. One radial axis is included by default in Chart.js.

* [linear](./linear.md#linear-radial-axis)
* [linear](./linear.md#linear-radial-axis)
8 changes: 4 additions & 4 deletions docs/axes/radial/linear.md
Expand Up @@ -19,7 +19,7 @@ The axis has configuration properties for ticks, angle lines (line that appear i
The following options are provided by the linear scale. They are all located in the `ticks` sub options. The [common tick configuration](../styling.md#tick-configuration) options are supported by this axis.

| Name | Type | Default | Description
| -----| ---- | --------| -----------
| ---- | ---- | ------- | -----------
| `backdropColor` | `Color` | `'rgba(255, 255, 255, 0.75)'` | Color of label backdrops.
| `backdropPaddingX` | `Number` | `2` | Horizontal padding of label backdrop.
| `backdropPaddingY` | `Number` | `2` | Vertical padding of label backdrop.
Expand Down Expand Up @@ -70,7 +70,7 @@ let chart = new Chart(ctx, {
In contrast to the `suggested*` settings, the `min` and `max` settings set explicit ends to the axes. When these are set, some data points may not be visible.

## Step Size
If set, the scale ticks will be enumerated by multiple of stepSize, having one tick per increment. If not set, the ticks are labeled automatically using the nice numbers algorithm.
If set, the scale ticks will be enumerated by multiple of `stepSize`, having one tick per increment. If not set, the ticks are labeled automatically using the nice numbers algorithm.

This example sets up a chart with a y axis that creates ticks at `0, 0.5, 1, 1.5, 2, 2.5, 3, 3.5, 4, 4.5, 5`.

Expand All @@ -91,7 +91,7 @@ let options = {
The following options are used to configure angled lines that radiate from the center of the chart to the point labels. They can be found in the `angleLines` sub options. Note that these options only apply if `angleLines.display` is true.

| Name | Type | Default | Description
| -----| ---- | --------| -----------
| ---- | ---- | ------- | -----------
| `display` | `Boolean` | `true` | if true, angle lines are shown.
| `color` | `Color` | `rgba(0, 0, 0, 0.1)` | Color of angled lines.
| `lineWidth` | `Number` | `1` | Width of angled lines.
Expand All @@ -103,7 +103,7 @@ The following options are used to configure angled lines that radiate from the c
The following options are used to configure the point labels that are shown on the perimeter of the scale. They can be found in the `pointLabels` sub options. Note that these options only apply if `pointLabels.display` is true.

| Name | Type | Default | Description
| -----| ---- | --------| -----------
| ---- | ---- | ------- | -----------
| `callback` | `Function` | | Callback function to transform data labels to point labels. The default implementation simply returns the current string.
| `fontColor` | `Color/Color[]` | `'#666'` | Font color for point labels.
| `fontFamily` | `String` | `"'Helvetica Neue', 'Helvetica', 'Arial', sans-serif"` | Font family to use when rendering labels.
Expand Down