diff --git a/.github/ISSUE_TEMPLATE.md b/.github/ISSUE_TEMPLATE.md
index 7d57bbd0c0c..e6ead94ecb3 100644
--- a/.github/ISSUE_TEMPLATE.md
+++ b/.github/ISSUE_TEMPLATE.md
@@ -1,7 +1,9 @@
diff --git a/.htmllintrc b/.htmllintrc
index a6b2097031b..1ab933490de 100644
--- a/.htmllintrc
+++ b/.htmllintrc
@@ -1,5 +1,6 @@
{
"indent-style": "tabs",
+ "line-end-style": false,
"attr-quote-style": "double",
"spec-char-escape": false,
"attr-bans": [
diff --git a/README.md b/README.md
index f914944e101..d7e966ca784 100644
--- a/README.md
+++ b/README.md
@@ -35,7 +35,7 @@ Files:
* `dist/Chart.bundle.js`
* `dist/Chart.bundle.min.js`
-The bundled build includes Moment.js in a single file. You should use this version if you require time axes and want to include a single file. You should not use this build if your application already included Moment.js. Otherwise, Moment.js will be included twice which results in increasing page load time and possible version compatability issues.
+The bundled build includes Moment.js in a single file. You should use this version if you require time axes and want to include a single file. You should not use this build if your application already included Moment.js. Otherwise, Moment.js will be included twice which results in increasing page load time and possible version compatibility issues. The Moment.js version in the bundled build is private to Chart.js so if you want to use Moment.js yourself, it's better to use Chart.js (non bundled) and import Moment.js manually.
## Documentation
diff --git a/docs/SUMMARY.md b/docs/SUMMARY.md
index 8591dad86ae..15265bd2b5a 100644
--- a/docs/SUMMARY.md
+++ b/docs/SUMMARY.md
@@ -6,6 +6,7 @@
* [Integration](getting-started/integration.md)
* [Usage](getting-started/usage.md)
* [General](general/README.md)
+ * [Accessibility](general/accessibility.md)
* [Responsive](general/responsive.md)
* [Pixel Ratio](general/device-pixel-ratio.md)
* [Interactions](general/interactions/README.md)
diff --git a/docs/axes/cartesian/README.md b/docs/axes/cartesian/README.md
index 8518da9f250..1bf35b79f16 100644
--- a/docs/axes/cartesian/README.md
+++ b/docs/axes/cartesian/README.md
@@ -15,7 +15,7 @@ All of the included cartesian axes support a number of common options.
| -----| ---- | --------| -----------
| `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` in the bar chart by default.
+| `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.
| `id` | `String` | | The ID is used to link datasets and scale axes together. [more...](#axis-id)
| `gridLines` | `Object` | | Grid line configuration. [more...](../styling.md#grid-line-configuration)
| `scaleLabel` | `Object` | | Scale title configuration. [more...](../labelling.md#scale-title-configuration)
diff --git a/docs/axes/cartesian/linear.md b/docs/axes/cartesian/linear.md
index 1d0292074a8..3f68b79ff1d 100644
--- a/docs/axes/cartesian/linear.md
+++ b/docs/axes/cartesian/linear.md
@@ -12,6 +12,7 @@ The following options are provided by the linear scale. They are all located in
| `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)
| `maxTicksLimit` | `Number` | `11` | Maximum number of ticks and gridlines to show.
+| `precision` | `Number` | | if defined and `stepSize` is not specified, the step size will be rounded to this many decimal places.
| `stepSize` | `Number` | | User defined fixed step size for the scale. [more...](#step-size)
| `suggestedMax` | `Number` | | Adjustment used when calculating the maximum data value. [more...](#axis-range-settings)
| `suggestedMin` | `Number` | | Adjustment used when calculating the minimum data value. [more...](#axis-range-settings)
diff --git a/docs/axes/cartesian/time.md b/docs/axes/cartesian/time.md
index cefe9c24806..fcda85d6173 100644
--- a/docs/axes/cartesian/time.md
+++ b/docs/axes/cartesian/time.md
@@ -6,7 +6,7 @@ The time scale is used to display times and dates. When building its ticks, it w
### Input Data
-The x-axis data points may additionally be specified via the `t` attribute when using the time scale.
+The x-axis data points may additionally be specified via the `t` or `x` attribute when using the time scale.
data: [{
x: new Date(),
@@ -64,6 +64,7 @@ var chart = new Chart(ctx, {
options: {
scales: {
xAxes: [{
+ type: 'time',
time: {
unit: 'month'
}
diff --git a/docs/axes/radial/linear.md b/docs/axes/radial/linear.md
index 14009be6a5c..e19a33d75fd 100644
--- a/docs/axes/radial/linear.md
+++ b/docs/axes/radial/linear.md
@@ -27,6 +27,7 @@ The following options are provided by the linear scale. They are all located in
| `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)
| `maxTicksLimit` | `Number` | `11` | Maximum number of ticks and gridlines to show.
+| `precision` | `Number` | | if defined and `stepSize` is not specified, the step size will be rounded to this many decimal places.
| `stepSize` | `Number` | | User defined fixed step size for the scale. [more...](#step-size)
| `suggestedMax` | `Number` | | Adjustment used when calculating the maximum data value. [more...](#axis-range-settings)
| `suggestedMin` | `Number` | | Adjustment used when calculating the minimum data value. [more...](#axis-range-settings)
@@ -75,14 +76,12 @@ This example sets up a chart with a y axis that creates ticks at `0, 0.5, 1, 1.5
```javascript
let options = {
- scales: {
- yAxes: [{
- ticks: {
- max: 5,
- min: 0,
- stepSize: 0.5
- }
- }]
+ scale: {
+ ticks: {
+ max: 5,
+ min: 0,
+ stepSize: 0.5
+ }
}
};
```
diff --git a/docs/axes/styling.md b/docs/axes/styling.md
index f60afd9bb68..12a170f3e54 100644
--- a/docs/axes/styling.md
+++ b/docs/axes/styling.md
@@ -9,6 +9,7 @@ The grid line configuration is nested under the scale configuration in the `grid
| Name | Type | Default | Description
| -----| ---- | --------| -----------
| `display` | `Boolean` | `true` | If false, do not display grid lines for this axis.
+| `circular` | `Boolean` | `false` | If true, gridlines are circular (on radar chart only)
| `color` | `Color/Color[]` | `'rgba(0, 0, 0, 0.1)'` | The color of the grid lines. If specified as an array, the first color applies to the first grid line, the second to the second grid line and so on.
| `borderDash` | `Number[]` | `[]` | Length and spacing of dashes on grid lines. See [MDN](https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/setLineDash)
| `borderDashOffset` | `Number` | `0` | Offset for line dashes. See [MDN](https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/lineDashOffset)
@@ -21,7 +22,7 @@ The grid line configuration is nested under the scale configuration in the `grid
| `zeroLineColor` | Color | `'rgba(0, 0, 0, 0.25)'` | Stroke color of the grid line for the first index (index 0).
| `zeroLineBorderDash` | `Number[]` | `[]` | Length and spacing of dashes of the grid line for the first index (index 0). See [MDN](https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/setLineDash)
| `zeroLineBorderDashOffset` | `Number` | `0` | Offset for line dashes of the grid line for the first index (index 0). See [MDN](https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/lineDashOffset)
-| `offsetGridLines` | `Boolean` | `false` | If true, grid lines will be shifted to be between labels. This is set to `true` in the bar chart by default.
+| `offsetGridLines` | `Boolean` | `false` | If true, grid lines will be shifted to be between labels. This is set to `true` for a category scale in a bar chart by default.
## Tick Configuration
The tick configuration is nested under the scale configuration in the `ticks` key. It defines options for the tick marks that are generated by the axis.
diff --git a/docs/charts/README.md b/docs/charts/README.md
index 26677b04d76..dda7e343811 100644
--- a/docs/charts/README.md
+++ b/docs/charts/README.md
@@ -4,9 +4,10 @@ Chart.js comes with built-in chart types:
* [line](./line.md)
* [bar](./bar.md)
* [radar](./radar.md)
-* [polar area](./polar.md)
* [doughnut and pie](./doughnut.md)
+* [polar area](./polar.md)
* [bubble](./bubble.md)
+* [scatter](./scatter.md)
[Area charts](area.md) can be built from a line or radar chart using the dataset `fill` option.
diff --git a/docs/charts/bar.md b/docs/charts/bar.md
index 84704ba941b..e4d146b2c67 100644
--- a/docs/charts/bar.md
+++ b/docs/charts/bar.md
@@ -95,12 +95,19 @@ The bar chart defines the following configuration options. These options are mer
| ---- | ---- | ------- | -----------
| `barPercentage` | `Number` | `0.9` | Percent (0-1) of the available width each bar should be within the category width. 1.0 will take the whole category width and put the bars right next to each other. [more...](#barpercentage-vs-categorypercentage)
| `categoryPercentage` | `Number` | `0.8` | Percent (0-1) of the available width each category should be within the sample width. [more...](#barpercentage-vs-categorypercentage)
-| `barThickness` | `Number` | | Manually set width of each bar in pixels. If not set, the base sample widths are calculated automatically so that they take the full available widths without overlap. Then, the bars are sized using `barPercentage` and `categoryPercentage`.
+| `barThickness` | `Number/String` | | Manually set width of each bar in pixels. If set to `'flex'`, it computes "optimal" sample widths that globally arrange bars side by side. If not set (default), bars are equally sized based on the smallest interval. [more...](#barthickness)
| `maxBarThickness` | `Number` | | Set this to ensure that bars are not sized thicker than this.
| `gridLines.offsetGridLines` | `Boolean` | `true` | If true, the bars for a particular data point fall between the grid lines. The grid line will move to the left by one half of the tick interval. If false, the grid line will go right down the middle of the bars. [more...](#offsetgridlines)
+### barThickness
+If this value is a number, it is applied to the width of each bar, in pixels. When this is enforced, `barPercentage` and `categoryPercentage` are ignored.
+
+If set to `'flex'`, the base sample widths are calculated automatically based on the previous and following samples so that they take the full available widths without overlap. Then, bars are sized using `barPercentage` and `categoryPercentage`. There is no gap when the percentage options are 1. This mode generates bars with different widths when data are not evenly spaced.
+
+If not set (default), the base sample widths are calculated using the smallest interval that prevents bar overlapping, and bars are sized using `barPercentage` and `categoryPercentage`. This mode always generates bars equally sized.
+
### offsetGridLines
-If true, the bars for a particular data point fall between the grid lines. The grid line will move to the left by one half of the tick interval, which is the space between the grid lines. If false, the grid line will go right down the middle of the bars. This is set to true for a bar chart while false for other charts by default.
+If true, the bars for a particular data point fall between the grid lines. The grid line will move to the left by one half of the tick interval, which is the space between the grid lines. If false, the grid line will go right down the middle of the bars. This is set to true for a category scale in a bar chart while false for other scales or chart types by default.
This setting applies to the axis configuration. If axes are added to the chart, this setting will need to be set for each new axis.
diff --git a/docs/charts/bubble.md b/docs/charts/bubble.md
index 4cb2ee6994f..e9f8a7216b1 100644
--- a/docs/charts/bubble.md
+++ b/docs/charts/bubble.md
@@ -51,6 +51,7 @@ The bubble chart allows a number of properties to be specified for each dataset.
| [`hitRadius`](#interactions) | `Number` | Yes | Yes | `1`
| [`label`](#labeling) | `String` | - | - | `undefined`
| [`pointStyle`](#styling) | `String` | Yes | Yes | `circle`
+| [`rotation`](#styling) | `Number` | Yes | Yes | `0`
| [`radius`](#styling) | `Number` | Yes | Yes | `3`
### Labeling
@@ -67,6 +68,7 @@ The style of each bubble can be controlled with the following properties:
| `borderColor` | bubble border color
| `borderWidth` | bubble border width (in pixels)
| `pointStyle` | bubble [shape style](../configuration/elements#point-styles)
+| `rotation` | bubble rotation (in degrees)
| `radius` | bubble radius (in pixels)
All these values, if `undefined`, fallback to the associated [`elements.point.*`](../configuration/elements.md#point-configuration) options.
diff --git a/docs/charts/line.md b/docs/charts/line.md
index 90471e462dd..db0245b1e0c 100644
--- a/docs/charts/line.md
+++ b/docs/charts/line.md
@@ -63,6 +63,7 @@ All point* properties can be specified as an array. If these are set to an array
| `pointBorderWidth` | `Number/Number[]` | The width of the point border in pixels.
| `pointRadius` | `Number/Number[]` | The radius of the point shape. If set to 0, the point is not rendered.
| `pointStyle` | `String/String[]/Image/Image[]` | Style of the point. [more...](../configuration/elements#point-styles)
+| `pointRotation` | `Number/Number[]` | The rotation of the point in degrees.
| `pointHitRadius` | `Number/Number[]` | The pixel size of the non-displayed point that reacts to mouse events.
| `pointHoverBackgroundColor` | `Color/Color[]` | Point background color when hovered.
| `pointHoverBorderColor` | `Color/Color[]` | Point border color when hovered.
diff --git a/docs/charts/radar.md b/docs/charts/radar.md
index b8a41c8384c..947e15a3102 100644
--- a/docs/charts/radar.md
+++ b/docs/charts/radar.md
@@ -82,6 +82,7 @@ All point* properties can be specified as an array. If these are set to an array
| `pointBorderColor` | `Color/Color[]` | The border color for points.
| `pointBorderWidth` | `Number/Number[]` | The width of the point border in pixels.
| `pointRadius` | `Number/Number[]` | The radius of the point shape. If set to 0, the point is not rendered.
+| `pointRotation` | `Number/Number[]` | The rotation of the point in degrees.
| `pointStyle` | `String/String[]/Image/Image[]` | Style of the point. [more...](#pointstyle)
| `pointHitRadius` | `Number/Number[]` | The pixel size of the non-displayed point that reacts to mouse events.
| `pointHoverBackgroundColor` | `Color/Color[]` | Point background color when hovered.
diff --git a/docs/configuration/elements.md b/docs/configuration/elements.md
index 5375a7e9f1f..148b5f39a54 100644
--- a/docs/configuration/elements.md
+++ b/docs/configuration/elements.md
@@ -19,6 +19,7 @@ Global point options: `Chart.defaults.global.elements.point`
| -----| ---- | --------| -----------
| `radius` | `Number` | `3` | Point radius.
| [`pointStyle`](#point-styles) | `String` | `circle` | Point style.
+| `rotation` | `Number` | `0` | Point rotation (in degrees).
| `backgroundColor` | `Color` | `'rgba(0,0,0,0.1)'` | Point fill color.
| `borderWidth` | `Number` | `1` | Point stroke width.
| `borderColor` | `Color` | `'rgba(0,0,0,0.1)'` | Point stroke color.
diff --git a/docs/configuration/legend.md b/docs/configuration/legend.md
index 6867b762d6f..d2a3a88b3b6 100644
--- a/docs/configuration/legend.md
+++ b/docs/configuration/legend.md
@@ -1,6 +1,6 @@
# Legend Configuration
-The chart legend displays data about the datasets that area appearing on the chart.
+The chart legend displays data about the datasets that are appearing on the chart.
## Configuration options
The legend configuration is passed into the `options.legend` namespace. The global options for the chart legend is defined in `Chart.defaults.global.legend`.
diff --git a/docs/configuration/tooltip.md b/docs/configuration/tooltip.md
index b591dc1d13e..566bc5696bc 100644
--- a/docs/configuration/tooltip.md
+++ b/docs/configuration/tooltip.md
@@ -256,12 +256,13 @@ var myPieChart = new Chart(ctx, {
// Display, position, and set styles for font
tooltipEl.style.opacity = 1;
tooltipEl.style.position = 'absolute';
- tooltipEl.style.left = position.left + tooltipModel.caretX + 'px';
- tooltipEl.style.top = position.top + tooltipModel.caretY + 'px';
+ tooltipEl.style.left = position.left + window.pageXOffset + tooltipModel.caretX + 'px';
+ tooltipEl.style.top = position.top + window.pageYOffset + tooltipModel.caretY + 'px';
tooltipEl.style.fontFamily = tooltipModel._bodyFontFamily;
tooltipEl.style.fontSize = tooltipModel.bodyFontSize + 'px';
tooltipEl.style.fontStyle = tooltipModel._bodyFontStyle;
tooltipEl.style.padding = tooltipModel.yPadding + 'px ' + tooltipModel.xPadding + 'px';
+ tooltipEl.style.pointerEvents = 'none';
}
}
}
diff --git a/docs/developers/contributing.md b/docs/developers/contributing.md
index fa3511bb09a..551ac71ca97 100644
--- a/docs/developers/contributing.md
+++ b/docs/developers/contributing.md
@@ -37,6 +37,7 @@ The following commands are now available from the repository root:
> gulp lint // perform code linting (ESLint)
> gulp test // perform code linting and run unit tests
> gulp docs // build the documentation in ./dist/docs
+> gulp docs --watch // starts the gitbook live reloaded server
```
More information can be found in [gulpfile.js](https://github.com/chartjs/Chart.js/blob/master/gulpfile.js).
diff --git a/docs/general/accessibility.md b/docs/general/accessibility.md
new file mode 100644
index 00000000000..a59df93475a
--- /dev/null
+++ b/docs/general/accessibility.md
@@ -0,0 +1,39 @@
+# Accessible Charts
+
+Chart.js charts are rendered on user provided `canvas` elements. Thus, it is up to the user to create the `canvas` element in a way that is accessible. The `canvas` element has support in all browsers and will render on screen but the `canvas` content will not be accessible to screen readers.
+
+With `canvas`, the accessibility has to be added with `ARIA` attributes on the `canvas` element or added using internal fallback content placed within the opening and closing canvas tags.
+
+This [website](http://pauljadam.com/demos/canvas.html) has a more detailed explanation of `canvas` accessibility as well as in depth examples.
+
+## Examples
+
+These are some examples of **accessible** `canvas` elements.
+
+By setting the `role` and `aria-label`, this `canvas` now has an accessible name.
+
+```html
+
+```
+
+This `canvas` element has a text alternative via fallback content.
+
+```html
+
+```
+
+These are some bad examples of **inaccessible** `canvas` elements.
+
+This `canvas` element does not have an accessible name or role.
+
+```html
+
+```
+
+This `canvas` element has inaccessible fallback content.
+
+```html
+
+```
diff --git a/docs/general/responsive.md b/docs/general/responsive.md
index f410826b84f..fd92aa494f0 100644
--- a/docs/general/responsive.md
+++ b/docs/general/responsive.md
@@ -16,6 +16,7 @@ Chart.js provides a [few options](#configuration-options) to enable responsivene
| `responsive` | `Boolean` | `true` | Resizes the chart canvas when its container does ([important note...](#important-note)).
| `responsiveAnimationDuration` | `Number` | `0` | Duration in milliseconds it takes to animate to new size after a resize event.
| `maintainAspectRatio` | `Boolean` | `true` | Maintain the original canvas aspect ratio `(width / height)` when resizing.
+| `aspectRatio` | `Number` | `2` | Canvas aspect ratio (i.e. `width / height`, a value of 1 representing a square canvas). Note that this option is ignored if the height is explicitly defined either as attribute or via the style.
| `onResize` | `Function` | `null` | Called when a resize occurs. Gets passed two arguments: the chart instance and the new size.
## Important Note
diff --git a/docs/getting-started/installation.md b/docs/getting-started/installation.md
index ccc02ddc4b9..00b19b059e4 100644
--- a/docs/getting-started/installation.md
+++ b/docs/getting-started/installation.md
@@ -54,4 +54,4 @@ Files:
* `dist/Chart.bundle.js`
* `dist/Chart.bundle.min.js`
-The bundled build includes Moment.js in a single file. You should use this version if you require time axes and want to include a single file. You should not use this build if your application already included Moment.js. Otherwise, Moment.js will be included twice which results in increasing page load time and possible version compatability issues.
+The bundled build includes Moment.js in a single file. You should use this version if you require time axes and want to include a single file. You should not use this build if your application already included Moment.js. Otherwise, Moment.js will be included twice which results in increasing page load time and possible version compatability issues. The Moment.js version in the bundled build is private to Chart.js so if you want to use Moment.js yourself, it's better to use Chart.js (non bundled) and import Moment.js manually.
diff --git a/docs/getting-started/integration.md b/docs/getting-started/integration.md
index 173448f58b4..95ccbc46d0a 100644
--- a/docs/getting-started/integration.md
+++ b/docs/getting-started/integration.md
@@ -2,13 +2,6 @@
Chart.js can be integrated with plain JavaScript or with different module loaders. The examples below show how to load Chart.js in different systems.
-## ES6 Modules
-
-```javascript
-import Chart from 'chart.js';
-var myChart = new Chart(ctx, {...});
-```
-
## Script Tag
```html
@@ -18,6 +11,13 @@ var myChart = new Chart(ctx, {...});
```
+## Webpack
+
+```javascript
+import Chart from 'chart.js';
+var myChart = new Chart(ctx, {...});
+```
+
## Common JS
```javascript
diff --git a/docs/notes/extensions.md b/docs/notes/extensions.md
index fe2c337f156..97f70e8fadd 100644
--- a/docs/notes/extensions.md
+++ b/docs/notes/extensions.md
@@ -18,6 +18,8 @@ In addition, many charts can be found on the [npm registry](https://www.npmjs.co
- chartjs-plugin-deferred - Defers initial chart update until chart scrolls into viewport.
- chartjs-plugin-draggable - Makes select chart elements draggable with the mouse.
- chartjs-plugin-stacked100 - Draws 100% stacked bar chart.
+ - chartjs-plugin-streaming - Enables to create live streaming charts.
+ - chartjs-plugin-style - Provides more styling options.
- chartjs-plugin-waterfall - Enables easy use of waterfall charts.
- chartjs-plugin-zoom - Enables zooming and panning on charts.
@@ -55,6 +57,7 @@ In addition, many plugins can be found on the [npm registry](https://www.npmjs.c
### Java
- Chart.java
+ - Wicked-Charts
### GWT (Google Web toolkit)
- Charba
diff --git a/gulpfile.js b/gulpfile.js
index 21f19645f81..f6795fa7f56 100644
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -20,7 +20,7 @@ var yargs = require('yargs');
var path = require('path');
var fs = require('fs');
var htmllint = require('gulp-htmllint');
-var package = require('./package.json');
+var pkg = require('./package.json');
var argv = yargs
.option('force-output', {default: false})
@@ -69,11 +69,11 @@ gulp.task('default', ['build', 'watch']);
*/
function bowerTask() {
var json = JSON.stringify({
- name: package.name,
- description: package.description,
- homepage: package.homepage,
- license: package.license,
- version: package.version,
+ name: pkg.name,
+ description: pkg.description,
+ homepage: pkg.homepage,
+ license: pkg.license,
+ version: pkg.version,
main: outDir + "Chart.js",
ignore: [
'.github',
@@ -112,11 +112,11 @@ function buildTask() {
.on('error', errorHandler)
.pipe(source('Chart.bundle.js'))
.pipe(insert.prepend(header))
- .pipe(streamify(replace('{{ version }}', package.version)))
+ .pipe(streamify(replace('{{ version }}', pkg.version)))
.pipe(gulp.dest(outDir))
.pipe(streamify(uglify()))
.pipe(insert.prepend(header))
- .pipe(streamify(replace('{{ version }}', package.version)))
+ .pipe(streamify(replace('{{ version }}', pkg.version)))
.pipe(streamify(concat('Chart.bundle.min.js')))
.pipe(gulp.dest(outDir));
@@ -127,11 +127,11 @@ function buildTask() {
.on('error', errorHandler)
.pipe(source('Chart.js'))
.pipe(insert.prepend(header))
- .pipe(streamify(replace('{{ version }}', package.version)))
+ .pipe(streamify(replace('{{ version }}', pkg.version)))
.pipe(gulp.dest(outDir))
.pipe(streamify(uglify()))
.pipe(insert.prepend(header))
- .pipe(streamify(replace('{{ version }}', package.version)))
+ .pipe(streamify(replace('{{ version }}', pkg.version)))
.pipe(streamify(concat('Chart.min.js')))
.pipe(gulp.dest(outDir));
@@ -190,7 +190,7 @@ function docsTask(done) {
const cmd = process.execPath;
exec([cmd, script, 'install', './'].join(' ')).then(() => {
- return exec([cmd, script, 'build', './', './dist/docs'].join(' '));
+ return exec([cmd, script, argv.watch ? 'serve' : 'build', './', './dist/docs'].join(' '));
}).catch((err) => {
console.error(err.stdout);
}).then(() => {
diff --git a/karma.conf.js b/karma.conf.js
index 5601cbd7212..5bb73ef03a0 100644
--- a/karma.conf.js
+++ b/karma.conf.js
@@ -3,9 +3,27 @@
module.exports = function(karma) {
var args = karma.args || {};
var config = {
- browsers: ['Firefox'],
frameworks: ['browserify', 'jasmine'],
reporters: ['progress', 'kjhtml'],
+ browsers: ['chrome', 'firefox'],
+
+ // Explicitly disable hardware acceleration to make image
+ // diff more stable when ran on Travis and dev machine.
+ // https://github.com/chartjs/Chart.js/pull/5629
+ customLaunchers: {
+ chrome: {
+ base: 'Chrome',
+ flags: [
+ '--disable-accelerated-2d-canvas'
+ ]
+ },
+ firefox: {
+ base: 'Firefox',
+ prefs: {
+ 'layers.acceleration.disabled': true
+ }
+ }
+ },
preprocessors: {
'./test/jasmine.index.js': ['browserify'],
@@ -19,21 +37,12 @@ module.exports = function(karma) {
// These settings deal with browser disconnects. We had seen test flakiness from Firefox
// [Firefox 56.0.0 (Linux 0.0.0)]: Disconnected (1 times), because no message in 10000 ms.
// https://github.com/jasmine/jasmine/issues/1327#issuecomment-332939551
- browserNoActivityTimeout: 60000,
browserDisconnectTolerance: 3
};
// https://swizec.com/blog/how-to-run-javascript-tests-in-chrome-on-travis/swizec/6647
if (process.env.TRAVIS) {
- config.browsers.push('chrome_travis_ci');
- config.customLaunchers = {
- chrome_travis_ci: {
- base: 'Chrome',
- flags: ['--no-sandbox']
- }
- };
- } else {
- config.browsers.push('Chrome');
+ config.customLaunchers.chrome.flags.push('--no-sandbox');
}
if (args.coverage) {
diff --git a/package.json b/package.json
index a2e6c494af1..30e365f7467 100644
--- a/package.json
+++ b/package.json
@@ -2,7 +2,7 @@
"name": "chart.js",
"homepage": "http://www.chartjs.org",
"description": "Simple HTML5 charts using the canvas element.",
- "version": "2.7.2",
+ "version": "2.7.3",
"license": "MIT",
"main": "src/chart.js",
"repository": {
diff --git a/samples/advanced/progress-bar.html b/samples/advanced/progress-bar.html
index b97a998ea95..b9c72446e59 100644
--- a/samples/advanced/progress-bar.html
+++ b/samples/advanced/progress-bar.html
@@ -28,6 +28,7 @@
data: {
labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'],
datasets: [{
+ label: 'My First dataset',
fill: false,
borderColor: window.chartColors.red,
backgroundColor: window.chartColors.red,
diff --git a/samples/charts/bar/horizontal.html b/samples/charts/bar/horizontal.html
index 6450e014d92..e174ad2ca35 100644
--- a/samples/charts/bar/horizontal.html
+++ b/samples/charts/bar/horizontal.html
@@ -102,7 +102,7 @@
var colorName = colorNames[horizontalBarChartData.datasets.length % colorNames.length];
var dsColor = window.chartColors[colorName];
var newDataset = {
- label: 'Dataset ' + horizontalBarChartData.datasets.length,
+ label: 'Dataset ' + (horizontalBarChartData.datasets.length + 1),
backgroundColor: color(dsColor).alpha(0.5).rgbString(),
borderColor: dsColor,
data: []
@@ -130,7 +130,7 @@
});
document.getElementById('removeDataset').addEventListener('click', function() {
- horizontalBarChartData.datasets.splice(0, 1);
+ horizontalBarChartData.datasets.pop();
window.myHorizontalBar.update();
});
diff --git a/samples/charts/bar/vertical.html b/samples/charts/bar/vertical.html
index e9348b274fd..5127d4937c2 100644
--- a/samples/charts/bar/vertical.html
+++ b/samples/charts/bar/vertical.html
@@ -95,7 +95,7 @@
var colorName = colorNames[barChartData.datasets.length % colorNames.length];
var dsColor = window.chartColors[colorName];
var newDataset = {
- label: 'Dataset ' + barChartData.datasets.length,
+ label: 'Dataset ' + (barChartData.datasets.length + 1),
backgroundColor: color(dsColor).alpha(0.5).rgbString(),
borderColor: dsColor,
borderWidth: 1,
@@ -125,7 +125,7 @@
});
document.getElementById('removeDataset').addEventListener('click', function() {
- barChartData.datasets.splice(0, 1);
+ barChartData.datasets.pop();
window.myBar.update();
});
diff --git a/samples/charts/doughnut.html b/samples/charts/doughnut.html
index 446dcee4e2e..8466970a403 100644
--- a/samples/charts/doughnut.html
+++ b/samples/charts/doughnut.html
@@ -23,6 +23,7 @@
+