chart.js
Version:
Simple HTML5 charts using the canvas element.
1,596 lines (1,591 loc) • 343 kB
JavaScript
/*!
* Chart.js v3.9.0
* https://www.chartjs.org
* (c) 2022 Chart.js Contributors
* Released under the MIT License
*/
import { r as requestAnimFrame, a as resolve, e as effects, c as color, d as defaults, i as isObject, b as isArray, v as valueOrDefault, u as unlistenArrayEvents, l as listenArrayEvents, f as resolveObjectKey, g as isNumberFinite, h as createContext, j as defined, s as sign, k as isNullOrUndef, _ as _arrayUnique, t as toRadians, m as toPercentage, n as toDimension, T as TAU, o as formatNumber, p as _angleBetween, H as HALF_PI, P as PI, q as _getStartAndCountOfVisiblePoints, w as _scaleRangesChanged, x as isNumber, y as _parseObjectDataRadialScale, z as log10, A as _factorize, B as finiteOrDefault, C as callback, D as _addGrace, E as _limitValue, F as toDegrees, G as _measureText, I as _int16Range, J as _alignPixel, K as toPadding, L as clipArea, M as renderText, N as unclipArea, O as toFont, Q as each, R as _toLeftRightCenter, S as _alignStartEnd, U as overrides, V as merge, W as _capitalize, X as getRelativePosition, Y as _rlookupByKey, Z as _lookupByKey, $ as _isPointInArea, a0 as getAngleFromPoint, a1 as getMaximumSize, a2 as _getParentNode, a3 as readUsedSize, a4 as throttled, a5 as supportsEventListenerOptions, a6 as _isDomSupported, a7 as descriptors, a8 as isFunction, a9 as _attachContext, aa as _createResolver, ab as _descriptors, ac as mergeIf, ad as uid, ae as debounce, af as retinaScale, ag as clearCanvas, ah as setsEqual, ai as _elementsEqual, aj as _isClickEvent, ak as _isBetween, al as _readValueToProps, am as _updateBezierControlPoints, an as _computeSegments, ao as _boundSegments, ap as _steppedInterpolation, aq as _bezierInterpolation, ar as _pointInLine, as as _steppedLineTo, at as _bezierCurveTo, au as drawPoint, av as addRoundedRectPath, aw as toTRBL, ax as toTRBLCorners, ay as _boundSegment, az as _normalizeAngle, aA as getRtlAdapter, aB as overrideTextDirection, aC as _textX, aD as restoreTextDirection, aE as drawPointLegend, aF as noop, aG as distanceBetweenPoints, aH as _setMinAndMaxByKey, aI as niceNum, aJ as almostWhole, aK as almostEquals, aL as _decimalPlaces, aM as _longestText, aN as _filterBetween, aO as _lookup } from './chunks/helpers.segment.js';
export { d as defaults } from './chunks/helpers.segment.js';
class Animator {
constructor() {
this._request = null;
this._charts = new Map();
this._running = false;
this._lastDate = undefined;
}
_notify(chart, anims, date, type) {
const callbacks = anims.listeners[type];
const numSteps = anims.duration;
callbacks.forEach(fn => fn({
chart,
initial: anims.initial,
numSteps,
currentStep: Math.min(date - anims.start, numSteps)
}));
}
_refresh() {
if (this._request) {
return;
}
this._running = true;
this._request = requestAnimFrame.call(window, () => {
this._update();
this._request = null;
if (this._running) {
this._refresh();
}
});
}
_update(date = Date.now()) {
let remaining = 0;
this._charts.forEach((anims, chart) => {
if (!anims.running || !anims.items.length) {
return;
}
const items = anims.items;
let i = items.length - 1;
let draw = false;
let item;
for (; i >= 0; --i) {
item = items[i];
if (item._active) {
if (item._total > anims.duration) {
anims.duration = item._total;
}
item.tick(date);
draw = true;
} else {
items[i] = items[items.length - 1];
items.pop();
}
}
if (draw) {
chart.draw();
this._notify(chart, anims, date, 'progress');
}
if (!items.length) {
anims.running = false;
this._notify(chart, anims, date, 'complete');
anims.initial = false;
}
remaining += items.length;
});
this._lastDate = date;
if (remaining === 0) {
this._running = false;
}
}
_getAnims(chart) {
const charts = this._charts;
let anims = charts.get(chart);
if (!anims) {
anims = {
running: false,
initial: true,
items: [],
listeners: {
complete: [],
progress: []
}
};
charts.set(chart, anims);
}
return anims;
}
listen(chart, event, cb) {
this._getAnims(chart).listeners[event].push(cb);
}
add(chart, items) {
if (!items || !items.length) {
return;
}
this._getAnims(chart).items.push(...items);
}
has(chart) {
return this._getAnims(chart).items.length > 0;
}
start(chart) {
const anims = this._charts.get(chart);
if (!anims) {
return;
}
anims.running = true;
anims.start = Date.now();
anims.duration = anims.items.reduce((acc, cur) => Math.max(acc, cur._duration), 0);
this._refresh();
}
running(chart) {
if (!this._running) {
return false;
}
const anims = this._charts.get(chart);
if (!anims || !anims.running || !anims.items.length) {
return false;
}
return true;
}
stop(chart) {
const anims = this._charts.get(chart);
if (!anims || !anims.items.length) {
return;
}
const items = anims.items;
let i = items.length - 1;
for (; i >= 0; --i) {
items[i].cancel();
}
anims.items = [];
this._notify(chart, anims, Date.now(), 'complete');
}
remove(chart) {
return this._charts.delete(chart);
}
}
var animator = new Animator();
const transparent = 'transparent';
const interpolators = {
boolean(from, to, factor) {
return factor > 0.5 ? to : from;
},
color(from, to, factor) {
const c0 = color(from || transparent);
const c1 = c0.valid && color(to || transparent);
return c1 && c1.valid
? c1.mix(c0, factor).hexString()
: to;
},
number(from, to, factor) {
return from + (to - from) * factor;
}
};
class Animation {
constructor(cfg, target, prop, to) {
const currentValue = target[prop];
to = resolve([cfg.to, to, currentValue, cfg.from]);
const from = resolve([cfg.from, currentValue, to]);
this._active = true;
this._fn = cfg.fn || interpolators[cfg.type || typeof from];
this._easing = effects[cfg.easing] || effects.linear;
this._start = Math.floor(Date.now() + (cfg.delay || 0));
this._duration = this._total = Math.floor(cfg.duration);
this._loop = !!cfg.loop;
this._target = target;
this._prop = prop;
this._from = from;
this._to = to;
this._promises = undefined;
}
active() {
return this._active;
}
update(cfg, to, date) {
if (this._active) {
this._notify(false);
const currentValue = this._target[this._prop];
const elapsed = date - this._start;
const remain = this._duration - elapsed;
this._start = date;
this._duration = Math.floor(Math.max(remain, cfg.duration));
this._total += elapsed;
this._loop = !!cfg.loop;
this._to = resolve([cfg.to, to, currentValue, cfg.from]);
this._from = resolve([cfg.from, currentValue, to]);
}
}
cancel() {
if (this._active) {
this.tick(Date.now());
this._active = false;
this._notify(false);
}
}
tick(date) {
const elapsed = date - this._start;
const duration = this._duration;
const prop = this._prop;
const from = this._from;
const loop = this._loop;
const to = this._to;
let factor;
this._active = from !== to && (loop || (elapsed < duration));
if (!this._active) {
this._target[prop] = to;
this._notify(true);
return;
}
if (elapsed < 0) {
this._target[prop] = from;
return;
}
factor = (elapsed / duration) % 2;
factor = loop && factor > 1 ? 2 - factor : factor;
factor = this._easing(Math.min(1, Math.max(0, factor)));
this._target[prop] = this._fn(from, to, factor);
}
wait() {
const promises = this._promises || (this._promises = []);
return new Promise((res, rej) => {
promises.push({res, rej});
});
}
_notify(resolved) {
const method = resolved ? 'res' : 'rej';
const promises = this._promises || [];
for (let i = 0; i < promises.length; i++) {
promises[i][method]();
}
}
}
const numbers = ['x', 'y', 'borderWidth', 'radius', 'tension'];
const colors = ['color', 'borderColor', 'backgroundColor'];
defaults.set('animation', {
delay: undefined,
duration: 1000,
easing: 'easeOutQuart',
fn: undefined,
from: undefined,
loop: undefined,
to: undefined,
type: undefined,
});
const animationOptions = Object.keys(defaults.animation);
defaults.describe('animation', {
_fallback: false,
_indexable: false,
_scriptable: (name) => name !== 'onProgress' && name !== 'onComplete' && name !== 'fn',
});
defaults.set('animations', {
colors: {
type: 'color',
properties: colors
},
numbers: {
type: 'number',
properties: numbers
},
});
defaults.describe('animations', {
_fallback: 'animation',
});
defaults.set('transitions', {
active: {
animation: {
duration: 400
}
},
resize: {
animation: {
duration: 0
}
},
show: {
animations: {
colors: {
from: 'transparent'
},
visible: {
type: 'boolean',
duration: 0
},
}
},
hide: {
animations: {
colors: {
to: 'transparent'
},
visible: {
type: 'boolean',
easing: 'linear',
fn: v => v | 0
},
}
}
});
class Animations {
constructor(chart, config) {
this._chart = chart;
this._properties = new Map();
this.configure(config);
}
configure(config) {
if (!isObject(config)) {
return;
}
const animatedProps = this._properties;
Object.getOwnPropertyNames(config).forEach(key => {
const cfg = config[key];
if (!isObject(cfg)) {
return;
}
const resolved = {};
for (const option of animationOptions) {
resolved[option] = cfg[option];
}
(isArray(cfg.properties) && cfg.properties || [key]).forEach((prop) => {
if (prop === key || !animatedProps.has(prop)) {
animatedProps.set(prop, resolved);
}
});
});
}
_animateOptions(target, values) {
const newOptions = values.options;
const options = resolveTargetOptions(target, newOptions);
if (!options) {
return [];
}
const animations = this._createAnimations(options, newOptions);
if (newOptions.$shared) {
awaitAll(target.options.$animations, newOptions).then(() => {
target.options = newOptions;
}, () => {
});
}
return animations;
}
_createAnimations(target, values) {
const animatedProps = this._properties;
const animations = [];
const running = target.$animations || (target.$animations = {});
const props = Object.keys(values);
const date = Date.now();
let i;
for (i = props.length - 1; i >= 0; --i) {
const prop = props[i];
if (prop.charAt(0) === '$') {
continue;
}
if (prop === 'options') {
animations.push(...this._animateOptions(target, values));
continue;
}
const value = values[prop];
let animation = running[prop];
const cfg = animatedProps.get(prop);
if (animation) {
if (cfg && animation.active()) {
animation.update(cfg, value, date);
continue;
} else {
animation.cancel();
}
}
if (!cfg || !cfg.duration) {
target[prop] = value;
continue;
}
running[prop] = animation = new Animation(cfg, target, prop, value);
animations.push(animation);
}
return animations;
}
update(target, values) {
if (this._properties.size === 0) {
Object.assign(target, values);
return;
}
const animations = this._createAnimations(target, values);
if (animations.length) {
animator.add(this._chart, animations);
return true;
}
}
}
function awaitAll(animations, properties) {
const running = [];
const keys = Object.keys(properties);
for (let i = 0; i < keys.length; i++) {
const anim = animations[keys[i]];
if (anim && anim.active()) {
running.push(anim.wait());
}
}
return Promise.all(running);
}
function resolveTargetOptions(target, newOptions) {
if (!newOptions) {
return;
}
let options = target.options;
if (!options) {
target.options = newOptions;
return;
}
if (options.$shared) {
target.options = options = Object.assign({}, options, {$shared: false, $animations: {}});
}
return options;
}
function scaleClip(scale, allowedOverflow) {
const opts = scale && scale.options || {};
const reverse = opts.reverse;
const min = opts.min === undefined ? allowedOverflow : 0;
const max = opts.max === undefined ? allowedOverflow : 0;
return {
start: reverse ? max : min,
end: reverse ? min : max
};
}
function defaultClip(xScale, yScale, allowedOverflow) {
if (allowedOverflow === false) {
return false;
}
const x = scaleClip(xScale, allowedOverflow);
const y = scaleClip(yScale, allowedOverflow);
return {
top: y.end,
right: x.end,
bottom: y.start,
left: x.start
};
}
function toClip(value) {
let t, r, b, l;
if (isObject(value)) {
t = value.top;
r = value.right;
b = value.bottom;
l = value.left;
} else {
t = r = b = l = value;
}
return {
top: t,
right: r,
bottom: b,
left: l,
disabled: value === false
};
}
function getSortedDatasetIndices(chart, filterVisible) {
const keys = [];
const metasets = chart._getSortedDatasetMetas(filterVisible);
let i, ilen;
for (i = 0, ilen = metasets.length; i < ilen; ++i) {
keys.push(metasets[i].index);
}
return keys;
}
function applyStack(stack, value, dsIndex, options = {}) {
const keys = stack.keys;
const singleMode = options.mode === 'single';
let i, ilen, datasetIndex, otherValue;
if (value === null) {
return;
}
for (i = 0, ilen = keys.length; i < ilen; ++i) {
datasetIndex = +keys[i];
if (datasetIndex === dsIndex) {
if (options.all) {
continue;
}
break;
}
otherValue = stack.values[datasetIndex];
if (isNumberFinite(otherValue) && (singleMode || (value === 0 || sign(value) === sign(otherValue)))) {
value += otherValue;
}
}
return value;
}
function convertObjectDataToArray(data) {
const keys = Object.keys(data);
const adata = new Array(keys.length);
let i, ilen, key;
for (i = 0, ilen = keys.length; i < ilen; ++i) {
key = keys[i];
adata[i] = {
x: key,
y: data[key]
};
}
return adata;
}
function isStacked(scale, meta) {
const stacked = scale && scale.options.stacked;
return stacked || (stacked === undefined && meta.stack !== undefined);
}
function getStackKey(indexScale, valueScale, meta) {
return `${indexScale.id}.${valueScale.id}.${meta.stack || meta.type}`;
}
function getUserBounds(scale) {
const {min, max, minDefined, maxDefined} = scale.getUserBounds();
return {
min: minDefined ? min : Number.NEGATIVE_INFINITY,
max: maxDefined ? max : Number.POSITIVE_INFINITY
};
}
function getOrCreateStack(stacks, stackKey, indexValue) {
const subStack = stacks[stackKey] || (stacks[stackKey] = {});
return subStack[indexValue] || (subStack[indexValue] = {});
}
function getLastIndexInStack(stack, vScale, positive, type) {
for (const meta of vScale.getMatchingVisibleMetas(type).reverse()) {
const value = stack[meta.index];
if ((positive && value > 0) || (!positive && value < 0)) {
return meta.index;
}
}
return null;
}
function updateStacks(controller, parsed) {
const {chart, _cachedMeta: meta} = controller;
const stacks = chart._stacks || (chart._stacks = {});
const {iScale, vScale, index: datasetIndex} = meta;
const iAxis = iScale.axis;
const vAxis = vScale.axis;
const key = getStackKey(iScale, vScale, meta);
const ilen = parsed.length;
let stack;
for (let i = 0; i < ilen; ++i) {
const item = parsed[i];
const {[iAxis]: index, [vAxis]: value} = item;
const itemStacks = item._stacks || (item._stacks = {});
stack = itemStacks[vAxis] = getOrCreateStack(stacks, key, index);
stack[datasetIndex] = value;
stack._top = getLastIndexInStack(stack, vScale, true, meta.type);
stack._bottom = getLastIndexInStack(stack, vScale, false, meta.type);
}
}
function getFirstScaleId(chart, axis) {
const scales = chart.scales;
return Object.keys(scales).filter(key => scales[key].axis === axis).shift();
}
function createDatasetContext(parent, index) {
return createContext(parent,
{
active: false,
dataset: undefined,
datasetIndex: index,
index,
mode: 'default',
type: 'dataset'
}
);
}
function createDataContext(parent, index, element) {
return createContext(parent, {
active: false,
dataIndex: index,
parsed: undefined,
raw: undefined,
element,
index,
mode: 'default',
type: 'data'
});
}
function clearStacks(meta, items) {
const datasetIndex = meta.controller.index;
const axis = meta.vScale && meta.vScale.axis;
if (!axis) {
return;
}
items = items || meta._parsed;
for (const parsed of items) {
const stacks = parsed._stacks;
if (!stacks || stacks[axis] === undefined || stacks[axis][datasetIndex] === undefined) {
return;
}
delete stacks[axis][datasetIndex];
}
}
const isDirectUpdateMode = (mode) => mode === 'reset' || mode === 'none';
const cloneIfNotShared = (cached, shared) => shared ? cached : Object.assign({}, cached);
const createStack = (canStack, meta, chart) => canStack && !meta.hidden && meta._stacked
&& {keys: getSortedDatasetIndices(chart, true), values: null};
class DatasetController {
constructor(chart, datasetIndex) {
this.chart = chart;
this._ctx = chart.ctx;
this.index = datasetIndex;
this._cachedDataOpts = {};
this._cachedMeta = this.getMeta();
this._type = this._cachedMeta.type;
this.options = undefined;
this._parsing = false;
this._data = undefined;
this._objectData = undefined;
this._sharedOptions = undefined;
this._drawStart = undefined;
this._drawCount = undefined;
this.enableOptionSharing = false;
this.supportsDecimation = false;
this.$context = undefined;
this._syncList = [];
this.initialize();
}
initialize() {
const meta = this._cachedMeta;
this.configure();
this.linkScales();
meta._stacked = isStacked(meta.vScale, meta);
this.addElements();
}
updateIndex(datasetIndex) {
if (this.index !== datasetIndex) {
clearStacks(this._cachedMeta);
}
this.index = datasetIndex;
}
linkScales() {
const chart = this.chart;
const meta = this._cachedMeta;
const dataset = this.getDataset();
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 = this.getScaleForId(xid);
meta.yScale = this.getScaleForId(yid);
meta.rScale = this.getScaleForId(rid);
meta.iScale = this.getScaleForId(iid);
meta.vScale = this.getScaleForId(vid);
}
getDataset() {
return this.chart.data.datasets[this.index];
}
getMeta() {
return this.chart.getDatasetMeta(this.index);
}
getScaleForId(scaleID) {
return this.chart.scales[scaleID];
}
_getOtherScale(scale) {
const meta = this._cachedMeta;
return scale === meta.iScale
? meta.vScale
: meta.iScale;
}
reset() {
this._update('reset');
}
_destroy() {
const meta = this._cachedMeta;
if (this._data) {
unlistenArrayEvents(this._data, this);
}
if (meta._stacked) {
clearStacks(meta);
}
}
_dataCheck() {
const dataset = this.getDataset();
const data = dataset.data || (dataset.data = []);
const _data = this._data;
if (isObject(data)) {
this._data = convertObjectDataToArray(data);
} else if (_data !== data) {
if (_data) {
unlistenArrayEvents(_data, this);
const meta = this._cachedMeta;
clearStacks(meta);
meta._parsed = [];
}
if (data && Object.isExtensible(data)) {
listenArrayEvents(data, this);
}
this._syncList = [];
this._data = data;
}
}
addElements() {
const meta = this._cachedMeta;
this._dataCheck();
if (this.datasetElementType) {
meta.dataset = new this.datasetElementType();
}
}
buildOrUpdateElements(resetNewElements) {
const meta = this._cachedMeta;
const dataset = this.getDataset();
let stackChanged = false;
this._dataCheck();
const oldStacked = meta._stacked;
meta._stacked = isStacked(meta.vScale, meta);
if (meta.stack !== dataset.stack) {
stackChanged = true;
clearStacks(meta);
meta.stack = dataset.stack;
}
this._resyncElements(resetNewElements);
if (stackChanged || oldStacked !== meta._stacked) {
updateStacks(this, meta._parsed);
}
}
configure() {
const config = this.chart.config;
const scopeKeys = config.datasetScopeKeys(this._type);
const scopes = config.getOptionScopes(this.getDataset(), scopeKeys, true);
this.options = config.createResolver(scopes, this.getContext());
this._parsing = this.options.parsing;
this._cachedDataOpts = {};
}
parse(start, count) {
const {_cachedMeta: meta, _data: data} = this;
const {iScale, _stacked} = meta;
const iAxis = iScale.axis;
let sorted = start === 0 && count === data.length ? true : meta._sorted;
let prev = start > 0 && meta._parsed[start - 1];
let i, cur, parsed;
if (this._parsing === false) {
meta._parsed = data;
meta._sorted = true;
parsed = data;
} else {
if (isArray(data[start])) {
parsed = this.parseArrayData(meta, data, start, count);
} else if (isObject(data[start])) {
parsed = this.parseObjectData(meta, data, start, count);
} else {
parsed = this.parsePrimitiveData(meta, data, start, count);
}
const isNotInOrderComparedToPrev = () => cur[iAxis] === null || (prev && cur[iAxis] < prev[iAxis]);
for (i = 0; i < count; ++i) {
meta._parsed[i + start] = cur = parsed[i];
if (sorted) {
if (isNotInOrderComparedToPrev()) {
sorted = false;
}
prev = cur;
}
}
meta._sorted = sorted;
}
if (_stacked) {
updateStacks(this, parsed);
}
}
parsePrimitiveData(meta, data, start, count) {
const {iScale, vScale} = meta;
const iAxis = iScale.axis;
const vAxis = vScale.axis;
const labels = iScale.getLabels();
const singleScale = iScale === vScale;
const parsed = new Array(count);
let i, ilen, index;
for (i = 0, ilen = count; i < ilen; ++i) {
index = i + start;
parsed[i] = {
[iAxis]: singleScale || iScale.parse(labels[index], index),
[vAxis]: vScale.parse(data[index], index)
};
}
return parsed;
}
parseArrayData(meta, data, start, count) {
const {xScale, yScale} = meta;
const parsed = new Array(count);
let i, ilen, index, item;
for (i = 0, ilen = count; i < ilen; ++i) {
index = i + start;
item = data[index];
parsed[i] = {
x: xScale.parse(item[0], index),
y: yScale.parse(item[1], index)
};
}
return parsed;
}
parseObjectData(meta, data, start, count) {
const {xScale, yScale} = meta;
const {xAxisKey = 'x', yAxisKey = 'y'} = this._parsing;
const parsed = new Array(count);
let i, ilen, index, item;
for (i = 0, ilen = count; i < ilen; ++i) {
index = i + start;
item = data[index];
parsed[i] = {
x: xScale.parse(resolveObjectKey(item, xAxisKey), index),
y: yScale.parse(resolveObjectKey(item, yAxisKey), index)
};
}
return parsed;
}
getParsed(index) {
return this._cachedMeta._parsed[index];
}
getDataElement(index) {
return this._cachedMeta.data[index];
}
applyStack(scale, parsed, mode) {
const chart = this.chart;
const meta = this._cachedMeta;
const value = parsed[scale.axis];
const stack = {
keys: getSortedDatasetIndices(chart, true),
values: parsed._stacks[scale.axis]
};
return applyStack(stack, value, meta.index, {mode});
}
updateRangeFromParsed(range, scale, parsed, stack) {
const parsedValue = parsed[scale.axis];
let value = parsedValue === null ? NaN : parsedValue;
const values = stack && parsed._stacks[scale.axis];
if (stack && values) {
stack.values = values;
value = applyStack(stack, parsedValue, this._cachedMeta.index);
}
range.min = Math.min(range.min, value);
range.max = Math.max(range.max, value);
}
getMinMax(scale, canStack) {
const meta = this._cachedMeta;
const _parsed = meta._parsed;
const sorted = meta._sorted && scale === meta.iScale;
const ilen = _parsed.length;
const otherScale = this._getOtherScale(scale);
const stack = createStack(canStack, meta, this.chart);
const range = {min: Number.POSITIVE_INFINITY, max: Number.NEGATIVE_INFINITY};
const {min: otherMin, max: otherMax} = getUserBounds(otherScale);
let i, parsed;
function _skip() {
parsed = _parsed[i];
const otherValue = parsed[otherScale.axis];
return !isNumberFinite(parsed[scale.axis]) || otherMin > otherValue || otherMax < otherValue;
}
for (i = 0; i < ilen; ++i) {
if (_skip()) {
continue;
}
this.updateRangeFromParsed(range, scale, parsed, stack);
if (sorted) {
break;
}
}
if (sorted) {
for (i = ilen - 1; i >= 0; --i) {
if (_skip()) {
continue;
}
this.updateRangeFromParsed(range, scale, parsed, stack);
break;
}
}
return range;
}
getAllParsedValues(scale) {
const parsed = this._cachedMeta._parsed;
const values = [];
let i, ilen, value;
for (i = 0, ilen = parsed.length; i < ilen; ++i) {
value = parsed[i][scale.axis];
if (isNumberFinite(value)) {
values.push(value);
}
}
return values;
}
getMaxOverflow() {
return false;
}
getLabelAndValue(index) {
const meta = this._cachedMeta;
const iScale = meta.iScale;
const vScale = meta.vScale;
const parsed = this.getParsed(index);
return {
label: iScale ? '' + iScale.getLabelForValue(parsed[iScale.axis]) : '',
value: vScale ? '' + vScale.getLabelForValue(parsed[vScale.axis]) : ''
};
}
_update(mode) {
const meta = this._cachedMeta;
this.update(mode || 'default');
meta._clip = toClip(valueOrDefault(this.options.clip, defaultClip(meta.xScale, meta.yScale, this.getMaxOverflow())));
}
update(mode) {}
draw() {
const ctx = this._ctx;
const chart = this.chart;
const meta = this._cachedMeta;
const elements = meta.data || [];
const area = chart.chartArea;
const active = [];
const start = this._drawStart || 0;
const count = this._drawCount || (elements.length - start);
const drawActiveElementsOnTop = this.options.drawActiveElementsOnTop;
let i;
if (meta.dataset) {
meta.dataset.draw(ctx, area, start, count);
}
for (i = start; i < start + count; ++i) {
const element = elements[i];
if (element.hidden) {
continue;
}
if (element.active && drawActiveElementsOnTop) {
active.push(element);
} else {
element.draw(ctx, area);
}
}
for (i = 0; i < active.length; ++i) {
active[i].draw(ctx, area);
}
}
getStyle(index, active) {
const mode = active ? 'active' : 'default';
return index === undefined && this._cachedMeta.dataset
? this.resolveDatasetElementOptions(mode)
: this.resolveDataElementOptions(index || 0, mode);
}
getContext(index, active, mode) {
const dataset = this.getDataset();
let context;
if (index >= 0 && index < this._cachedMeta.data.length) {
const element = this._cachedMeta.data[index];
context = element.$context ||
(element.$context = createDataContext(this.getContext(), index, element));
context.parsed = this.getParsed(index);
context.raw = dataset.data[index];
context.index = context.dataIndex = index;
} else {
context = this.$context ||
(this.$context = createDatasetContext(this.chart.getContext(), this.index));
context.dataset = dataset;
context.index = context.datasetIndex = this.index;
}
context.active = !!active;
context.mode = mode;
return context;
}
resolveDatasetElementOptions(mode) {
return this._resolveElementOptions(this.datasetElementType.id, mode);
}
resolveDataElementOptions(index, mode) {
return this._resolveElementOptions(this.dataElementType.id, mode, index);
}
_resolveElementOptions(elementType, mode = 'default', index) {
const active = mode === 'active';
const cache = this._cachedDataOpts;
const cacheKey = elementType + '-' + mode;
const cached = cache[cacheKey];
const sharing = this.enableOptionSharing && defined(index);
if (cached) {
return cloneIfNotShared(cached, sharing);
}
const config = this.chart.config;
const scopeKeys = config.datasetElementScopeKeys(this._type, elementType);
const prefixes = active ? [`${elementType}Hover`, 'hover', elementType, ''] : [elementType, ''];
const scopes = config.getOptionScopes(this.getDataset(), scopeKeys);
const names = Object.keys(defaults.elements[elementType]);
const context = () => this.getContext(index, active);
const values = config.resolveNamedOptions(scopes, names, context, prefixes);
if (values.$shared) {
values.$shared = sharing;
cache[cacheKey] = Object.freeze(cloneIfNotShared(values, sharing));
}
return values;
}
_resolveAnimations(index, transition, active) {
const chart = this.chart;
const cache = this._cachedDataOpts;
const cacheKey = `animation-${transition}`;
const cached = cache[cacheKey];
if (cached) {
return cached;
}
let options;
if (chart.options.animation !== false) {
const config = this.chart.config;
const scopeKeys = config.datasetAnimationScopeKeys(this._type, transition);
const scopes = config.getOptionScopes(this.getDataset(), scopeKeys);
options = config.createResolver(scopes, this.getContext(index, active, transition));
}
const animations = new Animations(chart, options && options.animations);
if (options && options._cacheable) {
cache[cacheKey] = Object.freeze(animations);
}
return animations;
}
getSharedOptions(options) {
if (!options.$shared) {
return;
}
return this._sharedOptions || (this._sharedOptions = Object.assign({}, options));
}
includeOptions(mode, sharedOptions) {
return !sharedOptions || isDirectUpdateMode(mode) || this.chart._animationsDisabled;
}
_getSharedOptions(start, mode) {
const firstOpts = this.resolveDataElementOptions(start, mode);
const previouslySharedOptions = this._sharedOptions;
const sharedOptions = this.getSharedOptions(firstOpts);
const includeOptions = this.includeOptions(mode, sharedOptions) || (sharedOptions !== previouslySharedOptions);
this.updateSharedOptions(sharedOptions, mode, firstOpts);
return {sharedOptions, includeOptions};
}
updateElement(element, index, properties, mode) {
if (isDirectUpdateMode(mode)) {
Object.assign(element, properties);
} else {
this._resolveAnimations(index, mode).update(element, properties);
}
}
updateSharedOptions(sharedOptions, mode, newOptions) {
if (sharedOptions && !isDirectUpdateMode(mode)) {
this._resolveAnimations(undefined, mode).update(sharedOptions, newOptions);
}
}
_setStyle(element, index, mode, active) {
element.active = active;
const options = this.getStyle(index, active);
this._resolveAnimations(index, mode, active).update(element, {
options: (!active && this.getSharedOptions(options)) || options
});
}
removeHoverStyle(element, datasetIndex, index) {
this._setStyle(element, index, 'active', false);
}
setHoverStyle(element, datasetIndex, index) {
this._setStyle(element, index, 'active', true);
}
_removeDatasetHoverStyle() {
const element = this._cachedMeta.dataset;
if (element) {
this._setStyle(element, undefined, 'active', false);
}
}
_setDatasetHoverStyle() {
const element = this._cachedMeta.dataset;
if (element) {
this._setStyle(element, undefined, 'active', true);
}
}
_resyncElements(resetNewElements) {
const data = this._data;
const elements = this._cachedMeta.data;
for (const [method, arg1, arg2] of this._syncList) {
this[method](arg1, arg2);
}
this._syncList = [];
const numMeta = elements.length;
const numData = data.length;
const count = Math.min(numData, numMeta);
if (count) {
this.parse(0, count);
}
if (numData > numMeta) {
this._insertElements(numMeta, numData - numMeta, resetNewElements);
} else if (numData < numMeta) {
this._removeElements(numData, numMeta - numData);
}
}
_insertElements(start, count, resetNewElements = true) {
const meta = this._cachedMeta;
const data = meta.data;
const end = start + count;
let i;
const move = (arr) => {
arr.length += count;
for (i = arr.length - 1; i >= end; i--) {
arr[i] = arr[i - count];
}
};
move(data);
for (i = start; i < end; ++i) {
data[i] = new this.dataElementType();
}
if (this._parsing) {
move(meta._parsed);
}
this.parse(start, count);
if (resetNewElements) {
this.updateElements(data, start, count, 'reset');
}
}
updateElements(element, start, count, mode) {}
_removeElements(start, count) {
const meta = this._cachedMeta;
if (this._parsing) {
const removed = meta._parsed.splice(start, count);
if (meta._stacked) {
clearStacks(meta, removed);
}
}
meta.data.splice(start, count);
}
_sync(args) {
if (this._parsing) {
this._syncList.push(args);
} else {
const [method, arg1, arg2] = args;
this[method](arg1, arg2);
}
this.chart._dataChanges.push([this.index, ...args]);
}
_onDataPush() {
const count = arguments.length;
this._sync(['_insertElements', this.getDataset().data.length - count, count]);
}
_onDataPop() {
this._sync(['_removeElements', this._cachedMeta.data.length - 1, 1]);
}
_onDataShift() {
this._sync(['_removeElements', 0, 1]);
}
_onDataSplice(start, count) {
if (count) {
this._sync(['_removeElements', start, count]);
}
const newCount = arguments.length - 2;
if (newCount) {
this._sync(['_insertElements', start, newCount]);
}
}
_onDataUnshift() {
this._sync(['_insertElements', 0, arguments.length]);
}
}
DatasetController.defaults = {};
DatasetController.prototype.datasetElementType = null;
DatasetController.prototype.dataElementType = null;
function getAllScaleValues(scale, type) {
if (!scale._cache.$bar) {
const visibleMetas = scale.getMatchingVisibleMetas(type);
let values = [];
for (let i = 0, ilen = visibleMetas.length; i < ilen; i++) {
values = values.concat(visibleMetas[i].controller.getAllParsedValues(scale));
}
scale._cache.$bar = _arrayUnique(values.sort((a, b) => a - b));
}
return scale._cache.$bar;
}
function computeMinSampleSize(meta) {
const scale = meta.iScale;
const values = getAllScaleValues(scale, meta.type);
let min = scale._length;
let i, ilen, curr, prev;
const updateMinAndPrev = () => {
if (curr === 32767 || curr === -32768) {
return;
}
if (defined(prev)) {
min = Math.min(min, Math.abs(curr - prev) || min);
}
prev = curr;
};
for (i = 0, ilen = values.length; i < ilen; ++i) {
curr = scale.getPixelForValue(values[i]);
updateMinAndPrev();
}
prev = undefined;
for (i = 0, ilen = scale.ticks.length; i < ilen; ++i) {
curr = scale.getPixelForTick(i);
updateMinAndPrev();
}
return min;
}
function computeFitCategoryTraits(index, ruler, options, stackCount) {
const thickness = options.barThickness;
let size, ratio;
if (isNullOrUndef(thickness)) {
size = ruler.min * options.categoryPercentage;
ratio = options.barPercentage;
} else {
size = thickness * stackCount;
ratio = 1;
}
return {
chunk: size / stackCount,
ratio,
start: ruler.pixels[index] - (size / 2)
};
}
function computeFlexCategoryTraits(index, ruler, options, stackCount) {
const pixels = ruler.pixels;
const curr = pixels[index];
let prev = index > 0 ? pixels[index - 1] : null;
let next = index < pixels.length - 1 ? pixels[index + 1] : null;
const percent = options.categoryPercentage;
if (prev === null) {
prev = curr - (next === null ? ruler.end - ruler.start : next - curr);
}
if (next === null) {
next = curr + curr - prev;
}
const start = curr - (curr - Math.min(prev, next)) / 2 * percent;
const size = Math.abs(next - prev) / 2 * percent;
return {
chunk: size / stackCount,
ratio: options.barPercentage,
start
};
}
function parseFloatBar(entry, item, vScale, i) {
const startValue = vScale.parse(entry[0], i);
const endValue = vScale.parse(entry[1], i);
const min = Math.min(startValue, endValue);
const max = Math.max(startValue, endValue);
let barStart = min;
let barEnd = max;
if (Math.abs(min) > Math.abs(max)) {
barStart = max;
barEnd = min;
}
item[vScale.axis] = barEnd;
item._custom = {
barStart,
barEnd,
start: startValue,
end: endValue,
min,
max
};
}
function parseValue(entry, item, vScale, i) {
if (isArray(entry)) {
parseFloatBar(entry, item, vScale, i);
} else {
item[vScale.axis] = vScale.parse(entry, i);
}
return item;
}
function parseArrayOrPrimitive(meta, data, start, count) {
const iScale = meta.iScale;
const vScale = meta.vScale;
const labels = iScale.getLabels();
const singleScale = iScale === vScale;
const parsed = [];
let i, ilen, item, entry;
for (i = start, ilen = start + count; i < ilen; ++i) {
entry = data[i];
item = {};
item[iScale.axis] = singleScale || iScale.parse(labels[i], i);
parsed.push(parseValue(entry, item, vScale, i));
}
return parsed;
}
function isFloatBar(custom) {
return custom && custom.barStart !== undefined && custom.barEnd !== undefined;
}
function barSign(size, vScale, actualBase) {
if (size !== 0) {
return sign(size);
}
return (vScale.isHorizontal() ? 1 : -1) * (vScale.min >= actualBase ? 1 : -1);
}
function borderProps(properties) {
let reverse, start, end, top, bottom;
if (properties.horizontal) {
reverse = properties.base > properties.x;
start = 'left';
end = 'right';
} else {
reverse = properties.base < properties.y;
start = 'bottom';
end = 'top';
}
if (reverse) {
top = 'end';
bottom = 'start';
} else {
top = 'start';
bottom = 'end';
}
return {start, end, reverse, top, bottom};
}
function setBorderSkipped(properties, options, stack, index) {
let edge = options.borderSkipped;
const res = {};
if (!edge) {
properties.borderSkipped = res;
return;
}
if (edge === true) {
properties.borderSkipped = {top: true, right: true, bottom: true, left: true};
return;
}
const {start, end, reverse, top, bottom} = borderProps(properties);
if (edge === 'middle' && stack) {
properties.enableBorderRadius = true;
if ((stack._top || 0) === index) {
edge = top;
} else if ((stack._bottom || 0) === index) {
edge = bottom;
} else {
res[parseEdge(bottom, start, end, reverse)] = true;
edge = top;
}
}
res[parseEdge(edge, start, end, reverse)] = true;
properties.borderSkipped = 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 setInflateAmount(properties, {inflateAmount}, ratio) {
properties.inflateAmount = inflateAmount === 'auto'
? ratio === 1 ? 0.33 : 0
: inflateAmount;
}
class BarController extends DatasetController {
parsePrimitiveData(meta, data, start, count) {
return parseArrayOrPrimitive(meta, data, start, count);
}
parseArrayData(meta, data, start, count) {
return parseArrayOrPrimitive(meta, data, start, count);
}
parseObjectData(meta, data, start, count) {
const {iScale, vScale} = meta;
const {xAxisKey = 'x', yAxisKey = 'y'} = this._parsing;
const iAxisKey = iScale.axis === 'x' ? xAxisKey : yAxisKey;
const vAxisKey = vScale.axis === 'x' ? xAxisKey : yAxisKey;
const parsed = [];
let i, ilen, item, obj;
for (i = start, ilen = start + count; i < ilen; ++i) {
obj = data[i];
item = {};
item[iScale.axis] = iScale.parse(resolveObjectKey(obj, iAxisKey), i);
parsed.push(parseValue(resolveObjectKey(obj, vAxisKey), item, vScale, i));
}
return parsed;
}
updateRangeFromParsed(range, scale, parsed, stack) {
super.updateRangeFromParsed(range, scale, parsed, stack);
const custom = parsed._custom;
if (custom && scale === this._cachedMeta.vScale) {
range.min = Math.min(range.min, custom.min);
range.max = Math.max(range.max, custom.max);
}
}
getMaxOverflow() {
return 0;
}
getLabelAndValue(index) {
const meta = this._cachedMeta;
const {iScale, vScale} = meta;
const parsed = this.getParsed(index);
const custom = parsed._custom;
const value = isFloatBar(custom)
? '[' + custom.start + ', ' + custom.end + ']'
: '' + vScale.getLabelForValue(parsed[vScale.axis]);
return {
label: '' + iScale.getLabelForValue(parsed[iScale.axis]),
value
};
}
initialize() {
this.enableOptionSharing = true;
super.initialize();
const meta = this._cachedMeta;
meta.stack = this.getDataset().stack;
}
update(mode) {
const meta = this._cachedMeta;
this.updateElements(meta.data, 0, meta.data.length, mode);
}
updateElements(bars, start, count, mode) {
const reset = mode === 'reset';
const {index, _cachedMeta: {vScale}} = this;
const base = vScale.getBasePixel();
const horizontal = vScale.isHorizontal();
const ruler = this._getRuler();
const {sharedOptions, includeOptions} = this._getSharedOptions(start, mode);
for (let i = start; i < start + count; i++) {
const parsed = this.getParsed(i);
const vpixels = reset || isNullOrUndef(parsed[vScale.axis]) ? {base, head: base} : this._calculateBarValuePixels(i);
const ipixels = this._calculateBarIndexPixels(i, ruler);
const stack = (parsed._stacks || {})[vScale.axis];
const properties = {
horizontal,
base: vpixels.base,
enableBorderRadius: !stack || isFloatBar(parsed._custom) || (index === stack._top || index === stack._bottom),
x: horizontal ? vpixels.head : ipixels.center,
y: horizontal ? ipixels.center : vpixels.head,
height: horizontal ? ipixels.size : Math.abs(vpixels.size),
width: horizontal ? Math.abs(vpixels.size) : ipixels.size
};
if (includeOptions) {
properties.options = sharedOptions || this.resolveDataElementOptions(i, bars[i].active ? 'active' : mode);
}
const options = properties.options || bars[i].options;
setBorderSkipped(properties, options, stack, index);
setInflateAmount(properties, options, ruler.ratio);
this.updateElement(bars[i], i, properties, mode);
}
}
_getStacks(last, dataIndex) {
const {iScale} = this._cachedMeta;
const metasets = iScale.getMatchingVisibleMetas(this._type)
.filter(meta => meta.controller.options.grouped);
const stacked = iScale.options.stacked;
const stacks = [];
const skipNull = (meta) => {
const parsed = meta.controller.getParsed(dataIndex);
const val = parsed && parsed[meta.vScale.axis];
if (isNullOrUndef(val) || isNaN(val)) {
return true;
}
};
for (const meta of metasets) {
if (dataIndex !== undefined && skipNull(meta)) {
continue;
}
if (stacked === false || stacks.indexOf(meta.stack) === -1 ||
(stacked === undefined && meta.stack === undefined)) {
stacks.push(meta.stack);
}
if (meta.index === last) {
break;
}
}
if (!stacks.length) {
stacks.push(undefined);
}
return stacks;
}
_getStackCount(index) {
return this._getStacks(undefined, index).length;
}
_getStackIndex(datasetIndex, name, dataIndex) {
const stacks = this._getStacks(datasetIndex, dataIndex);
const index = (name !== undefined)
? stacks.indexOf(name)
: -1;
return (index === -1)
? stacks.length - 1
: index;
}
_getRuler() {
const opts = this.options;
const meta = this._cachedMeta;
const iScale = meta.iScale;
const pixels = [];
let i, ilen;
for (i = 0, ilen = meta.data.length; i < ilen; ++i) {
pixels.push(iScale.getPixelForValue(this.getParsed(i)[iScale.axis], i));
}
const barThickness = opts.barThickness;
const min = barThickness || computeMinSampleSize(meta);
return {
min,
pixels,
start: iScale._startPixel,
end: iScale._endPixel,
stackCount: this._getStackCount(),
scale: iScale,
grouped: opts.grouped,
ratio: barThickness ? 1 : opts.categoryPercentage * opts.barPercentage
};
}
_calculateBarValuePixels(index) {
const {_cachedMeta: {vScale, _stacked}, options: {base: baseValue, minBarLength}} = this;
const actualBase = baseValue || 0;
const parsed = this.getParsed(index);
const custom = parsed._custom;
const floating = isFloatBar(custom);
let value = parsed[vScale.axis];
let start = 0;
let length = _stacked ? this.applyStack(vScale, parsed, _stacked) : value;
let head, size;
if (length !== value) {
start = length - value;
length = value;
}
if (floating) {
value = custom.barStart;
length = custom.barEnd - custom.barStart;
if (value !== 0 && sign(value) !== sign(custom.barEnd)) {
start = 0;
}
start += value;
}
const startValue = !isNullOrUndef(baseValue) && !floating ? baseValue : start;
let base = vScale.getPixelForValue(startValue);
if (this.chart.getDataVisibility(index)) {
head = vScale.getPixelForValue(start + length);
} else {
head = base;
}
size = head - base;
if (Math.abs(size) < minBarLength) {
size = barSign(size, vScale, actualBase) * minBarLength;
if (value === actualBase) {
base -= size / 2;
}
const startPixel = vScale.getPixelForDecimal(0);
const endPixel = vScale.getPixelForDecimal(1);
const min = Math.min(startPixel, endPixel);
const max = Math.max(startPixel, endPixel);
base = Math.max(Math.min(base, max), min);
head = base + size;
}
if (base === vScale.getPixelForValue(actualBase)) {
const halfGrid = sign(size) * vScale.getLineWidthForValue(actualBase) / 2;
base += halfGrid;
size -= halfGrid;
}
return {
size,
base,
head,
center: head + size / 2
};
}
_calculateBarIndexPixels(index, ruler) {
const scale = ruler.scale;
const options = this.options;
const skipNull = options.skipNull;
const maxBarThickness = valueOrDefault(options.maxBarThickness, Infinity);
let center, size;
if (ruler.grouped) {
const stackCount = skipNull ? this._getStackCount(index) : ruler.stackCount;
const range = options.barThickness === 'flex'
? computeFlexCategoryTraits(index, ruler, options, stackCount)
: computeFitCategoryTraits(index, ruler, options, stackCount);
const stackIndex = this._getStackIndex(this.index, this._cachedMeta.stack, skipNull ? index : undefined);
center = range.start + (range.chunk * stackIndex) + (range.chunk / 2);
size = Math.min(maxBarThickness, range.chunk * range.ratio);
} else {
center = scale.getPixelForValue(this.getParsed(index)[scale.axis], index);
size = Math.min(maxBarThickness, ruler.min * ruler.ratio);
}
return {
base: center - size / 2,
head: center + size / 2,
center,
size
};
}
draw() {
const meta = this._cachedMeta;
const vScale = meta.vScale;
const rects = meta.data;
const ilen = rects.length;
let i = 0;
for (; i < ilen; ++i) {
if (this.getParsed(i)[vScale.axis] !== null) {
rects[i].draw(this._ctx);
}
}
}
}
BarController.id = 'bar';
BarController.defaults = {
datasetElementType: false,
dataElementType: 'bar',
categoryPercentage: 0.8,
barPercentage: 0.9,
grouped: true,
animations: {
numbers: {
type: 'number',
properties: ['x', 'y', 'ba