Refined grammar and updated overall .md documentation files

docs/axes/cartesian/linear.md

@@ -38,7 +38,7 @@ Namespace: `options.scales[scaleId].ticks`
 
 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`.
+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`.
 
 ```javascript
 let options = {

docs/axes/index.md

@@ -4,18 +4,18 @@ Axes are an integral part of a chart. They are used to determine how data maps t
 
 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/).
 
-Scales in Chart.js >v2.0 are significantly more powerful, but also different than those of v1.0.
+Scales in Chart.js >v2.0 are significantly more powerful, but also different from those of v1.0.
 
 * Multiple X & Y axes are supported.
-* A built-in label auto-skip feature detects would-be overlapping ticks and labels and removes every nth label to keep things displaying normally.
+* A built-in label auto-skip feature detects would-be overlapping ticks and labels and removes every nth label to keep things displayed normally.
 * Scale titles are supported.
 * New scale types can be extended without writing an entirely new chart type.
 
 ## Default scales
 
-The default `scaleId`'s for carterian charts are `'x'` and `'y'`. For radial charts: `'r'`.
-Each dataset is mapped to a scale for each axis (x, y or r) it requires. The scaleId's that a dataset is mapped to, is determined by the `xAxisID`, `yAxisID` or `rAxisID`.
-If the ID for an axis is not specified, first scale for that axis is used. If no scale for an axis is found, a new scale is created.
+The default `scaleId`'s for cartesian charts are `'x'` and `'y'`. For radial charts: `'r'`.
+Each dataset is mapped to a scale for each axis (x, y or r) it requires. The scaleId's that a dataset is mapped to is determined by the `xAxisID`, `yAxisID` or `rAxisID`.
+If the ID for an axis is not specified, the first scale for that axis is used. If no scale for an axis is found, a new scale is created.
 
 Some examples:
 
@@ -94,15 +94,15 @@ let chart = new Chart(ctx, {
 ## Common Configuration
 
 :::tip Note
-These are only the common options supported by all axes. Please see specific axis documentation for all of the available options for that axis.
+These are only the common options supported by all axes. Please see specific axis documentation for all the available options for that axis.
 :::
 
 !!!include(axes/_common.md)!!!
 
 ## Tick Configuration
 
 :::tip Note
-These are only the common tick options supported by all axes. Please see specific axis documentation for all of the available tick options for that axis.
+These are only the common tick options supported by all axes. Please see specific axis documentation for all the available tick options for that axis.
 :::
 
 !!!include(axes/_common_ticks.md)!!!
@@ -111,7 +111,7 @@ These are only the common tick options supported by all axes. Please see specifi
 
 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 maintaining 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.suggestedMin);
@@ -145,7 +145,7 @@ In contrast to the `suggested*` settings, the `min` and `max` settings set expli
 
 ## Stacking
 
-By default data is not stacked. If the `stacked` option of the value scale (y-axis on horizontal chart) is `true`, positive and negative values are stacked separately. Additionally a `stack` option can be defined per dataset to further divide into stack groups [more...](../general/data-structures/#dataset-configuration).
+By default, data is not stacked. If the `stacked` option of the value scale (y-axis on horizontal chart) is `true`, positive and negative values are stacked separately. Additionally, a `stack` option can be defined per dataset to further divide into stack groups [more...](../general/data-structures/#dataset-configuration).
 For some charts, you might want to stack positive and negative values together. That can be achieved by specifying `stacked: 'single'`.
 
 ## Callbacks

docs/axes/radial/linear.md

@@ -18,7 +18,7 @@ Namespace: `options.scales[scaleId]`
 | `pointLabels` | `object` | | Point label configuration. [more...](#point-label-options)
 | `startAngle` | `number` | `0` | Starting angle of the scale. In degrees, 0 is at top.
 
-### Common options to all axes
+### Common options for all axes
 
 Namespace: `options.scales[scaleId]`
 
@@ -75,7 +75,7 @@ The scriptable context is described in [Options](../general/options.md#tick) sec
 
 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 maintaining 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);

docs/charts/bar.md

@@ -272,7 +272,7 @@ Sample:     |==================|
 
 ## Data Structure
 
-All of the supported [data structures](../general/data-structures.md) can be used with bar charts.
+All the supported [data structures](../general/data-structures.md) can be used with bar charts.
 
 ## Stacked Bar Chart
 
@@ -298,7 +298,7 @@ const stackedBar = new Chart(ctx, {
 ## Horizontal Bar Chart
 
 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.
-To achieve this you will have to set the `indexAxis` property in the options object to `'y'`.
+To achieve this, you will have to set the `indexAxis` property in the options object to `'y'`.
 The default for this property is `'x'` and thus will show vertical bars.
 
 ```js chart-editor

