Bar chart base value overrides (#7904)

* Bar chart base value overrides
* Ensure that `base` is marked as indexable and scriptable in the docs

docs/docs/charts/bar.mdx

@@ -79,6 +79,7 @@ the color of the bars is generally set this way.
 | Name | Type | [Scriptable](../general/options.md#scriptable-options) | [Indexable](../general/options.md#indexable-options) | Default
 | ---- | ---- | :----: | :----: | ----
 | [`backgroundColor`](#styling) | [`Color`](../general/colors.md) | Yes | Yes | `'rgba(0, 0, 0, 0.1)'`
+| [`base`](#general) | `number` | Yes | Yes | 
 | [`borderColor`](#styling) | [`Color`](../general/colors.md) | Yes | Yes | `'rgba(0, 0, 0, 0.1)'`
 | [`borderSkipped`](#borderskipped) | `string` | Yes | Yes | `'start'`
 | [`borderWidth`](#borderwidth) | <code>number&#124;object</code> | Yes | Yes | `0`
@@ -97,6 +98,7 @@ the color of the bars is generally set this way.
 
 | Name | Description
 | ---- | ----
+| `base` | Base value for the bar in data units along the value axis. If not set, defaults to the value axis base value.
 | `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.
@@ -161,6 +163,7 @@ The bar chart accepts the following configuration from the associated dataset op
 | `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` | <code>number&#124;string</code> | | 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)
+| `base` | `number` | | Base value for the bar in data units along the value axis. If not set, defaults to the value axis base value.
 | `maxBarThickness` | `number` | | Set this to ensure that bars are not sized thicker than this.
 | `minBarLength` | `number` | | Set this to ensure that bars have a minimum length in pixels.
 

src/controllers/controller.bar.js

@@ -404,9 +404,10 @@ export default class BarController extends DatasetController {
 		const me = this;
 		const meta = me._cachedMeta;
 		const vScale = meta.vScale;
-		const minBarLength = options.minBarLength;
+		const {base: baseValue, minBarLength} = options;
 		const parsed = me.getParsed(index);
 		const custom = parsed._custom;
+		const floating = isFloatBar(custom);
 		let value = parsed[vScale.axis];
 		let start = 0;
 		let length = meta._stacked ? me.applyStack(vScale, parsed) : value;
@@ -417,7 +418,7 @@ export default class BarController extends DatasetController {
 			length = value;
 		}
 
-		if (isFloatBar(custom)) {
+		if (floating) {
 			value = custom.barStart;
 			length = custom.barEnd - custom.barStart;
 			// bars crossing origin are not stacked
@@ -431,7 +432,8 @@ export default class BarController extends DatasetController {
 		// So we don't try to draw so huge rectangles.
 		// https://github.com/chartjs/Chart.js/issues/5247
 		// TODO: use borderWidth instead (need to move the parsing from rectangle)
-		let base = _limitValue(vScale.getPixelForValue(start),
+		const startValue = !isNullOrUndef(baseValue) && !floating ? baseValue : start;
+		let base = _limitValue(vScale.getPixelForValue(startValue),
 			vScale._startPixel - 10,
 			vScale._endPixel + 10);
 
@@ -521,6 +523,7 @@ BarController.defaults = {
 		'borderWidth',
 		'barPercentage',
 		'barThickness',
+		'base',
 		'categoryPercentage',
 		'maxBarThickness',
 		'minBarLength',

test/fixtures/controller.bar/bar-base-value.js

@@ -0,0 +1,31 @@
+module.exports = {
+	config: {
+		type: 'bar',
+		data: {
+			labels: [0, 1, 3, 4],
+			datasets: [
+				{
+					data: [5, 20, 10, 11],
+					base: 10,
+					backgroundColor: '#00ff00',
+					borderColor: '#ff0000',
+					borderWidth: 2,
+				}
+			]
+		},
+		options: {
+			legend: false,
+			title: false,
+			scales: {
+				x: {display: false},
+				y: {display: false}
+			}
+		}
+	},
+	options: {
+		canvas: {
+			height: 256,
+			width: 512
+		}
+	}
+};

types/elements/index.d.ts

@@ -253,6 +253,11 @@ export interface IRectangleProps {
 }
 
 export interface IRectangleOptions extends ICommonOptions {
+  /**
+   * The base value for the bar in data units along the value axis.
+   */
+  base: number;
+
   /**
    * 	Skipped (excluded) border: 'start', 'end', 'bottom', 'left', 'top' or 'right'.
    * @default 'start'