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

Version 2.7.1 #4876

Merged
merged 22 commits into from Oct 28, 2017
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
22 commits
Select commit Hold shift + click to select a range
4396a53
Expand scale jsdocs (#4736)
benmccann Sep 11, 2017
2b89f7a
Consistent formatting for cartesian option docs (#4765)
benmccann Sep 15, 2017
52145de
Fix regression in x-axis interaction mode (#4762)
etimberg Sep 16, 2017
8a4ac1e
Rename INTERVALS.major to INTERVALS.common (#4777)
benmccann Sep 29, 2017
b94532c
Error if style is null (#4781)
Rydori Sep 29, 2017
b4d6924
Fix handling of null labels (#4795)
benmccann Sep 29, 2017
0bd0654
fix colour settings of BeforeLabel and BeforeBody (#4783)
Rittyan Oct 2, 2017
73a3c3b
fixed typo (#4819)
einfallstoll Oct 6, 2017
3fe198c
Fix responsive issue when the chart is recreated (#4774)
simonbrunel Oct 7, 2017
fa2ca2c
Clarify that x/y coordinates only work with the time scale (#4826)
benmccann Oct 8, 2017
d2226b2
Fix markdown (#4827)
benmccann Oct 8, 2017
d81afc8
Fix choosing of formatting unit (#4779)
benmccann Oct 9, 2017
c83b03f
Fixes #4772: added scope for tooltip position mode call and added doc…
Oct 10, 2017
8ac0257
Add "beforeTooltipDraw" and "afterTooltipDraw" plugin hooks (#4793)
JewelsJLF Oct 14, 2017
11315fb
minor doc fixes (#4851)
minusf Oct 16, 2017
b64fd5d
Respect min and max when building ticks (#4860)
benmccann Oct 20, 2017
ee6432b
Update supported browser section (#4818)
etimberg Oct 21, 2017
9f32f07
Attempt to fix test flakiness (Firefox) (#4880)
benmccann Oct 22, 2017
c81a55f
Add jsDelivr as CDN install option (#4881)
simonbrunel Oct 22, 2017
26c1936
Move extend and inherits helpers in helpers.core.js (#4878)
simonbrunel Oct 24, 2017
13e9676
Reset tooltip when calling Chart.update (#4840)
etimberg Oct 28, 2017
8a6d58d
Bump version to 2.7.1 (#4877)
benmccann Oct 28, 2017
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
2 changes: 1 addition & 1 deletion docs/axes/cartesian/category.md
Expand Up @@ -40,7 +40,7 @@ The category scale provides the following options for configuring tick marks. Th

| Name | Type | Default | Description
| -----| ---- | --------| -----------
| labels | Array[String] | - | An array of labels to display.
| `labels` | `Array[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 Down
2 changes: 1 addition & 1 deletion docs/axes/cartesian/time.md
Expand Up @@ -34,7 +34,7 @@ The following options are provided by the time scale. You may also set options p
| `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` or `Function` | | Custom parser for dates. [more...](#parser)
| `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.unit` | `String` | `false` | If defined, will force the unit to be a certain type. See [Time Units](#time-units) section below for details.
Expand Down
6 changes: 3 additions & 3 deletions docs/axes/labelling.md
Expand Up @@ -10,12 +10,12 @@ The scale label configuration is nested under the scale configuration in the `sc
| -----| ---- | --------| -----------
| `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))
| `fontColor` | Color | `'#666'` | Font color for scale title.
| `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))
| `fontColor` | `Color` | `'#666'` | Font color for scale title.
| `fontFamily` | `String` | `"'Helvetica Neue', 'Helvetica', 'Arial', sans-serif"` | Font family for the scale title, follows CSS font-family options.
| `fontSize` | `Number` | `12` | Font size for scale title.
| `fontStyle` | `String` | `'normal'` | Font style for the scale title, follows CSS font-style options (i.e. normal, italic, oblique, initial, inherit).
| `padding` | `Number` or `Object` | `4` | Padding to apply around scale labels. Only `top` and `bottom` are implemented.
| `padding` | `Number/Object` | `4` | Padding to apply around scale labels. Only `top` and `bottom` are implemented.

## Creating Custom Tick Formats

Expand Down
8 changes: 4 additions & 4 deletions docs/axes/radial/linear.md
Expand Up @@ -20,7 +20,7 @@ The following options are provided by the linear scale. They are all located in

| Name | Type | Default | Description
| -----| ---- | --------| -----------
| `backdropColor` | Color | `'rgba(255, 255, 255, 0.75)'` | Color of label backdrops
| `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.
| `beginAtZero` | `Boolean` | `false` | if true, scale will include 0 if it is not already included.
Expand Down Expand Up @@ -94,7 +94,7 @@ The following options are used to configure angled lines that radiate from the c
| 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
| `color` | `Color` | `rgba(0, 0, 0, 0.1)` | Color of angled lines
| `lineWidth` | `Number` | `1` | Width of angled lines

## Point Label Options
Expand All @@ -104,7 +104,7 @@ The following options are used to configure the point labels that are shown on t
| 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 | `'#666'` | Font color for point labels.
| `fontColor` | `Color` | `'#666'` | Font color for point labels.
| `fontFamily` | `String` | `"'Helvetica Neue', 'Helvetica', 'Arial', sans-serif"` | Font family to use when rendering labels.
| `fontSize` | `Number` | 10 | font size in pixels
| `fontStyle` | `String` | `'normal'` | Font style to use when rendering point labels.
| `fontStyle` | `String` | `'normal'` | Font style to use when rendering point labels.
10 changes: 5 additions & 5 deletions docs/axes/styling.md
Expand Up @@ -9,10 +9,10 @@ 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.
| `color` | Color or 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.
| `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)
| `lineWidth` | `Number or Number[]` | `1` | Stroke width of grid lines.
| `lineWidth` | `Number/Number[]` | `1` | Stroke width of grid lines.
| `drawBorder` | `Boolean` | `true` | If true, draw border at the edge between the axis and the chart area.
| `drawOnChartArea` | `Boolean` | `true` | If true, draw lines on the chart area inside the axis lines. This is useful when there are multiple axes and you need to control which grid lines are drawn.
| `drawTicks` | `Boolean` | `true` | If true, draw lines beside the ticks in the axis area beside the chart.
Expand All @@ -30,7 +30,7 @@ The tick configuration is nested under the scale configuration in the `ticks` ke
| -----| ---- | --------| -----------
| `callback` | `Function` | | Returns the string representation of the tick value as it should be displayed on the chart. See [callback](../axes/labelling.md#creating-custom-tick-formats).
| `display` | `Boolean` | `true` | If true, show tick marks
| `fontColor` | Color | `'#666'` | Font color for tick labels.
| `fontColor` | `Color` | `'#666'` | Font color for tick labels.
| `fontFamily` | `String` | `"'Helvetica Neue', 'Helvetica', 'Arial', sans-serif"` | Font family for the tick labels, follows CSS font-family options.
| `fontSize` | `Number` | `12` | Font size for the tick labels.
| `fontStyle` | `String` | `'normal'` | Font style for the tick labels, follows CSS font-style options (i.e. normal, italic, oblique, initial, inherit).
Expand All @@ -44,7 +44,7 @@ The minorTick configuration is nested under the ticks configuration in the `mino
| Name | Type | Default | Description
| -----| ---- | --------| -----------
| `callback` | `Function` | | Returns the string representation of the tick value as it should be displayed on the chart. See [callback](../axes/labelling.md#creating-custom-tick-formats).
| `fontColor` | Color | `'#666'` | Font color for tick labels.
| `fontColor` | `Color` | `'#666'` | Font color for tick labels.
| `fontFamily` | `String` | `"'Helvetica Neue', 'Helvetica', 'Arial', sans-serif"` | Font family for the tick labels, follows CSS font-family options.
| `fontSize` | `Number` | `12` | Font size for the tick labels.
| `fontStyle` | `String` | `'normal'` | Font style for the tick labels, follows CSS font-style options (i.e. normal, italic, oblique, initial, inherit).
Expand All @@ -55,7 +55,7 @@ The majorTick configuration is nested under the ticks configuration in the `majo
| Name | Type | Default | Description
| -----| ---- | --------| -----------
| `callback` | `Function` | | Returns the string representation of the tick value as it should be displayed on the chart. See [callback](../axes/labelling.md#creating-custom-tick-formats).
| `fontColor` | Color | `'#666'` | Font color for tick labels.
| `fontColor` | `Color` | `'#666'` | Font color for tick labels.
| `fontFamily` | `String` | `"'Helvetica Neue', 'Helvetica', 'Arial', sans-serif"` | Font family for the tick labels, follows CSS font-family options.
| `fontSize` | `Number` | `12` | Font size for the tick labels.
| `fontStyle` | `String` | `'normal'` | Font style for the tick labels, follows CSS font-style options (i.e. normal, italic, oblique, initial, inherit).
2 changes: 1 addition & 1 deletion docs/charts/bar.md
Expand Up @@ -152,7 +152,7 @@ The `data` property of a dataset for a bar chart is specified as a an array of n
data: [20, 10]
```

You can also specify the dataset as x/y coordinates.
You can also specify the dataset as x/y coordinates when using the [time scale](./time.md).

```javascript
data: [{x:'2016-12-25', y:20}, {x:'2016-12-26', y:10}]
Expand Down
2 changes: 1 addition & 1 deletion docs/charts/line.md
Expand Up @@ -50,7 +50,7 @@ All point* properties can be specified as an array. If these are set to an array
| `yAxisID` | `String` | The ID of the y axis to plot this dataset on. If not specified, this defaults to the ID of the first found y axis.
| `backgroundColor` | `Color` | The fill color under the line. See [Colors](../general/colors.md#colors)
| `borderColor` | `Color` | The color of the line. See [Colors](../general/colors.md#colors)
| `borderWidth` | `Number/` | The width of the line in pixels.
| `borderWidth` | `Number` | The width of the line in pixels.
| `borderDash` | `Number[]` | Length and spacing of dashes. See [MDN](https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/setLineDash)
| `borderDashOffset` | `Number` | Offset for line dashes. See [MDN](https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/lineDashOffset)
| `borderCapStyle` | `String` | Cap style of the line. See [MDN](https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/lineCap)
Expand Down
2 changes: 1 addition & 1 deletion docs/configuration/legend.md
Expand Up @@ -31,7 +31,7 @@ The legend label configuration is nested below the legend configuration using th
| `boxWidth` | `Number` | `40` | width of coloured box
| `fontSize` | `Number` | `12` | font size of text
| `fontStyle` | `String` | `'normal'` | font style of text
| `fontColor` | Color | `'#666'` | Color of text
| `fontColor` | `Color` | `'#666'` | Color of text
| `fontFamily` | `String` | `"'Helvetica Neue', 'Helvetica', 'Arial', sans-serif"` | Font family of legend text.
| `padding` | `Number` | `10` | Padding between rows of colored boxes.
| `generateLabels` | `Function` | | Generates legend items for each thing in the legend. Default implementation returns the text + styling for the color box. See [Legend Item](#legend-item-interface) for details.
Expand Down
6 changes: 3 additions & 3 deletions docs/configuration/title.md
Expand Up @@ -11,11 +11,11 @@ The title configuration is passed into the `options.title` namespace. The global
| `position` | `String` | `'top'` | Position of title. [more...](#position)
| `fontSize` | `Number` | `12` | Font size
| `fontFamily` | `String` | `"'Helvetica Neue', 'Helvetica', 'Arial', sans-serif"` | Font family for the title text.
| `fontColor` | Color | `'#666'` | Font color
| `fontColor` | `Color` | `'#666'` | Font color
| `fontStyle` | `String` | `'bold'` | Font style
| `padding` | `Number` | `10` | Number of pixels to add above and below the title text.
| `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))
| `text` | `String/String[]` | `''` | Title text to display. If specified as an array, text is rendered on multiple lines.
| `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))
| `text` | `String/String[]` | `''` | Title text to display. If specified as an array, text is rendered on multiple lines.

### Position
Possible title position values are:
Expand Down
36 changes: 29 additions & 7 deletions docs/configuration/tooltip.md
Expand Up @@ -14,32 +14,32 @@ The tooltip configuration is passed into the `options.tooltips` namespace. The g
| `callbacks` | `Object` | | See the [callbacks section](#tooltip-callbacks)
| `itemSort` | `Function` | | Sort tooltip items. [more...](#sort-callback)
| `filter` | `Function` | | Filter tooltip items. [more...](#filter-callback)
| `backgroundColor` | Color | `'rgba(0,0,0,0.8)'` | Background color of the tooltip.
| `backgroundColor` | `Color` | `'rgba(0,0,0,0.8)'` | Background color of the tooltip.
| `titleFontFamily` | `String` | `"'Helvetica Neue', 'Helvetica', 'Arial', sans-serif"` | title font
| `titleFontSize` | `Number` | `12` | Title font size
| `titleFontStyle` | `String` | `'bold'` | Title font style
| `titleFontColor` | Color | `'#fff'` | Title font color
| `titleFontColor` | `Color` | `'#fff'` | Title font color
| `titleSpacing` | `Number` | `2` | Spacing to add to top and bottom of each title line.
| `titleMarginBottom` | `Number` | `6` | Margin to add on bottom of title section.
| `bodyFontFamily` | `String` | `"'Helvetica Neue', 'Helvetica', 'Arial', sans-serif"` | body line font
| `bodyFontSize` | `Number` | `12` | Body font size
| `bodyFontStyle` | `String` | `'normal'` | Body font style
| `bodyFontColor` | Color | `'#fff'` | Body font color
| `bodyFontColor` | `Color` | `'#fff'` | Body font color
| `bodySpacing` | `Number` | `2` | Spacing to add to top and bottom of each tooltip item.
| `footerFontFamily` | `String` | `"'Helvetica Neue', 'Helvetica', 'Arial', sans-serif"` | footer font
| `footerFontSize` | `Number` | `12` | Footer font size
| `footerFontStyle` | `String` | `'bold'` | Footer font style
| `footerFontColor` | Color | `'#fff'` | Footer font color
| `footerFontColor` | `Color` | `'#fff'` | Footer font color
| `footerSpacing` | `Number` | `2` | Spacing to add to top and bottom of each fotter line.
| `footerMarginTop` | `Number` | `6` | Margin to add before drawing the footer.
| `xPadding` | `Number` | `6` | Padding to add on left and right of tooltip.
| `yPadding` | `Number` | `6` | Padding to add on top and bottom of tooltip.
| `caretPadding` | `Number` | `2` | Extra distance to move the end of the tooltip arrow away from the tooltip point.
| `caretSize` | `Number` | `5` | Size, in px, of the tooltip arrow.
| `cornerRadius` | `Number` | `6` | Radius of tooltip corner curves.
| `multiKeyBackground` | Color | `'#fff'` | Color to draw behind the colored boxes when multiple items are in the tooltip
| `multiKeyBackground` | `Color` | `'#fff'` | Color to draw behind the colored boxes when multiple items are in the tooltip
| `displayColors` | `Boolean` | `true` | if true, color boxes are shown in the tooltip
| `borderColor` | Color | `'rgba(0,0,0,0)'` | Color of the border
| `borderColor` | `Color` | `'rgba(0,0,0,0)'` | Color of the border
| `borderWidth` | `Number` | `0` | Size of the border

### Position Modes
Expand All @@ -51,6 +51,28 @@ The tooltip configuration is passed into the `options.tooltips` namespace. The g

New modes can be defined by adding functions to the Chart.Tooltip.positioners map.

Example:
```javascript
/**
* Custom positioner
* @function Chart.Tooltip.positioners.custom
* @param elements {Chart.Element[]} the tooltip elements
* @param eventPosition {Point} the position of the event in canvas coordinates
* @returns {Point} the tooltip position
*/
Chart.Tooltip.positioners.custom = function(elements, eventPosition) {
/** @type {Chart.Tooltip} */
var tooltip = this;

/* ... */

return {
x: 0,
y: 0
};
}
```

### Sort Callback

Allows sorting of [tooltip items](#tooltip-item-interface). Must implement at minimum a function that can be passed to [Array.prototype.sort](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort). This function can also accept a third parameter that is the data object passed to the chart.
Expand Down Expand Up @@ -243,7 +265,7 @@ The tooltip model contains parameters that can be used to render the tooltip.

// Body
// The body lines that need to be rendered
// Each pbject contains 3 parameters
// Each object contains 3 parameters
// before: String[] // lines of text before the line with the color square
// lines: String[], // lines of text to render as the main item with color square
// after: String[], // lines of text to render after the main lines
Expand Down
7 changes: 6 additions & 1 deletion docs/developers/README.md
Expand Up @@ -22,7 +22,12 @@ Latest builds are available for testing at:

# Browser support

Chart.js offers support for all browsers where canvas is supported.
Chart.js offers support for the following browsers:
* Chrome 50+
* Firefox 45+
* Internet Explorer 11
* Edge 14+
* Safari 9+

Browser support for the canvas element is available in all modern & major mobile browsers. [CanIUse](http://caniuse.com/#feat=canvas)

Expand Down
15 changes: 13 additions & 2 deletions docs/getting-started/installation.md
Expand Up @@ -3,6 +3,7 @@ Chart.js can be installed via npm or bower. It is recommended to get Chart.js th

## npm
[![npm](https://img.shields.io/npm/v/chart.js.svg?style=flat-square&maxAge=600)](https://npmjs.com/package/chart.js)
[![npm](https://img.shields.io/npm/dm/chart.js.svg?style=flat-square&maxAge=600)](https://npmjs.com/package/chart.js)

```bash
npm install chart.js --save
Expand All @@ -16,9 +17,19 @@ bower install chart.js --save
```

## CDN
[![cdn](https://img.shields.io/cdnjs/v/Chart.js.svg?label=cdn&style=flat-square&maxAge=600)](https://cdnjs.com/libraries/Chart.js)
### CDNJS
[![cdnjs](https://img.shields.io/cdnjs/v/Chart.js.svg?style=flat-square&maxAge=600)](https://cdnjs.com/libraries/Chart.js)

or just use these [Chart.js CDN](https://cdnjs.com/libraries/Chart.js) links.
Chart.js built files are available on [CDNJS](https://cdnjs.com/):

https://cdnjs.com/libraries/Chart.js

### jsDelivr
[![jsdelivr](https://img.shields.io/npm/v/chart.js.svg?label=jsdelivr&style=flat-square&maxAge=600)](https://cdn.jsdelivr.net/npm/chart.js@latest/dist/) [![jsdelivr hits](https://data.jsdelivr.com/v1/package/npm/chart.js/badge)](https://www.jsdelivr.com/package/npm/chart.js)

Chart.js built files are also available through [jsDelivr](http://www.jsdelivr.com/):

https://www.jsdelivr.com/package/npm/chart.js?path=dist

## Github
[![github](https://img.shields.io/github/release/chartjs/Chart.js.svg?style=flat-square&maxAge=600)](https://github.com/chartjs/Chart.js/releases/latest)
Expand Down
8 changes: 7 additions & 1 deletion karma.conf.js
Expand Up @@ -14,7 +14,13 @@ module.exports = function(karma) {

browserify: {
debug: true
}
},

// 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
Expand Down
2 changes: 1 addition & 1 deletion package.json
Expand Up @@ -2,7 +2,7 @@
"name": "chart.js",
"homepage": "http://www.chartjs.org",
"description": "Simple HTML5 charts using the canvas element.",
"version": "2.7.0",
"version": "2.7.1",
"license": "MIT",
"main": "src/chart.js",
"repository": {
Expand Down