docs/charts/doughnut.md

@@ -201,7 +201,7 @@ We can also change these default values for each Doughnut type that is created,
 
 ## Data Structure
 
-For a pie chart, datasets need to contain an array of data points. The data points should be a number, Chart.js will total all of the numbers and calculate the relative proportion of each.
+For a pie chart, datasets need to contain an array of data points. The data points should be a number, Chart.js will total all the numbers and calculate the relative proportion of each.
 
 You also need to specify an array of labels so that tooltips appear correctly.
 

docs/charts/line.md

@@ -163,7 +163,7 @@ If left untouched (`undefined`), the global `options.elements.line.cubicInterpol
 
 ### Segment
 
-Line segment styles can be overridden by scriptable options in the `segment` object. Currently all of the `border*` and `backgroundColor` options are supported. The segment styles are resolved for each section of the line between each point. `undefined` fallbacks to main line styles.
+Line segment styles can be overridden by scriptable options in the `segment` object. Currently, all of the `border*` and `backgroundColor` options are supported. The segment styles are resolved for each section of the line between each point. `undefined` fallbacks to main line styles.
 
 :::tip
 To be able to style gaps, you need the [`spanGaps`](#line-styling) option enabled.
@@ -204,7 +204,7 @@ Chart.overrides.line.spanGaps = true;
 
 ## Data Structure
 
-All of the supported [data structures](../general/data-structures.md) can be used with line charts.
+All the supported [data structures](../general/data-structures.md) can be used with line charts.
 
 ## Stacked Area Chart
 
@@ -227,7 +227,7 @@ const stackedLine = new Chart(ctx, {
 ## Vertical Line Chart
 
 A vertical line chart is a variation on the horizontal line chart.
-To achieve this you will have to set the `indexAxis` property in the options object to `'y'`.
+To achieve this, you will have to set the `indexAxis` property in the options object to `'y'`.
 The default for this property is `'x'` and thus will show horizontal lines.
 
 ```js chart-editor

docs/charts/scatter.md

@@ -1,6 +1,6 @@
 # Scatter Chart
 
-Scatter charts are based on basic line charts with the x axis changed to a linear axis. To use a scatter chart, data must be passed as objects containing X and Y properties. The example below creates a scatter chart with 4 points.
+Scatter charts are based on basic line charts with the x-axis changed to a linear axis. To use a scatter chart, data must be passed as objects containing X and Y properties. The example below creates a scatter chart with 4 points.
 
 ```js chart-editor
 // <block:setup:1>
@@ -56,10 +56,10 @@ Namespaces:
 * `options.elements.point` - options for all [point elements](../configuration/elements.md#point-configuration)
 * `options` - options for the whole chart
 
-The scatter chart supports all of the same properties as the [line chart](./line.md#dataset-properties).
+The scatter chart supports all the same properties as the [line chart](./line.md#dataset-properties).
 By default, the scatter chart will override the showLine property of the line chart to `false`.
 
-The index scale is of the type `linear`. This means if you are using the labels array the values have to be numbers or parsable to numbers, the same applies to the object format for the keys.
+The index scale is of the type `linear`. This means, if you are using the labels array, the values have to be numbers or parsable to numbers, the same applies to the object format for the keys.
 
 ## Data Structure
 

docs/configuration/animations.md

@@ -282,4 +282,4 @@ const chart = new Chart(ctx, {
 });
 ```
 
