From: Jukka Kurkela Date: Thu, 18 Jun 2020 21:35:52 +0000 (+0300) Subject: Replace horizontalBar with indexAxis: 'y' (#7514) X-Git-Tag: v3.0.0-beta.2~82 X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=59a1af91ac599e7831f5ac68cdc110a28ed1c881;p=thirdparty%2FChart.js.git Replace horizontalBar with indexAxis: 'y' (#7514) * Replace horizontalBar with indexAxis: 'y' * Fix drawing of line for last x-position * Consistently determine axis of scale * Add test --- diff --git a/docs/docs/charts/bar.mdx b/docs/docs/charts/bar.mdx index f7819eadf..9a7a67925 100644 --- a/docs/docs/charts/bar.mdx +++ b/docs/docs/charts/bar.mdx @@ -80,13 +80,14 @@ the color of the bars is generally set this way. | ---- | ---- | :----: | :----: | ---- | [`backgroundColor`](#styling) | [`Color`](../general/colors.md) | Yes | Yes | `'rgba(0, 0, 0, 0.1)'` | [`borderColor`](#styling) | [`Color`](../general/colors.md) | Yes | Yes | `'rgba(0, 0, 0, 0.1)'` -| [`borderSkipped`](#borderskipped) | `string` | Yes | Yes | `'bottom'` +| [`borderSkipped`](#borderskipped) | `string` | Yes | Yes | `'start'` | [`borderWidth`](#borderwidth) | number|object | Yes | Yes | `0` | [`clip`](#general) | number|object | - | - | `undefined` | [`data`](#data-structure) | `object[]` | - | - | **required** | [`hoverBackgroundColor`](#interactions) | [`Color`](../general/colors.md) | - | Yes | `undefined` | [`hoverBorderColor`](#interactions) | [`Color`](../general/colors.md) | - | Yes | `undefined` | [`hoverBorderWidth`](#interactions) | `number` | - | Yes | `1` +| [`indexAxis`](#general) | `string` | `'x'` | The base axis for the dataset. Use `'y'` for horizontal bar. | [`label`](#general) | `string` | - | - | `''` | [`order`](#general) | `number` | - | - | `0` | [`xAxisID`](#general) | `string` | - | - | first x axis @@ -97,6 +98,7 @@ the color of the bars is generally set this way. | Name | Description | ---- | ---- | `clip` | How to clip relative to chartArea. Positive value allows overflow, negative value clips that many pixels inside chartArea. `0` = clip at chartArea. Clipping can also be configured per side: `clip: {left: 5, top: false, right: -2, bottom: 0}` +| `indexAxis` | The base axis of the dataset. `'x'` for vertical bars and `'y'` for horizontal bars. | `label` | The label for the dataset which appears in the legend and tooltips. | `order` | The drawing order of dataset. Also affects order for stacking, tooltip and legend. | `xAxisID` | The ID of the x axis to plot this dataset on. @@ -126,6 +128,8 @@ that derive from a bar chart. Options are: +* `'start'` +* `'end'` * `'bottom'` * `'left'` * `'top'` @@ -275,10 +279,11 @@ A horizontal bar chart is a variation on a vertical bar chart. It is sometimes u export const ExampleChart1 = () => { useEffect(() => { const cfg = { - type: 'horizontalBar', + type: 'bar', data: { labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'], datasets: [{ + axis: 'y', label: 'My First Dataset', data: [65, 59, 80, 81, 56, 55, 40], fill: false, @@ -322,7 +327,7 @@ export const ExampleChart1 = () => { ```javascript var myBarChart = new Chart(ctx, { - type: 'horizontalBar', + type: 'bar', data: data, options: options }); @@ -332,8 +337,6 @@ var myBarChart = new Chart(ctx, { 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. -The default horizontal bar configuration is specified in `Chart.defaults.horizontalBar`. - ## Internal data format `{x, y, _custom}` where `_custom` is optional object defining stacked bar properties: `{start, end, barStart, barEnd, min, max}`. `start` and `end` are the input values. Those two are repeated in `barStart` (closer to origin), `barEnd` (further from origin), `min` and `max`. diff --git a/docs/docs/configuration/elements.md b/docs/docs/configuration/elements.md index d07213813..aae54c8ed 100644 --- a/docs/docs/configuration/elements.md +++ b/docs/docs/configuration/elements.md @@ -79,7 +79,7 @@ Global rectangle options: `Chart.defaults.elements.rectangle`. | `backgroundColor` | `Color` | `Chart.defaults.color` | Bar fill color. | `borderWidth` | `number` | `0` | Bar stroke width. | `borderColor` | `Color` | `Chart.defaults.color` | Bar stroke color. -| `borderSkipped` | `string` | `'bottom'` | Skipped (excluded) border: `'bottom'`, `'left'`, `'top'` or `'right'`. +| `borderSkipped` | `string` | `'start'` | Skipped (excluded) border: `'start'`, `'end'`, `'bottom'`, `'left'`, `'top'` or `'right'`. ## Arc Configuration diff --git a/docs/docs/developers/charts.md b/docs/docs/developers/charts.md index 6149b6af5..f68bebe47 100644 --- a/docs/docs/developers/charts.md +++ b/docs/docs/developers/charts.md @@ -71,7 +71,6 @@ The built in controller types are: * `Chart.controllers.line` * `Chart.controllers.bar` -* `Chart.controllers.horizontalBar` * `Chart.controllers.radar` * `Chart.controllers.doughnut` * `Chart.controllers.polarArea` diff --git a/docs/docs/general/interactions/modes.md b/docs/docs/general/interactions/modes.md index 2ed9a64d5..636dc5001 100644 --- a/docs/docs/general/interactions/modes.md +++ b/docs/docs/general/interactions/modes.md @@ -7,6 +7,7 @@ When configuring interaction with the graph via hover or tooltips, a number of d The modes are detailed below and how they behave in conjunction with the `intersect` setting. ## point + Finds all of the items that intersect the point. ```javascript @@ -22,6 +23,7 @@ var chart = new Chart(ctx, { ``` ## nearest + Gets the items that are at the nearest distance to the point. The nearest item is determined based on the distance to the center of the chart item (point, bar). You can use the `axis` setting to define which directions are used in distance calculation. If `intersect` is true, this is only triggered when the mouse position intersects an item in the graph. This is very useful for combo charts where points are hidden behind bars. ```javascript @@ -37,6 +39,7 @@ var chart = new Chart(ctx, { ``` ## index + Finds item at the same index. If the `intersect` setting is true, the first intersecting item is used to determine the index in the data. If `intersect` false the nearest item, in the x direction, is used to determine the index. ```javascript @@ -55,7 +58,7 @@ To use index mode in a chart like the horizontal bar chart, where we search alon ```javascript var chart = new Chart(ctx, { - type: 'horizontalBar', + type: 'bar', data: data, options: { tooltips: { diff --git a/docs/docs/getting-started/v3-migration.md b/docs/docs/getting-started/v3-migration.md index 81548f4fe..b5190a50e 100644 --- a/docs/docs/getting-started/v3-migration.md +++ b/docs/docs/getting-started/v3-migration.md @@ -21,6 +21,10 @@ Chart.js 3.0 introduces a number of breaking changes. Chart.js 2.0 was released * Chart.js is no longer providing the `Chart.bundle.js` and `Chart.bundle.min.js`. Please see the [installation](installation.md) and [integration](integration.md) docs for details on the recommended way to setup Chart.js if you were using these builds. * `moment` is no longer specified as an npm dependency. If you are using the time scale, you must include one of [the available adapters](https://github.com/chartjs/awesome#adapters) and corresponding date library. You no longer need to exclude moment from your build. +### Chart types + +* `horizontalBar` chart type was removed. Horizontal bar charts can be configured using the new [`indexAxis`](../charts/bar.md#general) option + ### Options A number of changes were made to the configuration options passed to the `Chart` constructor. Those changes are documented below. @@ -304,6 +308,10 @@ The following properties and methods were removed: The following private APIs were removed. * `Chart.data.datasets[datasetIndex]._meta` +* `DatasetController._getIndexScaleId` +* `DatasetController._getIndexScale` +* `DatasetController._getValueScaleId` +* `DatasetController._getValueScale` * `Element._ctx` * `Element._model` * `Element._view` diff --git a/samples/charts/bar/horizontal.html b/samples/charts/bar/horizontal.html index 3b6d6cbde..a6a561fbe 100644 --- a/samples/charts/bar/horizontal.html +++ b/samples/charts/bar/horizontal.html @@ -62,9 +62,10 @@ window.onload = function() { var ctx = document.getElementById('canvas').getContext('2d'); window.myHorizontalBar = new Chart(ctx, { - type: 'horizontalBar', + type: 'bar', data: horizontalBarChartData, options: { + indexAxis: 'y', // Elements options apply to all of the options unless overridden in a dataset // In this case, we are setting the border of each horizontal bar to be 2px wide elements: { diff --git a/src/controllers/controller.bar.js b/src/controllers/controller.bar.js index d7acc836b..e39d748a7 100644 --- a/src/controllers/controller.bar.js +++ b/src/controllers/controller.bar.js @@ -22,14 +22,14 @@ defaults.set('bar', { }, scales: { - x: { + _index_: { type: 'category', offset: true, gridLines: { offsetGridLines: true } }, - y: { + _value_: { type: 'linear', beginAtZero: true, } diff --git a/src/controllers/controller.horizontalBar.js b/src/controllers/controller.horizontalBar.js deleted file mode 100644 index 054d5192b..000000000 --- a/src/controllers/controller.horizontalBar.js +++ /dev/null @@ -1,55 +0,0 @@ -import BarController from './controller.bar'; -import defaults from '../core/core.defaults'; - -defaults.set('horizontalBar', { - hover: { - mode: 'index', - axis: 'y' - }, - - scales: { - x: { - type: 'linear', - beginAtZero: true - }, - y: { - type: 'category', - offset: true, - gridLines: { - offsetGridLines: true - } - } - }, - - datasets: { - categoryPercentage: 0.8, - barPercentage: 0.9 - }, - - elements: { - rectangle: { - borderSkipped: 'left' - } - }, - - tooltips: { - axis: 'y' - } -}); - -export default class HorizontalBarController extends BarController { - - /** - * @protected - */ - getValueScaleId() { - return this._cachedMeta.xAxisID; - } - - /** - * @protected - */ - getIndexScaleId() { - return this._cachedMeta.yAxisID; - } -} diff --git a/src/controllers/controller.line.js b/src/controllers/controller.line.js index 5af4eb67c..5f338d8e4 100644 --- a/src/controllers/controller.line.js +++ b/src/controllers/controller.line.js @@ -14,10 +14,10 @@ defaults.set('line', { }, scales: { - x: { + _index_: { type: 'category', }, - y: { + _value_: { type: 'linear', }, } diff --git a/src/controllers/controller.polarArea.js b/src/controllers/controller.polarArea.js index 3f615dae4..2a2cda994 100644 --- a/src/controllers/controller.polarArea.js +++ b/src/controllers/controller.polarArea.js @@ -14,6 +14,9 @@ defaults.set('polarArea', { animateScale: true }, aspectRatio: 1, + datasets: { + indexAxis: 'r' + }, scales: { r: { type: 'radialLinear', @@ -90,20 +93,6 @@ export default class PolarAreaController extends DatasetController { this.outerRadius = undefined; } - /** - * @protected - */ - getIndexScaleId() { - return this._cachedMeta.rAxisID; - } - - /** - * @protected - */ - getValueScaleId() { - return this._cachedMeta.rAxisID; - } - update(mode) { const arcs = this._cachedMeta.data; @@ -136,7 +125,7 @@ export default class PolarAreaController extends DatasetController { const dataset = me.getDataset(); const opts = chart.options; const animationOpts = opts.animation; - const scale = chart.scales.r; + const scale = me._cachedMeta.rScale; const centerX = scale.xCenter; const centerY = scale.yCenter; const datasetStartAngle = getStartAngleRadians(opts.startAngle); diff --git a/src/controllers/controller.radar.js b/src/controllers/controller.radar.js index b596f725a..792fafa67 100644 --- a/src/controllers/controller.radar.js +++ b/src/controllers/controller.radar.js @@ -11,6 +11,9 @@ defaults.set('radar', { type: 'radialLinear', } }, + datasets: { + indexAxis: 'r' + }, elements: { line: { fill: 'start', @@ -21,20 +24,6 @@ defaults.set('radar', { export default class RadarController extends DatasetController { - /** - * @protected - */ - getIndexScaleId() { - return this._cachedMeta.rAxisID; - } - - /** - * @protected - */ - getValueScaleId() { - return this._cachedMeta.rAxisID; - } - /** * @protected */ @@ -73,7 +62,7 @@ export default class RadarController extends DatasetController { updateElements(points, start, mode) { const me = this; const dataset = me.getDataset(); - const scale = me.chart.scales.r; + const scale = me._cachedMeta.rScale; const reset = mode === 'reset'; let i; diff --git a/src/controllers/index.js b/src/controllers/index.js index 8977bd2f7..b853df696 100644 --- a/src/controllers/index.js +++ b/src/controllers/index.js @@ -1,7 +1,6 @@ export {default as bar} from './controller.bar'; export {default as bubble} from './controller.bubble'; export {default as doughnut} from './controller.doughnut'; -export {default as horizontalBar} from './controller.horizontalBar'; export {default as line} from './controller.line'; export {default as polarArea} from './controller.polarArea'; export {default as pie} from './controller.pie'; diff --git a/src/core/core.controller.js b/src/core/core.controller.js index 118403b6e..f35ae23f2 100644 --- a/src/core/core.controller.js +++ b/src/core/core.controller.js @@ -18,38 +18,62 @@ import {version} from '../../package.json'; */ +function getIndexAxis(type, options) { + const typeDefaults = defaults[type] || {}; + const datasetDefaults = typeDefaults.datasets || {}; + const typeOptions = options[type] || {}; + const datasetOptions = typeOptions.datasets || {}; + return datasetOptions.indexAxis || options.indexAxis || datasetDefaults.indexAxis || 'x'; +} + +function getAxisFromDefaultScaleID(id, indexAxis) { + let axis = id; + if (id === '_index_') { + axis = indexAxis; + } else if (id === '_value_') { + axis = indexAxis === 'x' ? 'y' : 'x'; + } + return axis; +} + +function getDefaultScaleIDFromAxis(axis, indexAxis) { + return axis === indexAxis ? '_index_' : '_value_'; +} + function mergeScaleConfig(config, options) { options = options || {}; const chartDefaults = defaults[config.type] || {scales: {}}; const configScales = options.scales || {}; + const chartIndexAxis = getIndexAxis(config.type, options); const firstIDs = {}; const scales = {}; // First figure out first scale id's per axis. - // Note: for now, axis is determined from first letter of scale id! Object.keys(configScales).forEach(id => { - const axis = id[0]; + const scaleConf = configScales[id]; + const axis = determineAxis(id, scaleConf); + const defaultId = getDefaultScaleIDFromAxis(axis, chartIndexAxis); firstIDs[axis] = firstIDs[axis] || id; - scales[id] = mergeIf({}, [configScales[id], chartDefaults.scales[axis]]); + scales[id] = mergeIf({axis}, [scaleConf, chartDefaults.scales[axis], chartDefaults.scales[defaultId]]); }); // Backward compatibility if (options.scale) { - scales[options.scale.id || 'r'] = mergeIf({}, [options.scale, chartDefaults.scales.r]); + scales[options.scale.id || 'r'] = mergeIf({axis: 'r'}, [options.scale, chartDefaults.scales.r]); firstIDs.r = firstIDs.r || options.scale.id || 'r'; } // Then merge dataset defaults to scale configs config.data.datasets.forEach(dataset => { - const datasetDefaults = defaults[dataset.type || config.type] || {scales: {}}; + const type = dataset.type || config.type; + const indexAxis = dataset.indexAxis || getIndexAxis(type, options); + const datasetDefaults = defaults[type] || {}; const defaultScaleOptions = datasetDefaults.scales || {}; Object.keys(defaultScaleOptions).forEach(defaultID => { - const id = dataset[defaultID + 'AxisID'] || firstIDs[defaultID] || defaultID; + const axis = getAxisFromDefaultScaleID(defaultID, indexAxis); + const id = dataset[axis + 'AxisID'] || firstIDs[axis] || axis; scales[id] = scales[id] || {}; - mergeIf(scales[id], [ - configScales[id], - defaultScaleOptions[defaultID] - ]); + mergeIf(scales[id], [{axis}, configScales[id], defaultScaleOptions[defaultID]]); }); }); @@ -127,6 +151,22 @@ function positionIsHorizontal(position, axis) { return position === 'top' || position === 'bottom' || (KNOWN_POSITIONS.indexOf(position) === -1 && axis === 'x'); } +function axisFromPosition(position) { + if (position === 'top' || position === 'bottom') { + return 'x'; + } + if (position === 'left' || position === 'right') { + return 'y'; + } +} + +function determineAxis(id, scaleOptions) { + if (id === 'x' || id === 'y' || id === 'r') { + return id; + } + return scaleOptions.axis || axisFromPosition(scaleOptions.position) || id.charAt(0).toLowerCase(); +} + function compare2Level(l1, l2) { return function(a, b) { return a[l1] === b[l1] @@ -373,12 +413,13 @@ class Chart { if (scaleOpts) { items = items.concat( - Object.keys(scaleOpts).map((axisID) => { - const axisOptions = scaleOpts[axisID]; - const isRadial = axisID.charAt(0).toLowerCase() === 'r'; - const isHorizontal = axisID.charAt(0).toLowerCase() === 'x'; + Object.keys(scaleOpts).map((id) => { + const scaleOptions = scaleOpts[id]; + const axis = determineAxis(id, scaleOptions); + const isRadial = axis === 'r'; + const isHorizontal = axis === 'x'; return { - options: axisOptions, + options: scaleOptions, dposition: isRadial ? 'chartArea' : isHorizontal ? 'bottom' : 'left', dtype: isRadial ? 'radialLinear' : isHorizontal ? 'category' : 'linear' }; @@ -389,9 +430,10 @@ class Chart { each(items, (item) => { const scaleOptions = item.options; const id = scaleOptions.id; + const axis = determineAxis(id, scaleOptions); const scaleType = valueOrDefault(scaleOptions.type, item.dtype); - if (scaleOptions.position === undefined || positionIsHorizontal(scaleOptions.position, scaleOptions.axis || id[0]) !== positionIsHorizontal(item.dposition)) { + if (scaleOptions.position === undefined || positionIsHorizontal(scaleOptions.position, axis) !== positionIsHorizontal(item.dposition)) { scaleOptions.position = item.dposition; } @@ -485,6 +527,7 @@ class Chart { meta = me.getDatasetMeta(i); } meta.type = type; + meta.indexAxis = dataset.indexAxis || getIndexAxis(type, me.options); meta.order = dataset.order || 0; me._updateMetasetIndex(meta, i); meta.label = '' + dataset.label; diff --git a/src/core/core.datasetController.js b/src/core/core.datasetController.js index 5375e4c50..76df52bc5 100644 --- a/src/core/core.datasetController.js +++ b/src/core/core.datasetController.js @@ -188,14 +188,19 @@ export default class DatasetController { const meta = me._cachedMeta; const dataset = me.getDataset(); - const xid = meta.xAxisID = dataset.xAxisID || getFirstScaleId(chart, 'x'); - const yid = meta.yAxisID = dataset.yAxisID || getFirstScaleId(chart, 'y'); - const rid = meta.rAxisID = dataset.rAxisID || getFirstScaleId(chart, 'r'); + const chooseId = (axis, x, y, r) => axis === 'x' ? x : axis === 'r' ? r : y; + + const xid = meta.xAxisID = valueOrDefault(dataset.xAxisID, getFirstScaleId(chart, 'x')); + const yid = meta.yAxisID = valueOrDefault(dataset.yAxisID, getFirstScaleId(chart, 'y')); + const rid = meta.rAxisID = valueOrDefault(dataset.rAxisID, getFirstScaleId(chart, 'r')); + const indexAxis = meta.indexAxis; + const iid = meta.iAxisID = chooseId(indexAxis, xid, yid, rid); + const vid = meta.vAxisID = chooseId(indexAxis, yid, xid, rid); meta.xScale = me.getScaleForId(xid); meta.yScale = me.getScaleForId(yid); meta.rScale = me.getScaleForId(rid); - meta.iScale = me._getIndexScale(); - meta.vScale = me._getValueScale(); + meta.iScale = me.getScaleForId(iid); + meta.vScale = me.getScaleForId(vid); } getDataset() { @@ -214,34 +219,6 @@ export default class DatasetController { return this.chart.scales[scaleID]; } - /** - * @protected - */ - getValueScaleId() { - return this._cachedMeta.yAxisID; - } - - /** - * @protected - */ - getIndexScaleId() { - return this._cachedMeta.xAxisID; - } - - /** - * @private - */ - _getValueScale() { - return this.getScaleForId(this.getValueScaleId()); - } - - /** - * @private - */ - _getIndexScale() { - return this.getScaleForId(this.getIndexScaleId()); - } - /** * @private */ diff --git a/src/elements/element.line.js b/src/elements/element.line.js index c29cb5519..db1cae385 100644 --- a/src/elements/element.line.js +++ b/src/elements/element.line.js @@ -118,13 +118,25 @@ function fastPathSegment(ctx, line, segment, params) { let countX = 0; let i, point, prevX, minY, maxY, lastY; + const pointIndex = (index) => (start + (reverse ? ilen - index : index)) % count; + const drawX = () => { + if (minY !== maxY) { + // Draw line to maxY and minY, using the average x-coordinate + ctx.lineTo(avgX, maxY); + ctx.lineTo(avgX, minY); + // Line to y-value of last point in group. So the line continues + // from correct position. Not using move, to have solid path. + ctx.lineTo(avgX, lastY); + } + }; + if (move) { - point = points[(start + (reverse ? ilen : 0)) % count]; + point = points[pointIndex(0)]; ctx.moveTo(point.x, point.y); } for (i = 0; i <= ilen; ++i) { - point = points[(start + (reverse ? ilen - i : i)) % count]; + point = points[pointIndex(i)]; if (point.skip) { // If there is a skipped point inside a segment, spanGaps must be true @@ -145,14 +157,7 @@ function fastPathSegment(ctx, line, segment, params) { // For first point in group, countX is `0`, so average will be `x` / 1. avgX = (countX * avgX + x) / ++countX; } else { - if (minY !== maxY) { - // Draw line to maxY and minY, using the average x-coordinate - ctx.lineTo(avgX, maxY); - ctx.lineTo(avgX, minY); - // Line to y-value of last point in group. So the line continues - // from correct position. Not using move, to have solid path. - ctx.lineTo(avgX, lastY); - } + drawX(); // Draw line to next x-position, using the first (or only) // y-value in that group ctx.lineTo(x, y); @@ -164,6 +169,7 @@ function fastPathSegment(ctx, line, segment, params) { // Keep track of the last y-value in group lastY = y; } + drawX(); } /** diff --git a/src/elements/element.rectangle.js b/src/elements/element.rectangle.js index 94d338ea0..8dfa2833d 100644 --- a/src/elements/element.rectangle.js +++ b/src/elements/element.rectangle.js @@ -4,7 +4,7 @@ import {isObject} from '../helpers/helpers.core'; const scope = 'elements.rectangle'; defaults.set(scope, { - borderSkipped: 'bottom', + borderSkipped: 'start', borderWidth: 0 }); @@ -39,10 +39,6 @@ function getBarBounds(bar, useFinalPosition) { return {left, top, right, bottom}; } -function swap(orig, v1, v2) { - return orig === v1 ? v2 : orig === v2 ? v1 : orig; -} - function parseBorderSkipped(bar) { let edge = bar.options.borderSkipped; const res = {}; @@ -51,18 +47,32 @@ function parseBorderSkipped(bar) { return res; } - if (bar.horizontal) { - if (bar.base > bar.x) { - edge = swap(edge, 'left', 'right'); - } - } else if (bar.base < bar.y) { - edge = swap(edge, 'bottom', 'top'); - } + edge = bar.horizontal + ? parseEdge(edge, 'left', 'right', bar.base > bar.x) + : parseEdge(edge, 'bottom', 'top', bar.base < bar.y); res[edge] = true; return res; } +function parseEdge(edge, a, b, reverse) { + if (reverse) { + edge = swap(edge, a, b); + edge = startEnd(edge, b, a); + } else { + edge = startEnd(edge, a, b); + } + return edge; +} + +function swap(orig, v1, v2) { + return orig === v1 ? v2 : orig === v2 ? v1 : orig; +} + +function startEnd(v, start, end) { + return v === 'start' ? start : v === 'end' ? end : v; +} + function skipOrLimit(skip, value, min, max) { return skip ? 0 : Math.max(Math.min(value, max), min); } diff --git a/test/fixtures/controller.bar/floatBar/data-as-objects-horizontal.js b/test/fixtures/controller.bar/floatBar/data-as-objects-horizontal.js index d0e5b18b4..0a258ab96 100644 --- a/test/fixtures/controller.bar/floatBar/data-as-objects-horizontal.js +++ b/test/fixtures/controller.bar/floatBar/data-as-objects-horizontal.js @@ -1,6 +1,6 @@ module.exports = { config: { - type: 'horizontalBar', + type: 'bar', data: { labels: ['a', 'b', 'c'], datasets: [ @@ -17,6 +17,7 @@ module.exports = { options: { legend: false, title: false, + indexAxis: 'y', scales: { x: {display: false, min: 0}, y: {display: false, stacked: true} diff --git a/test/fixtures/controller.bar/floatBar/float-bar-horizontal.json b/test/fixtures/controller.bar/floatBar/float-bar-horizontal.json index a19659666..e2e35e1d2 100644 --- a/test/fixtures/controller.bar/floatBar/float-bar-horizontal.json +++ b/test/fixtures/controller.bar/floatBar/float-bar-horizontal.json @@ -1,6 +1,6 @@ { "config": { - "type": "horizontalBar", + "type": "bar", "data": { "labels": ["2030", "2034", "2038", "2042"], "datasets": [{ @@ -17,6 +17,7 @@ "options": { "title": false, "legend": false, + "indexAxis": "y", "scales": { "x": { "display": false, diff --git a/test/fixtures/controller.bar/floatBar/float-bar-stacked-horizontal.json b/test/fixtures/controller.bar/floatBar/float-bar-stacked-horizontal.json index 5ca15a95a..bbf8cb228 100644 --- a/test/fixtures/controller.bar/floatBar/float-bar-stacked-horizontal.json +++ b/test/fixtures/controller.bar/floatBar/float-bar-stacked-horizontal.json @@ -1,6 +1,6 @@ { "config": { - "type": "horizontalBar", + "type": "bar", "data": { "labels": ["2030", "2034", "2038", "2042"], "datasets": [{ @@ -17,6 +17,7 @@ "options": { "title": false, "legend": false, + "indexAxis": "y", "scales": { "x": { "display": false, diff --git a/test/fixtures/controller.bar/horizontal-borders.js b/test/fixtures/controller.bar/horizontal-borders.js index 66085c700..b1e9b0d7a 100644 --- a/test/fixtures/controller.bar/horizontal-borders.js +++ b/test/fixtures/controller.bar/horizontal-borders.js @@ -1,7 +1,7 @@ module.exports = { threshold: 0.01, config: { - type: 'horizontalBar', + type: 'bar', data: { labels: [0, 1, 2, 3, 4, 5], datasets: [ @@ -13,13 +13,14 @@ module.exports = { { // option in element (fallback) data: [0, 5, 10, null, -10, -5], - borderSkipped: false, + borderSkipped: false } ] }, options: { legend: false, title: false, + indexAxis: 'y', elements: { rectangle: { backgroundColor: '#AAAAAA80', diff --git a/test/fixtures/core.scale/label-offset-vertical-axes.json b/test/fixtures/core.scale/label-offset-vertical-axes.json index 5231c6a9f..0cf9164df 100644 --- a/test/fixtures/core.scale/label-offset-vertical-axes.json +++ b/test/fixtures/core.scale/label-offset-vertical-axes.json @@ -1,6 +1,6 @@ { "config": { - "type": "horizontalBar", + "type": "bar", "data": { "labels": ["\u25C0", "\u25A0", "\u25C6", "\u25CF"], "datasets": [{ @@ -10,6 +10,7 @@ "options": { "legend": false, "title": false, + "indexAxis": "y", "scales": { "x": { "ticks": { diff --git a/test/fixtures/core.scale/tick-drawing.json b/test/fixtures/core.scale/tick-drawing.json index b7f55b1fd..c961e659c 100644 --- a/test/fixtures/core.scale/tick-drawing.json +++ b/test/fixtures/core.scale/tick-drawing.json @@ -1,6 +1,6 @@ { "config": { - "type": "horizontalBar", + "type": "bar", "data": { "labels": ["January", "February", "March", "April", "May", "June", "July"], "datasets": [] @@ -8,6 +8,7 @@ "options": { "legend": false, "title": false, + "indexAxis": "y", "scales": { "x": { "type": "category", diff --git a/test/fixtures/mixed/bar+line.js b/test/fixtures/mixed/bar+line.js new file mode 100644 index 000000000..f66fd2662 --- /dev/null +++ b/test/fixtures/mixed/bar+line.js @@ -0,0 +1,41 @@ +module.exports = { + config: { + data: { + datasets: [ + { + type: 'line', + data: [6, 16, 3, 19], + borderColor: '#0000ff', + fill: false + }, + { + type: 'bar', + data: [5, 20, 1, 10], + backgroundColor: '#00ff00', + borderColor: '#ff0000' + } + ] + }, + options: { + indexAxis: 'y', + legend: false, + title: false, + scales: { + horz: { + position: 'top' + }, + vert: { + axis: 'y', + labels: ['a', 'b', 'c', 'd'] + } + } + } + }, + options: { + spriteText: true, + canvas: { + height: 256, + width: 512 + } + } +}; diff --git a/test/fixtures/mixed/bar+line.png b/test/fixtures/mixed/bar+line.png new file mode 100644 index 000000000..e366a8aa0 Binary files /dev/null and b/test/fixtures/mixed/bar+line.png differ diff --git a/test/fixtures/scale.category/ticks-from-data.js b/test/fixtures/scale.category/ticks-from-data.js index a7f067962..ef63f5a43 100644 --- a/test/fixtures/scale.category/ticks-from-data.js +++ b/test/fixtures/scale.category/ticks-from-data.js @@ -1,7 +1,7 @@ module.exports = { threshold: 0.01, config: { - type: 'horizontalBar', + type: 'bar', data: { datasets: [{ data: [10, 5, 0, 25, 78] @@ -9,6 +9,7 @@ module.exports = { labels: ['tick1', 'tick2', 'tick3', 'tick4', 'tick5'] }, options: { + indexAxis: 'y', legend: false, title: false, elements: { diff --git a/test/specs/controller.bar.tests.js b/test/specs/controller.bar.tests.js index c1a8f9bb8..f287071ac 100644 --- a/test/specs/controller.bar.tests.js +++ b/test/specs/controller.bar.tests.js @@ -3,7 +3,6 @@ describe('Chart.controllers.bar', function() { it('should be registered as dataset controller', function() { expect(typeof Chart.controllers.bar).toBe('function'); - expect(typeof Chart.controllers.horizontalBar).toBe('function'); }); it('should be constructed', function() { @@ -49,611 +48,511 @@ describe('Chart.controllers.bar', function() { }); it('should correctly count the number of stacks ignoring datasets of other types and hidden datasets', function() { - [ - 'bar', - 'horizontalBar' - ].forEach(function(barType) { - var chart = window.acquireChart({ - type: barType, - data: { - datasets: [ - {data: [], type: 'line'}, - {data: [], hidden: true}, - {data: []}, - {data: []} - ], - labels: [] - } - }); - - var meta = chart.getDatasetMeta(1); - expect(meta.controller._getStackCount()).toBe(2); + var chart = window.acquireChart({ + type: 'bar', + data: { + datasets: [ + {data: [], type: 'line'}, + {data: [], hidden: true}, + {data: []}, + {data: []} + ], + labels: [] + } }); + + var meta = chart.getDatasetMeta(1); + expect(meta.controller._getStackCount()).toBe(2); }); it('should correctly count the number of stacks when a group is not specified', function() { - [ - 'bar', - 'horizontalBar' - ].forEach(function(barType) { - var chart = window.acquireChart({ - type: barType, - data: { - datasets: [ - {data: []}, - {data: []}, - {data: []}, - {data: []} - ], - labels: [] - } - }); - - var meta = chart.getDatasetMeta(1); - expect(meta.controller._getStackCount()).toBe(4); + var chart = window.acquireChart({ + type: 'bar', + data: { + datasets: [ + {data: []}, + {data: []}, + {data: []}, + {data: []} + ], + labels: [] + } }); + + var meta = chart.getDatasetMeta(1); + expect(meta.controller._getStackCount()).toBe(4); }); it('should correctly count the number of stacks when a group is not specified and the scale is stacked', function() { - [ - 'bar', - 'horizontalBar' - ].forEach(function(barType) { - var chart = window.acquireChart({ - type: barType, - data: { - datasets: [ - {data: []}, - {data: []}, - {data: []}, - {data: []} - ], - labels: [] - }, - options: { - scales: { - x: { - stacked: true - }, - y: { - stacked: true - } + var chart = window.acquireChart({ + type: 'bar', + data: { + datasets: [ + {data: []}, + {data: []}, + {data: []}, + {data: []} + ], + labels: [] + }, + options: { + scales: { + x: { + stacked: true + }, + y: { + stacked: true } } - }); - - var meta = chart.getDatasetMeta(1); - expect(meta.controller._getStackCount()).toBe(1); + } }); + + var meta = chart.getDatasetMeta(1); + expect(meta.controller._getStackCount()).toBe(1); }); it('should correctly count the number of stacks when a group is not specified and the scale is not stacked', function() { - [ - 'bar', - 'horizontalBar' - ].forEach(function(barType) { - var chart = window.acquireChart({ - type: barType, - data: { - datasets: [ - {data: []}, - {data: []}, - {data: []}, - {data: []} - ], - labels: [] - }, - options: { - scales: { - x: { - stacked: false - }, - y: { - stacked: false - } + var chart = window.acquireChart({ + type: 'bar', + data: { + datasets: [ + {data: []}, + {data: []}, + {data: []}, + {data: []} + ], + labels: [] + }, + options: { + scales: { + x: { + stacked: false + }, + y: { + stacked: false } } - }); - - var meta = chart.getDatasetMeta(1); - expect(meta.controller._getStackCount()).toBe(4); + } }); + + var meta = chart.getDatasetMeta(1); + expect(meta.controller._getStackCount()).toBe(4); }); it('should correctly count the number of stacks when a group is specified for some', function() { - [ - 'bar', - 'horizontalBar' - ].forEach(function(barType) { - var chart = window.acquireChart({ - type: barType, - data: { - datasets: [ - {data: [], stack: 'stack1'}, - {data: [], stack: 'stack1'}, - {data: []}, - {data: []} - ], - labels: [] - } - }); - - var meta = chart.getDatasetMeta(3); - expect(meta.controller._getStackCount()).toBe(3); + var chart = window.acquireChart({ + type: 'bar', + data: { + datasets: [ + {data: [], stack: 'stack1'}, + {data: [], stack: 'stack1'}, + {data: []}, + {data: []} + ], + labels: [] + } }); + + var meta = chart.getDatasetMeta(3); + expect(meta.controller._getStackCount()).toBe(3); }); it('should correctly count the number of stacks when a group is specified for some and the scale is stacked', function() { - [ - 'bar', - 'horizontalBar' - ].forEach(function(barType) { - var chart = window.acquireChart({ - type: barType, - data: { - datasets: [ - {data: [], stack: 'stack1'}, - {data: [], stack: 'stack1'}, - {data: []}, - {data: []} - ], - labels: [] - }, - options: { - scales: { - x: { - stacked: true - }, - y: { - stacked: true - } + var chart = window.acquireChart({ + type: 'bar', + data: { + datasets: [ + {data: [], stack: 'stack1'}, + {data: [], stack: 'stack1'}, + {data: []}, + {data: []} + ], + labels: [] + }, + options: { + scales: { + x: { + stacked: true + }, + y: { + stacked: true } } - }); - - var meta = chart.getDatasetMeta(3); - expect(meta.controller._getStackCount()).toBe(2); + } }); + + var meta = chart.getDatasetMeta(3); + expect(meta.controller._getStackCount()).toBe(2); }); it('should correctly count the number of stacks when a group is specified for some and the scale is not stacked', function() { - [ - 'bar', - 'horizontalBar' - ].forEach(function(barType) { - var chart = window.acquireChart({ - type: barType, - data: { - datasets: [ - {data: [], stack: 'stack1'}, - {data: [], stack: 'stack1'}, - {data: []}, - {data: []} - ], - labels: [] - }, - options: { - scales: { - x: { - stacked: false - }, - y: { - stacked: false - } + var chart = window.acquireChart({ + type: 'bar', + data: { + datasets: [ + {data: [], stack: 'stack1'}, + {data: [], stack: 'stack1'}, + {data: []}, + {data: []} + ], + labels: [] + }, + options: { + scales: { + x: { + stacked: false + }, + y: { + stacked: false } } - }); - - var meta = chart.getDatasetMeta(3); - expect(meta.controller._getStackCount()).toBe(4); + } }); + + var meta = chart.getDatasetMeta(3); + expect(meta.controller._getStackCount()).toBe(4); }); it('should correctly count the number of stacks when a group is specified for all', function() { - [ - 'bar', - 'horizontalBar' - ].forEach(function(barType) { - var chart = window.acquireChart({ - type: barType, - data: { - datasets: [ - {data: [], stack: 'stack1'}, - {data: [], stack: 'stack1'}, - {data: [], stack: 'stack2'}, - {data: [], stack: 'stack2'} - ], - labels: [] - } - }); - - var meta = chart.getDatasetMeta(3); - expect(meta.controller._getStackCount()).toBe(2); + var chart = window.acquireChart({ + type: 'bar', + data: { + datasets: [ + {data: [], stack: 'stack1'}, + {data: [], stack: 'stack1'}, + {data: [], stack: 'stack2'}, + {data: [], stack: 'stack2'} + ], + labels: [] + } }); + + var meta = chart.getDatasetMeta(3); + expect(meta.controller._getStackCount()).toBe(2); }); it('should correctly count the number of stacks when a group is specified for all and the scale is stacked', function() { - [ - 'bar', - 'horizontalBar' - ].forEach(function(barType) { - var chart = window.acquireChart({ - type: barType, - data: { - datasets: [ - {data: [], stack: 'stack1'}, - {data: [], stack: 'stack1'}, - {data: [], stack: 'stack2'}, - {data: [], stack: 'stack2'} - ], - labels: [] - }, - options: { - scales: { - x: { - stacked: true - }, - y: { - stacked: true - } + var chart = window.acquireChart({ + type: 'bar', + data: { + datasets: [ + {data: [], stack: 'stack1'}, + {data: [], stack: 'stack1'}, + {data: [], stack: 'stack2'}, + {data: [], stack: 'stack2'} + ], + labels: [] + }, + options: { + scales: { + x: { + stacked: true + }, + y: { + stacked: true } } - }); - - var meta = chart.getDatasetMeta(3); - expect(meta.controller._getStackCount()).toBe(2); + } }); + + var meta = chart.getDatasetMeta(3); + expect(meta.controller._getStackCount()).toBe(2); }); it('should correctly count the number of stacks when a group is specified for all and the scale is not stacked', function() { - [ - 'bar', - 'horizontalBar' - ].forEach(function(barType) { - var chart = window.acquireChart({ - type: barType, - data: { - datasets: [ - {data: [], stack: 'stack1'}, - {data: [], stack: 'stack1'}, - {data: [], stack: 'stack2'}, - {data: [], stack: 'stack2'} - ], - labels: [] - }, - options: { - scales: { - x: { - stacked: false - }, - y: { - stacked: false - } + var chart = window.acquireChart({ + type: 'bar', + data: { + datasets: [ + {data: [], stack: 'stack1'}, + {data: [], stack: 'stack1'}, + {data: [], stack: 'stack2'}, + {data: [], stack: 'stack2'} + ], + labels: [] + }, + options: { + scales: { + x: { + stacked: false + }, + y: { + stacked: false } } - }); - - var meta = chart.getDatasetMeta(3); - expect(meta.controller._getStackCount()).toBe(4); + } }); + + var meta = chart.getDatasetMeta(3); + expect(meta.controller._getStackCount()).toBe(4); }); it('should correctly get the stack index accounting for datasets of other types and hidden datasets', function() { - [ - 'bar', - 'horizontalBar' - ].forEach(function(barType) { - var chart = window.acquireChart({ - type: barType, - data: { - datasets: [ - {data: []}, - {data: [], hidden: true}, - {data: [], type: 'line'}, - {data: []} - ], - labels: [] - } - }); - - var meta = chart.getDatasetMeta(1); - expect(meta.controller._getStackIndex(0)).toBe(0); - expect(meta.controller._getStackIndex(3)).toBe(1); + var chart = window.acquireChart({ + type: 'bar', + data: { + datasets: [ + {data: []}, + {data: [], hidden: true}, + {data: [], type: 'line'}, + {data: []} + ], + labels: [] + } }); + + var meta = chart.getDatasetMeta(1); + expect(meta.controller._getStackIndex(0)).toBe(0); + expect(meta.controller._getStackIndex(3)).toBe(1); }); it('should correctly get the stack index when a group is not specified', function() { - [ - 'bar', - 'horizontalBar' - ].forEach(function(barType) { - var chart = window.acquireChart({ - type: barType, - data: { - datasets: [ - {data: []}, - {data: []}, - {data: []}, - {data: []} - ], - labels: [] - } - }); - - var meta = chart.getDatasetMeta(1); - expect(meta.controller._getStackIndex(0)).toBe(0); - expect(meta.controller._getStackIndex(1)).toBe(1); - expect(meta.controller._getStackIndex(2)).toBe(2); - expect(meta.controller._getStackIndex(3)).toBe(3); + var chart = window.acquireChart({ + type: 'bar', + data: { + datasets: [ + {data: []}, + {data: []}, + {data: []}, + {data: []} + ], + labels: [] + } }); + + var meta = chart.getDatasetMeta(1); + expect(meta.controller._getStackIndex(0)).toBe(0); + expect(meta.controller._getStackIndex(1)).toBe(1); + expect(meta.controller._getStackIndex(2)).toBe(2); + expect(meta.controller._getStackIndex(3)).toBe(3); }); it('should correctly get the stack index when a group is not specified and the scale is stacked', function() { - [ - 'bar', - 'horizontalBar' - ].forEach(function(barType) { - var chart = window.acquireChart({ - type: barType, - data: { - datasets: [ - {data: []}, - {data: []}, - {data: []}, - {data: []} - ], - labels: [] - }, - options: { - scales: { - x: { - stacked: true - }, - y: { - stacked: true - } + var chart = window.acquireChart({ + type: 'bar', + data: { + datasets: [ + {data: []}, + {data: []}, + {data: []}, + {data: []} + ], + labels: [] + }, + options: { + scales: { + x: { + stacked: true + }, + y: { + stacked: true } } - }); - - var meta = chart.getDatasetMeta(1); - expect(meta.controller._getStackIndex(0)).toBe(0); - expect(meta.controller._getStackIndex(1)).toBe(0); - expect(meta.controller._getStackIndex(2)).toBe(0); - expect(meta.controller._getStackIndex(3)).toBe(0); + } }); + + var meta = chart.getDatasetMeta(1); + expect(meta.controller._getStackIndex(0)).toBe(0); + expect(meta.controller._getStackIndex(1)).toBe(0); + expect(meta.controller._getStackIndex(2)).toBe(0); + expect(meta.controller._getStackIndex(3)).toBe(0); }); it('should correctly get the stack index when a group is not specified and the scale is not stacked', function() { - [ - 'bar', - 'horizontalBar' - ].forEach(function(barType) { - var chart = window.acquireChart({ - type: barType, - data: { - datasets: [ - {data: []}, - {data: []}, - {data: []}, - {data: []} - ], - labels: [] - }, - options: { - scales: { - x: { - stacked: false - }, - y: { - stacked: false - } + var chart = window.acquireChart({ + type: 'bar', + data: { + datasets: [ + {data: []}, + {data: []}, + {data: []}, + {data: []} + ], + labels: [] + }, + options: { + scales: { + x: { + stacked: false + }, + y: { + stacked: false } } - }); - - var meta = chart.getDatasetMeta(1); - expect(meta.controller._getStackIndex(0)).toBe(0); - expect(meta.controller._getStackIndex(1)).toBe(1); - expect(meta.controller._getStackIndex(2)).toBe(2); - expect(meta.controller._getStackIndex(3)).toBe(3); + } }); + + var meta = chart.getDatasetMeta(1); + expect(meta.controller._getStackIndex(0)).toBe(0); + expect(meta.controller._getStackIndex(1)).toBe(1); + expect(meta.controller._getStackIndex(2)).toBe(2); + expect(meta.controller._getStackIndex(3)).toBe(3); }); it('should correctly get the stack index when a group is specified for some', function() { - [ - 'bar', - 'horizontalBar' - ].forEach(function(barType) { - var chart = window.acquireChart({ - type: barType, - data: { - datasets: [ - {data: [], stack: 'stack1'}, - {data: [], stack: 'stack1'}, - {data: []}, - {data: []} - ], - labels: [] - } - }); - - var meta = chart.getDatasetMeta(1); - expect(meta.controller._getStackIndex(0)).toBe(0); - expect(meta.controller._getStackIndex(1)).toBe(0); - expect(meta.controller._getStackIndex(2)).toBe(1); - expect(meta.controller._getStackIndex(3)).toBe(2); + var chart = window.acquireChart({ + type: 'bar', + data: { + datasets: [ + {data: [], stack: 'stack1'}, + {data: [], stack: 'stack1'}, + {data: []}, + {data: []} + ], + labels: [] + } }); + + var meta = chart.getDatasetMeta(1); + expect(meta.controller._getStackIndex(0)).toBe(0); + expect(meta.controller._getStackIndex(1)).toBe(0); + expect(meta.controller._getStackIndex(2)).toBe(1); + expect(meta.controller._getStackIndex(3)).toBe(2); }); it('should correctly get the stack index when a group is specified for some and the scale is stacked', function() { - [ - 'bar', - 'horizontalBar' - ].forEach(function(barType) { - var chart = window.acquireChart({ - type: barType, - data: { - datasets: [ - {data: [], stack: 'stack1'}, - {data: [], stack: 'stack1'}, - {data: []}, - {data: []} - ], - labels: [] - }, - options: { - scales: { - x: { - stacked: true - }, - y: { - stacked: true - } + var chart = window.acquireChart({ + type: 'bar', + data: { + datasets: [ + {data: [], stack: 'stack1'}, + {data: [], stack: 'stack1'}, + {data: []}, + {data: []} + ], + labels: [] + }, + options: { + scales: { + x: { + stacked: true + }, + y: { + stacked: true } } - }); - - var meta = chart.getDatasetMeta(1); - expect(meta.controller._getStackIndex(0)).toBe(0); - expect(meta.controller._getStackIndex(1)).toBe(0); - expect(meta.controller._getStackIndex(2)).toBe(1); - expect(meta.controller._getStackIndex(3)).toBe(1); + } }); + + var meta = chart.getDatasetMeta(1); + expect(meta.controller._getStackIndex(0)).toBe(0); + expect(meta.controller._getStackIndex(1)).toBe(0); + expect(meta.controller._getStackIndex(2)).toBe(1); + expect(meta.controller._getStackIndex(3)).toBe(1); }); it('should correctly get the stack index when a group is specified for some and the scale is not stacked', function() { - [ - 'bar', - 'horizontalBar' - ].forEach(function(barType) { - var chart = window.acquireChart({ - type: barType, - data: { - datasets: [ - {data: [], stack: 'stack1'}, - {data: [], stack: 'stack1'}, - {data: []}, - {data: []} - ], - labels: [] - }, - options: { - scales: { - x: { - stacked: false - }, - y: { - stacked: false - } + var chart = window.acquireChart({ + type: 'bar', + data: { + datasets: [ + {data: [], stack: 'stack1'}, + {data: [], stack: 'stack1'}, + {data: []}, + {data: []} + ], + labels: [] + }, + options: { + scales: { + x: { + stacked: false + }, + y: { + stacked: false } } - }); - - var meta = chart.getDatasetMeta(1); - expect(meta.controller._getStackIndex(0)).toBe(0); - expect(meta.controller._getStackIndex(1)).toBe(1); - expect(meta.controller._getStackIndex(2)).toBe(2); - expect(meta.controller._getStackIndex(3)).toBe(3); + } }); + + var meta = chart.getDatasetMeta(1); + expect(meta.controller._getStackIndex(0)).toBe(0); + expect(meta.controller._getStackIndex(1)).toBe(1); + expect(meta.controller._getStackIndex(2)).toBe(2); + expect(meta.controller._getStackIndex(3)).toBe(3); }); it('should correctly get the stack index when a group is specified for all', function() { - [ - 'bar', - 'horizontalBar' - ].forEach(function(barType) { - var chart = window.acquireChart({ - type: barType, - data: { - datasets: [ - {data: [], stack: 'stack1'}, - {data: [], stack: 'stack1'}, - {data: [], stack: 'stack2'}, - {data: [], stack: 'stack2'} - ], - labels: [] - } - }); - - var meta = chart.getDatasetMeta(1); - expect(meta.controller._getStackIndex(0)).toBe(0); - expect(meta.controller._getStackIndex(1)).toBe(0); - expect(meta.controller._getStackIndex(2)).toBe(1); - expect(meta.controller._getStackIndex(3)).toBe(1); + var chart = window.acquireChart({ + type: 'bar', + data: { + datasets: [ + {data: [], stack: 'stack1'}, + {data: [], stack: 'stack1'}, + {data: [], stack: 'stack2'}, + {data: [], stack: 'stack2'} + ], + labels: [] + } }); + + var meta = chart.getDatasetMeta(1); + expect(meta.controller._getStackIndex(0)).toBe(0); + expect(meta.controller._getStackIndex(1)).toBe(0); + expect(meta.controller._getStackIndex(2)).toBe(1); + expect(meta.controller._getStackIndex(3)).toBe(1); }); it('should correctly get the stack index when a group is specified for all and the scale is stacked', function() { - [ - 'bar', - 'horizontalBar' - ].forEach(function(barType) { - var chart = window.acquireChart({ - type: barType, - data: { - datasets: [ - {data: [], stack: 'stack1'}, - {data: [], stack: 'stack1'}, - {data: [], stack: 'stack2'}, - {data: [], stack: 'stack2'} - ], - labels: [] - }, - options: { - scales: { - x: { - stacked: true - }, - y: { - stacked: true - } + var chart = window.acquireChart({ + type: 'bar', + data: { + datasets: [ + {data: [], stack: 'stack1'}, + {data: [], stack: 'stack1'}, + {data: [], stack: 'stack2'}, + {data: [], stack: 'stack2'} + ], + labels: [] + }, + options: { + scales: { + x: { + stacked: true + }, + y: { + stacked: true } } - }); - - var meta = chart.getDatasetMeta(1); - expect(meta.controller._getStackIndex(0)).toBe(0); - expect(meta.controller._getStackIndex(1)).toBe(0); - expect(meta.controller._getStackIndex(2)).toBe(1); - expect(meta.controller._getStackIndex(3)).toBe(1); + } }); + + var meta = chart.getDatasetMeta(1); + expect(meta.controller._getStackIndex(0)).toBe(0); + expect(meta.controller._getStackIndex(1)).toBe(0); + expect(meta.controller._getStackIndex(2)).toBe(1); + expect(meta.controller._getStackIndex(3)).toBe(1); }); it('should correctly get the stack index when a group is specified for all and the scale is not stacked', function() { - [ - 'bar', - 'horizontalBar' - ].forEach(function(barType) { - var chart = window.acquireChart({ - type: barType, - data: { - datasets: [ - {data: [], stack: 'stack1'}, - {data: [], stack: 'stack1'}, - {data: [], stack: 'stack2'}, - {data: [], stack: 'stack2'} - ], - labels: [] - }, - options: { - scales: { - x: { - stacked: false - }, - y: { - stacked: false - } + var chart = window.acquireChart({ + type: 'bar', + data: { + datasets: [ + {data: [], stack: 'stack1'}, + {data: [], stack: 'stack1'}, + {data: [], stack: 'stack2'}, + {data: [], stack: 'stack2'} + ], + labels: [] + }, + options: { + scales: { + x: { + stacked: false + }, + y: { + stacked: false } } - }); - - var meta = chart.getDatasetMeta(1); - expect(meta.controller._getStackIndex(0)).toBe(0); - expect(meta.controller._getStackIndex(1)).toBe(1); - expect(meta.controller._getStackIndex(2)).toBe(2); - expect(meta.controller._getStackIndex(3)).toBe(3); + } }); + + var meta = chart.getDatasetMeta(1); + expect(meta.controller._getStackIndex(0)).toBe(0); + expect(meta.controller._getStackIndex(1)).toBe(1); + expect(meta.controller._getStackIndex(2)).toBe(2); + expect(meta.controller._getStackIndex(3)).toBe(3); }); it('should create rectangle elements for each data item during initialization', function() { @@ -1444,7 +1343,7 @@ describe('Chart.controllers.bar', function() { }); }); - describe('Bar height (horizontalBar type)', function() { + describe('Bar height (horizontal type)', function() { beforeEach(function() { // 2 datasets this.data = { @@ -1486,9 +1385,10 @@ describe('Chart.controllers.bar', function() { it('should correctly set bar height when min and max option is set.', function() { this.config = { - type: 'horizontalBar', + type: 'bar', data: this.data, options: { + indexAxis: 'y', scales: { y: { min: 'March', @@ -1501,9 +1401,10 @@ describe('Chart.controllers.bar', function() { it('should correctly set bar height when scale are stacked with min and max options.', function() { this.config = { - type: 'horizontalBar', + type: 'bar', data: this.data, options: { + indexAxis: 'y', scales: { x: { stacked: true @@ -1612,12 +1513,13 @@ describe('Chart.controllers.bar', function() { expect(data[1].base + minBarLength).toEqual(data[1].y); }); - it('minBarLength settings should be used on X axis on horizontalBar chart', function() { + it('minBarLength settings should be used on X axis on horizontal bar chart', function() { var minBarLength = 4; var chart = window.acquireChart({ - type: 'horizontalBar', + type: 'bar', data: { datasets: [{ + indexAxis: 'y', minBarLength: minBarLength, data: [0.05, -0.05, 10, 15, 20, 25, 30, 35] }] diff --git a/test/specs/controller.radar.tests.js b/test/specs/controller.radar.tests.js index 2f034243d..8f3cf935b 100644 --- a/test/specs/controller.radar.tests.js +++ b/test/specs/controller.radar.tests.js @@ -395,7 +395,7 @@ describe('Chart.controllers.radar', function() { } }); - var controller = chart.getDatasetMeta(0).controller; - expect(controller.getValueScaleId()).toBe('test'); + var meta = chart.getDatasetMeta(0); + expect(meta.vScale.id).toBe('test'); }); }); diff --git a/test/specs/core.interaction.tests.js b/test/specs/core.interaction.tests.js index 6f8dc2269..0f3504fb2 100644 --- a/test/specs/core.interaction.tests.js +++ b/test/specs/core.interaction.tests.js @@ -153,8 +153,11 @@ describe('Core.Interaction', function() { it ('axis: y gets correct items', function() { var chart = window.acquireChart({ - type: 'horizontalBar', - data: data + type: 'bar', + data: data, + options: { + indexAxis: 'y', + } }); var meta0 = chart.getDatasetMeta(0); @@ -271,8 +274,11 @@ describe('Core.Interaction', function() { it ('axis: x gets correct items', function() { var chart = window.acquireChart({ - type: 'horizontalBar', - data: data + type: 'bar', + data: data, + options: { + indexAxis: 'y', + } }); var evt = { diff --git a/test/specs/mixed.tests.js b/test/specs/mixed.tests.js new file mode 100644 index 000000000..236fe95c1 --- /dev/null +++ b/test/specs/mixed.tests.js @@ -0,0 +1,3 @@ +describe('Mixed charts', function() { + describe('auto', jasmine.fixture.specs('mixed')); +}); diff --git a/test/specs/plugin.tooltip.tests.js b/test/specs/plugin.tooltip.tests.js index 9ccf50b7a..3ead8db7b 100644 --- a/test/specs/plugin.tooltip.tests.js +++ b/test/specs/plugin.tooltip.tests.js @@ -794,7 +794,7 @@ describe('Core.Tooltip', function() { jasmine.triggerMouseEvent(chart, 'mousemove', point0); }); - ['line', 'bar', 'horizontalBar'].forEach(function(type) { + ['line', 'bar'].forEach(function(type) { it('Should have dataPoints in a ' + type + ' chart', function(done) { var chart = window.acquireChart({ type: type, diff --git a/test/specs/scale.category.tests.js b/test/specs/scale.category.tests.js index 131070f7d..0e17194ba 100644 --- a/test/specs/scale.category.tests.js +++ b/test/specs/scale.category.tests.js @@ -466,11 +466,9 @@ describe('Category scale tests', function() { it('Should get the correct pixel for an object value in a horizontal bar chart', function() { var chart = window.acquireChart({ - type: 'horizontalBar', + type: 'bar', data: { datasets: [{ - xAxisID: 'x', - yAxisID: 'y', data: [ {x: 10, y: 0}, {x: 5, y: 1}, @@ -482,6 +480,7 @@ describe('Category scale tests', function() { labels: [0, 1, 2, 3] }, options: { + indexAxis: 'y', scales: { x: { type: 'linear', diff --git a/test/specs/scale.linear.tests.js b/test/specs/scale.linear.tests.js index c011f666c..ba364710e 100644 --- a/test/specs/scale.linear.tests.js +++ b/test/specs/scale.linear.tests.js @@ -1005,9 +1005,10 @@ describe('Linear Scale', function() { }; var chart = window.acquireChart({ - type: 'horizontalBar', + type: 'bar', data: barData, options: { + indexAxis: 'y', scales: { x: { stacked: true @@ -1041,9 +1042,10 @@ describe('Linear Scale', function() { }; var chart = window.acquireChart({ - type: 'horizontalBar', + type: 'bar', data: barData, options: { + indexAxis: 'y', scales: { x: { min: 20 @@ -1067,9 +1069,10 @@ describe('Linear Scale', function() { }; var chart = window.acquireChart({ - type: 'horizontalBar', + type: 'bar', data: barData, options: { + indexAxis: 'y', scales: { x: { min: 0, @@ -1093,9 +1096,10 @@ describe('Linear Scale', function() { }; var chart = window.acquireChart({ - type: 'horizontalBar', + type: 'bar', data: barData, options: { + indexAxis: 'y', scales: { x: { min: -3000, @@ -1110,13 +1114,14 @@ describe('Linear Scale', function() { it('Should get correct pixel values when horizontal', function() { var chart = window.acquireChart({ - type: 'horizontalBar', + type: 'bar', data: { datasets: [{ data: [0.05, -25, 10, 15, 20, 25, 30, 35] }] }, options: { + indexAxis: 'y', scales: { x: { type: 'linear', diff --git a/test/specs/scale.logarithmic.tests.js b/test/specs/scale.logarithmic.tests.js index c4ce945cc..c1c98d819 100644 --- a/test/specs/scale.logarithmic.tests.js +++ b/test/specs/scale.logarithmic.tests.js @@ -828,14 +828,14 @@ describe('Logarithmic Scale tests', function() { ]; config.forEach(function(setup) { var scaleConfig = {}; - var type, chartStart, chartEnd; + var indexAxis, chartStart, chartEnd; if (setup.axis === 'x') { - type = 'horizontalBar'; + indexAxis = 'y'; chartStart = 'left'; chartEnd = 'right'; } else { - type = 'bar'; + indexAxis = 'x'; chartStart = 'bottom'; chartEnd = 'top'; } @@ -850,12 +850,13 @@ describe('Logarithmic Scale tests', function() { describe(description, function() { it('should define the correct axis limits', function() { var chart = window.acquireChart({ - type: type, + type: 'bar', data: { labels: ['category 1', 'category 2'], datasets: setup.data || data, }, options: { + indexAxis, scales: scaleConfig } }); @@ -917,18 +918,6 @@ describe('Logarithmic Scale tests', function() { lastTick: 10, describe: 'empty dataset with stack option, without min/max' }, - { - data: { - datasets: [ - {data: [], stack: 'stack'}, - {data: [], stack: 'stack'}, - ], - }, - type: 'horizontalBar', - firstTick: 1, - lastTick: 10, - describe: 'empty dataset with stack option, without min/max' - }, { dataset: [], scale: {min: 1},