-Another example usage of these callbacks can be found [in this progress bar sample.](../samples/advanced/progress-bar.md) which displays a progress bar showing how far along the animation is.
+Another example usage of these callbacks can be found [in this progress bar sample,](../samples/advanced/progress-bar.md) which displays a progress bar showing how far along the animation is.

docs/configuration/device-pixel-ratio.md

@@ -1,8 +1,8 @@
 # Device Pixel Ratio
 
-By default the chart's canvas will use a 1:1 pixel ratio, unless the physical display has a higher pixel ratio (e.g. Retina displays).
+By default, the chart's canvas will use a 1:1 pixel ratio, unless the physical display has a higher pixel ratio (e.g. Retina displays).
 
-For applications where a chart will be converted to a bitmap, or printed to a higher DPI medium it can be desirable to render the chart at a higher resolution than the default.
+For applications where a chart will be converted to a bitmap, or printed to a higher DPI medium, it can be desirable to render the chart at a higher resolution than the default.
 
 Setting `devicePixelRatio` to a value other than 1 will force the canvas size to be scaled by that amount, relative to the container size. There should be no visible difference on screen; the difference will only be visible when the image is zoomed or printed.
 

docs/configuration/elements.md

@@ -1,10 +1,10 @@
 # Elements
 
-While chart types provide settings to configure the styling of each dataset, you sometimes want to style **all datasets the same way**. A common example would be to stroke all of the bars in a bar chart with the same colour but change the fill per dataset. Options can be configured for four different types of elements: **[arc](#arc-configuration)**, **[lines](#line-configuration)**, **[points](#point-configuration)**, and **[bars](#bar-configuration)**. When set, these options apply to all objects of that type unless specifically overridden by the configuration attached to a dataset.
+While chart types provide settings to configure the styling of each dataset, you sometimes want to style **all datasets the same way**. A common example would be to stroke all the bars in a bar chart with the same colour but change the fill per dataset. Options can be configured for four different types of elements: **[arc](#arc-configuration)**, **[lines](#line-configuration)**, **[points](#point-configuration)**, and **[bars](#bar-configuration)**. When set, these options apply to all objects of that type unless specifically overridden by the configuration attached to a dataset.
 
 ## Global Configuration
 
-The element options can be specified per chart or globally. The global options for elements are defined in `Chart.defaults.elements`. For example, to set the border width of all bar charts globally you would do:
+The element options can be specified per chart or globally. The global options for elements are defined in `Chart.defaults.elements`. For example, to set the border width of all bar charts globally, you would do:
 
 ```javascript
 Chart.defaults.elements.bar.borderWidth = 2;

docs/configuration/index.md

@@ -8,9 +8,9 @@ The top level structure of Chart.js configuration:
 
 ```javascript
 const config = {
-  type: 'line'
-  data: {}
-  options: {}
+  type: 'line',
+  data: {},
+  options: {},
   plugins: []
 }
 ```
@@ -38,7 +38,7 @@ More about plugins in the [developers section](../developers/plugins.md).
 
 This concept was introduced in Chart.js 1.0 to keep configuration [DRY](https://en.wikipedia.org/wiki/Don%27t_repeat_yourself), and allow for changing options globally across chart types, avoiding the need to specify options for each instance, or the default for a particular chart type.
 
-Chart.js merges the options object passed to the chart with the global configuration using chart type defaults and scales defaults appropriately. This way you can be as specific as you would like in your individual chart configuration, while still changing the defaults for all chart types where applicable. The global general options are defined in `Chart.defaults`. The defaults for each chart type are discussed in the documentation for that chart type.
+Chart.js merges the `options` object passed to the chart with the global configuration using chart type defaults and scales defaults appropriately. This way you can be as specific as you would like in your individual chart configuration, while still changing the defaults for all chart types where applicable. The global general options are defined in `Chart.defaults`. The defaults for each chart type are discussed in the documentation for that chart type.
 
 The following example would set the interaction mode to 'nearest' for all charts where this was not overridden by the chart type defaults or the options passed to the constructor on creation.
 

docs/configuration/legend.md

@@ -139,7 +139,7 @@ Items passed to the legend `onClick` function are the ones returned from `labels
 
 ## Example
 
-The following example will create a chart with the legend enabled and turn all of the text red in color.
+The following example will create a chart with the legend enabled and turn all the text red in color.
 
 ```javascript
 const chart = new Chart(ctx, {
@@ -178,7 +178,7 @@ function(e, legendItem, legend) {
 }
 ```
 
-Lets say we wanted instead to link the display of the first two datasets. We could change the click handler accordingly.
+Let's say we wanted instead to link the display of the first two datasets. We could change the click handler accordingly.
 
 ```javascript
 const defaultLegendClickHandler = Chart.defaults.plugins.legend.onClick;

docs/configuration/locale.md

@@ -14,7 +14,7 @@ A Unicode BCP 47 locale identifier consists of
 
 with all present components separated by hyphens.
 
-By default the chart is using the default locale of the platform which is running on.
+By default, the chart is using the default locale of the platform which is running on.
 
 ## Configuration Options
 

docs/configuration/responsive.md

@@ -1,6 +1,6 @@
 # Responsive Charts
 
-When it comes to changing the chart size based on the window size, a major limitation is that the canvas *render* size (`canvas.width` and `.height`) can **not** be expressed with relative values, contrary to the *display* size (`canvas.style.width` and `.height`). Furthermore, these sizes are independent from each other and thus the canvas *render* size does not adjust automatically based on the *display* size, making the rendering inaccurate.
+When it comes to changing the chart size based on the window size, a major limitation is that the canvas *render* size (`canvas.width` and `.height`) can **not** be expressed with relative values, contrary to the *display* size (`canvas.style.width` and `.height`). Furthermore, these sizes are independent of each other and thus the canvas *render* size does not adjust automatically based on the *display* size, making the rendering inaccurate.
 
 The following examples **do not work**:
 

docs/configuration/tooltip.md

@@ -183,7 +183,7 @@ const chart = new Chart(ctx, {
 
 ### Label Point Style Callback
 
-For example, to draw triangles instead of the regular color box for each item in the tooltip you could do:
+For example, to draw triangles instead of the regular color box for each item in the tooltip, you could do:
 
 ```javascript
 const chart = new Chart(ctx, {

docs/developers/api.md

@@ -136,7 +136,7 @@ const x = meta.data[0].x;
 
 ## getVisibleDatasetCount
 
-Returns the amount of datasets that are currently not hidden.
+Returns the number of datasets that are currently not hidden.
 
 ```javascript
 const numberOfVisibleDatasets = chart.getVisibleDatasetCount();
@@ -162,7 +162,7 @@ chart.update(); // chart now renders with item hidden
 
 ## getDataVisibility(index)
 
-Returns the stored visibility state of an data index for all datasets. Set by [toggleDataVisibility](#toggleDataVisibility). A dataset controller should use this method to determine if an item should not be visible.
+Returns the stored visibility state of a data index for all datasets. Set by [toggleDataVisibility](#toggleDataVisibility). A dataset controller should use this method to determine if an item should not be visible.
 
 ```javascript
 const visible = chart.getDataVisibility(2);

docs/developers/charts.md

@@ -69,9 +69,9 @@ The following methods may optionally be overridden by derived dataset controller
 
 ## Extending Existing Chart Types
 
-Extending or replacing an existing controller type is easy. Simply replace the constructor for one of the built in types with your own.
+Extending or replacing an existing controller type is easy. Simply replace the constructor for one of the built-in types with your own.
 
-The built in controller types are:
+The built-in controller types are:
 
 * `BarController`
 * `BubbleController`