vue-data-ui
Version:
A user-empowering data visualization Vue 3 components library for eloquent data storytelling
5,212 lines • 188 kB
JavaScript
import { t as e } from "./rolldown-runtime-Dy4uBu1J.js";
import { $ as t, A as n, B as r, Bt as i, Ct as a, D as o, Et as s, G as c, Gt as l, H as u, I as ee, Jt as te, Kt as ne, L as re, Lt as d, M as f, N as ie, P as ae, Pt as oe, S as se, St as ce, U as le, V as ue, Vt as de, W as fe, X as pe, _ as me, b as p, c as m, d as h, dt as he, i as g, jt as ge, k as _e, l as ve, n as ye, o as be, ot as _, q as xe, qt as Se, r as Ce, tt as we, v as Te, vt as Ee, w as De, xt as Oe, z as ke, zt as Ae } from "./lib-Bttd6u5E.js";
import { n as je, t as Me } from "./useHints-Dq_w2E8B.js";
import { n as Ne, r as Pe, t as Fe } from "./useTimeLabels-d2f-W1L4.js";
import { t as Ie } from "./useConfig-D3scuR88.js";
import { t as Le } from "./usePrinter-DN5bYhTG.js";
import { n as Re, t as ze } from "./BaseScanner-DZvpgOjM.js";
import { t as Be } from "./useSvgExport-DH-FfcqQ.js";
import { t as Ve } from "./useNestedProp-vPNvh7rV.js";
import { t as He } from "./useThemeCheck-C43Tcqmk.js";
import { t as Ue } from "./useTransitions-g_zBREk2.js";
import { t as We } from "./useStableElementSize-C7KADDKj.js";
import { t as Ge } from "./useTimeLabelCollider-AEcY4Ioe.js";
import { t as Ke } from "./img-Bnokohej.js";
import { n as qe } from "./Title-BE3qg9xl.js";
import { t as Je } from "./vue_ui_xy-BA3-_LCx.js";
import { t as Ye } from "./Shape-C21CMlWS.js";
import { t as Xe } from "./_plugin-vue_export-helper-B3ysoDQm.js";
import { t as Ze } from "./DefGrad-DVBqDjhO.js";
import { t as Qe } from "./SlicerPreview-wUw1hFwe.js";
import { t as $e } from "./vue-ui-accordion-BxGriZik.js";
import { t as et } from "./BaseLegendToggle-DZVucLnv.js";
import { t as tt } from "./A11yDataTable-DdRsVULz.js";
import { Fragment as v, Teleport as nt, computed as y, createBlock as rt, createCommentVNode as b, createElementBlock as x, createElementVNode as S, createSlots as it, createTextVNode as at, createVNode as ot, defineAsyncComponent as st, getCurrentInstance as ct, guardReactiveProps as lt, mergeProps as ut, nextTick as dt, normalizeClass as C, normalizeProps as ft, normalizeStyle as w, onBeforeUnmount as pt, onMounted as mt, openBlock as T, ref as E, renderList as D, renderSlot as O, resolveDynamicComponent as ht, shallowRef as gt, toDisplayString as k, toRefs as _t, unref as A, useSlots as vt, vModelCheckbox as yt, watch as bt, watchEffect as xt, withCtx as j, withDirectives as St } from "vue";
//#region src/utils/xy.js
function Ct(e) {
return ![
null,
void 0,
NaN,
Infinity,
-Infinity
].includes(e);
}
function wt(e, t) {
let n = jt(e), r = Array(n).fill(0);
for (let e = 0; e < t.length && e < n; e += 1) r[e] = t[e] ?? null;
return r;
}
function Tt(e, t) {
let n = Object.create(null);
for (let r = 0; r < e.length; r += 1) {
let i = e[r], a = String(t(i));
n[a] || (n[a] = []), n[a].push(i);
}
return n;
}
function Et(e) {
return e && typeof e == "object" && Number.isFinite(Number(e.x)) && Number.isFinite(Number(e.y));
}
function Dt(e, t) {
let n = Number(e), r = Number(t);
return !Number.isFinite(n) || !Number.isFinite(r) ? !1 : !Object.is(n, r);
}
function Ot(e) {
let t = /* @__PURE__ */ new WeakMap();
return (n, ...r) => {
let i = t.get(n), a = JSON.stringify(r);
if (i && i.has(a)) return i.get(a);
let o = e(n, ...r);
return i || (i = /* @__PURE__ */ new Map(), t.set(n, i)), i.set(a, o), o;
};
}
function kt(e, t) {
let n = Number.isFinite(e) ? e : 0, r = Number.isFinite(t) ? t : 1;
return n === r ? r = n + 1 : n > r && ([n, r] = [r, n]), {
min: n,
max: r
};
}
function At(e, t, n = 0) {
return Number.isFinite(e) && Number.isFinite(t) && Math.abs(t) > 1e-9 ? e / t : n;
}
function jt(e) {
return Number.isFinite(e) ? Math.max(0, Math.floor(e)) : 0;
}
//#endregion
//#region src/components/vue-ui-xy.vue
var Mt = /* @__PURE__ */ e({ default: () => M }), Nt = ["id"], Pt = ["id"], Ft = ["id"], It = { style: { position: "relative" } }, Lt = [
"viewBox",
"aria-label",
"aria-describedby"
], Rt = [
"x",
"y",
"width",
"height"
], zt = { key: 1 }, Bt = { class: "vue-ui-xy-grid" }, Vt = [
"stroke",
"x1",
"x2",
"y1",
"y2"
], Ht = [
"stroke",
"x1",
"x2",
"y1",
"y2"
], Ut = { key: 1 }, Wt = [
"x1",
"x2",
"y1",
"y2",
"stroke"
], Gt = [
"x1",
"x2",
"y1",
"y2",
"stroke"
], Kt = [
"x1",
"x2",
"y1",
"y2",
"stroke"
], qt = { key: 3 }, Jt = ["d", "stroke"], Yt = { key: 4 }, Xt = ["d", "stroke"], Zt = { key: 0 }, Qt = ["id"], $t = ["stop-color", "offset"], en = [
"x",
"y",
"height",
"width",
"fill"
], tn = [
"x",
"y",
"width"
], nn = { key: 0 }, rn = [
"x",
"y",
"height",
"width",
"fill"
], an = [
"x",
"y",
"height",
"width",
"rx",
"fill",
"stroke",
"stroke-width"
], on = [
"x",
"y",
"height",
"width",
"rx",
"fill",
"stroke",
"stroke-width"
], sn = [
"width",
"x",
"y"
], cn = [
"stroke",
"x1",
"x2",
"y1",
"y2"
], ln = { key: 3 }, un = [
"x1",
"x2",
"y1",
"y2",
"stroke",
"stroke-width",
"stroke-dasharray"
], dn = {
key: 4,
class: "vue-ui-xy-crosshair-selection"
}, fn = [
"x1",
"x2",
"y1",
"y2",
"stroke",
"stroke-width",
"stroke-dasharray"
], pn = [
"x1",
"x2",
"y1",
"y2",
"stroke",
"stroke-width",
"stroke-dasharray"
], mn = [
"cx",
"cy",
"r",
"fill",
"stroke",
"stroke-width"
], hn = [
"x",
"y",
"width",
"height",
"stroke",
"stroke-width",
"stroke-linecap",
"stroke-linejoin",
"stroke-dasharray"
], gn = ["opacity"], _n = [
"x1",
"x2",
"y1",
"y2",
"stroke",
"stroke-width"
], vn = [
"fill",
"font-size",
"transform"
], yn = [
"x1",
"x2",
"y1",
"y2",
"stroke"
], bn = [
"transform",
"text-anchor",
"font-size",
"fill"
], xn = [
"x1",
"x2",
"y1",
"y2",
"stroke"
], Sn = [
"transform",
"font-size",
"text-anchor",
"fill"
], Cn = {
key: 7,
class: "vue-ui-xy-crosshair-selection"
}, wn = [
"transform",
"font-size",
"text-anchor",
"fill"
], Tn = {
key: 8,
class: "vue-ui-xy-crosshair-selection"
}, En = [
"cx",
"cy",
"r",
"fill",
"stroke",
"stroke-width"
], Dn = [
"width",
"x",
"y"
], On = { style: { width: "100%" } }, kn = [
"d",
"stroke",
"stroke-width",
"stroke-dasharray"
], An = [
"d",
"stroke",
"stroke-width",
"stroke-dasharray"
], jn = [
"d",
"stroke",
"stroke-width",
"stroke-dasharray"
], Mn = [
"d",
"stroke",
"stroke-width",
"stroke-dasharray"
], Nn = { key: 9 }, Pn = { key: 10 }, Fn = [
"d",
"fill",
"fill-opacity"
], In = { key: 0 }, Ln = ["d", "fill"], Rn = ["d", "fill"], zn = ["d", "fill"], Bn = ["d", "fill"], Vn = [
"d",
"stroke",
"stroke-width",
"stroke-dasharray"
], Hn = [
"d",
"stroke",
"stroke-width",
"stroke-dasharray"
], Un = [
"d",
"stroke",
"stroke-width",
"stroke-dasharray"
], Wn = [
"d",
"stroke",
"stroke-width",
"stroke-dasharray"
], Gn = [
"width",
"x",
"y"
], Kn = { style: { width: "100%" } }, qn = { key: 11 }, Jn = [
"text-anchor",
"font-size",
"transform",
"fill",
"stroke",
"innerHTML"
], Yn = [
"transform",
"font-size",
"fill",
"font-weight"
], Xn = { key: 12 }, Zn = [
"transform",
"text-anchor",
"font-size",
"fill",
"stroke",
"innerHTML"
], Qn = { key: 13 }, $n = ["x", "y"], er = ["innerHTML"], tr = ["x", "y"], nr = ["innerHTML"], rr = [
"x1",
"x2",
"y1",
"y2",
"stroke"
], ir = { key: 14 }, ar = [
"transform",
"text-anchor",
"font-size",
"fill",
"stroke",
"innerHTML"
], or = { key: 15 }, sr = ["x", "y"], cr = ["innerHTML"], lr = ["x", "y"], ur = ["innerHTML"], dr = [
"x1",
"x2",
"y1",
"y2",
"stroke"
], fr = [
"x",
"y",
"font-size",
"fill",
"innerHTML"
], pr = [
"x",
"y",
"font-size",
"fill",
"innerHTML"
], mr = [
"x",
"y",
"font-size",
"fill",
"innerHTML"
], hr = [
"x",
"y",
"font-size",
"fill",
"innerHTML"
], gr = { key: 0 }, _r = ["id"], vr = ["fill", "stroke"], yr = [
"x1",
"x2",
"y1",
"y2",
"stroke",
"marker-end"
], br = [
"x1",
"x2",
"y1",
"y2",
"stroke",
"marker-end"
], xr = [
"transform",
"font-size",
"fill",
"stroke"
], Sr = [
"x",
"y",
"width",
"height",
"fill",
"onMouseenter"
], Cr = [
"font-size",
"fill",
"transform"
], wr = [
"x",
"y",
"font-size",
"fill"
], Tr = ["opacity"], Er = [
"text-anchor",
"font-size",
"fill",
"transform",
"onClick"
], Dr = [
"text-anchor",
"font-size",
"fill",
"transform",
"innerHTML",
"onClick"
], Or = { key: 18 }, kr = [
"text-anchor",
"font-size",
"fill",
"transform",
"innerHTML"
], Ar = { key: 19 }, jr = [
"x1",
"y1",
"x2",
"y2",
"stroke",
"stroke-width",
"stroke-dasharray"
], Mr = [
"x1",
"y1",
"x2",
"y2",
"stroke",
"stroke-width",
"stroke-dasharray"
], Nr = [
"y",
"x",
"width",
"height",
"fill"
], Pr = [
"id",
"transform",
"font-size",
"fill",
"text-anchor"
], Fr = {
key: 20,
style: { "pointer-events": "none" }
}, Ir = ["x", "y"], Lr = ["innerHTML"], Rr = [
"cx",
"cy",
"r",
"fill"
], zr = ["data-start", "data-end"], Br = {
key: 0,
style: {
position: "absolute",
top: "100%",
left: "0",
width: "100%"
},
"data-dom-to-png-ignore": "",
"aria-hidden": "true"
}, Vr = {
key: 5,
class: "vue-data-ui-watermark"
}, Hr = {
class: "vue-ui-xy-tag-arrow",
height: "20",
viewBox: "0 0 10 20",
style: {
position: "absolute",
right: "100%",
top: "50%",
transform: "translateY(-50%)"
}
}, Ur = ["fill"], Wr = ["innerHTML"], Gr = {
class: "vue-ui-xy-tag-arrow",
height: "100%",
viewBox: "0 0 10 20",
style: {
position: "absolute",
left: "100%",
top: "50%",
transform: "translateY(-50%)"
}
}, Kr = ["fill"], qr = ["innerHTML"], Jr = {
class: "vue-ui-xy-tag-arrow",
height: "20",
viewBox: "0 0 10 20",
style: {
position: "absolute",
right: "100%",
top: "50%",
transform: "translateY(-50%)"
}
}, Yr = ["fill"], Xr = ["innerHTML"], Zr = {
class: "vue-ui-xy-tag-arrow",
height: "100%",
viewBox: "0 0 10 20",
style: {
position: "absolute",
left: "100%",
top: "50%",
transform: "translateY(-50%)"
}
}, Qr = ["fill"], $r = ["innerHTML"], ei = ["id"], ti = ["onClick", "onKeydown"], ni = {
key: 0,
viewBox: "0 0 20 12",
height: "1em",
width: "1.43em",
"aria-hidden": "true"
}, ri = ["stroke", "fill"], ii = {
key: 1,
viewBox: "0 0 40 40",
height: "1em",
width: "1em",
"aria-hidden": "true"
}, ai = ["fill"], oi = ["fill"], si = {
key: 2,
viewBox: "0 0 12 12",
height: "1em",
width: "1em",
"aria-hidden": "true"
}, ci = {
style: {
display: "flex",
"flex-direction": "row",
gap: "6px",
"align-items": "center",
"padding-left": "6px"
},
"data-dom-to-png-ignore": ""
}, li = ["innerHTML"], M = /*#__PURE__*/ Xe({
__name: "vue-ui-xy",
props: {
config: {
type: Object,
default() {
return {};
}
},
dataset: {
type: Array,
default() {
return [];
}
},
selectedXIndex: {
type: Number,
default: void 0
}
},
emits: [
"selectTimeLabel",
"selectX",
"selectLegend",
"zoomStart",
"zoomEnd",
"zoomReset",
"copyAlt"
],
setup(e, { expose: Xe, emit: Mt }) {
let M = e, ui = st(() => import("./DataTable-BbKgJ5UI.js")), di = st(() => import("./Tooltip-DhjyfHwz.js")), fi = st(() => import("./UserOptions-Dt98of5H.js").then((e) => e.n)), pi = st(() => import("./BaseIcon-BfndwIWE.js").then((e) => e.n)), mi = st(() => import("./vue-ui-table-sparkline-iRFmtK5S.js").then((e) => e.n)), hi = st(() => import("./PackageVersion-D6d8SCp9.js").then((e) => e.t)), gi = st(() => import("./PenAndPaper-DAE-tnEQ.js").then((e) => e.t)), _i = st(() => import("./BaseDraggableDialog-LoqqwRtV.js").then((e) => e.n)), vi = Mt, yi = vt(), bi = ct(), { vue_ui_xy: xi } = Ie(), { isThemeValid: Si, warnInvalidTheme: Ci } = He(), wi = E(null), Ti = E(null), Ei = E(null), Di = E(null), Oi = E(null), ki = E(null), Ai = E(null), ji = E(null), Mi = E(null), Ni = E(null), Pi = E(null), Fi = E(null), Ii = E(null), Li = E(null), Ri = E(0), N = E(null), zi = E(!0), Bi = E(600), P = E(1e3), Vi = E("0 0 1000 600"), Hi = E({
x: 0,
y: 0
}), Ui = E({
line: "line",
bar: "bar",
plot: "plot"
}), Wi = E(!1), Gi = E(!1), Ki = E(!1), qi = E(null), Ji = E([]), Yi = y(() => new Set(Ji.value)), F = E(xe()), Xi = E(0), Zi = E(0), Qi = E(0), $i = E(!0), ea = E(0), I = E(null), ta = E(!1), na = E(!0), ra = E(!0), L = E(null), ia = E({}), aa = E(null), oa = E(!1), sa = E(null), ca = E(!1), la = E(!1), ua = E(null), R = E(null), da = E(null), fa = E({
x: 0,
y: 0
}), pa = E(null), ma = E(null), z = E(null), ha = E(null), ga = E(null), _a = gt(null), va = E(!1), ya = E(0), ba = E(0), xa = We({
elementRef: _a,
minimumWidth: 2,
minimumHeight: 2,
stableFramesRequired: 2,
once: !1,
onSizeAccepted: () => {
wa();
}
});
function Sa() {
_a.value = wi.value?.parentNode ?? null;
}
function Ca() {
return new Promise((e) => {
requestAnimationFrame(() => {
requestAnimationFrame(e);
});
});
}
async function wa() {
let e = ++ba.value;
va.value = !1, await dt(), await Ca(), await Ca(), e === ba.value && (ya.value += 1, va.value = !0);
}
let Ta = E(!1);
function Ea() {
Ta.value || (Ta.value = !0, dt(() => {
Ta.value = !1, Sa(), wa();
}));
}
let Da = y(() => ({
height: Bi.value,
width: P.value
})), Oa = E(!1), ka = E(null), Aa = E(null), B = E({
xAxis: 18,
yAxis: 12,
dataLabels: 20,
plotLabels: 10
}), ja = E({
plot: 3,
line: 3,
selectedLine: 3
}), Ma = y(() => Math.max(ja.value.line * 1.5, ja.value.selectedLine));
mt(() => {
oa.value = !0, M.dataset.length && M.dataset.forEach((e, t) => {
[null, void 0].includes(e.series) && we({
componentName: "VueUiXy",
type: "datasetSerieAttribute",
property: "series (number[])",
index: t,
debug: za.value
});
}), Sa(), xa.start(), wa();
});
function Na() {
if (!Object.keys(M.config || {}).length) return xi;
let e = Ve({
userConfig: M.config,
defaultConfig: xi
});
M.config && Ee(M.config, "chart.highlightArea") && (Array.isArray(M.config.chart.highlightArea) ? e.chart.highlightArea = M.config.chart.highlightArea : e.chart.highlightArea = [M.config.chart.highlightArea]), M.config && Ee(M.config, "chart.annotations") && Array.isArray(M.config.chart.annotations) && M.config.chart.annotations.length ? e.chart.annotations = M.config.chart.annotations.map((e) => Ve({
defaultConfig: xi.chart.annotations[0],
userConfig: e
})) : e.chart.annotations = [], M.config && Ee(M.config, "chart.grid.position") && M.config.chart.grid.position === "start" && M.dataset.length && M.dataset.some((e) => e.type === "bar") && (e.chart.grid.position = "middle", Ee(M.config, "debug") && console.warn("Vue Data UI - VueUiXy - config.chart.grid.position was overriden to `middle` because your dataset contains a bar")), M.config && Ee(M.config, "chart.highlightArea") && (Array.isArray(M.config.chart.highlightArea) ? e.chart.highlightArea = M.config.chart.highlightArea.map((e) => Pa({
defaultConfig: xi.chart.highlightArea,
userConfig: e
})) : e.chart.highlightArea = Pa({
defaultConfig: xi.chart.highlightArea,
userConfig: M.config.chart.highlightArea
}));
let t = e.theme;
if (!t) return e;
if (!Si.value(e)) return Ci(e), e;
let n = Ve({
userConfig: Je[t] || M.config,
defaultConfig: e
}), r = Ve({
userConfig: M.config,
defaultConfig: n
});
return {
...r,
customPalette: r.customPalette.length ? r.customPalette : ne[t] || oe
};
}
function Pa({ defaultConfig: e, userConfig: t }) {
return Ve({
defaultConfig: e,
userConfig: t
});
}
let Fa = y({
get() {
return !!M.dataset && M.dataset.length;
},
set(e) {
return e;
}
}), V = E(Na());
je({
config: () => V.value,
dataset: () => M.dataset,
component: "VueUiXy",
rules: [
Me.emptyArray,
{
test: (e) => e.some((e) => e.series.length > 365),
message: [
"👀 One or more series have more than 365 datapoints. Consider if you really need this level of detail.",
"",
"▶️ Use larger time scales, or aggregated values",
"",
"▶️ Filter the time range by adding date inputs in your UI."
]
},
{
test: (e) => e.some((e) => e.series.length > 1095),
message: [
"👀 One or more series have more than 1095 datapoints. Above this threshold, the dataset is computed through an LTTB algorithm, to preserve the shape of the data without increasing the number of datapoints.",
"",
"▶️ If you need this level of detail, you can change config.downsample.threshold and set a higher value. Note that performance will be impacted."
]
},
{
test: (e) => e.length > 6,
message: [
"👀 The number of series is greater than 6. If your chart is hard to read, you might consider other ways of charting the data:",
"",
"▶️ A summary table with sparklines (custom, with VueUiSparkline), or VueUiTableSparkline.",
"",
"▶️ Individual charts for individual series, or fewer series with comparable scopes.",
"",
"▶️ Add filters to reduce the number of visible series on the chart, to reduce cognitive load."
]
}
]
});
let { transitionEnabled: Ia } = Ue({
config: () => V.value.transitions,
dataset: () => M.dataset
}), La = y(() => V.value.chart.userOptions.useCursorPointer), H = E({
dataLabels: { show: !0 },
showTooltip: !0,
showTable: !1,
isStacked: !1,
useIndividualScale: !1
});
function Ra() {
let e = V.value.chart.grid.labels.yAxis.stacked, t = V.value.chart.grid.labels.yAxis.useIndividualScale;
if (!Oa.value) {
H.value = {
dataLabels: { show: !0 },
showTooltip: V.value.chart.tooltip.show === !0,
showTable: V.value.showTable === !0,
isStacked: e,
useIndividualScale: t
}, ka.value = e, Aa.value = t, Oa.value = !0;
return;
}
H.value.showTooltip = V.value.chart.tooltip.show === !0, e !== ka.value && (H.value.isStacked = e, ka.value = e), t !== Aa.value && (H.value.useIndividualScale = t, Aa.value = t), H.value.isStacked && (H.value.useIndividualScale = !0);
}
let za = y(() => !!V.value.debug), Ba = y(() => te({
defaultConfig: {
useCssAnimation: !1,
showTable: !1,
chart: {
annotations: [],
highlightArea: [],
backgroundColor: "#99999930",
grid: {
stroke: "#6A6A6A",
labels: {
show: !1,
axis: {
yLabel: "",
xLabel: ""
},
xAxisLabels: { show: !1 },
yAxis: {
commonScaleSteps: 10,
useNiceScale: !0,
scaleMin: 0,
scaleMax: 134
},
zeroLine: { show: !0 }
}
},
padding: {
top: 12,
bottom: 24,
left: 24,
right: 24
},
userOptions: { show: !1 },
zoom: {
show: !1,
startIndex: null,
endIndex: null
}
},
bar: {
serieName: { show: !1 },
labels: { show: !1 },
border: {
useSerieColor: !1,
stroke: "#999999"
}
},
line: {
dot: {
useSerieColor: !1,
fill: "#8A8A8A"
},
labels: { show: !1 }
}
},
userConfig: V.value.skeletonConfig ?? {}
})), Va = y(() => M.config?.skeletonDataset ?? [{
name: "",
series: [
0,
1,
2,
3,
5,
8,
13,
21,
34,
55,
89,
134
],
type: "line",
smooth: !0,
color: "#BABABA"
}, {
name: "",
series: [
0,
.5,
1,
1.5,
2.5,
4,
6.5,
10.5,
17,
27.5,
44.5,
67
],
type: "bar",
color: "#CACACA"
}]), { loading: Ha, FINAL_DATASET: Ua, manualLoading: Wa } = Re({
..._t(M),
FINAL_CONFIG: V,
prepareConfig: Na,
callback: () => {
Promise.resolve().then(async () => {
(!V.value.chart.zoom.keepState || !as.value || U.value.start === 0 && U.value.end === 0) && await cs(), H.value.showTable = V.value.showTable;
});
},
skeletonDataset: Va.value,
skeletonConfig: te({
defaultConfig: V.value,
userConfig: Ba.value
})
}), Ga = Ot((e, t) => s({
data: e,
threshold: t
})), Ka = (e) => Ga(e, V.value.downsample.threshold), qa = y(() => {
let e = V.value.downsample.threshold;
return Ua.value.map((t) => Ga(t.series, e).length);
}), Ja = y(() => {
let e = -Infinity;
for (let t = 0; t < qa.value.length; t += 1) {
let n = qa.value[t];
n > e && (e = n);
}
return e;
}), Ya = y(() => {
let e = 0;
for (let t = 0; t < qa.value.length; t += 1) {
let n = qa.value[t];
n > e && (e = n);
}
return e;
}), Xa = y(() => Ja.value), U = E({
start: 0,
end: Xa.value
}), Za = E({
start: 0,
end: Xa.value
}), Qa = y(() => V.value.chart.zoom.preview.enable && (Za.value.start !== U.value.start || Za.value.end !== U.value.end));
function $a(e, t) {
Za.value[e] = t;
}
function eo() {
if (G.value) {
let e = nl.value.min, t = nl.value.max, n = Number(U.value.start), r = Number(U.value.end);
Number.isFinite(n) || (n = e), Number.isFinite(r) || (r = t), n = Math.max(e, Math.min(n, t)), r = Math.max(n, Math.min(r, t)), r <= n && (n = e, r = t), U.value = {
start: n,
end: r
}, Za.value.start = n, Za.value.end = r, Ei.value && (Ei.value.setStartValue(n), Ei.value.setEndValue(r));
return;
}
let e = Math.max(1, ...Ua.value.map((e) => Ka(e.series).length)), t = Math.max(0, Math.min(U.value.start ?? 0, e - 1)), n = Math.max(t + 1, Math.min(U.value.end ?? e, e));
(!Number.isFinite(t) || !Number.isFinite(n) || n <= t) && (t = 0, n = e), U.value = {
start: t,
end: n
}, Za.value.start = t, Za.value.end = n, Ei.value && (Ei.value.setStartValue(t), Ei.value.setEndValue(n));
}
let to = y(() => {
let { left: e, top: t, width: n, height: r } = J.value, i = U.value.start, a = U.value.end - i, o = n / a, s = Za.value.start - i, c = Za.value.end - i, l = Math.max(0, Math.min(a, s)), u = Math.max(0, Math.min(a, c));
return {
x: e + l * o,
y: t,
width: (u - l) * o,
height: r,
fill: V.value.chart.zoom.preview.fill,
stroke: V.value.chart.zoom.preview.stroke,
"stroke-width": V.value.chart.zoom.preview.strokeWidth,
"stroke-dasharray": V.value.chart.zoom.preview.strokeDasharray,
"stroke-linecap": "round",
"stroke-linejoin": "round",
style: {
pointerEvents: "none",
transition: "none !important",
animation: "none !important"
}
};
});
bt(() => M.selectedXIndex, (e) => {
if ([null, void 0].includes(M.selectedXIndex)) {
R.value = null;
return;
}
let t = e - U.value.start;
t < 0 || e >= U.value.end ? R.value = null : R.value = t ?? null;
}, { immediate: !0 });
let { isPrinting: no, isImaging: ro, generatePdf: io, generateImage: ao } = Le({
elementId: `vue-ui-xy_${F.value}`,
fileName: V.value.chart.title.text || "vue-ui-xy",
options: V.value.chart.userOptions.print
}), oo = E(!1), so = y(() => De(V.value.customPalette)), co = y(() => {
let e = V.value.chart.grid.labels.yAxis.scaleMin;
if (e == null) return null;
let t = Number(e);
return Number.isFinite(t) ? t : null;
}), lo = y(() => co.value === null ? Os.value : J.value.bottom), uo = y(() => {
let e = V.value.chart.grid.labels.yAxis.scaleMax;
if (e == null) return null;
let t = Number(e);
return Number.isFinite(t) ? t : null;
}), fo = y(() => co.value !== null || uo.value !== null), po = y(() => Gc(So.value.filter((e) => !Yi.value.has(e.id)), 0, 1)), mo = y(() => {
let { min: e, max: t } = po.value;
if (!fo.value) {
let t = e;
return t > 0 ? 0 : t;
}
let n = co.value === null ? e > 0 ? 0 : e : co.value, r = uo.value === null ? t : uo.value;
return kt(e < n ? e : n, t > r ? t : r).min;
}), ho = y(() => {
let { min: e, max: t } = po.value;
if (!fo.value) {
let e = t;
return mo.value === e ? e + 1 : e;
}
let n = co.value === null ? e > 0 ? 0 : e : co.value, r = uo.value === null ? t : uo.value;
return kt(e < n ? e : n, t > r ? t : r).max;
}), W = y(() => V.value.chart.grid.labels.yAxis.useNiceScale ? me(mo.value, ho.value < 0 ? 0 : ho.value, V.value.chart.grid.labels.yAxis.commonScaleSteps) : Te(mo.value, ho.value < 0 ? 0 : ho.value, V.value.chart.grid.labels.yAxis.commonScaleSteps)), go = y(() => [null, void 0].includes(V.value.chart.grid.labels.yAxis.scaleMin) ? W.value.min >= 0 ? 0 : Math.abs(W.value.min) : -W.value.min), G = y(() => Ua.value.some((e) => Array.isArray(e.series) && e.series.some(Et)));
xt(() => {
G.value && Ua.value.some((e) => !yo(e)) && console.warn("Vue Data UI - VueUiXy: mixed continuous and non-continuous series are not supported in the same chart.\n\nContinuous mode requires all visible 'line' and 'plot' series to use coordinate-based datasets:\n[{ x: number, y: number }]\n\nSeries of type 'bar' and standard numeric series are ignored in continuous mode to prevent runtime errors.\n\nIf you need to mix 'bar', 'line', and 'plot' series in the same chart, all series must use the standard [number, number, number...] format.");
});
function _o(e) {
return e && typeof e == "object" && e.x === null && e.y === null;
}
function vo(e) {
return Array.isArray(e) && e.some((e) => Et(e) || _o(e));
}
function yo(e) {
return !G.value || ["line", "plot"].includes(e.type) && vo(e.series);
}
function bo(e, t) {
return _o(e) ? {
x: null,
y: null,
index: t,
raw: e,
isNull: !0
} : !e || typeof e != "object" ? {
x: null,
y: null,
index: t,
raw: e,
isNull: !0,
isInvalid: !0
} : {
x: Number(e.x),
y: ce(e.y) ? Number(e.y) : null,
index: t,
raw: e,
isNull: !1,
isInvalid: !1
};
}
function xo(e) {
return G.value ? e && typeof e == "object" ? e.y : null : e;
}
let So = y(() => !zi.value && !G.value ? Ua.value : Ua.value.map((e, t) => {
let n = `uniqueId_${t}`, r = yo(e), i = G.value ? r ? e.series : [] : Ka(e.series);
return {
...e,
slotAbsoluteIndex: t,
series: G.value ? i.map((e, t) => bo(e, t)).filter((e) => e.isInvalid ? !1 : e.x === null && e.y === null ? U.value.start <= 0 && U.value.end >= 0 : e.x >= U.value.start && e.x <= U.value.end) : i.map((e) => ce(e) ? e : null).slice(U.value.start, U.value.end),
color: se(e.color ? e.color : so.value[t] ? so.value[t] : oe[t]),
id: n,
scaleLabel: e.scaleLabel || n
};
})), Co = y(() => So.value.map((e, t) => ({
absoluteIndex: t,
...e,
series: G.value ? e.series.map((e) => ({
...e,
y: e.y === null ? null : e.y + go.value
})) : e.series.map((e) => e + go.value),
absoluteValues: G.value ? e.series.map((e) => e.y) : e.series,
segregate: () => nc(e),
isSegregated: Yi.value.has(e.id)
}))), K = y(() => So.value.map((e) => ({
...e,
series: G.value ? e.series.map((e) => ({
...e,
y: e.y === null ? null : e.y + go.value
})) : e.series.map((e) => e + go.value),
absoluteValues: G.value ? e.series.map((e) => e.y) : e.series
})).filter((e) => !Yi.value.has(e.id))), wo = y(() => Ji.value.length === Co.value.length), q = y(() => V.value.chart.grid.labels.yAxis.position === "right");
function To() {
let e = 0;
Pi.value && (e = Array.from(Pi.value.querySelectorAll("text")).reduce((e, t) => {
let n = t.getComputedTextLength();
return n > e ? n : e;
}, 0));
let t = Mi.value ? Mi.value.getBoundingClientRect().width + V.value.chart.grid.labels.axis.yLabelOffsetX + B.value.yAxis : 0, n = e + V.value.chart.grid.labels.yAxis.scaleValueOffsetX + V.value.chart.grid.labels.yAxis.crosshairSize;
return {
left: q.value ? 0 : n + t,
right: q.value ? n + t : 0,
scaleLabelsOffset: n,
yAxisLabelWidth: t
};
}
function Eo(e) {
let t = Hs(e);
if (!t) {
Z.value = [], Bs.value = null, ua.value = null;
return;
}
let n = Number(t.point.x), r = Vs.value.matchingPointsByXValue.get(n) || [];
Z.value = r.map((e) => ({
...e,
distance: 0
})), Bs.value = tl({ x: n }), ua.value = n;
}
function Do(e) {
if (!Number.isFinite(Number(e))) {
Z.value = [], Bs.value = null;
return;
}
let t = tl({ x: Number(e) });
Eo(t), Bs.value = t;
}
let Oo = E(0), ko = E(0);
function Ao() {
let e = Ni.value;
if (!e) {
Oo.value = 0, ko.value = 0;
return;
}
try {
let t = e.getBBox();
Oo.value = t?.height ?? 0, ko.value = t?.x ?? 0;
} catch {
Oo.value = 0, ko.value = 0;
}
}
let jo = y(() => {
let e = 0;
if (ji.value) try {
e = ji.value.getBBox().height || 0;
} catch {
e = 0;
}
return e + Oo.value + B.value.xAxis;
}), Mo = y(() => Ua.value.some((e) => e.useProgression));
function No() {
return V.value.chart.grid.labels.yAxis.crosshairSize + V.value.chart.grid.labels.yAxis.scaleValueOffsetX + 5 + V.value.chart.grid.labels.yAxis.labelWidth + V.value.chart.grid.labels.axis.yLabelOffsetX + B.value.dataLabels * .8;
}
let J = y(() => {
ya.value;
let e = 0, t = 0, n = 0, r = 0;
if (V.value.chart.grid.labels.show) if (H.value.useIndividualScale && !H.value.isStacked) q.value ? t = (Ua.value.length - Ji.value.length) * No() : e = (Ua.value.length - Ji.value.length) * (V.value.chart.grid.labels.yAxis.labelWidth + 36);
else if (H.value.useIndividualScale && H.value.isStacked) {
let n = V.value.chart.grid.labels.yAxis.labelWidth + 36;
q.value ? t = n : e = n;
} else {
let i = To();
e = i.left, t = i.right, n = i.scaleLabelsOffset, r = i.yAxisLabelWidth;
}
let i = V.value.chart.labels.fontSize * 1.1, a = Mo.value ? 24 : 6;
Ni.value && ko.value < 0 && (e += Math.abs(ko.value));
let o = P.value - e - t - a - V.value.chart.padding?.left - V.value.chart.padding?.right;
return {
top: V.value.chart.padding?.top + i,
right: e + (q.value ? 0 : V.value.chart.grid.labels.yAxis.crosshairSize) + V.value.chart.padding?.left + o,
bottom: Bi.value - jo.value - V.value.chart.padding?.bottom - V.value.chart.grid.labels.axis.xLabelOffsetY,
left: e + (q.value ? 0 : V.value.chart.grid.labels.yAxis.crosshairSize) + V.value.chart.padding?.left,
height: Bi.value - jo.value - V.value.chart.padding?.top - V.value.chart.padding?.bottom - i - V.value.chart.grid.labels.axis.xLabelOffsetY,
width: o,
scaleLabelX: e,
rightScaleLabelX: t,
scaleLabelsOffset: n,
yAxisLabelWidth: r,
individualOffsetX: 36
};
}), Po = y(() => {
let e = +(V.value.chart.grid.position === "middle"), t = X.value + e, n = _(J.value?.top), r = _(J.value?.bottom);
return G.value ? V.value.chart.grid.position === "middle" ? $c.value.map((e, t, i) => {
if (t === 0) return null;
let a = i[t - 1], o = a.x + (e.x - a.x) / 2;
return `M${o},${n} L${o},${r}`;
}).filter(Boolean).join(" ") : $c.value.map((e) => `M${e.x},${n} L${e.x},${r}`).join(" ") : Array.from({ length: t }).map((e, t) => {
let i = V.value.chart.grid.position === "middle" ? gc(t) : hc(t);
return `M${i},${n} L${i},${r}`;
}).join(" ");
}), Fo = y(() => {
if (!V.value.chart.grid.labels.xAxis.showCrosshairs) return "";
let e = V.value.chart.grid.labels.xAxis.crosshairSize, t = V.value.chart.grid.labels.xAxis.crosshairsAlwaysAtZero;
return (G.value ? $c.value : Yo.value).map((n, r) => {
if (!n || !n.text) return null;
let i = G.value ? n.x : hc(r);
return `M${i},${t ? Os.value - (Os.value === J.value?.bottom ? 0 : e / 2) : J.value?.bottom} L${i},${t ? Os.value + e / (Os.value === J.value?.bottom ? 1 : 2) : J.value?.bottom + e}`;
}).filter(Boolean).join(" ");
});
function Io() {
return !!bi?.vnode.props?.onSelectTimeLabel;
}
function Lo(e, t, n) {
if (!aa.value) {
let e = document.createElement("canvas");
aa.value = e.getContext("2d");
}
return aa.value.font = `${n || "normal"} ${e}px ${t || "sans-serif"}`, aa.value;
}
function Ro() {
let e = wi.value.querySelectorAll(".vue-ui-xy-tag");
e.length && Array.from(e).forEach((e) => e.style.opacity = "0");
}
function zo(e, t, n, r, i) {
n && (ia.value[`${e}_${t}_${r}_${i}`] = n);
}
let Bo = E(!1);
async function Vo(e = !1) {
await dt(), Bo.value = e, ta.value && (ra.value = e);
}
function Ho() {
Vo(!0);
}
function Uo() {
Vo(!1);
}
function Wo() {
Wi.value = !Wi.value;
}
let Y = E([]), Go = E([]), Ko = 0;
xt(() => {
let e = ++Ko;
(async () => {
let t = Ja.value, n = await Fe({
values: V.value.chart.grid.labels.xAxisLabels.values,
maxDatapoints: t,
formatter: V.value.chart.grid.labels.xAxisLabels.datetimeFormatter,
start: U.value.start,
end: U.value.end
});
e === Ko && (Y.value = n);
})();
});
let qo = 0;
xt(() => {
let e = ++qo;
(async () => {
let t = Ja.value, n = await Fe({
values: V.value.chart.grid.labels.xAxisLabels.values,
maxDatapoints: t,
formatter: V.value.chart.grid.labels.xAxisLabels.datetimeFormatter,
start: 0,
end: Xa.value
});
e === qo && (Go.value = n);
})();
});
let Jo = y(() => {
let e = V.value.chart.grid.labels.xAxisLabels.modulo;
return Y.value.length ? Math.min(e, [...new Set(Y.value.map((e) => e.text))].length) : e;
}), Yo = y(() => {
let e = V.value.chart.grid.labels.xAxisLabels, t = Y.value || [], n = Go.value || [], r = U.value.start ?? 0, i = R.value, a = X.value, o = t.map((e) => e?.text ?? ""), s = n.map((e) => e?.text ?? "");
return m(!!e.showOnlyFirstAndLast, !!e.showOnlyAtModulo, Math.max(1, Jo.value || 1), o, s, r, i, a);
}), Xo = y(() => (Yo.value || []).map((e) => e?.text ?? "").join("|"));
mt(() => {
requestAnimationFrame(() => {
Ao();
}), bt([
() => Xo.value,
() => V.value.chart.grid.labels.xAxisLabels.rotation,
() => B.value.xAxis,
() => P.value,
() => Bi.value
], async () => {
await dt(), requestAnimationFrame(() => {
Ao();
});
}, { flush: "post" });
}), pt(() => {
Oo.value = 0, ko.value = 0, xa.stop(), pa.value &&= (pa.value.disconnect(), null);
});
function Zo(e, t) {
let n = K.value.map((e) => ({
shape: e.shape ?? e.type === "bar" ? "square" : "circle",
name: e.name,
color: e.color,
type: e.type,
value: e.absoluteValues.find((e, n) => n === t),
comments: e.comments || [],
prefix: e.prefix || V.value.chart.labels.prefix,
suffix: e.suffix || V.value.chart.labels.suffix
}));
vi("selectTimeLabel", {
datapoint: n,
absoluteIndex: e.absoluteIndex,
label: e.text
});
}
let X = y(() => {
let e = jt((U.value.end ?? 0) - (U.value.start ?? 0));
return Math.max(1, e);
});
function Qo(e) {
G.value || (I.value = e);
}
function $o(e) {
if (!G.value || !a(e)) {
ua.value = null, Z.value = [], Bs.value = null;
return;
}
ua.value = Number(e), Do(Number(e));
}
let es = y(() => G.value ? a(ua.value) || a(Bs.value) : ![null, void 0].includes(R.value) || ![null, void 0].includes(I.value));
function ts() {
H.value.isStacked = !H.value.isStacked, H.value.isStacked ? H.value.useIndividualScale = !0 : H.value.useIndividualScale = V.value.chart.grid.labels.yAxis.useIndividualScale;
}
function ns(e) {
za.value && e.autoScaling && (V.value.chart.grid.labels.yAxis.useIndividualScale || console.warn(`VueUiXy (datapoint: ${e.name}) : autoScaling only works when config.chart.grid.labels.yAxis.useIndividualScale is set to true`), V.value.chart.grid.labels.yAxis.stacked || console.warn(`VueUiXy (datapoint: ${e.name}) : autoScaling only works when config.chart.grid.labels.yAxis.stacked is set to true`));
}
function rs(e) {
let t = Ja.value;
return e > t ? t : e < 0 || V.value.chart.zoom.startIndex !== null && e < V.value.chart.zoom.startIndex ? V.value.chart.zoom.startIndex === null ? 1 : V.value.chart.zoom.startIndex + 1 : e;
}
let is = E(!1), as = E(!1), os = E(0), ss = E(0);
function cs() {
if (!is.value) {
is.value = !0;
try {
if (G.value) {
let e = nl.value.min, t = nl.value.max;
os.value = e, ss.value = t, U.value.start = e, U.value.end = t, Za.value.start = e, Za.value.end = t, as.value = !0, Ei.value && (Ei.value.setStartValue(e), Ei.value.setEndValue(t));
return;
}
let { startIndex: e, endIndex: t } = V.value.chart.zoom, n = V.value.chart.zoom.keepState ? Ya.value : Ja.value;
if (V.value.chart.zoom.keepState && n <= 0) return;
os.value = 0, ss.value = n;
let r = e ?? 0, i = t == null ? n : Math.min(rs(t + 1), n);
ls.value = !0, U.value.start = r, U.value.end = i, Za.value.start = r, Za.value.end = i, eo(), as.value = !0;
} finally {
queueMicrotask(() => {
ls.value = !1;
}), is.value = !1;
}
}
}
let ls = E(!1), us = E(!1), ds = null, fs = null, ps = {};
function ms(e = U.value) {
return Number(e.end) - Number(e.start);
}
function hs() {
ds &&= (cancelAnimationFrame(ds), null), fs &&= (cancelAnimationFrame(fs), null);
}
function gs(e) {
ps = {
...ps,
...e
}, ds && cancelAnimationFrame(ds), ds = requestAnimationFrame(() => {
let e = ms(), t = {
...U.value,
...ps
}, n = ms(t);
us.value = n !== e, U.value = t, Za.value = { ...t }, ps = {}, ds = null, eo(), fs && cancelAnimationFrame(fs), fs = requestAnimationFrame(() => {
us.value = !1, fs = null;
});
});
}
function _s(e) {
if (is.value || ls.value) return;
let t = Number(e);
vi("zoomStart", {
index: t,
isZoom: Dt(t, os.value)
}), Number.isFinite(t) && t !== U.value.start && gs({ start: t });
}
function vs(e) {
if (is.value || ls.value) return;
if (G.value) {
let t = Number(e);
if (!Number.isFinite(t)) return;
let n = Math.max(Number(U.value.start) + 1 / 10 ** V.value.chart.grid.labels.xAxis.rounding, Math.min(t, nl.value.max));
if (vi("zoomEnd", {
index: n,
isZoom: Dt(n, ss.value)
}), n === U.value.end) return;
gs({ end: n });
return;
}
let t = rs(e);
vi("zoomEnd", {
index: t,
isZoom: Dt(t, ss.value)
}), t !== U.value.end && gs({ end: t });
}
async function ys() {
let e = ms();
us.value = !0, await cs(), ms() === e ? us.value = !1 : (await dt(), fs && cancelAnimationFrame(fs), fs = requestAnimationFrame(() => {
us.value = !1, fs = null;
})), vi("zoomReset");
}
let bs = y(() => W.value.max + go.value);
function xs(e) {
return e / (Ct(bs.value) ? bs.value : 1);
}
let Ss = y(() => V.value.chart.grid.labels.yAxis.reverse);
function Cs(e) {
return Ss.value ? 1 - e : e;
}
function ws({ ratio: e, yOffset: t = 0, individualHeight: n }) {
let r = Cs(e);
return J.value?.bottom - t - n * r;
}
function Ts({ value: e, scaleMin: t, scaleMax: n, yOffset: r = 0, individualHeight: i }) {
return ws({
ratio: (e - t) / (n - t || 1),
yOffset: r,
individualHeight: i
});
}
let Es = y(() => V.value.chart.grid.labels.xAxis.reverse);
function Ds(e) {
return Es.value ? 1 - e : e;
}
let Os = y(() => isNaN(xs(go.value)) ? J.value?.bottom : J.value?.bottom - J.value.height * xs(go.value));
function ks(e) {
let t = W.value.min, n = W.value.max - t;
return !Number.isFinite(e) || !Number.isFinite(n) || n === 0 ? J.value?.bottom : J.value?.bottom - J.value.height * ((e - t) / n);
}
let As = y(() => W.value.min <= 0 && W.value.max >= 0 ? ks(0) : W.value.min > 0 ? ks(W.value.min) : ks(W.value.max));
function js(e) {
let t = ![null, void 0].includes(V.value.chart.grid.labels.yAxis.scaleMin) && V.value.chart.grid.labels.yAxis.scaleMin > 0 && mo.value >= 0 ? J.value?.bottom : Os.value;
return e.value >= 0 ? p(t - e.y <= 0 ? 1e-5 : t - e.y) : p(e.y - Os.value <= 0 ? 1e-5 : e.y - Os.value);
}
function Ms(e) {
return e.value >= 0 ? p(e.zeroPosition - e.y <= 0 ? 1e-5 : e.zeroPosition - e.y) : p(e.y - e.zeroPosition <= 0 ? 1e-5 : e.zeroPosition - e.y);
}
let Ns = y(() => {
let e = Math.max(1, X.value);
return {
bar: At(Math.max(1, J.value.width), e * jc.value, 1),
plot: pc.value,
line: pc.value
};
});
function Ps() {
return H.value.useIndividualScale && H.value.isStacked ? Ns.value.line - J.value.width / X.value * .1 : Ns.value.bar;
}
function Fs(e) {
return H.value.useIndividualScale && H.value.isStacked ? e.x + J.value.width / X.value * .05 : e.x + Ns.value.bar / 2;
}
function Is(e) {
return H.value.useIndividualScale && H.value.isStacked ? e.x + Ns.value.line / 2 : Fs(e) + Ps() / 2 - Ic.value / 2;
}
function Ls(e) {
return e.value >= 0 ? e.y : [
null,
void 0,
NaN,
Infinity,
-Infinity
].includes(Os.value) ? J?.bottom.value : Os.value;
}
function Rs(e) {
return e.value >= 0 ? e.y : [
null,
void 0,
NaN,
Infinity,
-Infinity
].includes(e.zeroPosition) ? 0 : e.zeroPosition;
}
let zs = E(null), Z = E([]), Bs = E(null), Vs = y(() => {
if (!G.value) return {
sortedPoints: [],
matchingPointsByXValue: /* @__PURE__ */ new Map()
};
let e = [], t = /* @__PURE__ */ new Map(), n = 0;
for (let r = 0; r < K.value.length; r += 1) {
let i = K.value[r];
if (["line", "plot"].includes(i.type) && Array.isArray(i.series)) for (let r = 0; r < i.series.length; r += 1) {
let o = i.series[r];
if (!a(o?.x) || !a(o?.y)) continue;
let s = Number(o.x), c = tl(o), l = {
datapoint: i,
point: o,
index: r,
x: c,
y: o.y,
distance: 0,
sourceOrder: n
};
e.push({
...l,
xValue: s
}), t.has(s) || t.set(s, []), t.get(s).push(l), n += 1;
}
}
return e.sort((e, t) => e.x === t.x ? e.sourceOrder - t.sourceOrder : e.x - t.x), {
sortedPoints: e,
matchingPointsByXValue: t
};
});
function Hs(e) {
let t = Vs.value.sortedPoints;
if (!t.length) return null;
let n = 0, r = t.length - 1;
for (; n <= r;) {
let i = Math.floor((n + r) / 2);
t[i].x < e ? n = i + 1 : r = i - 1;
}
let i = /* @__PURE__ */ new Set();
n >= 0 && n < t.length && i.add(n), n - 1 >= 0 && n - 1 < t.length && i.add(n - 1), n + 1 >= 0 && n + 1 < t.length && i.add(n + 1);
let a = null;
return i.forEach((n) => {
let r = t[n], i = Math.abs(r.x - e);
(!a || i < a.distance || i === a.distance && r.sourceOrder < a.sourceOrder) && (a = {
...r,
distance: i
});
}), a;
}
let Us = y(() => G.value ? Array.from(Vs.value.matchingPointsByXValue.keys()).sort((e, t) => tl({ x: e }) - tl({ x: t })) : []);
function Ws(e) {
let t = Us.value[e];
if (!a(t)) {
Z.value = [], Bs.value = null, ua.value = null, Ki.value = !1;
return;
}
Do(Number(t));
let n = tl({ x: Number(t) }), r = J.value.top + J.value.height / 2, i = l(n, r, L.value);
i && (fa.value = i), R.value = e, da.value = e, Ki.value = !0;
}
function Gs(e) {
let t = L.value;
if (!t) return null;
if (t.createSVGPoint && t.getScreenCTM) {
let n = t.createSVGPoint();
n.x = e.clientX, n.y = e.clientY;
let r = t.getScreenCTM();
if (r) {
let e = n.matrixTransform(r.inverse());
return {
x: e.x,
y: e.y,
ok: !0
};
}
}
let n = t.getBoundingClientRect(), r = t.viewBox?.baseVal || {
x: 0,
y: 0,
width: n.width,
height: n.height
}, i = Math.min(n.width / r.width, n.height / r.height), a = r.width * i, o = r.height * i, s = (n.width - a) / 2, c = (n.height - o) / 2;
return {
x: (e.clientX - n?.left - s) / i + r.x,
y: (e.clientY - n?.top - c) / i + r.y,
ok: !0
};
}
let Ks = 0;
function qs(e) {
da.value = null, !Wi.value && (Ks && cancelAnimationFrame(Ks), Ks = requestAnimationFrame(() => {
Ks = 0;
let t = Gs(e);
if (!t || !L.value) {
Js();
return;
}
let { left: n, right: r, top: i, bottom: a } = J.value;
if (t.x < n || t.x > r || t.y < i || t.y > a) {
Js();
return;
}
if (G.value) {
Eo(t.x), Vl(!0, R.value ?? 0);
return;
}
let o = yc(t.x);
o == null ? Js() : zs.value !== o && (zs.value = o, Vl(!0, o));
}));
}
function Js() {
Ks &&= (cancelAnimationFrame(Ks), 0), zs.value = null, I.value = null, ua.value = null, Vl(!1, null), Z.value = [], Bs.value = null;
}
function Ys(e) {
let t = Gs(e);
if (t && L.value) {
let { left: e, right: n, top: r, bottom: i } = J.value;
if (t.x >= e && t.x <= n && t.y >= r && t.y <= i) {
let e = yc(t.x);
if (e != null) {
Xs(e);
return;
}
}
}
zs.value != null && Xs(zs.value);
}
function Xs(e) {
let t = K.value.map((t) => ({
name: t.name,
value: [
null,
void 0,
NaN
].includes(t.absoluteValues[e]) ? null : t.absoluteValues[e],
color: t.color,
type: t.type
}));
vi("selectX", {
dataset: t,
index: e,
indexLabel: V.value.chart.grid.labels.xAxisLabels.values[e]
}), V.value.events.datapointClick && V.value.events.datapointClick({
datapoint: t,
seriesIndex: e + U.value.start
});
}
function Zs() {
return Co.value.map((e) => ({
values: e.absoluteValues,
color: e.color,
name: e.name,
type: e.type
}));
}
async function Qs({ scale: e = 2 } = {}) {
if (!wi.value) return;
let { imageUri: t, base64: n } = await Ke({
domElement: wi.value,
base64: !0,
img: !0,
scale: e
}), r = wi.value.getBoundingClientRect(), i = {
width: r.width,
height: r.height,
aspectRatio: r.height ? r.width / r.height : 0
}, a = await he(t, e) ?? i;
return {
imageUri: t,
base64: n,
title: V.value.chart.title.text,
...a
};
}
function $s() {
Ji.value.length ? Ji.value = [] : Co.value.forEach((e) => {
Ji.value.push(e.id);
}), tc();
}
function ec(e, t) {
(e.key === "Enter" || e.key === " ") && (e.preventDefault(), nc(t));
}
function tc() {
vi("selectLegend", K.value.map((e) => ({
name: e.name,
values: e.absoluteValues,
color: e.color,
type: e.type
})));
}
function nc(e) {
if (us.value = !1, fs &&= (cancelAnimationFrame(fs), null), Yi.value.has(e.id)) Ji.value = Ji.value.filter((t) => t !== e.id);
else {
if (Ji.value.length + 1 === So.value.length) return;
Ji.value.push(e.id);
}
tc(), ea.value += 1;
}
function rc(e) {
return Co.value.length ? Co.value.find((t) => t.name === e) || (V.value.debug && console.warn(`VueUiXy - Series name not found "${e}"`), null) : (V.value.debug && console.warn("VueUiXy - There are no series to show."), null);
}
function ic(e) {
let t = rc(e);
t !== null && Yi.value.has(t.id) && nc({ id: t.id });
}
function ac(e) {
let t = rc(e);
t !== null && (Yi.value.has(t.id) || nc({ id: t.id }));
}
let oc = y(() => `${V.value.chart.title.text || "Chart visualization"}. ${V.value.chart.title.subtitle.text || ""}`), sc = y(() => ({ linePlot: X.value > V.value.line.dot.hideAboveMaxSerieLength })), cc = y(() => V.value.chart.userOptions.show && (!V.value.chart.title.show || !V.value.chart.title.text)), lc = y(() => {
if (Array.isArray(V.value.chart.highlightArea)) return V.value.chart.highlightArea.map((e) => {
let t = Math.min(e.to, Xa.value - 1);
return {
...e,
span: e.from === t ? 1 : t < e.from ? 0 : t - e.from + 1
};
});
let e = {
...V.value.chart.highlightArea,
to: Math.min(V.value.chart.highlightArea.to, Xa.value - 1)
};
return [{
...e,
span: e.from === e.to ? 1 : e.to < e.from ? 0 : e.to - e.from + 1
}];
}), uc = y(() => zi.value ? Ua.value.map((e, t) => ({
...e,
series: Ka(e.series),
id: `uniqueId_${t}`,
color: se(e.color ? e.color : so.value[t] ? so.value[t] : oe[t])
})) : Ua.value), dc = y(() => K.value.map((e) => {
let t = e.absoluteValues.map((e) => [void 0, null].includes(e) ? null : e);
return {
id: e.id,
name: e.name,
color: e.color,
values: wt(X.value, t)
};
})), fc = y(() => ({
responsiveBreakpoint: V.value.table.responsiveBreakpoint,
roundingValues: V.value.table.rounding,
showAverage: !1,
showMedian: !1,
showTotal: !1,
fontFamily: V.value.chart.fontFamily,
prefix: V.value.chart.labels.prefix,
suffix: V.value.chart.labels.suffix,
colNames: Y.value.map((e, t) => V.value.table.useDefaultTimeFormat ? e.text : Cl.value(t + U.value.start, V.value.table.timeFormat)),
thead: {
backgroundColor: V.value.table.th.backgroundColor,
color: V.value.table.th.color,
outline: V.value.table.th.outline
},
tbody: {
backgroundColor: V.value.table.td.backgroundColor,
color: V.value.table.td.color,
outline: V.value.table.td.outline
},
userOptions: { show: !1 },
sparkline: {
animation: { show: !1 },
cutNullValues: V.value.line.cutNullValues
}
})), pc = y(() => {
let e = Math.max(0, J.value?.width || 0);
return V.value.chart.grid.position === "middle" ? At(e, Math.max(1, X.value), 1) : At(e, Math.max(1, X.value - 1), 0);
}), mc = y(() => V.value.chart.grid.position === "middle" ? pc.value : X.value <= 1 ? Math.max(0, J.value?.width || 0) : pc.value);
function hc(e) {
let t = J.value?.left || 0;
return V.value.chart.grid.position === "middle" ? t + pc.value / 2 + pc.value * e : t + pc.value * e;
}
function gc(e) {
let t = J.value?.left || 0;
return V.value.chart.grid.position === "middle" ? t + pc.value * e : X.value <= 1 ? t : t + pc.value * e - pc.value / 2;
}
function _c(e) {
return Math.max(J.value?.left || 0, gc(e));
}
function vc(e) {
let t = J.value?.left || 0, n = J.value?.right || 0, r = gc(e), i = r + mc.value;
return Math.max(1e-5, Math.min(n, i) - Math.max(t, r));
}
function yc(e) {
let t = J.value?.left || 0, n = J.value?.right || 0, r = X.value;
if (r <= 0 || e < t || e > n) return null;
let i = pc.value;
if (i <= 0) return 0;
let a;
return a = V.value.chart.grid.position === "middle" ? Math.ceil((e - t) / i) - 1 : r <= 1 ? 0 : Math.ceil((e - t) / i - .5), a < 0 ? 0 : a >= r ? r - 1 : a;
}
function bc(e) {
let t = J.value?.left || 0, n = J.value?.right || 0, r = gc(e), i = r + mc.value;
return Math.max(1e-5, Math.min(n, i) - Math.max(t, r));
}
function xc(e) {
return Math.max(1e-5, mc.value * e);
}
let Sc = y(() => be(Co.value.filter((e) => !Yi.value.has(e.id)))), Cc = [
"bar",
"line",
"plot"
], wc = y(() => Sc.value.filter((e) => Cc.includes(e.type))), Tc = y(() => wc.value.length), Ec = y(() => wc.value.filter((e) => e.type === "bar")), Dc = y(() => wc.value.filter((e) => e.type === "line")), Oc = y(() => wc.value.filter((e) => e.type === "plot")), kc = y(() => So.value.filter((e) => e.type === "bar" && !Yi.value.has(e.id))), Ac = y(() => kc.value.length), jc = y(() => Math.max(1, Ac.value)), Mc = y(() => {
let e = Tt(Sc.value, (e) => e.scaleLabel), t = {};
for (let [n, r] of Object.entries(e)) {
let e = Infinity, i = -Infinity, a = !1;
for (let t = 0; t < r.length; t += 1) {
let n = r[t].absoluteValues || [];
for (let t = 0; t < n.length; t += 1) {
let r = n[t], o = r === null ? 0 : Number(r);
if (Number.isNaN(o)) {
e = NaN, i = NaN, a = !0;
break;
}
a = !0, o < e && (e = o), o > i && (i = o);
}
if (Number.isNaN(e) || Number.isNaN(i)) break;
}
t[n] = {
min: a ? e : 0,
max: a ? i : 1,
groupId: Yc("scale_group", [n])
};
}
return t;
}), Nc = y(() => Sc.value.reduce((e, t) => {
let n = t.scaleLabel || "";
return e[n] = (e[n] || 0) + 1, e;
}, {}));
function Pc({ datapoint: e, scaleYLabels: t, autoScaleYLabels: n, zeroPosition: r, autoScaleZeroPosition: i, individualMax: a, autoScaleMax: o, yOffset: s, individualHeight: c }) {
let l = e.scaleLabel || "";
return {
...Mc.value[l] || {},
name: e.name,
groupName: l,
groupColor: V.value.chart.grid.labels.yAxis.groupColor || e.color,
color: e.color,
scaleYLabels: e.autoScaling ? n : t,
zeroPosition: e.autoScaling ? i : r,
individualMax: e.autoScaling ? o : a,
scaleLabel: l,
id: e.id,
yOffset: s,
individualHeight: c,
autoScaleYLabels: n,
unique: Nc.value[l] === 1
};
}
let Fc = y(() => J.value.width / X.value / Ac.value - Ic.value * Ac.value), Ic = y(() => Ns.value.line * V.value.bar.periodGap), Lc = y(() => Math.max(1e-5, Ps() - (H.value.useIndividualScale && H.value.isStacked ? 0 : Ic.value))), Rc = y(() => Lc.value * Math.min(Math.abs(V.value.bar.innerGap), .95)), zc = y(() => {
if (!V.value.chart.zoom.minimap.show) return [];
let e = uc.value.filter((e) => !Yi.value.has(e.id)), t = 0;
for (let n = 0; n < e.length; n += 1) {
let r = e[n].series.length;
r > t && (t = r);
}
let n = [];
for (let r = 0; r < t; r += 1) {
let t = 0;
for (let n = 0; n < e.length; n += 1) t += e[n].series[r] || 0;
n.push(t);
}
let r = qc(n, 0, 1).min;
return n.map((e) => e + (r < 0 ? Math.abs(r) : 0));
}), Bc = y(() => V.value.chart.zoom.minimap.show ? uc.value.map((e) => ({
...e,
isVisible: !Yi.value.has(e.id)
})) : []), Vc = y(() => G.value ? Z.value.map((e) => ({
slotAbsoluteIndex: e.datapoint.slotAbsoluteIndex,
shape: e.datapoint.shape || e.datapoint.type === "bar" ? "square" : "circle",
name: e.datapoint.name,
color: e.datapoint.color,
type: e.datapoint.type,
value: e.point.raw?.y ?? e.point.y,
x: e.point.raw?.x ?? e.point.x,
comments: e.datapoint.comments || [],
prefix: e.datapoint.prefix || V.value.chart.labels.prefix,
suffix: e.datapoint.suffix || V.value.chart.labels.suffix
})) : K.value.map((e) => ({
slotAbsoluteIndex: e.slotAbsoluteIndex,
shape: e.shape || e.type === "bar" ? "square" : "circle",
name: e.name,
color: e.color,
type: e.type,
value: e.absoluteValues.find((e, t) => t === R.value),
comments: e.comments || [],
prefix: e.prefix || V.value.chart.labels.prefix,
suffix: e.suffix || V.value.chart.labels.suffix
}))), Hc = y(() => W.value.ticks.map((e) => {
let t = e >= 0 ? Os.value - J.value.height * xs(e) : Os.value + J.value.height * xs(Math.abs(e));
return {
y: Ss.value ? J.value.top + J.value.bottom - t : t,
value: e,
prefix: V.value.chart.labels.prefix,
suffix: V.value.chart.labels.suffix
};
})), Uc = y(() => {
let e = V.value.chart.annotations;
if (!e || !Array.isArray(e) || e.every((e) => !e.show)) return [];
let t = e.filter((e) => e.show && (e.yAxis.yTop != null || e.yAxis.yBottom != null));
if (!t.length) return [];
let { left: n, right: r } = J.value, i = Os.value, a = J.value.height, o = W.value.min, s = W.value.max - o, c = (e) => {
let t = (e - 0) / s;
return i - t * a;
};
return t.map((e, t) => {
let { yAxis: { yTop: i, yBottom: a, label: o } } = e, s = i != null && a != null && i !== a, l = i == null ? null : c(i), u = a == null ? null : c(a), ee = Lo(o.fontSize);
ee.font = `${o.fontSize}px sans-serif`;
let te = ee.measureText(o.text).width, ne = o.fontSize, re = (o.position === "start" ? n + o.padding?.left : r - o.padding?.right) + o.offsetX, d = (l != null && u != null ? Math.min(l, u) : l ?? u) - o.fontSize / 3 + o.offsetY - o.padding?.top, f;
f = o.textAnchor === "middle" ? re - te / 2 - o.padding?.left : o.textAnchor === "end" ? re - te - o.padding?.right : re - o.padding?.left;
let ie = d - ne * .75 - o.padding?.top;
return {
show: ![
l,
u,
ie
].includes(NaN),
id: Yc("annotation_y", [
t,
i,
a,
o.text
]),
hasArea: s,
areaHeight: s ? Math.abs(l - u) : 0,
yTop: l,
yBottom: u,
config: e.yAxis,
x1: n,
x2: r,
_text: {
x: re,
y: d
},
_box: {
x: f,
y: ie,
width: te + o.padding?.left + o.padding?.right,
height: ne + o.padding?.top + o.padding?.bottom,
fill: o.backgroundColor,
stroke: o.border.stroke,
rx: o.border.rx,
ry: o.border.ry,
strokeWidth: o.border.strokeWidth
}
};
});
});
function Wc(e, t) {
let n = e[t - 1], r = e[t + 1], i = !!n && !!r && n.value == null && r.value == null || !n && !!r && r.value == null || !!n && !r && n.value == null;
return Ct(e[t].value) && i && V.value.line.cutNullValues;
}
function Gc(e, t = 0, n = 1) {
let r = Infinity, i = -Infinity, a = !1;
for (let t = 0; t < e.length; t += 1) {
let n = e[t];
if (Array.isArray(n.series)) for (let e = 0; e < n.series.length; e += 1) {
let t = xo(n.series[e]);
Number.isFinite(t) && (a = !0, t < r && (r = t), t > i && (i = t));
}
}
return a ? {
min: r,
max: i
} : {
min: t,
max: n
};
}
function Kc(e, t = 0, n = 1) {
let r = Infinity, i = -Infinity, a = !1;
for (let t = 0; t < e.length; t += 1) {
let n = e[t];
if (Array.isArray(n.series)) for (let e = 0; e < n.series.length; e += 1) {
let t = n.series[e];
if (!Et(t)) continue;
let o = Number(t.x);
Number.isFinite(o) && (a = !0, o < r && (r = o), o > i && (i = o));
}
}
return a ? {
min: r,
max: r === i ? i + 1 : i
} : {
min: t,
max: n
};
}
function qc(e, t = 0, n = 1) {
if (!Array.isArray(e) || e.length === 0) return {
min: t,
max: n
};
let r = Infinity, i = -Infinity;
for (let t = 0; t < e.length; t += 1) {
let n = e[t], a = n === null ? 0 : Number(n);
if (Number.isNaN(a)) return {
min: NaN,
max: NaN
};
a < r && (r = a), a > i && (i = a);
}
return {
min: r,
max: i
};
}
function Jc(e) {
let t = String(e ?? ""), n = 0;
for (let e = 0; e < t.length; e += 1) n = (n << 5) - n + t.charCodeAt(e), n |= 0;
return Math.abs(n).toString(36);
}
function Yc(e, t) {
return `${e}_${Jc(t.join("|"))}`;
}
function Xc() {
return Ha.value || us.value || !V.value.line.showTransition ? void 0 : `all ${V.value.line.transitionDurationMs}ms ease-in-out`;
}
let Zc = y(() => Kc(So.value, 0, 1)), Qc = y(() => {
let e = V.value.chart.grid.labels.xAxis.commonScaleSteps, t = V.value.chart.grid.labels.xAxis.scaleMin, n = V.value.chart.grid.labels.xAxis.scaleMax, r = t !== null && Number.isFinite(Number(t)) ? Number(t) : Zc.value.min, i = n !== null && Number.isFinite(Number(n)) ? Number(n) : Zc.value.max, a = V.value.chart.grid.labels.xAxis.useNiceScale ? me(r, i, e) : Te(r, i, e);
if (V.value.chart.grid.position !== "start") return a;
let o = a.ticks.length > 1 ? a.ticks[1] - a.ticks[0] : 1;
return {
...a,
max: a.max + o
};
}), $c = y(() => G.value ? (Es.value ? [...Qc.value.ticks].reverse() : [...Qc.value.ticks]).map((e, t) => ({
id: `continuous_x_label_${t}`,
text: g(V.value.chart.grid.labels.xAxis.formatter, e, pe({
v: e,
s: V.value.chart.labels.prefix,
p: V.value.chart.labels.suffix,
r: V.value.chart.grid.labels.xAxis.rounding
}), {
datapoint: e,
seriesIndex: t
}),
value: e,
x: tl({ x: e }),
index: t
})) : Yo.value);
function el(e, t) {
return G.value ? e.x : hc(t);
}
function tl({ x: e }) {
let t = Qc.value.max - Qc.value.min || 1, n = Ds((e - Qc.value.min) / t);
return J.value.left + J.value.width * n;
}
let nl = y(() => Kc(Ua.value, 0, 1)), rl = y(() => G.value ? nl.value.min : 0), il = y(() => G.value ? nl.value.max : Xa.value);
function al(e, t) {
return G.value ? e.x == null || e.y == null ? null : tl(e) : hc(t);
}
function ol(e) {
return !G.value || !e ? null : e.x ?? null;
}
function sl({ datapoint: e, totalSeries: t, gap: n, usableHeight: r, autoScaleValueMin: i, autoScaleValueMax: a, individualExtremes: o, forceExactScale: s = !1 }) {
let c = e.scaleSteps || V.value.chart.grid.labels.yAxis.commonScaleSteps, l = 1.0000001, u = s || !V.value.chart.grid.labels.yAxis.useNiceScale ? Te : me, ee = o.max === o.min ? o.max * l : o.max, te = a === i ? a * l : a, ne = u(o.min, ee, c), re = u(i, te, c), d = ne.min >= 0 ? 0 : Math.abs(ne.min), f = ne.max + Math.abs(d), ie = re.max + 0, ae = e.stackIndex, oe = t - 1 - ae, se = H.value.isStacked ? 1 - e.cumulatedStackRatio : 0, ce = H.value.isStacked ? r * se + n * oe : 0, le = H.value.isStacked ? r * e.stackRatio : J.value.height;
return {
scaleSteps: c,
individualScale: ne,
autoScaleSteps: re,
individualZero: d,
autoScaleZero: 0,
individualMax: f,
autoScaleMax: ie,
yOffset: ce,
individualHeight: le,
zeroPosition: J.value?.bottom - ce - le * d / f,
autoScaleZeroPosition: J.value?.bottom - ce - le * 0 / ie
};
}
function cl({ datapoint: e, clampNegativeAutoScaleMaximum: t = !1 }) {
let n = Mc.value[e.scaleLabel], r = n.min, i = n.max;
return {
ratios: e.absoluteValues.filter((e) => ![null, void 0].includes(e)).map((e) => (e - r) / (i - r)),
valueMin: r,
valueMax: t && i < 0 ? 0 : i
};
}
function ll({ datapoint: e, filterMinimumValues: t = !1, preserveLooseMinimumExpression: n = !1 }) {
let r = qc(e.absoluteValues, 0, 1), i = qc(t ? e.absoluteValues.filter((e) => ![null, void 0].includes(e)) : e.absoluteValues, 0, 1).min;
return {
max: e.scaleMax || r.max || 1,
min: n ? e.scaleMin || i > 0 ? 0 : i : e.scaleMin || (i > 0 ? 0 : i)
};
}
function ul({ values: e, autoScaleSteps: t }) {
return e.map((e) => t.min >= 0 ? (e - Math.abs(t.min)) / (t.max - Math.abs(t.min)) : (e + Math.abs(t.min)) / (t.max + Math.abs(t.min)));
}
function dl({ datapoint: e, individualScale: t, yOffset: n, individualHeight: r }) {
return t.ticks.map((i) => ({
y: Ts({
value: i,
scaleMin: t.min,
scaleMax: t.max,
yOffset: n,
individualHeight: r
}),
value: i,
prefix: e.prefix || V.value.chart.labels.prefix,
suffix: e.suffix || V.value.chart.labels.suffix,
datapoint: e
}));
}
function fl({ datapoint: e, autoScaleSteps: t, yOffset: n, individualHeight: r }) {
return t.ticks.map((i) => ({
y: ws({
ratio: (i - t.min) / (t.max - t.min || 1),
yOffset: n,
individualHeight: r
}),
value: i,
prefix: e.prefix || V.value.chart.labels.prefix,
suffix: e.suffix || V.value.chart.labels.suffix,
datapoint: e
}));
}
function pl({ datapoint: e, totalSeries: t, gap: n, usableHeight: r, forceExactScale: i = !1, clampNegativeAutoScaleMaximum: a = !1, filterMinimumValues: o = !1, preserveLooseMinimumExpression: s = !1 }) {
ns(e);
let c = cl({
datapoint: e,
clampNegativeAutoScaleMaximum: a
}), l = ll({
datapoint: e,
filterMinimumValues: o,
preserveLooseMinimumExpression: s
}), u = sl({
datapoint: e,
totalSeries: t,
gap: n,
usableHeight: r,
autoScaleValueMin: c.valueMin,
autoScaleValueMax: c.valueMax,
individualExtremes: l,
forceExactScale: i
});
return {
autoScale: c,
individualExtremes: l,
scaleYLabels: dl({
datapoint: e,
individualScale: u.individualScale,
yOffset: u.yOffset,
individualHeight: u.individualHeight
}),
autoScaleYLabels: fl({
datapoint: e,
autoScaleSteps: u.autoScaleSteps,
yOffset: u.yOffset,
individualHeight: u.individualHeight
}),
autoScaleRatiosToNiceScale: ul({
values: e.absoluteValues,
autoScaleSteps: u.autoScaleSteps
}),
...u
};
}
function ml(e) {
return Array.isArray(e) ? e.slice(U.value.start, U.value.end) : [];
}
function hl(e, t) {
return Array.isArray(e) && e[t + U.value.start] || "";
}
let gl = y(() => {
let e = Tc.value, t = V.value.chart.grid.labels.yAxis.gap, n = H.value.isStacked ? t * (e - 1) : 0, r = J.value.height - n;
return Ec.value.map((n, i) => {
let { individualScale: a, autoScaleSteps: o, individualZero: s, individualMax: c, autoScaleMax: l, yOffset: u, individualHeight: ee, zeroPosition: te, autoScaleZeroPosition: ne, scaleYLabels: re, autoScaleYLabels: d, autoScaleRatiosToNiceScale: f } = pl({
datapoint: n,
totalSeries: e,
gap: t,
usableHeight: r,
clampNegativeAutoScaleMaximum: !0,
filterMinimumValues: !0,
preserveLooseMinimumExpression: !0
}), ie = Ac.value, ae = ml(n.comments), oe = n.series.map((e, t) => {
let r = H.value.useIndividualScale ? (n.absoluteValues[t] + s) / c : xs(e), a = H.value.useIndividualScale && H.value.isStacked ? J.value?.left + J.value.width / X.value * t : J.value?.left + Ns.value.bar * i + Ns.value.bar * t * ie - Fc.value / 2 - i * Ic.value;
return {
yOffset: p(u),
individualHeight: p(ee),
x: p(a),
y: ws({
ratio: r,
yOffset: u,
individualHeight: ee
}),
value: n.absoluteValues[t],
zeroPosition: p(te),
individualMax: p(c),
comment: ae[t] || ""
};
}), se = n.series.map((e, t) => {
let r = H.value.useIndividualScale && H.value.isStacked ? J.value?.left + J.value.width / X.value * t : J.value?.left - Ns.value.bar / 2 + Ns.value.bar * i + Ns.value.bar * t * Co.value.filter((e) => e.type === "bar").filter((e) => !Yi.value.has(e.id)).length;
return {
yOffset: p(u),
individualHeight: p(ee),
x: p(r),
y: p(ws({
ratio: f[t] || 0,
yOffset: p(u),
individualHeight: p(ee)
})),
value: n.absoluteValues[t],
zeroPosition: p(te),
individualMax: p(c),
comment: ae[t] || ""
};
}), ce = Pc({
datapoint: n,
scaleYLabels: re,
autoScaleYLabels: d,
zeroPosition: te,
autoScaleZeroPosition: ne,
individualMax: c,
autoScaleMax: l,
yOffset: u,
individualHeight: ee
});
return {
...n,
yOffset: u,
autoScaleYLabels: d,
individualHeight: ee,
scaleYLabels: n.autoScaling ? d : re,
individualScale: n.autoScaling ? o : a,
individualMax: n.autoScaling ? l : c,
zeroPosition: n.autoScaling ? ne : te,
plots: n.autoScaling ? se : oe,
scaleGroup: ce,
groupId: ce.groupId
};
});
}), Q = y(() => {
let e = Tc.value, t = V.value.chart.grid.labels.yAxis.gap, i = H.value.isStacked ? t * (e - 1) : 0, a = J.value.height - i;
return Dc.value.map((i, o) => {
let { individualScale: s, autoScaleSteps: c, individualZero: l, individualMax: te, autoScaleMax: ne, yOffset: d, individualHeight: f, zeroPosition: oe, autoScaleZeroPosition: ce, scaleYLabels: de, autoScaleYLabels: fe, autoScaleRatiosToNiceScale: pe } = pl({
datapoint: i,
totalSeries: e,
gap: t,
usableHeight: a
}), me = ml(i.comments), m = i.series.map((e, t) => {
if (G.value && (e.x == null || e.y == null)) return {
index: t,
x: null,
y: null,
value: null,
datasetXValue: ol(e),
comment: i.comments && i.comments.slice(U.value.start, U.value.end)[t] || ""
};
let n = H.value.useIndividualScale ? (i.absoluteValues[t] + Math.abs(l)) / te : xs(xo(e));
return {
index: t,
x: p(al(e, t)),
datasetXValue: ol(e),
y: p(ws({
ratio: n,
yOffset: d,
individualHeight: f
})),
value: i.absoluteValues[t],
comment: me[t] || ""
};
}), h = i.series.map((e, t) => G.value && (e.x === null || e.y === null) ? {
index: t,
x: null,
y: null,
datasetXValue: ol(e),
value: null,
comment: me[t] || ""
} : [void 0, null].includes(i.absoluteValues[t]) ? {
index: t,
x: p(al(e, t)),
y: oe,
value: i.absoluteValues[t],
comment: me[t] || ""
} : {
index: t,
x: p(al(e, t)),
datasetXValue: ol(e),
y: p(ws({
ratio: pe[t] || 0,
yOffset: d,
individualHeight: f
})),
value: i.absoluteValues[t],
comment: me[t] || ""
}), he = i.dashIndices && Array.isArray(i.dashIndices) && i?.dashIndices?.length > 0, g = V.value.line.cutNullValues ? ee(m) : ae(m.filter((e) => e.value !== null)), ge = V.value.line.cutNullValues ? ee(h) : ae(h.filter((e) => e.value !== null)), ve = V.value.line.cutNullValues ? u(m) : ue(m.filter((e) => e.value !== null)), ye = V.value.line.cutNullValues ? u(h) : ue(h.filter((e) => e.value !== null)), be = r(V.value.line.cutNullValues ? m : m.filter((e) => e.value !== null)), _ = r(V.value.line.cutNullValues ? h : h.filter((e) => e.value !== null)), xe = he ? le(V.value.line.cutNullValues ? m : m.filter((e) => e.value !== null), i.dashIndices.map((e) => e - U.value.start)) : [], Se = he ? re(V.value.line.cutNullValues ? m : m.filter((e) => e.value !== null), i.dashIndices.map((e) => e - U.value.start)) : [], Ce = Pc({
datapoint: i,
scaleYLabels: de,
autoScaleYLabels: fe,
zeroPosition: oe,
autoScaleZeroPosition: ce,
individualMax: te,
autoScaleMax: ne,
yOffset: d,
individualHeight: f
}), we = H.value.useIndividualScale ? i.autoScaling ? ce : oe : lo.value, Te = Math.max(Math.max(i.autoScaling ? ce : de.at(-1) ? de.at(-1).y : 0, J.value?.top), we), Ee = i.autoScaling ? h : m, De = V.value.line.cutNullValues ? Ee : Ee.filter((e) => e.value !== null), Oe = i.absoluteValues.filter((e) => ![
null,
void 0,
NaN
].includes(e)), ke = !!i.temperatureColors && new Set(Oe).size <= 1;
return {
...i,
isFlatTemperatureLine: ke,
temperatureColors: i.temperatureColors ? i.temperatureColors.map((e) => se(e)) : null,
yOffset: d,
autoScaleYLabels: fe,
individualHeight: f,
scaleYLabels: i.autoScaling ? fe : de,
individualScale: i.autoScaling ? c : s,
individualMax: i.autoScaling ? ne : te,
zeroPosition: i.autoScaling ? ce : oe,
curve: i.useStepper ? i.autoScaling ? _ : be : i.autoScaling ? ge : g,
plots: i.autoScaling ? h : m,
dashedStraight: xe,
dashedSmooth: Se,
hasDashedSegments: he,
area: i.useArea ? i.useStepper ? r(De, Te) : H.value.useIndividualScale ? V.value.line.cutNullValues ? n(i.autoScaling ? h : m, Te) : _e(i.autoScaling ? h.filter((e) => e.value !== null) : m.filter((e) => e.value !== null), Te) : V.value.line.cutNullValues ? n(m, Te) : _e(m.filter((e) => e.value !== null), Te) : "",
curveAreas: i.useArea ? i.useStepper ? r(De, Te).split(";").filter(Boolean).map((e) => `M${e}Z`) : ie(i.autoScaling ? V.value.line.cutNullValues ? h : h.filter((e) => e.value !== null) : V.value.line.cutNullValues ? m : m.filter((e) => e.value !== null), Te, V.value.line.cutNullValues) : [],
straight: i.useStepper ? i.autoScaling ? _ : be : i.autoScaling ? ye : ve,
scaleGroup: Ce,
groupId: Ce.groupId
};
});
}), $ = y(() => {
let e = Tc.value, t = V.value.chart.grid.labels.yAxis.gap, n = H.value.isStacked ? t * (e - 1) : 0, r = J.value.height - n;
return Oc.value.map((n) => {
let { individualScale: i, autoScaleSteps: a, individualZero: o, individualMax: s, autoScaleMax: c, yOffset: l, individualHeight: u, zeroPosition: ee, autoScaleZeroPosition: te, scaleYLabels: ne, autoScaleYLabels: re, autoScaleRatiosToNiceScale: d } = pl({
datapoint: n,
totalSeries: e,
gap: t,
usableHeight: r,
forceExactScale: !0,
preserveLooseMinimumExpression: !0
}), f = ml(n.comments), ie = n.series.map((e, t) => {
if (G.value && (e.x == null || e.y == null)) return {
index: t,
x: null,
datasetXValue: ol(e),
y: null,
value: null,
comment: f[t] || ""
};
let r = H.value.useIndividualScale ? (n.absoluteValues[t] + Math.abs(o)) / s : xs(xo(e));
return {
index: t,
x: p(al(e, t)),
datasetXValue: ol(e),
y: p(ws({
ratio: r,
yOffset: l,
individualHeight: u
})),
value: n.absoluteValues[t],
comment: f[t] || ""
};
}), ae = n.series.map((e, t) => G.value && (e.x === null || e.y === null) ? {
index: t,
x: null,
datasetXValue: ol(e),
y: null,
value: null,
comment: f[t] || ""
} : {
index: t,
x: p(al(e, t)),
datasetXValue: ol(e),
y: p(ws({
ratio: d[t] || 0,
yOffset: l,
individualHeight: u
})),
value: n.absoluteValues[t],
comment: f[t] || ""
}), oe = Pc({
datapoint: n,
scaleYLabels: ne,
autoScaleYLabels: re,
zeroPosition: ee,
autoScaleZeroPosition: te,
individualMax: s,
autoScaleMax: c,
yOffset: l,
individualHeight: u
});
return {
...n,
yOffset: l,
autoScaleYLabels: re,
individualHeight: u,
scaleYLabels: n.autoScaling ? re : ne,
individualScale: n.autoScaling ? a : i,
individualMax: n.autoScaling ? c : s,
zeroPosition: n.autoScaling ? te : ee,
plots: n.autoScaling ? ae : ie,
scaleGroup: oe,
groupId: oe.groupId
};
});
}), _l = y(() => {
let e = Object.entries(Mc.value).reduce((e, [t, n]) => (e[t] = {
...n,
scaleLabel: t
}, e), {});
return [
...Q.value,
...gl.value,
...$.value
].forEach((t) => {
t.scaleGroup && (e[t.scaleLabel || ""] = {
...e[t.scaleLabel || ""],
...t.scaleGroup
});
}), e;
}), vl = y(() => {
let e = Q.value.map((e) => ({
name: e.name,
color: e.color,
scale: e.individualScale,
scaleYLabels: e.scaleYLabels,
zero: e.zeroPosition,
max: e.individualMax,
scaleLabel: e.scaleLabel || "",
id: e.id,
yOffset: e.yOffset || 0,
individualHeight: e.individualHeight || J.value.height,
autoScaleYLabels: e.autoScaleYLabels
})), t = gl.value.map((e) => ({
name: e.name,
color: e.color,
scale: e.individualScale,
scaleYLabels: e.scaleYLabels,
zero: e.zeroPosition,
max: e.individualMax,
scaleLabel: e.scaleLabel || "",
id: e.id,
yOffset: e.yOffset || 0,
individualHeight: e.individualHeight || J.value.height
})), n = $.value.map((e) => ({
name: e.name,
color: e.color,
scale: e.individualScale,
scaleYLabels: e.scaleYLabels,
zero: e.zeroPosition,
max: e.individualMax,
scaleLabel: e.scaleLabel || "",
id: e.id,
yOffset: e.yOffset || 0,
individualHeight: e.individualHeight || J.value.height
})), r = H.value.useIndividualScale && !H.value.isStacked ? Object.values(_l.value) : [
...e,
...t,
...n
], i = r.flatMap((e) => e).length;
return r.flatMap((e, t) => {
let n = 0;
n = H.value.isStacked ? q.value ? J.value?.right : J.value?.left : q.value ? J.value?.right + No() * t : J.value?.left / i * (t + 1);
let r = H.value.useIndividualScale && !H.value.isStacked ? e.unique ? e.name : e.groupName : e.name;
return {
unique: e.unique,
id: e.id,
groupId: e.groupId,
scaleLabel: e.scaleLabel,
name: g(V.value.chart.grid.labels.yAxis.serieNameFormatter, r, r, e),
color: H.value.useIndividualScale && !H.value.isStacked ? e.unique ? e.color : e.groupColor : e.color,
scale: e.scale,
yOffset: e.yOffset,
individualHeight: e.individualHeight,
x: n,
yLabels: e.scaleYLabels || e.scale.ticks.map((t) => ({
y: Ts({
value: t,
scaleMin: e.scale.min,
scaleMax: e.scale.max,
yOffset: e.yOffset || 0,
individualHeight: e.individualHeight
}),
value: t
}))
};
});
}), yl = y(() => {
let e = V.value.line.interLine || {}, t = e.pairs || [], n = e.colors || [];
if (!t.length) return [];
let r = [];
return t.forEach((e, t) => {
let [i, a] = Array.isArray(e) ? e : [e.a, e.b];
if (!i || !a) return;
let o = Q.value.find((e) => e.name === i), s = Q.value.find((e) => e.name === a);
if (!o || !s || o.type !== "line" || s.type !== "line") return;
let c = n?.[t]?.[0] ?? o.color, l = n?.[t]?.[1] ?? s.color;
ve({
lineA: o.plots,
lineB: s.plots,
smoothA: !!o.smooth,
smoothB: !!s.smooth,
stepperA: !!o.useStepper,
stepperB: !!s.useStepper,
colorLineA: c,
colorLineB: l,
sampleStepPx: 2,
cutNullValues: V.value.line.cutNullValues
}).forEach((e, n) => {
r.push({
...e,
key: `inter_${i}_${a}_${t}_${n}`
});
});
}), r;
}), bl = y(() => {
let e = Z.value[0]?.index ?? null, t = G.value ? e : R.value;
return {
timeLabel: G.value ? {
text: String(Z.value[0]?.point.raw?.x ?? Z.value[0]?.point.x),
absoluteIndex: e
} : Y.value[R.value],
datapoint: Vc.value,
seriesIndex: R.value,
selectedIndex: t,
absoluteIndex: G.value ? e : R.value + U.value.start,
series: Co.value,
bars: gl.value,
lines: Q.value,
plots: $.value,
config: V.value
};
}), xl = E({
months: [],
shortMonths: [],
days: [],
shortDays: []
}), Sl = 0;
xt(() => {
let e = ++Sl, t = V.value.chart.grid.labels.xAxisLabels.datetimeFormatter;
(async () => {
let n = await Pe(t.locale).catch(() => Pe("en"));
e === Sl && (xl.value = n.data);
})();
});
let Cl = y(() => {
let e = V.value.chart.grid.labels.xAxisLabels.datetimeFormatter, t = Ne({
useUTC: e.useUTC,
locale: xl.value,
januaryAsYear: e.januaryAsYear
});
return (e, n) => {
let r = V.value.chart.grid.labels.xAxisLabels.values?.[e];
return r == null ? "" : t.formatDate(new Date(r), n);
};
}), wl = y(() => (V.value.chart.grid.labels.xAxisLabels.values || []).map((e, t) => ({
text: Cl.value(t, V.value.chart.zoom.timeFormat),
absoluteIndex: t
}))), Tl = /* @__PURE__ */ new Map();
function El(e) {
return {
absoluteIndex: R.value + U.value.start,
seriesIndex: R.value,
datapoint: Vc.value,
series: Co.value,
bars: gl.value,
lines: Q.value,
plots: $.value,
config: V.value,
dateLabel: e
};
}
function Dl(e) {
return [
Ui.value[e.type],
e.shape || "",
e.color,
V.value.chart.tooltip.backgroundColor,
!!yi.pattern,
F.value,
e.slotAbsoluteIndex
].join("|");
}
function Ol(e) {
let t = Dl(e);
if (Tl.has(t)) return Tl.get(t);
let n = V.value.chart.tooltip.backgroundColor, r = "", i = "";
switch (Ui.value[e.type]) {
case "bar":
r = `<svg viewBox="0 0 40 40" height="14" width="14">${yi.pattern ? `<rect x="0" y="0" rx="1" stroke="none" height="40" width="40" fill="${e.color}" />` : ""}<rect x="0" y="0" rx="1" stroke="none" height="40" width="40" fill="${yi.pattern ? `url(#pattern_${F.value}_${e.slotAbsoluteIndex})` : e.color}" /></svg>`;
break;
case "line":
!e.shape || ![
"star",
"triangle",
"square",
"diamond",
"pentagon",
"hexagon"
].includes(e.shape) ? i = `<circle cx="10" cy="8" r="4" stroke="${n}" stroke-width="0.5" fill="${e.color}" />` : e.shape === "triangle" ? i = `<path d="${f({
plot: {
x: 10,
y: 8
},
radius: 4,
sides: 3,
rotation: .52
}).path}" fill="${e.color}" stroke="${n}" stroke-width="0.5" />` : e.shape === "square" ? i = `<path d="${f({
plot: {
x: 10,
y: 8
},
radius: 4,
sides: 4,
rotation: .8
}).path}" fill="${e.color}" stroke="${n}" stroke-width="0.5" />` : e.shape === "diamond" ? i = `<path d="${f({
plot: {
x: 10,
y: 8
},
radius: 4,
sides: 4,
rotation: 0
}).path}" fill="${e.color}" stroke="${n}" stroke-width="0.5" />` : e.shape === "pentagon" ? i = `<path d="${f({
plot: {
x: 10,
y: 8
},
radius: 4,
sides: 5,
rotation: .95
}).path}" fill="${e.color}" stroke="${n}" stroke-width="0.5" />` : e.shape === "hexagon" ? i = `<path d="${f({
plot: {
x: 10,
y: 8
},
radius: 4,
sides: 6,
rotation: 0
}).path}" fill="${e.color}" stroke="${n}" stroke-width="0.5" />` : e.shape === "star" && (i = `<polygon stroke="${n}" stroke-width="0.5" fill="${e.color}" points="${ke({
plot: {
x: 10,
y: 8
},
radius: 4
})}" />`), r = `<svg viewBox="0 0 20 12" height="14" width="20"><rect rx="1.5" x="0" y="6.5" stroke="${n}" stroke-width="0.5" height="3" width="20" fill="${e.color}" />${i}</svg>`;
break;
case "plot":
if (!e.shape || ![
"star",
"triangle",
"square",
"diamond",
"pentagon",
"hexagon"
].includes(e.shape)) {
r = `<svg viewBox="0 0 12 12" height="14" width="14"><circle cx="6" cy="6" r="6" stroke="${n}" stroke-width="1" fill="${e.color}" /></svg>`;
break;
}
if (e.shape === "star") {
r = `<svg viewBox="0 0 12 12" height="14" width="14"><polygon stroke="${n}" stroke-width="1" fill="${e.color}" points="${ke({
plot: {
x: 6,
y: 6
},
radius: 5
})}" /></svg>`;
break;
}
if (e.shape === "triangle") {
r = `<svg viewBox="0 0 12 12" height="14" width="14"><path d="${f({
plot: {
x: 6,
y: 6
},
radius: 6,
sides: 3,
rotation: .52
}).path}" fill="${e.color}" stroke="${n}" stroke-width="1" /></svg>`;
break;
}
if (e.shape === "square") {
r = `<svg viewBox="0 0 12 12" height="14" width="14"><path d="${f({
plot: {
x: 6,
y: 6
},
radius: 6,
sides: 4,
rotation: .8
}).path}" fill="${e.color}" stroke="${n}" stroke-width="1" /></svg>`;
break;
}
if (e.shape === "diamond") {
r = `<svg viewBox="0 0 12 12" height="14" width="14"><path d="${f({
plot: {
x: 6,
y: 6
},
radius: 5,
sides: 4,
rotation: 0
}).path}" fill="${e.color}" stroke="${n}" stroke-width="1" /></svg>`;
break;
}
if (e.shape === "pentagon") {
r = `<svg viewBox="0 0 12 12" height="14" width="14"><path d="${f({
plot: {
x: 6,
y: 6
},
radius: 5,
sides: 5,
rotation: .95
}).path}" fill="${e.color}" stroke="${n}" stroke-width="1" /></svg>`;
break;
}
if (e.shape === "hexagon") {
r = `<svg viewBox="0 0 12 12" height="14" width="14"><path d="${f({
plot: {
x: 6,
y: 6
},
radius: 5,
sides: 6,
rotation: 0
}).path}" fill="${e.color}" stroke="${n}" stroke-width="1" /></svg>`;
break;
}
}
return Tl.set(t, r), r;
}
let kl = y(() => {
let e = "", t = Vc.value.map((e) => e.value).filter((e) => ce(e) && e !== null).reduce((e, t) => Math.abs(e) + Math.abs(t), 0), n = G.value ? { text: g(V.value.chart.grid.labels.xAxis.formatter, Z.value[0]?.point.raw?.x ?? Z.value[0]?.point.x, pe({
v: Z.value[0]?.point.raw?.x ?? Z.value[0]?.point.x,
r: V.value.chart.tooltip.roundingValue
}), {
datapoint: null,
serriesIndex: null
}) } : Y.value[R.value], r = V.value.chart.tooltip.customFormat;
if (Oe(r)) try {
let e = r(El(n));
if (typeof e == "string") return e;
} catch (e) {
console.warn("Vue Data UI - VueUiXy: custom tooltip formatter failed.", e);
}
if (n && n.text && V.value.chart.tooltip.showTimeLabel) {
let t = Cl.value(R.value + U.value.start, V.value.chart.tooltip.timeFormat);
G.value || (e += `<div style="padding-bottom: 6px; margin-bottom: 4px; border-bottom: 1px solid ${V.value.chart.tooltip.borderColor}; width:100%">${V.value.chart.grid.labels.xAxisLabels.datetimeFormatter.enable && !V.value.chart.tooltip.useDefaultTimeFormat ? t : n.text}</div>`);
}
return Vc.value.forEach((r) => {
if (ce(r.value)) {
let i = Ol(r), a = V.value.chart.tooltip.showValue ? g(r.type === "line" ? V.value.line.labels.formatter : r.type === "bar" ? V.value.bar.labels.formatter : V.value.plot.labels.formatter, r.value, pe({
p: r.prefix,
v: r.value,
s: r.suffix,
r: V.value.chart.tooltip.roundingValue
}), { datapoint: r }) : "", o = V.value.chart.tooltip.showValue ? n?.text ?? "" : "", s = G.value ? `
<span>${V.value.chart.grid.labels.axis.xLabel || "X"}: </span>
<span>${o}</span>,
<span>${V.value.chart.grid.labels.axis.yLabel || "Y"}: </span>
<span>${a}</span>
` : a;
G.value ? e += `
<div style="display:flex;flex-direction:column;">
<div style="display:flex; flex-direction:row; gap:3px;">
<div style="width:20px">${i}</div>
<div style="display:flex;flex-direction:column;">
<div>${r.name}</div>
<div>${s}</div>
</div>
</div>
</div>
` : e += `<div style="display:flex;flex-direction:row; align-items:center;gap:3px;white-space:nowrap;"><div style="width:20px">${i}</div> ${r.name}: <b>${s}</b> ${V.value.chart.tooltip.showPercentage ? `(${pe({
v: p(Math.abs(r.value) / t * 100),
s: "%",
r: V.value.chart.tooltip.roundingPercentage
})})` : ""}</div>`;
let c = hl(r.comments, R.value);
V.value.chart.comments.showInTooltip && c && (e += `<div class="vue-data-ui-tooltip-comment" style="background:${r.color}20; padding: 6px; margin-bottom: 6px; border-left: 1px solid ${r.color}">${c}</div>`);
}
}), `<div style="border-radius:4px;padding:12px;font-variant-numeric: tabular-nums;color:${V.value.chart.tooltip.color}">${e}</div>`;
}), Al = y(() => {
if (!G.value) return [];
let e = /* @__PURE__ */ new Set(), t = [];
return K.value.forEach((n) => {
n.series.forEach((n) => {
let r = Number(n?.x);
if (!Number.isFinite(r)) return;
let i = String(r);
e.has(i) || (e.add(i), t.push(r));
});
}), t.sort((e, t) => Es.value ? t - e : e - t);
});
function jl(e) {
let t = Number(e);
return Number.isFinite(t) ? g(V.value.chart.grid.labels.xAxis.formatter, t, pe({
v: t,
r: V.value.table.rounding
}), {
datapoint: t,
seriesIndex: null
}) : "-";
}
function Ml(e) {
return G.value ? jl(e) : V.value.table.useDefaultTimeFormat ? Y.value[e]?.text ?? "-" : Cl.value(e + U.value.start, V.value.table.timeFormat);
}
function Nl(e, t) {
if (G.value) {
let n = Number(t);
return Number.isFinite(n) ? e.series.find((e) => Number(e?.x) === n)?.y ?? null : null;
}
return e.absoluteValues[t];
}
function Pl(e, t) {
let n = Nl(e, t);
return Ct(n) ? Number(n.toFixed(V.value.table.rounding)) : "";
}
function Fl(e, t) {
let n = Nl(e, t);
return Ct(n) ? g(e.type === "line" ? V.value.line.labels.formatter : e.type === "bar" ? V.value.bar.labels.formatter : V.value.plot.labels.formatter, n, pe({
p: e.prefix || V.value.chart.labels.prefix,
v: n,
s: e.suffix || V.value.chart.labels.suffix,
r: V.value.table.rounding
})) : "";
}
function Il(e) {
return K.value.map((t) => Nl(t, e) ?? 0).reduce((e, t) => e + t, 0);
}
let Ll = y(() => {
if (G.value) return Al.value.map((e) => {
let t = Il(e);
return {
period: Ml(e),
csvValues: K.value.map((t) => Pl(t, e)),
formattedValues: K.value.map((t) => Fl(t, e)),
sum: t,
formattedSum: t.toFixed(V.value.table.rounding)
};
});
let e = [];
for (let t = 0; t < X.value; t += 1) {
let n = Il(t);
e.push({
period: Ml(t),
csvValues: K.value.map((e) => Pl(e, t)),
formattedValues: K.value.map((e) => Fl(e, t)),
sum: n,
formattedSum: n.toFixed(V.value.table.rounding)
});
}
return e;
}), Rl = y(() => So.value.length === 0 ? {
head: [],
body: [],
config: {},
columnNames: []
} : {
head: K.value.map((e) => ({
label: e.name,
color: e.color,
type: e.type
})),
body: Ll.value.map((e) => [e.period].concat(e.csvValues))
}), zl = y(() => {
let e = V.value.table.showSum, t = [G.value ? V.value.chart.grid.labels.axis.xLabel || "X" : ""].concat(K.value.map((e) => e.name));
e && (t = t.concat(" <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\" fill=\"none\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\"/><path d=\"M18 16v2a1 1 0 0 1 -1 1h-11l6 -7l-6 -7h11a1 1 0 0 1 1 1v2\" /></svg>"));
let n = Ll.value.map((t) => [t.period].concat(t.formattedValues, e ? t.formattedSum : [])), r = {
th: {
backgroundColor: V.value.table.th.backgroundColor,
color: V.value.table.th.color,
outline: V.value.table.th.outline
},
td: {
backgroundColor: V.value.table.td.backgroundColor,
color: V.value.table.td.color,
outline: V.value.table.td.outline
},
breakpoint: V.value.table.responsiveBreakpoint
}, i = [G.value ? V.value.chart.grid.labels.axis.xLabel || "X" : V.value.table.columnNames.period].concat(K.value.map((e) => e.name), V.value.table.columnNames.total);
return {
head: t,
body: n,
config: r,
colNames: i
};
});
function Bl(e = null) {
let n = [
[V.value.chart.title.text],
[V.value.chart.title.subtitle.text],
[""]
], r = [G.value ? V.value.chart.grid.labels.axis.xLabel || "X" : V.value.table.columnNames.period, ...Rl.value.head.map((e) => e.label)], i = Rl.value.body, a = n.concat([r]).concat(i), s = o(a);
e ? e(s) : t({
csvContent: s,
title: V.value.chart.title.text || "vue-ui-xy"
});
}
function Vl(e, t = null) {
if (wo.value) return;
Ki.value = e;
let n = K.value.map((e) => ({
name: e.name,
value: [
null,
void 0,
NaN
].includes(e.absoluteValues[t]) ? null : e.absoluteValues[t],
color: e.color,
type: e.type
}));
e ? (R.value = t, V.value.events.datapointEnter && V.value.events.datapointEnter({
datapoint: n,
seriesIndex: t + U.value.start
})) : (R.value = null, V.value.events.datapointLeave && V.value.events.datapointLeave({
datapoint: n,
seriesIndex: t + U.value.start
}));
}
function Hl() {
H.value.showTable = !H.value.showTable;
}
function Ul() {
H.value.dataLabels.show = !H.value.dataLabels.show;
}
function Wl() {
H.value.showTooltip = !H.value.showTooltip;
}
function Gl(e) {
Gi.value = e, Xi.value += 1;
}
function Kl() {
if (!V.value.responsiveProportionalSizing) {
B.value.dataLabels = V.value.chart.grid.labels.fontSize, B.value.yAxis = V.value.chart.grid.labels.axis.fontSize, B.value.xAxis = V.value.chart.grid.labels.xAxisLabels.fontSize, B.value.plotLabels = V.value.chart.labels.fontSize, ja.value.plot = V.value.plot.radius, ja.value.line = V.value.line.radius, ja.value.selectedLine = V.value.line.dot.selectedRadius;
return;
}
B.value.dataLabels = Se({
relator: Bi.value,
adjuster: 400,
source: V.value.chart.grid.labels.fontSize,
threshold: 10,
fallback: 10
}), B.value.yAxis = Se({
relator: P.value,
adjuster: 1e3,
source: V.value.chart.grid.labels.axis.fontSize,
threshold: 10,
fallback: 10
}), B.value.xAxis = Se({
relator: P.value,
adjuster: 1e3,
source: V.value.chart.grid.labels.xAxisLabels.fontSize,
threshold: 10,
fallback: 10
}), B.value.plotLabels = Se({
relator: P.value,
adjuster: 800,
source: V.value.chart.labels.fontSize,
threshold: 10,
fallback: 10
}), ja.value.plot = Se({
relator: P.value,
adjuster: 800,
source: V.value.plot.radius,
threshold: 1,
fallback: 1
}), ja.value.line = Se({
relator: P.value,
adjuster: 800,
source: V.value.line.radius,
threshold: 1,
fallback: 0
}), ja.value.selectedLine = Se({
relator: P.value,
adjuster: 800,
source: V.value.line.dot.selectedRadius,
threshold: 1,
fallback: 0
});
}
function ql() {
if (ge(M.dataset) ? (we({
componentName: "VueUiXy",
type: "dataset",
debug: za.value
}), Wa.value = !0) : M.dataset.forEach((e, t) => {
[null, void 0].includes(e.name) && (we({
componentName: "VueUiXy",
type: "datasetSerieAttribute",
property: "name (string)",
index: t,
debug: za.value
}), Wa.value = !0);
}), za.value && M.dataset.forEach((e) => {
e.series.forEach((t, n) => {
ce(t) || console.warn(`VueUiXy has detected an unsafe value in your dataset:\n-----> The serie '${e.name}' contains the value '${t}' at index ${n}.\n'${t}' was converted to null to allow the chart to display.`);
});
}), ge(M.dataset) || (Wa.value = V.value.loading), ta.value = V.value.chart.userOptions.showOnChartHover, na.value = V.value.chart.userOptions.keepStateOnChartLeave, ra.value = !V.value.chart.userOptions.showOnChartHover, Ra(), V.value.responsive) {
let e = wi.value.parentNode;
Ii.value && (Li.value && Ii.value.unobserve(Li.value), Ii.value.disconnect(), Ii.value = null, Li.value = null);
let { height: t, width: n } = e.getBoundingClientRect(), r = null, i = 0;
V.value.chart.title.show && Ti.value && (r = Ti.value, i = r.getBoundingClientRect().height);
let a = null, o = 0;
V.value.chart.zoom.show && Xa.value > 6 && Fa.value && Ei.value && Ei.value.$el && (a = Ei.value.$el, o = a.getBoundingClientRect().height);
let s = null, c = 0;
V.value.chart.legend.show && Di.value && (s = Di.value, c = s.getBoundingClientRect().height);
let l = 0;
Oi.value && (l = Oi.value.getBoundingClientRect().height);
let u = 0;
ki.value && (u = ki.value.getBoundingClientRect().height), Bi.value = t - i - c - o - l - u - 12, P.value = n, Vi.value = `0 0 ${P.value < 0 ? 10 : P.value} ${Bi.value < 0 ? 10 : Bi.value}`, Kl();
let ee = new ResizeObserver((e) => {
for (let t of e) i = V.value.chart.title.show && Ti.value ? Ti.value.getBoundingClientRect().height : 0, o = Ei.value && Ei.value.$el ? Ei.value.$el.getBoundingClientRect().height : 0, c = Di.value ? Di.value.getBoundingClientRect().height : 0, l = Oi.value ? Oi.value.getBoundingClientRect().height : 0, u = ki.value ? ki.value.getBoundingClientRect().height : 0, requestAnimationFrame(() => {
Bi.value = t.contentRect.height - i - c - o - l - u - 12, P.value = t.contentBoxSize[0].inlineSize ?? t.contentRect.width, Vi.value = `0 0 ${P.value < 0 ? 10 : P.value} ${Bi.value < 0 ? 10 : Bi.value}`, Kl(), Ea();
});
});
Ii.value = ee, Li.value = e, ee.observe(e);
} else Bi.value = V.value.chart.height, P.value = V.value.chart.width, B.value.dataLabels = V.value.chart.grid.labels.fontSize, B.value.yAxis = V.value.chart.grid.labels.axis.fontSize, B.value.xAxis = V.value.chart.grid.labels.xAxisLabels.fontSize, B.value.plotLabels = V.value.chart.labels.fontSize, ja.value.plot = V.value.plot.radius, ja.value.line = V.value.line.radius, ja.value.selectedLine = V.value.line.dot.selectedRadius, Vi.value = `0 0 ${P.value} ${Bi.value}`;
Ea();
}
function Jl(e) {
Hi.value = {
x: e.clientX,
y: e.clientY
};
}
mt(() => {
ql(), cs(), document.addEventListener("mousemove", Jl, { passive: !0 }), document.addEventListener("scroll", Ro, { passive: !0 });
}), pt(() => {
document.removeEventListener("scroll", Ro, { passive: !0 }), document.removeEventListener("mousemove", Jl, { passive: !0 }), Ii.value && (Li.value && Ii.value.unobserve(Li.value), Ii.value.disconnect(), Ii.value = null, Li.value = null), nu(), hs();
}), Ge({
timeLabelsEls: Ni,
timeLabels: Y,
slicer: U,
configRef: V,
rotationPath: [
"chart",
"grid",
"labels",
"xAxisLabels",
"rotation"
],
autoRotatePath: [
"chart",
"grid",
"labels",
"xAxisLabels",
"autoRotate",
"enable"
],
isAutoSize: oo,
height: Bi,
width: P,
rotation: V.value.chart.grid.labels.xAxisLabels.autoRotate.angle
});
let Yl = E(!1), Xl = E(null), Zl = E(200), Ql = y(() => R.value ?? I.value ?? 0), $l = y(() => {
if (!G.value) return null;
if (a(ua.value)) return Number(ua.value);
let e = Z.value[0];
return a(e?.point?.x) ? Number(e.point.x) : null;
});
function eu() {
let e = Math.ceil(Zl.value || 200);
return Math.min(Math.max(e, 1), 200);
}
function tu() {
let e = eu(), t = (G.value && a($l.value) ? tl({ x: $l.value }) : hc(Ql.value)) - e / 2 - (200 - e) / 2, n = J.value?.left - (200 - e) / 2, r = J.value?.right - (200 + e) / 2;
return p(Math.max(n, Math.min(t, r)));
}
function nu() {
ha.value !== null && (cancelAnimationFrame(ha.value), ha.value = null), ma.value && z.value && ma.value.unobserve(z.value), ma.value &&= (ma.value.disconnect(), null), ga.value &&= (ga.value(), null), z.value = null;
}
function ru(e) {
ha.value !== null && cancelAnimationFrame(ha.value), ha.value = requestAnimationFrame(() => {
Zl.value = Math.min(Math.max(Math.ceil(e || 0), 1), 200), ha.value = null;
});
}
function iu(e) {
!ma.value || !e || (z.value && z.value !== e && (ma.value.unobserve(z.value), z.value = null), e !== z.value && (dt(() => {
e.offsetParent !== null && ru(e.offsetWidth || e.getBoundingClientRect().width || 200);
}), ma.value.observe(e), z.value = e));
}
mt(() => {
ma.value = new ResizeObserver((e) => {
let t = e.find((e) => e.target === z.value) || e[0];
t && ru(t.contentRect.width || 200);
}), ga.value = xt((e) => {
let t = Xl.value;
if (!t) {
ma.value && z.value && (ma.value.unobserve(z.value), z.value = null);
return;
}
iu(t), e(() => {
ma.value && z.value && z.value !== Xl.value && (ma.value.unobserve(z.value), z.value = null);
});
});
});
let au = y(() => {
if (G.value) {
if (!Number.isFinite(Number($l.value))) return "";
} else if ([null, void 0].includes(R.value) && [null, void 0].includes(I.value)) return "";
let e = (R.value == null ? 0 : R.value) || (I.value == null ? 0 : I.value), t = V.value.chart.timeTag.customFormat;
if (Yl.value = !1, G.value) {
let e = $l.value;
if (Oe(t)) try {
let n = t({
absoluteIndex: e,
seriesIndex: e,
datapoint: Vc.value,
bars: gl.value,
lines: Q.value,
plots: $.value,
config: V.value
});
if (typeof n == "string") return Yl.value = !0, n;
} catch {
console.warn("Custom format cannot be applied on timeTag."), Yl.value = !1;
}
return pe({
v: e,
r: V.value.chart.grid.labels.xAxis.rounding
});
}
if (Oe(t)) try {
let n = t({
absoluteIndex: e + U.value.start,
seriesIndex: e,
datapoint: Vc.value,
bars: gl.value,
lines: Q.value,
plots: $.value,
config: V.value
});
if (typeof n == "string") return Yl.value = !0, n;
} catch {
console.warn("Custom format cannot be applied on timeTag."), Yl.value = !1;
}
if (!Yl.value) return [null, void 0].includes(Y.value[e]) ? "" : V.value.chart.grid.labels.xAxisLabels.datetimeFormatter.enable && !V.value.chart.timeTag.useDefaultFormat ? Cl.value(e + U.value.start, V.value.chart.timeTag.timeFormat) : Y.value[e].text;
});
function ou({ serie: e, plot: t, type: n }) {
if (!Ct(t.value)) return "";
let r = pe({
p: e.prefix || V.value.chart.labels.prefix,
v: t.value,
s: e.suffix || V.value.chart.labels.suffix,
r: V.value[n].labels.rounding
}), i = t.datasetXValue, o = G.value && a(i) ? `x: ${pe({
v: i,
r: V.value.chart.grid.labels.xAxis.rounding
})}\ny: ${r}` : g(V.value[n].labels.formatter, t.value, r, {
datapoint: t,
serie: e
});
return c({
content: o,
fontSize: B.value.plotLabels,
fill: V.value[n].labels.color,
x: 0,
y: 0
});
}
function su({ plot: e }) {
let t = V.value.bar.labels.offsetY, n = Math.abs(Ms(e)), r = e.value < 0, i = {
x: Is(e) + V.value.bar.labels.offsetX,
y: p(e.y) + (V.value.bar.labels.alwaysOnTop ? t - (r ? n : 0) : e.value >= 0 ? t : -t * 3)
};
return `translate(${i.x}, ${i.y}) rotate(${V.value.bar.labels.rotation})`;
}
function cu({ plot: e, type: t }) {
let n = V.value[t].labels.offsetY, r = {
x: e.x + V.value[t].labels.offsetX,
y: p(e.y) + (V.value[t].labels.alwaysOnTop || e.value >= 0 ? n : -n * 3)
};
return `translate(${r.x}, ${r.y}) rotate(${V.value[t].labels.rotation})`;
}
function lu({ plot: e, type: t }) {
if (V.value[t].labels.textAnchor != null) return V.value[t].labels.textAnchor;
let n = e.value >= 0;
return V.value[t].labels.rotation === 0 ? "middle" : V.value[t].labels.alwaysOnTop || n ? "start" : "end";
}
let uu = y(() => G.value ? a(ua.value) ? tl({ x: Number(ua.value) }) : a(Bs.value) ? Bs.value : null : hc(R.value ?? I.value ?? 0)), du = y(() => V.value.chart.highlighter.crosshairs.show && es.value), fu = y(() => [
...Q.value,
...$.value,
...gl.value
].flatMap((e) => (e.plots || []).map((e, t) => ({
plot: e,
index: t
})).filter(({ plot: t, index: n }) => hu(e, t, n)).filter(({ plot: e }) => Ct(e.value)).map(({ plot: t, index: n }) => ({
...t,
index: t.index ?? n,
serie: e,
x: p(e.type === "bar" ? Is(t) : t.x),
y: p(t.y)
})))), pu = y(() => {
if (!du.value) return null;
if (G.value) {
let e = Z.value[0], t = e?.point?.raw?.x ?? e?.point?.x;
return a(t) ? {
x: uu.value,
text: g(V.value.chart.grid.labels.xAxis.formatter, t, pe({
v: t,
r: V.value.chart.tooltip.roundingValue
}))
} : null;
}
let e = R.value === null ? I.value : R.value;
return e == null ? null : {
x: hc(e),
text: Y.value[e]?.text ?? ""
};
});
function mu(e) {
return V.value.chart.grid.labels.yAxis.position === "right" ? J.value.right : J.value.left;
}
function hu(e, t, n) {
return G.value ? Z.value.some((n) => n.datapoint.id === e.id && n.index === t.index) : R.value !== null && R.value === n || I.value !== null && I.value === n;
}
function gu({ serie: e, plot: t, index: n, type: r }) {
return !t || !Ct(t.value) || !V.value[r].labels.show || !H.value.dataLabels.show ? !1 : !Object.hasOwn(e, "dataLabels") || e.dataLabels === !0 || hu(e, t, n);
}
function _u(e, t) {
let n = [];
return e.forEach((e, r) => {
(Array.isArray(e.plots) ? e.plots : []).forEach((i, a) => {
gu({
serie: e,
plot: i,
index: a,
type: t
}) && n.push({
key: `data_label_${t}_${e.id}_${(i.index ?? a) + U.value.start}`,
serie: e,
serieIndex: r,
plot: i,
plotIndex: a
});
});
}), n;
}
let vu = y(() => _u(gl.value, "bar")), yu = y(() => _u($.value, "plot")), bu = y(() => _u(Q.value, "line"));
bt(() => M.dataset, (e) => {
if (Array.isArray(e) && e.length > 0 && (Wa.value = !1), V.value.chart.zoom.keepState) {
let e = Xa.value;
if (e > 0) {
let t = U.value.start, n = U.value.end;
if (!as.value || t === 0 && n === 0) cs();
else {
let r = Math.max(0, Math.min(t, e - 1)), i = Math.max(r + 1, Math.min(n, e));
U.value = {
start: r,
end: i
}, Za.value = {
start: r,
end: i
}, os.value = 0, ss.value = e;
}
}
} else U.value = {
start: 0,
end: Xa.value
};
Ri.value += 1, ea.value += 1, Ea(), eo();
}, { deep: !0 }), bt(() => M.config, (e) => {
Ha.value || (V.value = Na()), ql(), Qi.value += 1, Zi.value += 1, Ra(), V.value.chart.zoom.keepState && Xa.value > 0 && (!as.value || U.value.start === 0 && U.value.end === 0) && cs(), eo();
}, { deep: !0 });
let xu = E(!1), Su = E(!1);
function Cu() {
let e = wi.value?.parentNode;
if (!e) {
Su.value = xu.value, xu.value = !1;
return;
}
let t = e.getBoundingClientRect();
Su.value = xu.value, xu.value = t.width > 0 && t.height > 0;
}
function wu() {
return !xu.value || Su.value || as.value ? !1 : U.value.start === 0 && U.value.end === 0;
}
mt(() => {
Cu(), pa.value = new ResizeObserver(() => {
Cu(), xu.value && (ql(), eo(), wu() && cs());
}), wi.value?.parentNode && pa.value.observe(wi.value.parentNode);
}), bt(V, () => {
Ra();
}, { immediate: !0 });
let Tu = y(() => {
let e = V.value.table.useDialog && !V.value.showTable, t = H.value.showTable;
return {
component: e ? _i : $e,
title: `${V.value.chart.title.text}${V.value.chart.title.subtitle.text ? `: ${V.value.chart.title.subtitle.text}` : ""}`,
props: e ? {
backgroundColor: V.value.table.th.backgroundColor,
color: V.value.table.th.color,
headerColor: V.value.table.th.color,
headerBg: V.value.table.th.backgroundColor,
isFullscreen: Gi.value,
fullscreenParent: wi.value,
forcedWidth: Math.min(800, window.innerWidth * .8)
} : {
hideDetails: !0,
config: {
open: t,
maxHeight: 1e4,
body: {
backgroundColor: V.value.chart.backgroundColor,
color: V.value.chart.color
},
head: {
backgroundColor: V.value.chart.backgroundColor,
color: V.value.chart.color
}
}
}
};
});
bt(() => H.value.showTable, (e) => {
V.value.showTable || (e && V.value.table.useDialog && sa.value ? sa.value.open() : sa.value && sa.value.close && sa.value.close());
});
function Eu() {
H.value.showTable = !1, Fi.value && Fi.value.setTableIconState(!1);
}
let Du = y(() => Co.value.map((e) => ({
shape: e.type === "bar" ? "square" : e.shape ?? "circle",
color: e.color,
name: e.name
}))), Ou = y(() => V.value.chart.backgroundColor), ku = y(() => V.value.chart.legend), Au = y(() => V.value.chart.title), { exportSvg: ju, getSvg: Mu } = Be({
svg: L,
title: Au,
legend: ku,
legendItems: Du,
backgroundColor: Ou
});
async function Nu({ isCb: e }) {
la.value = !0, await dt();
try {
if (e) {
let { blob: e, url: t, text: n, dataUrl: r } = await Mu();
await Promise.resolve(V.value.chart.userOptions.callbacks.svg({
blob: e,
url: t,
text: n,
dataUrl: r
}));
} else await Promise.resolve(ju());
} finally {
la.value = !1;
}
}
function Pu(e) {
if (e?.stage === "start") {
ca.value = !0;
return;
}
if (e?.stage === "end") {
ca.value = !1;
return;
}
ao();
}
async function Fu() {
if (vi("copyAlt", {
config: {
...V.value,
formattedDates: Y.value
},
dataset: {
lines: Q.value,
bars: gl.value,
plots: $.value
}
}), !V.value.chart.userOptions.callbacks.altCopy) {
console.warn("Vue Data UI - A callback must be set for `altCopy` in userOptions.");
return;
}
await Promise.resolve(V.value.chart.userOptions.callbacks.altCopy({
config: {
...V.value,
formattedDates: Y.value
},
dataset: {
lines: Q.value,
bars: gl.value,
plots: $.value
}
}));
}
let Iu = E(!1);
function Lu() {
U.value.end > U.value.start && (da.value = null), Bo.value = !0, Iu.value = !0;
}
function Ru() {
da.value = null, Js(), Iu.value = !1, Bo.value = !1;
}
function zu(e) {
if (!L.value || Wi.value || document.activeElement !== L.value) return;
let t = e.key === "ArrowLeft", n = e.key === "ArrowRight";
if (!t && !n || !U.value.end && U.value.end !== 0) return;
let r = U.value.end - U.value.start;
if (r <= 0) return;
if (e.preventDefault(), e.stopPropagation(), G.value) {
let e = Us.value.length;
if (!e) return;
let r = da.value;
r !== null && r >= 0 && r < e ? n ? (r += 1, r >= e && (r = 0)) : t && (--r, r < 0 && (r = e - 1)) : r = n ? 0 : e - 1, Ws(r);
return;
}
let i = da.value, a = zs.value;
i !== null && i >= 0 && i < r ? n ? (i += 1, i >= r && (i = 0)) : t && (--i, i < 0 && (i = r - 1)) : a !== null && a >= 0 && a < r ? (i = n ? a + 1 : a - 1, i >= r && (i = 0), i < 0 && (i = r - 1)) : i = n ? 0 : r - 1, da.value = i, Bu(i), Vl(!0, i);
}
function Bu(e) {
let t = U.value.end - U.value.start;
if (t <= 0) return;
let n = J.value.width / t, r = J.value.left + n * e + n / 2, i = J.value.top + J.value.height / 2, a = l(r, i, L.value);
a && (fa.value = a);
}
let Vu = y(() => {
if (!zl.value) return null;
let e = V.value.table.showSum, t = [V.value.table.columnNames.period].concat(K.value.map((e) => e.name));
return e && (t = t.concat(V.value.table.columnNames.total)), {
headers: t,
rows: zl.value.body
};
});
return Xe({
getData: Zs,
getImage: Qs,
generatePdf: io,
generateImage: ao,
generateSvg: Nu,
generateCsv: Bl,
hideSeries: ac,
showSeries: ic,
toggleStack: ts,
toggleTable: Hl,
toggleLabels: Ul,
toggleTooltip: Wl,
toggleAnnotator: Wo,
toggleFullscreen: Gl,
copyAlt: Fu,
resetZoom: ys
}), (t, n) => (T(), x("div", {
id: `vue-ui-xy_${F.value}`,
class: C(`vue-data-ui-component vue-ui-xy ${Gi.value ? "vue-data-ui-wrapper-fullscreen" : ""} ${V.value.useCssAnimation ? "" : "vue-ui-dna"}`),
ref_key: "chart",
ref: wi,
style: w(`background:${V.value.chart.backgroundColor}; color:${V.value.chart.color};width:100%;font-family:${V.value.chart.fontFamily};${V.value.responsive ? "height: 100%" : ""}`),
onMouseenter: Ho,
onMouseleave: Uo,
onClick: Ys
}, [
S("div", {
id: `chart-instructions-${F.value}`,
class: "sr-only"
}, [S("p", null, k(V.value.a11y.translations.keyboardNavigation), 1)], 8, Pt),
Vu.value?.rows?.length ? (T(), rt(tt, {
key: 0,
uid: F.value,
head: Vu.value.headers,
body: Vu.value.rows,
notice: V.value.a11y.translations.tableAvailable,
caption: V.value.a11y.translations.tableCaption
}, null, 8, [
"uid",
"head",
"body",
"notice",
"caption"
])) : b("", !0),
V.value.chart.userOptions.buttons.annotator && L.value ? (T(), rt(A(gi), {
key: 1,
svgRef: L.value,
backgroundColor: V.value.chart.backgroundColor,
color: V.value.chart.color,
active: Wi.value,
isCursorPointer: La.value,
onClose: Wo
}, {
"annotator-action-close": j(() => [O(t.$slots, "annotator-action-close", {}, void 0, !0)]),
"annotator-action-color": j(({ color: e }) => [O(t.$slots, "annotator-action-color", ft(lt({ color: e })), void 0, !0)]),
"annotator-action-draw": j(({ mode: e }) => [O(t.$slots, "annotator-action-draw", ft(lt({ mode: e })), void 0, !0)]),
"annotator-action-undo": j(({ disabled: e }) => [O(t.$slots, "annotator-action-undo", ft(lt({ disabled: e })), void 0, !0)]),
"annotator-action-redo": j(({ disabled: e }) => [O(t.$slots, "annotator-action-redo", ft(lt({ disabled: e })), void 0, !0)]),
"annotator-action-delete": j(({ disabled: e }) => [O(t.$slots, "annotator-action-delete", ft(lt({ disabled: e })), void 0, !0)]),
_: 3
}, 8, [
"svgRef",
"backgroundColor",
"color",
"active",
"isCursorPointer"
])) : b("", !0),
cc.value ? (T(), x("div", {
key: 2,
ref_key: "noTitle",
ref: ki,
class: "vue-data-ui-no-title-space",
style: "height:36px; width: 100%; background:transparent"
}, null, 512)) : b("", !0),
V.value.chart.title.show ? (T(), x("div", {
key: 3,
ref_key: "chartTitle",
ref: Ti,
class: "vue-ui-xy-title",
style: w(`font-family:${V.value.chart.fontFamily}`)
}, [(T(), rt(qe, {
key: `title_${Qi.value}`,
config: {
title: {
cy: "xy-div-title",
...V.value.chart.title
},
subtitle: {
cy: "xy-div-subtitle",
...V.value.chart.title.subtitle
}
}
}, null, 8, ["config"]))], 4)) : b("", !0),
S("div", { id: `legend-top-${F.value}` }, null, 8, Ft),
V.value.chart.userOptions.show && (na.value || ra.value) ? (T(), rt(A(fi), {
ref_key: "userOptionsRef",
ref: Fi,
key: `user_options_${Xi.value}`,
backgroundColor: V.value.chart.backgroundColor,
color: V.value.chart.color,
isPrinting: A(no),
isImaging: A(ro),
uid: F.value,
hasTooltip: V.value.chart.userOptions.buttons.tooltip && V.value.chart.tooltip.show,
hasPdf: V.value.chart.userOptions.buttons.pdf,
hasXls: V.value.chart.userOptions.buttons.csv,
hasImg: V.value.chart.userOptions.buttons.img,
hasSvg: V.value.chart.userOptions.buttons.svg,
hasLabel: V.value.chart.userOptions.buttons.labels,
hasTable: V.value.chart.userOptions.buttons.table,
hasStack: e.dataset.length > 1 && V.value.chart.userOptions.buttons.stack,
hasFullscreen: V.value.chart.userOptions.buttons.fullscreen,
hasAltCopy: V.value.chart.userOptions.buttons.altCopy,
isStacked: H.value.isStacked,
isFullscreen: Gi.value,
chartElement: t.$refs.chart,
position: V.value.chart.userOptions.position,
isTooltip: H.value.showTooltip,
titles: { ...V.value.chart.userOptions.buttonTitles },
hasAnnotator: V.value.chart.userOptions.buttons.annotator,
isAnnotation: Wi.value,
callbacks: V.value.chart.userOptions.callbacks,
tableDialog: V.value.table.useDialog,
printScale: V.value.chart.userOptions.print.scale,
isCursorPointer: La.value,
onToggleFullscreen: Gl,
onGeneratePdf: A(io),
onGenerateCsv: Bl,
onGenerateImage: Pu,
onGenerateSvg: Nu,
onToggleTable: Hl,
onToggleLabels: Ul,
onToggleStack: ts,
onToggleTooltip: Wl,
onToggleAnnotator: Wo,
onCopyAlt: Fu,
style: w({ visibility: na.value ? ra.value ? "visible" : "hidden" : "visible" })
}, it({ _: 2 }, [
t.$slots.menuIcon ? {
name: "menuIcon",
fn: j(({ isOpen: e, color: n }) => [O(t.$slots, "menuIcon", ft(lt({
isOpen: e,
color: n
})), void 0, !0)]),
key: "0"
} : void 0,
t.$slots.optionTooltip ? {
name: "optionTooltip",
fn: j(() => [O(t.$slots, "optionTooltip", {}, void 0, !0)]),
key: "1"
} : void 0,
t.$slots.optionPdf ? {
name: "optionPdf",
fn: j(() => [O(t.$slots, "optionPdf", {}, void 0, !0)]),
key: "2"
} : void 0,
t.$slots.optionCsv ? {
name: "optionCsv",
fn: j(() => [O(t.$slots, "optionCsv", {}, void 0, !0)]),
key: "3"
} : void 0,
t.$slots.optionImg ? {
name: "optionImg",
fn: j(() => [O(t.$slots, "optionImg", {}, void 0, !0)]),
key: "4"
} : void 0,
t.$slots.optionSvg ? {
name: "optionSvg",
fn: j(() => [O(t.$slots, "optionSvg", {}, void 0, !0)]),
key: "5"
} : void 0,
t.$slots.optionTable ? {
name: "optionTable",
fn: j(() => [O(t.$slots, "optionTable", {}, void 0, !0)]),
key: "6"
} : void 0,
t.$slots.optionLabels ? {
name: "optionLabels",
fn: j(() => [O(t.$slots, "optionLabels", {}, void 0, !0)]),
key: "7"
} : void 0,
t.$slots.optionStack ? {
name: "optionStack",
fn: j(({ isStack: e }) => [O(t.$slots, "optionStack", ft(lt({ isStack: e })), void 0, !0)]),
key: "8"
} : void 0,
t.$slots.optionFullscreen ? {
name: "optionFullscreen",
fn: j(({ toggleFullscreen: e, isFullscreen: n }) => [O(t.$slots, "optionFullscreen", ft(lt({
toggleFullscreen: e,
isFullscreen: n
})), void 0, !0)]),
key: "9"
} : void 0,
t.$slots.optionAnnotator ? {
name: "optionAnnotator",
fn: j(({ toggleAnnotator: e, isAnnotator: n }) => [O(t.$slots, "optionAnnotator", ft(lt({
toggleAnnotator: e,
isAnnotator: n
})), void 0, !0)]),
key: "10"
} : void 0,
t.$slots.optionAltCopy ? {
name: "optionAltCopy",
fn: j(({ altCopy: e }) => [O(t.$slots, "optionAltCopy", ft(lt({ altCopy: e })), void 0, !0)]),
key: "11"
} : void 0,
t.$slots["custom-menu-before"] ? {
name: "custom-menu-before",
fn: j(() => [O(t.$slots, "custom-menu-before", {}, void 0, !0)]),
key: "12"
} : void 0,
t.$slots["custom-menu-after"] ? {
name: "custom-menu-after",
fn: j(() => [O(t.$slots, "custom-menu-after", {}, void 0, !0)]),
key: "13"
} : void 0
]), 1032, /* @__PURE__ */ "backgroundColor.color.isPrinting.isImaging.uid.hasTooltip.hasPdf.hasXls.hasImg.hasSvg.hasLabel.hasTable.hasStack.hasFullscreen.hasAltCopy.isStacked.isFullscreen.chartElement.position.isTooltip.titles.hasAnnotator.isAnnotation.callbacks.tableDialog.printScale.isCursorPointer.onGeneratePdf.style".split("."))) : b("", !0),
S("div", It, [(T(), x("svg", {
ref_key: "svgRef",
ref: L,
xmlns: "http://www.w3.org/2000/svg",
class: C([{
"vue-data-ui-fullscreen--on": Gi.value,
"vue-data-ui-fulscreen--off": !Gi.value,
"vue-data-ui-no-transition": !A(Ia)
}, "vue-ui-xy-svg vue-data-ui-svg"]),
width: "100%",
viewBox: Vi.value,
style: w({
background: "transparent",
color: V.value.chart.color,
fontFamily: V.value.chart.fontFamily
}),
"aria-label": oc.value,
"aria-describedby": `chart-instructions-${F.value}`,
"aria-live": "polite",
role: "img",
tabindex: "0",
preserveAspectRatio: "xMidYMid",
onMousemove: qs,
onMouseleave: Js,
onClick: Ys,
onFocus: Lu,
onBlur: Ru,
onKeydown: zu
}, [S("g", {
ref_key: "G",
ref: Ai,
class: "vue-data-ui-g"
}, [
ot(A(hi)),
t.$slots["chart-background"] ? (T(), x("foreignObject", {
key: 0,
x: Math.max(0, J.value?.left),
y: J.value?.top,
width: Math.max(0, J.value?.width),
height: Math.max(0, J.value?.height),
style: { pointerEvents: "none" }
}, [O(t.$slots, "chart-background", {}, void 0, !0)], 8, Rt)) : b("", !0),
X.value > 0 ? (T(), x("g", zt, [
S("g", Bt, [
V.value.chart.grid.labels.xAxis.showBaseline ? (T(), x("line", {
key: 0,
stroke: V.value.chart.grid.stroke,
"stroke-width": "1",
x1: J.value?.left,
x2: J.value?.right,
y1: A(_)(J.value?.bottom),
y2: A(_)(J.value?.bottom),
"stroke-linecap": "round",
style: { animation: "none !important" }
}, null, 8, Vt)) : b("", !0),
H.value.useIndividualScale ? V.value.chart.grid.showHorizontalLines ? (T(!0), x(v, { key: 2 }, D(vl.value, (e) => (T(), x("g", { key: `individual_grid_${e.groupId || e.id}` }, [e.id === N.value && e.yLabels.length ? (T(!0), x(v, { key: 0 }, D(e.yLabels, (t) => (T(), x("line", {
key: `selected_individual_grid_line_${e.groupId || e.id}_${t.value}_${t.y}`,
x1: J.value?.left,
x2: J.value?.right,
y1: A(_)(t.y),
y2: A(_)(t.y),
stroke: e.color,
"stroke-width": .5,
"stroke-linecap": "round",
style: { animation: "none !important" }
}, null, 8, Gt))), 128)) : e.yLabels.length ? (T(!0), x(v, { key: 1 }, D(e.yLabels, (t) => (T(), x("line", {
key: `individual_grid_line_${e.groupId || e.id}_${t.value}_${t.y}`,
x1: J.value?.left,
x2: J.value?.right,
y1: A(_)(t.y),
y2: A(_)(t.y),
stroke: V.value.chart.grid.stroke,
"stroke-width": .5,
"stroke-linecap": "round",
style: { animation: "none !important" }
}, null, 8, Kt))), 128)) : b("", !0)]))), 128)) : b("", !0) : (T(), x(v, { key: 1 }, [V.value.chart.grid.labels.yAxis.showBaseline ? (T(), x("line", {
key: 0,
class: "vue-ui-xy-y-axis",
stroke: V.value.chart.grid.stroke,
"stroke-width": "1",
x1: q.value ? J.value?.right : J.value?.left,
x2: q.value ? J.value?.right : J.value?.left,
y1: A(_)(J.value?.top),
y2: A(_)(J.value?.bottom),
"stroke-linecap": "round",
style: { animation: "none !important" }
}, null, 8, Ht)) : b("", !0), V.value.chart.grid.showHorizontalLines ? (T(), x("g", Ut, [(T(!0), x(v, null, D(Hc.value, (e) => (T(), x("line", {
key: `horizontal_grid_line_${e.value}_${e.y}`,
x1: J.value?.left,
x2: J.value?.right,
y1: A(_)(e.y),
y2: A(_)(e.y),
stroke: V.value.chart.grid.stroke,
"stroke-width": .5,
"stroke-linecap": "round",
style: { animation: "none !important" }
}, null, 8, Wt))), 128))])) : b("", !0)], 64)),
V.value.chart.grid.showVerticalLines ? (T(), x("g", qt, [S("path", {
d: Po.value,
"stroke-width": .5,
stroke: V.value.chart.grid.stroke,
"stroke-linecap": "round",
style: { animation: "none !important" }
}, null, 8, Jt)])) : b("", !0),
V.value.chart.grid.labels.xAxisLabels.show ? (T(), x("g", Yt, [S("path", {
d: Fo.value,
stroke: V.value.chart.grid.stroke,
"stroke-width": 1,
"stroke-linecap": "round",
style: { animation: "none !important" }
}, null, 8, Xt)])) : b("", !0)
]),
(T(!0), x(v, null, D(gl.value, (e, n) => (T(), x("defs", { key: `def_rect_${n}` }, [t.$slots["bar-gradient"] ? O(t.$slots, "bar-gradient", ut({ ref_for: !0 }, {
series: e,
positiveId: `rectGradient_pos_${n}_${F.value}`,
negativeId: `rectGradient_neg_${n}_${F.value}`
}), void 0, !0, 0) : (T(), x(v, { key: 1 }, [ot(Ze, {
t: "linear",
id: `rectGradient_pos_${n}_${F.value}`,
x2: "0%",
y2: "100%",
stops: [
[
"0%",
e.color,
1
],
[
"62%",
A(de)(e.color, .02),
1
],
[
"100%",
A(de)(e.color, .05),
1
]
]
}, null, 8, ["id", "stops"]), ot(Ze, {
t: "linear",
id: `rectGradient_neg_${n}_${F.value}`,
x2: "0%",
y2: "100%",
stops: [
[
"0%",
A(de)(e.color, .05),
1
],
[
"38%",
A(de)(e.color, .02),
1
],
[
"100%",
e.color,
1
]
]
}, null, 8, ["id", "stops"])], 64))]))), 128)),
(T(!0), x(v, null, D($.value, (e, t) => (T(), x("defs", { key: `def_plot_${t}` }, [ot(Ze, {
t: "radial",
id: `plotGradient_${t}_${F.value}`,
cx: "50%",
cy: "50%",
r: "50%",
fx: "50%",
fy: "50%",
stops: [[
"0%",
A(de)(e.color, .05),
1
], [
"100%",
e.color,
1
]]
}, null, 8, ["id", "stops"])]))), 128)),
(T(!0), x(v, null, D(Q.value, (e, n) => (T(), x(v, { key: `def_line_${e.id}` }, [S("defs", null, [ot(Ze, {
t: "radial",
id: `lineGradient_${n}_${F.value}`,
cx: "50%",
cy: "50%",
r: "50%",
fx: "50%",
fy: "50%",
stops: [[
"0%",
A(de)(e.color, .05),
1
], [
"100%",
e.color,
1
]]
}, null, 8, ["id", "stops"]), t.$slots["area-gradient"] ? O(t.$slots, "area-gradient", ut({ ref_for: !0 }, {
series: e,
id: `areaGradient_${n}_${F.value}`
}), void 0, !0, 0) : (T(), rt(Ze, {
key: 1,
t: "linear",
id: `areaGradient_${n}_${F.value}`,
x1: "0%",
x2: "100%",
y1: "0%",
y2: "0%",
stops: [[
"0%",
A(i)(A(de)(e.color, .03), V.value.line.area.opacity),
1
], [
"100%",
A(i)(e.color, V.value.line.area.opacity),
1
]]
}, null, 8, ["id", "stops"]))]), e.temperatureColors && !e.isFlatTemperatureLine ? (T(), x("defs", Zt, [S("linearGradient", {
id: `temperature_grad_line_${n}_${F.value}`,
gradientTransform: "rotate(90)"
}, [(T(!0), x(v, null, D(e.temperatureColors, (t, r) => (T(), x("stop", {
key: `temperature_grad_stop_${n}_${r}_${F.value}`,
"stop-color": t,
offset: A(Ae)(r, e.temperatureColors.length)
}, null, 8, $t))), 128))], 8, Qt)])) : b("", !0)], 64))), 128)),
(T(!0), x(v, null, D(lc.value, (e) => (T(), x("g", { key: `highlight_area_${e.from}_${e.span}_${e.color}` }, [e.show ? (T(), x(v, { key: 0 }, [(T(!0), x(v, null, D(e.span, (t, n) => (T(), x("g", { key: `highlight_area_rect_${e.from}_${n}` }, [S("rect", {
style: w({
transition: "none",
opacity: +(e.from + n >= U.value.start && e.from + n <= U.value.end - 1)
}),
x: _c(e.from + n - U.value.start),
y: J.value?.top,
height: J.value.height < 0 ? 10 : J.value.height,
width: vc(e.from + n - U.value.start),
fill: A(i)(e.color, e.opacity)
}, null, 12, en)]))), 128)), (T(!0), x(v, null, D(e.span, (t, n) => (T(), x("g", { key: `highlight_area_caption_${e.from}_${n}` }, [e.caption.text && n === 0 ? (T(), x("foreignObject", {
key: 0,
x: _c(e.from + n - U.value.start) - (e.caption.width === "auto" ? 0 : e.caption.width / 2 - xc(e.span) / 2),
y: J.value?.top + e.caption.offsetY,
style: w({
overflow: "visible",
opacity: +(e.to >= U.value.start && e.from < U.value.end)
}),
height: "1",
width: e.caption.width === "auto" ? xc(e.span) : e.caption.width
}, [S("div", { style: w(`padding:${e.caption.padding}px;text-align:${e.caption.textAlign};font-size:${e.caption.fontSize}px;color:${e.caption.color};font-weight:${e.caption.bold ? "bold" : "normal"}`) }, k(e.caption.text), 5)], 12, tn)) : b("", !0)]))), 128))], 64)) : b("", !0)]))), 128)),
Bo.value && !G.value ? (T(), x("g", nn, [(T(!0), x(v, null, D(X.value, (e, t) => (T(), x("g", { key: `tooltip_trap_highlighter_${t}` }, [S("rect", {
x: _c(t),
y: J.value?.top,
height: J.value.height < 0 ? 10 : J.value.height,
width: bc(t),
fill: [
I.value,
R.value,
qi.value
].includes(t) ? A(i)(V.value.chart.highlighter.color, V.value.chart.highlighter.crosshairs.show ? 0 : V.value.chart.highlighter.opacity) : "transparent",
style: {
transition: "none !important",
animation: "none !important"
}
}, null, 8, rn)]))), 128))])) : b("", !0),
gl.value.length ? (T(!0), x(v, { key: 1 }, D(gl.value, (e, n) => (T(), x("g", {
key: `serie_bar_${e.id}`,
class: C(`serie_bar_${n}`),
style: w(`opacity:${N.value ? N.value === e.groupId ? 1 : .2 : 1};transition:opacity 0.2s ease-in-out`)
}, [(T(!0), x(v, null, D(e.plots, (r, i) => (T(), x("g", { key: `bar_plot_${n}_${i}` }, [
A(Ct)(r.value) ? (T(), x("rect", {
key: 0,
x: Fs(r) + Rc.value / 2,
y: H.value.useIndividualScale ? Rs(r) : Ls(r),
height: H.value.useIndividualScale ? Math.abs(Ms(r)) : Math.abs(js(r)),
width: Lc.value - Rc.value,
rx: V.value.bar.borderRadius,
fill: V.value.bar.useGradient ? r.value >= 0 ? `url(#rectGradient_pos_${n}_${F.value})` : `url(#rectGradient_neg_${n}_${F.value})` : e.color,
stroke: V.value.bar.border.useSerieColor ? e.color : V.value.bar.border.stroke,
"stroke-width": V.value.bar.border.strokeWidth,
style: w({ transition: A(Ha) || !V.value.bar.showTransition ? void 0 : `all ${V.value.bar.transitionDurationMs}ms ease-in-out` })
}, null, 12, an)) : b("", !0),
A(Ct)(r.value) && t.$slots.pattern ? (T(), x("rect", {
key: 1,
x: Fs(r) - Rc.value / 2,
y: H.value.useIndividualScale ? Rs(r) : Ls(r),
height: H.value.useIndividualScale ? Math.abs(Ms(r)) : Math.abs(js(r)),
width: Lc.value - Rc.value,
rx: V.value.bar.borderRadius,
fill: `url(#pattern_${F.value}_${e.slotAbsoluteIndex})`,
stroke: V.value.bar.border.useSerieColor ? e.color : V.value.bar.border.stroke,
"stroke-width": V.value.bar.border.strokeWidth,
style: w({ transition: A(Ha) || !V.value.bar.showTransition ? void 0 : `all ${V.value.bar.transitionDurationMs}ms ease-in-out` })
}, null, 12, on)) : b("", !0),
r.comment && V.value.chart.comments.show ? (T(), x("foreignObject", {
key: 2,
style: { overflow: "visible" },
height: "12",
width: Lc.value + V.value.chart.comments.width,
x: Fs(r) - V.value.chart.comments.width / 2 + V.value.chart.comments.offsetX,
y: A(p)(r.y) + V.value.chart.comments.offsetY + 6
}, [O(t.$slots, "plot-comment", { plot: {
...r,
color: e.color,
seriesIndex: n,
datapointIndex: i
} }, void 0, !0)], 8, sn)) : b("", !0)
]))), 128))], 6))), 128)) : b("", !0),
!H.value.useIndividualScale && V.value.chart.grid.labels.zeroLine.show ? (T(), x("line", {
key: 2,
stroke: V.value.chart.grid.stroke,
"stroke-width": "1",
x1: J.value?.left,
x2: J.value?.right,
y1: A(_)(As.value),
y2: A(_)(As.value),
"stroke-linecap": "round",
style: { animation: "none !important" }
}, null, 8, cn)) : b("", !0),
!V.value.chart.highlighter.crosshairs.show && (V.value.chart.highlighter.useLine || G.value) && es.value ? (T(), x("g", ln, [S("line", {
x1: uu.value,
x2: uu.value,
y1: A(_)(J.value?.top),
y2: A(_)(J.value?.bottom),
stroke: V.value.chart.highlighter.color,
"stroke-width": V.value.chart.highlighter.lineWidth,
"stroke-dasharray": V.value.chart.highlighter.lineDasharray,
"stroke-linecap": "round",
style: {
transition: "none !important",
animation: "none !important",
"pointer-events": "none"
}
}, null, 8, un)])) : b("", !0),
du.value ? (T(), x("g", dn, [(T(!0), x(v, null, D(fu.value, (e) => (T(), x("g", { key: `crosshair_${e.serie.id}_${e.index}` }, [
S("line", {
x1: V.value.chart.highlighter.crosshairs.stopOnPoint ? A(_)(e.x) : J.value.left,
x2: V.value.chart.highlighter.crosshairs.stopOnPoint ? A(_)(mu(e.x)) : J.value.right,
y1: A(_)(e.y),
y2: A(_)(e.y),
stroke: V.value.chart.highlighter.crosshairs.stroke,
"stroke-width": V.value.chart.highlighter.crosshairs.strokeWidth,
"stroke-dasharray": V.value.chart.highlighter.crosshairs.strokeDasharray,
"stroke-linecap": "round",
style: { "pointer-events": "none" }
}, null, 8, fn),
S("line", {
x1: A(_)(e.x),
x2: A(_)(e.x),
y1: V.value.chart.highlighter.crosshairs.stopOnPoint ? A(_)(e.y) : J.value.top,
y2: V.value.chart.highlighter.crosshairs.stopOnPoint ? A(_)(J.value.bottom) : J.value.bottom,
stroke: V.value.chart.highlighter.crosshairs.stroke,
"stroke-width": V.value.chart.highlighter.crosshairs.strokeWidth,
"stroke-dasharray": V.value.chart.highlighter.crosshairs.strokeDasharray,
"stroke-linecap": "round",
style: { "pointer-events": "none" }
}, null, 8, pn),
S("circle", {
cx: A(_)(mu(e.x)),
cy: A(_)(e.y),
r: V.value.chart.highlighter.crosshairs.dot.radius,
fill: V.value.chart.highlighter.crosshairs.dot.fill,
stroke: V.value.chart.highlighter.crosshairs.dot.stroke,
"stroke-width": V.value.chart.highlighter.crosshairs.dot.strokeWidth,
style: { "pointer-events": "none" }
}, null, 8, mn)
]))), 128))])) : b("", !0),
V.value.chart.grid.frame.show ? (T(), x("rect", {
key: 5,
style: {
pointerEvents: "none",
transition: "none",
animation: "none !important"
},
x: Math.max(0, J.value?.left),
y: J.value?.top,
width: Math.max(0, J.value?.width),
height: J.value.height < 0 ? 0 : J.value.height,
fill: "transparent",
stroke: V.value.chart.grid.frame.stroke,
"stroke-width": V.value.chart.grid.frame.strokeWidth,
"stroke-linecap": V.value.chart.grid.frame.strokeLinecap,
"stroke-linejoin": V.value.chart.grid.frame.strokeLinejoin,
"stroke-dasharray": V.value.chart.grid.frame.strokeDasharray
}, null, 8, hn)) : b("", !0),
V.value.chart.grid.labels.show ? (T(), x("g", {
key: 6,
ref_key: "scaleLabels",
ref: Pi,
opacity: du.value ? .2 : 1,
style: { transition: "opacity 0.2s" }
}, [H.value.useIndividualScale ? (T(), x(v, { key: 0 }, [(T(!0), x(v, null, D(vl.value, (e) => (T(), x("g", { key: `individual_scale_axis_${e.groupId || e.id}` }, [S("line", {
x1: H.value.isStacked ? q.value ? J.value.right : J.value.left : q.value ? e.x : e.x - J.value.individualOffsetX,
x2: H.value.isStacked ? q.value ? J.value.right : J.value.left : q.value ? e.x : e.x - J.value.individualOffsetX,
y1: H.value.isStacked ? A(_)(J.value?.bottom - e.yOffset - e.individualHeight) : A(_)(J.value?.top),
y2: H.value.isStacked ? A(_)(J.value?.bottom - e.yOffset) : A(_)(J.value?.bottom),
stroke: e.color,
"stroke-width": V.value.chart.grid.stroke,
"stroke-linecap": "round",
style: w(`opacity:${N.value ? N.value === e.groupId ? 1 : .3 : 1};transition:opacity 0.2s ease-in-out; animation: none !important`)
}, null, 12, _n)]))), 128)), (T(!0), x(v, null, D(vl.value, (e) => (T(), x("g", {
key: `individual_scale_label_${e.groupId || e.id}`,
style: w(`opacity:${N.value ? N.value === e.groupId ? 1 : .3 : 1};transition:opacity 0.2s ease-in-out`)
}, [
S("text", {
class: C({ "vue-data-ui-transition": A(Ia) }),
fill: e.color,
"font-size": B.value.dataLabels * .8,
"text-anchor": "middle",
transform: `translate(${H.value.isStacked ? q.value ? J.value.right + V.value.chart.grid.labels.yAxis.crosshairSize + V.value.chart.grid.labels.yAxis.scaleValueOffsetX + 5 + V.value.chart.grid.labels.yAxis.labelWidth + J.value.individualOffsetX + V.value.chart.grid.labels.axis.yLabelOffsetX : J.value.left - V.value.chart.grid.labels.yAxis.crosshairSize - V.value.chart.grid.labels.yAxis.scaleValueOffsetX - V.value.chart.grid.labels.yAxis.labelWidth - V.value.chart.grid.labels.axis.yLabelOffsetX : q.value ? e.x + V.value.chart.grid.labels.yAxis.crosshairSize + V.value.chart.grid.labels.yAxis.scaleValueOffsetX + 5 + V.value.chart.grid.labels.yAxis.labelWidth + V.value.chart.grid.labels.axis.yLabelOffsetX : e.x - B.value.dataLabels * .8 / 2}, ${H.value.isStacked ? J.value?.bottom - e.yOffset - e.individualHeight / 2 : J.value?.top + J.value.height / 2}) rotate(-90)`
}, k(e.name) + " " + k(e.scaleLabel && e.unique && e.scaleLabel !== e.id ? `- ${e.scaleLabel}` : ""), 11, vn),
(T(!0), x(v, null, D(e.yLabels, (t, n) => (T(), x(v, { key: `individual_scale_y_crosshair_${e.groupId || e.id}_${t.value}_${n}` }, [V.value.chart.grid.labels.yAxis.showCrosshairs ? (T(), x("line", {
key: 0,
x1: H.value.isStacked ? q.value ? J.value.right : J.value.left : q.value ? e.x : e.x + 3 - V.value.chart.grid.labels.yAxis.crosshairSize - J.value.individualOffsetX,
x2: H.value.isStacked ? q.value ? J.value.right + V.value.chart.grid.labels.yAxis.crosshairSize : J.value.left - V.value.chart.grid.labels.yAxis.crosshairSize : q.value ? e.x + V.value.chart.grid.labels.yAxis.crosshairSize : e.x - J.value.individualOffsetX,
y1: A(_)(t.y),
y2: A(_)(t.y),
stroke: e.color,
"stroke-width": 1,
"stroke-linecap": "round",
style: { animation: "none !important" }
}, null, 8, yn)) : b("", !0)], 64))), 128)),
(T(!0), x(v, null, D(e.yLabels, (t, n) => (T(), x("text", {
class: C({ "vue-data-ui-transition": A(Ia) }),
key: `individual_scale_y_label_${e.groupId || e.id}_${t.value}_${n}`,
transform: `translate(${H.value.isStacked ? q.value ? J.value.right + V.value.chart.grid.labels.yAxis.crosshairSize + V.value.chart.grid.labels.yAxis.scaleValueOffsetX + 5 : J.value.left - V.value.chart.grid.labels.yAxis.crosshairSize - V.value.chart.grid.labels.yAxis.scaleValueOffsetX - 5 : q.value ? e.x + V.value.chart.grid.labels.yAxis.crosshairSize + V.value.chart.grid.labels.yAxis.scaleValueOffsetX + 5 : e.x - 5 - J.value.individualOffsetX}, ${A(_)(t.y) + B.value.dataLabels / 3})`,
"text-anchor": q.value ? "start" : "end",
"font-size": B.value.dataLabels,
fill: e.color
}, k(A(g)(V.value.chart.grid.labels.yAxis.formatter, t.value, A(pe)({
p: t.prefix,
v: t.value,
s: t.suffix,
r: V.value.chart.grid.labels.yAxis.rounding
}), {
datapoint: t.datapoint,
seriesIndex: n
})), 11, bn))), 128))
], 4))), 128))], 64)) : (T(!0), x(v, { key: 1 }, D(Hc.value, (e, t) => (T(), x("g", { key: `yLabel_${t}` }, [A(Ct)(e) && e.value >= W.value.min && e.value <= W.value.max && V.value.chart.grid.labels.yAxis.showCrosshairs ? (T(), x("line", {
key: 0,
x1: q.value ? J.value?.right : J.value?.left,
x2: q.value ? J.value?.right + V.value.chart.grid.labels.yAxis.crosshairSize : J.value?.left - V.value.chart.grid.labels.yAxis.crosshairSize,
y1: A(_)(e.y),
y2: A(_)(e.y),
stroke: V.value.chart.grid.stroke,
"stroke-width": "1",
"stroke-linecap": "round",
style: { animation: "none !important" }
}, null, 8, xn)) : b("", !0), e.value >= W.value.min && e.value <= W.value.max ? (T(), x("text", {
key: 1,
class: C({ "vue-data-ui-transition": A(Ia) }),
transform: `translate(${q.value ? J.value.right + V.value.chart.grid.labels.yAxis.crosshairSize + V.value.chart.grid.labels.yAxis.scaleValueOffsetX + 5 : J.value.scaleLabelX - V.value.chart.grid.labels.yAxis.crosshairSize}, ${A(p)(e.y + B.value.dataLabels / 3)})`,
"font-size": B.value.dataLabels,
"text-anchor": q.value ? "start" : "end",
fill: V.value.chart.grid.labels.color
}, k(A(Ct)(e.value) ? A(g)(V.value.chart.grid.labels.yAxis.formatter, e.value, A(pe)({
p: e.prefix,
v: e.value,
s: e.suffix,
r: V.value.chart.grid.labels.yAxis.rounding
})) : ""), 11, Sn)) : b("", !0)]))), 128))], 8, gn)) : b("", !0),
du.value ? (T(), x("g", Cn, [(T(!0), x(v, null, D(fu.value, (e) => (T(), x("text", {
class: C({ "vue-data-ui-transition": A(Ia) }),
key: `crosshair_y_label_${e.serie.id}_${e.index}`,
transform: `translate(${q.value ? J.value.right + V.value.chart.grid.labels.yAxis.crosshairSize + V.value.chart.grid.labels.yAxis.scaleValueOffsetX + 5 : J.value.scaleLabelX - V.value.chart.grid.labels.yAxis.crosshairSize}, ${A(_)(e.y) + B.value.dataLabels / 3})`,
"font-size": B.value.dataLabels,
"text-anchor": q.value ? "start" : "end",
fill: V.value.chart.grid.labels.color,
style: {
transition: "none !important",
animation: "none !important",
"pointer-events": "none"
}
}, k(A(g)(V.value.chart.grid.labels.yAxis.formatter, e.value, A(pe)({
p: e.serie.prefix || V.value.chart.labels.prefix,
v: e.value,
s: e.serie.suffix || V.value.chart.labels.suffix,
r: V.value.chart.grid.labels.yAxis.rounding
}), {
datapoint: e.serie,
seriesIndex: e.index
})), 11, wn))), 128))])) : b("", !0),
pu.value ? (T(), x("g", Tn, [S("circle", {
cx: uu.value,
cy: A(_)(J.value?.bottom),
r: V.value.chart.highlighter.crosshairs.dot.radius,
fill: V.value.chart.highlighter.crosshairs.dot.fill,
stroke: V.value.chart.highlighter.crosshairs.dot.stroke,
"stroke-width": V.value.chart.highlighter.crosshairs.dot.strokeWidth,
style: {
transition: "none !important",
animation: "none !important",
"pointer-events": "none"
}
}, null, 8, En)])) : b("", !0),
(T(!0), x(v, null, D($.value, (e, n) => (T(), x("g", {
key: `serie_plot_${e.id}`,
class: C(`serie_plot_${n}`),
style: w(`opacity:${N.value ? N.value === e.groupId ? 1 : .2 : 1};transition:opacity 0.2s ease-in-out`)
}, [(T(!0), x(v, null, D(e.plots, (r, i) => (T(), x("g", { key: `circle_plot_${e.id}_${i}` }, [r && A(Ct)(r.value) ? (T(), rt(Ye, {
key: 0,
shape: [
"triangle",
"square",
"diamond",
"pentagon",
"hexagon",
"star"
].includes(e.shape) ? e.shape : "circle",
color: V.value.plot.useGradient ? `url(#plotGradient_${n}_${F.value})` : V.value.plot.dot.useSerieColor ? e.color : V.value.plot.dot.fill,
plot: {
x: A(p)(r.x),
y: A(p)(r.y)
},
radius: hu(e, r, i) ? (ja.value.plot || 6) * 1.5 : (Wc(e.plots, i), ja.value.plot || 6),
stroke: V.value.plot.dot.useSerieColor ? V.value.chart.backgroundColor : e.color,
strokeWidth: V.value.plot.dot.strokeWidth,
transition: A(Ha) || us.value || !V.value.plot.showTransition ? void 0 : `all ${V.value.plot.transitionDurationMs}ms ease-in-out`,
still: us.value
}, null, 8, [
"shape",
"color",
"plot",
"radius",
"stroke",
"strokeWidth",
"transition",
"still"
])) : b("", !0), r.comment && V.value.chart.comments.show ? (T(), x("foreignObject", {
key: 1,
style: { overflow: "visible" },
height: "12",
width: V.value.chart.comments.width,
x: r.x - V.value.chart.comments.width / 2 + V.value.chart.comments.offsetX,
y: r.y + V.value.chart.comments.offsetY + 6
}, [S("div", On, [O(t.$slots, "plot-comment", { plot: {
...r,
color: e.color,
seriesIndex: n,
datapointIndex: i
} }, void 0, !0)])], 8, Dn)) : b("", !0)]))), 128))], 6))), 128)),
(T(!0), x(v, null, D(Q.value, (e, t) => (T(), x("g", {
key: `serie_line_${e.id}`,
class: C(`serie_line_${t}`),
style: w(`opacity:${N.value ? N.value === e.groupId ? 1 : .2 : 1};transition:opacity 0.2s ease-in-out`)
}, [e.hasDashedSegments ? (T(), x(v, { key: 0 }, [e.smooth ? (T(!0), x(v, { key: 0 }, D(e.dashedSmooth, (t, n) => (T(), x("path", {
key: `line_coating_smooth_segment_${e.id}_${n}`,
fill: "none",
"stroke-linecap": "round",
"stroke-linejoin": "round",
d: `M ${t.path}`,
stroke: V.value.chart.backgroundColor,
"stroke-width": V.value.line.strokeWidth + 1,
"stroke-dasharray": t.dashed ? V.value.line.strokeWidth * 2 : 0,
style: w({ transition: Xc() })
}, null, 12, kn))), 128)) : (T(!0), x(v, { key: 1 }, D(e.dashedStraight, (t, n) => (T(), x("path", {
key: `line_coating_straight_segment_${e.id}_${n}`,
fill: "none",
"stroke-linecap": "round",
"stroke-linejoin": "round",
d: `M ${t.path}`,
stroke: V.value.chart.backgroundColor,
"stroke-width": V.value.line.strokeWidth + 1,
"stroke-dasharray": t.dashed ? V.value.line.strokeWidth * 2 : 0,
style: w({ transition: Xc() })
}, null, 12, An))), 128))], 64)) : e.smooth && e.plots.length > 1 && e.curve ? (T(), x("path", {
key: 1,
d: `M${e.curve}`,
stroke: V.value.chart.backgroundColor,
"stroke-width": V.value.line.strokeWidth + 1,
"stroke-dasharray": e.dashed ? V.value.line.strokeWidth * 2 : 0,
fill: "none",
"stroke-linecap": "round",
"stroke-linejoin": "round",
style: w({ transition: Xc() })
}, null, 12, jn)) : e.plots.length > 1 && e.straight ? (T(), x("path", {
key: 2,
d: `M${e.straight}`,
stroke: V.value.chart.backgroundColor,
"stroke-width": V.value.line.strokeWidth + 1,
"stroke-dasharray": e.dashed ? V.value.line.strokeWidth * 2 : 0,
fill: "none",
"stroke-linecap": "round",
"stroke-linejoin": "round",
style: w({ transition: Xc() })
}, null, 12, Mn)) : b("", !0)], 6))), 128)),
t.$slots.pattern ? (T(), x("defs", Nn, [(T(!0), x(v, null, D(So.value, (e, n) => O(t.$slots, "pattern", ut({ key: `serie_pattern_slot_${e.id}` }, { ref_for: !0 }, {
...e,
seriesIndex: e.slotAbsoluteIndex,
patternId: `pattern_${F.value}_${n}`
}), void 0, !0)), 128))])) : b("", !0),
yl.value.length && !H.value.isStacked ? (T(), x("g", Pn, [(T(!0), x(v, null, D(yl.value, (e) => (T(), x("path", {
key: e.key,
d: e.d,
fill: e.color,
"fill-opacity": V.value.line.interLine.fillOpacity,
stroke: "none",
"pointer-events": "none",
style: w({ transition: Xc() })
}, null, 12, Fn))), 128))])) : b("", !0),
(T(!0), x(v, null, D(Q.value, (e, n) => (T(), x("g", {
key: `serie_line_above_${e.id}`,
class: C(`serie_line_${n}`),
style: w(`opacity:${N.value ? N.value === e.groupId ? 1 : .2 : 1};transition:opacity 0.2s ease-in-out`)
}, [
e.useArea && e.plots.length > 1 ? (T(), x("g", In, [e.smooth ? (T(!0), x(v, { key: 0 }, D(e.curveAreas, (r, a) => (T(), x(v, { key: a }, [r ? (T(), x("path", {
key: 0,
d: r,
fill: V.value.line.area.useGradient ? `url(#areaGradient_${n}_${F.value})` : A(i)(e.color, V.value.line.area.opacity),
style: w({ transition: Xc() })
}, null, 12, Ln)) : b("", !0), t.$slots.pattern && r ? (T(), x("path", {
key: 1,
d: r,
fill: `url(#pattern_${F.value}_${e.slotAbsoluteIndex})`,
style: w({ transition: Xc() })
}, null, 12, Rn)) : b("", !0)], 64))), 128)) : (T(!0), x(v, { key: 1 }, D(e.area.split(";"), (r, a) => (T(), x(v, { key: a }, [r ? (T(), x("path", {
key: 0,
d: `M${r}Z`,
fill: V.value.line.area.useGradient ? `url(#areaGradient_${n}_${F.value})` : A(i)(e.color, V.value.line.area.opacity),
style: w({ transition: Xc() })
}, null, 12, zn)) : b("", !0), t.$slots.pattern && r ? (T(), x("path", {
key: 1,
d: `M${r}Z`,
fill: `url(#pattern_${F.value}_${e.slotAbsoluteIndex})`,
style: w({ transition: Xc() })
}, null, 12, Bn)) : b("", !0)], 64))), 128))])) : b("", !0),
!e.hasDashedSegments && e.smooth && e.plots.length > 1 && e.curve ? (T(), x("path", {
key: 1,
d: `M${e.curve}`,
stroke: e.temperatureColors && !e.isFlatTemperatureLine ? `url(#temperature_grad_line_${n}_${F.value})` : e.color,
"stroke-width": V.value.line.strokeWidth,
"stroke-dasharray": e.dashed ? V.value.line.strokeWidth * 2 : 0,
fill: "none",
"stroke-linecap": "round",
style: w({ transition: Xc() })
}, null, 12, Vn)) : e.hasDashedSegments ? (T(), x(v, { key: 2 }, [e.smooth ? (T(!0), x(v, { key: 0 }, D(e.dashedSmooth, (t, r) => (T(), x("path", {
key: `line_smooth_segment_${e.id}_${r}`,
fill: "none",
"stroke-linecap": "round",
"stroke-linejoin": "round",
d: `M ${t.path}`,
stroke: e.temperatureColors && !e.isFlatTemperatureLine ? `url(#temperature_grad_line_${n}_${F.value})` : e.color,
"stroke-width": V.value.line.strokeWidth,
"stroke-dasharray": t.dashed ? V.value.line.strokeWidth * 2 : 0,
style: w({ transition: Xc() })
}, null, 12, Hn))), 128)) : (T(!0), x(v, { key: 1 }, D(e.dashedStraight, (t, r) => (T(), x("path", {
key: `line_straight_segment_${e.id}_${r}`,
fill: "none",
"stroke-linecap": "round",
"stroke-linejoin": "round",
d: `M ${t.path}`,
stroke: e.temperatureColors && !e.isFlatTemperatureLine ? `url(#temperature_grad_line_${n}_${F.value})` : e.color,
"stroke-width": V.value.line.strokeWidth,
"stroke-dasharray": t.dashed ? V.value.line.strokeWidth * 2 : 0,
style: w({ transition: Xc() })
}, null, 12, Un))), 128))], 64)) : e.plots.length > 1 && e.straight ? (T(), x("path", {
key: 3,
d: `M${e.straight}`,
stroke: e.temperatureColors && !e.isFlatTemperatureLine ? `url(#temperature_grad_line_${n}_${F.value})` : e.color,
"stroke-width": V.value.line.strokeWidth,
"stroke-dasharray": e.dashed ? V.value.line.strokeWidth * 2 : 0,
fill: "none",
"stroke-linecap": "round",
"stroke-linejoin": "round",
style: w({ transition: Xc() })
}, null, 12, Wn)) : b("", !0),
(T(!0), x(v, null, D(e.plots, (r, i) => (T(), x(v, { key: `circle_line_${e.id}_${i}` }, [!sc.value.linePlot && r && A(Ct)(r.value) || sc.value.linePlot && r && A(Ct)(r.value) && (R.value !== null && R.value === i || I.value !== null && I.value === i) || Wc(e.plots, i) ? (T(), rt(Ye, {
key: 0,
shape: [
"triangle",
"square",
"diamond",
"pentagon",
"hexagon",
"star"
].includes(e.shape) ? e.shape : "circle",
color: V.value.line.useGradient ? `url(#lineGradient_${n}_${F.value})` : V.value.line.dot.useSerieColor ? e.color : V.value.line.dot.fill,
plot: {
x: A(p)(r.x),
y: A(p)(r.y)
},
radius: hu(e, r, i) ? Ma.value || 0 : (Wc(e.plots, i), ja.value.line || 0),
stroke: V.value.line.dot.useSerieColor ? V.value.chart.backgroundColor : e.color,
strokeWidth: V.value.line.dot.strokeWidth,
transition: A(Ha) || us.value || !V.value.line.showTransition ? void 0 : `all ${V.value.line.transitionDurationMs}ms ease-in-out`,
still: us.value
}, null, 8, [
"shape",
"color",
"plot",
"radius",
"stroke",
"strokeWidth",
"transition",
"still"
])) : b("", !0), r.comment && V.value.chart.comments.show ? (T(), x("foreignObject", {
key: 1,
style: { overflow: "visible" },
height: "12",
width: V.value.chart.comments.width,
x: r.x - V.value.chart.comments.width / 2 + V.value.chart.comments.offsetX,
y: r.y + V.value.chart.comments.offsetY + 6
}, [S("div", Kn, [O(t.$slots, "plot-comment", { plot: {
...r,
color: e.color,
seriesIndex: n,
datapointIndex: i
} }, void 0, !0)])], 8, Gn)) : b("", !0)], 64))), 128))
], 6))), 128)),
(V.value.bar.labels.show || V.value.bar.serieName.show) && H.value.dataLabels.show ? (T(), x("g", qn, [(T(!0), x(v, null, D(vu.value, (e) => (T(), x("text", {
key: e.key,
class: C({ "vue-data-ui-transition": A(Ia) }),
"text-anchor": lu({
plot: e.plot,
type: "bar"
}),
"font-size": B.value.plotLabels,
transform: su({ plot: e.plot }),
fill: V.value.bar.labels.color,
stroke: V.value.chart.backgroundColor,
"paint-order": "stroke",
style: w(`opacity:${N.value ? N.value === e.serie.groupId ? 1 : .2 : 1};`),
innerHTML: ou({
serie: e.serie,
plot: e.plot,
type: "bar"
})
}, null, 14, Jn))), 128)), (T(!0), x(v, null, D(gl.value, (e, t) => (T(), x(v, { key: `xLabel_bar_${e.id}` }, [(T(!0), x(v, null, D(e.plots, (n, r) => (T(), x(v, { key: `xLabel_bar_${t}_${r}` }, [n && V.value.bar.serieName.show ? (T(), x("text", {
key: 0,
class: C({ "vue-data-ui-transition": A(Ia) }),
transform: `translate(${H.value.useIndividualScale && H.value.isStacked ? n.x + Ns.value.line / 2 : n.x + Ps() * 1.1}, ${n.y + (n.value > 0 ? V.value.bar.serieName.offsetY : -V.value.bar.serieName.offsetY * 3)})`,
"text-anchor": "middle",
"font-size": B.value.plotLabels,
fill: V.value.bar.serieName.useSerieColor ? e.color : V.value.bar.serieName.color,
"font-weight": V.value.bar.serieName.bold ? "bold" : "normal",
style: w(`opacity:${N.value ? N.value === e.groupId ? 1 : .2 : 1};transition:opacity 0.2s ease-in-out`)
}, k(V.value.bar.serieName.useAbbreviation ? A(ye)({
source: e.name,
length: V.value.bar.serieName.abbreviationSize
}) : e.name), 15, Yn)) : b("", !0)], 64))), 128))], 64))), 128))])) : b("", !0),
V.value.plot.labels.show && H.value.dataLabels.show ? (T(), x("g", Xn, [(T(!0), x(v, null, D(yu.value, (e) => (T(), x("text", {
key: e.key,
class: C({ "vue-data-ui-transition": A(Ia) }),
transform: cu({
plot: e.plot,
type: "plot"
}),
"text-anchor": lu({
plot: e.plot,
type: "plot"
}),
"font-size": B.value.plotLabels,
fill: V.value.plot.labels.color,
stroke: V.value.chart.backgroundColor,
"paint-order": "stroke",
style: w(`opacity:${N.value ? N.value === e.serie.groupId ? 1 : .2 : 1}`),
innerHTML: ou({
serie: e.serie,
plot: e.plot,
type: "plot"
})
}, null, 14, Zn))), 128))])) : (T(), x("g", Qn, [(T(!0), x(v, null, D($.value, (e, t) => (T(), x(v, { key: `xLabel_plot_${e.id}` }, [(T(!0), x(v, null, D(e.plots, (n, r) => (T(), x(v, { key: `xLabel_plot_${t}_${r}` }, [V.value.plot.tag.followValue ? (T(), x(v, { key: 1 }, [[
I.value,
R.value,
qi.value
].includes(r) && e.useTag ? (T(), x("line", {
key: 0,
class: "vue-ui-xy-tag-plot",
x1: J.value?.left,
x2: J.value?.right,
y1: n.y,
y2: n.y,
"stroke-width": 1,
"stroke-linecap": "round",
"stroke-dasharray": "2",
stroke: e.color
}, null, 8, rr)) : b("", !0)], 64)) : (T(), x(v, { key: 0 }, [n && r === 0 && e.useTag && e.useTag === "start" ? (T(), x("foreignObject", {
key: 0,
x: n.x,
y: n.y - 20,
height: 24,
width: "150",
style: w(`overflow: visible; opacity:${N.value ? N.value === e.groupId ? 1 : .2 : 1};transition:opacity 0.2s ease-in-out`)
}, [S("div", {
style: w(`padding: 3px; background:${A(i)(e.color, 80)};color:${A(Ce)(e.color)};width:fit-content;font-size:${B.value.plotLabels}px;border-radius: 2px;`),
innerHTML: A(g)(V.value.plot.tag.formatter, n.value, e.name, {
datapoint: n,
seriesIndex: r,
serieName: e.name
})
}, null, 12, er)], 12, $n)) : b("", !0), n && r === e.plots.length - 1 && e.useTag && e.useTag === "end" ? (T(), x("foreignObject", {
key: 1,
x: n.x - e.name.length * (B.value.plotLabels / 2),
y: n.y - 20,
height: 24,
width: "150",
style: w(`overflow: visible; opacity:${N.value ? N.value === e.groupId ? 1 : .2 : 1};transition:opacity 0.2s ease-in-out`)
}, [S("div", {
style: w(`padding: 3px; background:${A(i)(e.color, 80)};color:${A(Ce)(e.color)};width:fit-content;font-size:${B.value.plotLabels}px;border-radius: 2px;`),
innerHTML: A(g)(V.value.plot.tag.formatter, n.value, e.name, {
datapoint: n,
seriesIndex: r,
serieName: e.name
})
}, null, 12, nr)], 12, tr)) : b("", !0)], 64))], 64))), 128))], 64))), 128))])),
V.value.line.labels.show && H.value.dataLabels.show ? (T(), x("g", ir, [(T(!0), x(v, null, D(bu.value, (e) => (T(), x("text", {
key: e.key,
class: C({ "vue-data-ui-transition": A(Ia) }),
transform: cu({
plot: e.plot,
type: "line"
}),
"text-anchor": lu({
plot: e.plot,
type: "line"
}),
"font-size": B.value.plotLabels,
fill: V.value.line.labels.color,
stroke: V.value.chart.backgroundColor,
"paint-order": "stroke",
style: w(`opacity:${N.value ? N.value === e.serie.groupId ? 1 : .2 : 1};`),
innerHTML: ou({
serie: e.serie,
plot: e.plot,
type: "line"
})
}, null, 14, ar))), 128))])) : (T(), x("g", or, [(T(!0), x(v, null, D(Q.value, (e, t) => (T(), x(v, { key: `xLabel_line_${e.id}` }, [(T(!0), x(v, null, D(e.plots, (n, r) => (T(), x(v, { key: `xLabel_line_${t}_${r}` }, [V.value.line.tag.followValue ? (T(), x(v, { key: 1 }, [[
I.value,
R.value,
qi.value
].includes(r) && e.useTag ? (T(), x("line", {
key: 0,
class: "vue-ui-xy-tag-line",
x1: J.value?.left,
x2: J.value?.right,
y1: n.y,
y2: n.y,
"stroke-width": 1,
"stroke-linecap": "round",
"stroke-dasharray": "2",
stroke: e.color
}, null, 8, dr)) : b("", !0)], 64)) : (T(), x(v, { key: 0 }, [n && r === 0 && e.useTag && e.useTag === "start" ? (T(), x("foreignObject", {
key: 0,
x: n.x,
y: n.y - 20,
height: 24,
width: "150",
style: w(`overflow: visible; opacity:${N.value ? N.value === e.groupId ? 1 : .2 : 1};transition:opacity 0.2s ease-in-out`)
}, [S("div", {
style: w(`padding: 3px; background:${A(i)(e.color, 80)};color:${A(Ce)(e.color)};width:fit-content;font-size:${B.value.plotLabels}px;border-radius: 2px;`),
innerHTML: A(g)(V.value.line.tag.formatter, n.value, e.name, {
datapoint: n,
seriesIndex: r,
serieName: e.name
})
}, null, 12, cr)], 12, sr)) : b("", !0), n && r === e.plots.length - 1 && e.useTag && e.useTag === "end" ? (T(), x("foreignObject", {
key: 1,
x: n.x,
y: n.y - 20,
height: 24,
width: "150",
style: w(`overflow: visible; opacity:${N.value ? N.value === e.groupId ? 1 : .2 : 1};transition:opacity 0.2s ease-in-out`)
}, [S("div", {
style: w(`padding: 3px; background:${A(i)(e.color, 80)};color:${A(Ce)(e.color)};width:fit-content;font-size:${B.value.plotLabels}px;border-radius: 2px;`),
innerHTML: A(g)(V.value.line.tag.formatter, n.value, e.name, {
datapoint: n,
seriesIndex: r,
serieName: e.name
})
}, null, 12, ur)], 12, lr)) : b("", !0)], 64))], 64))), 128))], 64))), 128))])),
(T(!0), x(v, null, D(Q.value, (e, t) => (T(), x(v, { key: `xLabel_line_${e.id}` }, [(T(!0), x(v, null, D(e.plots, (n, r) => (T(), x(v, { key: `xLabel_line_${t}_${r}` }, [n && r === 0 && e.showSerieName && e.showSerieName === "start" ? (T(), x("text", {
key: 0,
x: n.x - B.value.plotLabels,
y: n.y,
"font-size": B.value.plotLabels,
"text-anchor": "end",
fill: e.color,
innerHTML: A(fe)({
content: e.name,
fontSize: B.value.plotLabels,
fill: e.color,
x: n.x - B.value.plotLabels,
y: n.y,
maxWords: 2
}),
style: w(`opacity:${N.value ? N.value === e.groupId ? 1 : .2 : 1};transition:opacity 0.2s ease-in-out`)
}, null, 12, fr)) : b("", !0), n && r === e.plots.length - 1 && e.showSerieName && e.showSerieName === "end" ? (T(), x("text", {
key: 1,
x: n.x + B.value.plotLabels,
y: n.y,
"font-size": B.value.plotLabels,
"text-anchor": "start",
fill: e.color,
innerHTML: A(fe)({
content: e.name,
fontSize: B.value.plotLabels,
fill: e.color,
x: n.x + B.value.plotLabels,
y: n.y,
maxWords: 2
}),
style: w(`opacity:${N.value ? N.value === e.groupId ? 1 : .2 : 1};transition:opacity 0.2s ease-in-out`)
}, null, 12, pr)) : b("", !0)], 64))), 128))], 64))), 128)),
(T(!0), x(v, null, D($.value, (e, t) => (T(), x(v, { key: `xLabel_plot_${e.id}` }, [(T(!0), x(v, null, D(e.plots, (n, r) => (T(), x(v, { key: `xLabel_plot_${t}_${r}` }, [n && r === 0 && e.showSerieName && e.showSerieName === "start" ? (T(), x("text", {
key: 0,
x: n.x - B.value.plotLabels,
y: n.y,
"font-size": B.value.plotLabels,
"text-anchor": "end",
fill: e.color,
innerHTML: A(fe)({
content: e.name,
fontSize: B.value.plotLabels,
fill: e.color,
x: n.x - B.value.plotLabels,
y: n.y,
maxWords: 2
}),
style: w(`opacity:${N.value ? N.value === e.groupId ? 1 : .2 : 1};transition:opacity 0.2s ease-in-out`)
}, null, 12, mr)) : b("", !0), n && r === e.plots.length - 1 && e.showSerieName && e.showSerieName === "end" ? (T(), x("text", {
key: 1,
x: n.x + B.value.plotLabels,
y: n.y,
"font-size": B.value.plotLabels,
"text-anchor": "start",
fill: e.color,
innerHTML: A(fe)({
content: e.name,
fontSize: B.value.plotLabels,
fill: e.color,
x: n.x + B.value.plotLabels,
y: n.y,
maxWords: 2
}),
style: w(`opacity:${N.value ? N.value === e.groupId ? 1 : .2 : 1};transition:opacity 0.2s ease-in-out`)
}, null, 12, hr)) : b("", !0)], 64))), 128))], 64))), 128)),
(T(!0), x(v, null, D([
...$.value,
...Q.value,
...gl.value
], (e, t) => (T(), x(v, { key: `progression-${t}` }, [Object.hasOwn(e, "useProgression") && e.useProgression === !0 && !isNaN(A(h)(e.plots).trend) ? (T(), x("g", gr, [
S("defs", null, [S("marker", {
id: `progression_arrow_${t}`,
markerWidth: "9",
markerHeight: "9",
viewBox: "-1 -1 9 9",
markerUnits: "userSpaceOnUse",
refX: "7",
refY: 7 / 2,
orient: "auto",
overflow: "visible"
}, [S("polygon", {
points: "0,0 7,3.5 0,7",
fill: e.color,
stroke: V.value.chart.backgroundColor,
"stroke-width": "1",
"stroke-linejoin": "round"
}, null, 8, vr)], 8, _r)]),
e.plots.length > 1 ? (T(), x("line", {
key: 0,
x1: A(h)(e.plots).x1 + (e.type === "bar" ? Ps() : 0),
x2: A(h)(e.plots).x2 + (e.type === "bar" ? Ps() : 0),
y1: A(_)(A(h)(e.plots).y1),
y2: A(_)(A(h)(e.plots).y2),
"stroke-width": 1,
stroke: V.value.chart.backgroundColor,
"stroke-dasharray": 2,
"stroke-linecap": "round",
"stroke-linejoin": "round",
"marker-end": `url(#progression_arrow_${t})`
}, null, 8, yr)) : b("", !0),
e.plots.length > 1 ? (T(), x("line", {
key: 1,
x1: A(h)(e.plots).x1 + (e.type === "bar" ? Ps() : 0),
x2: A(h)(e.plots).x2 + (e.type === "bar" ? Ps() : 0),
y1: A(_)(A(h)(e.plots).y1),
y2: A(_)(A(h)(e.plots).y2),
"stroke-width": 1,
stroke: e.color,
"stroke-dasharray": 2,
"stroke-linecap": "round",
"stroke-linejoin": "round",
"marker-end": `url(#progression_arrow_${t})`
}, null, 8, br)) : b("", !0),
e.plots.length > 1 ? (T(), x("text", {
key: 2,
class: C({ "vue-data-ui-transition": A(Ia) }),
"text-anchor": "middle",
transform: `translate(${A(h)(e.plots).x2 + (e.type === "bar" ? Ps() : 0)}, ${A(h)(e.plots).y2 - 12})`,
"font-size": B.value.plotLabels,
fill: e.color,
stroke: V.value.chart.backgroundColor,
"stroke-width": 4,
"stroke-linecap": "round",
"stroke-linejoin": "round",
"paint-order": "stroke fill"
}, k(A(pe)({
v: A(h)(e.plots).trend * 100,
s: "%",
r: 2
})), 11, xr)) : b("", !0)
])) : b("", !0)], 64))), 128)),
H.value.useIndividualScale && !H.value.isStacked ? (T(), x(v, { key: 16 }, [S("defs", null, [(T(!0), x(v, null, D(vl.value, (e, t) => (T(), rt(Ze, {
t: "linear",
key: `individual_scale_gradient_${e.groupId || e.id || t}`,
id: `individual_scale_gradient_${F.value}_${t}`,
x1: q.value ? "100%" : "0%",
x2: q.value ? "0%" : "100%",
y1: "0%",
y2: "0%",
stops: [[
"0%",
V.value.chart.backgroundColor,
0
], [
"100%",
e.color,
.2
]]
}, null, 8, [
"id",
"x1",
"x2",
"stops"
]))), 128))]), (T(!0), x(v, null, D(vl.value, (e, t) => (T(), x("rect", {
key: `individual_scale_background_${e.groupId || e.id || t}`,
x: q.value ? e.x : e.x - V.value.chart.grid.labels.yAxis.labelWidth - J.value.individualOffsetX,
y: J.value?.top,
width: (q.value, V.value.chart.grid.labels.yAxis.labelWidth + J.value.individualOffsetX),
height: J.value.height < 0 ? 10 : J.value.height,
fill: N.value === e.groupId ? `url(#individual_scale_gradient_${F.value}_${t})` : "transparent",
onMouseenter: (t) => N.value = e.groupId,
onMouseleave: n[0] ||= (e) => N.value = null
}, null, 40, Sr))), 128))], 64)) : b("", !0),
S("g", null, [V.value.chart.grid.labels.axis.yLabel && !H.value.useIndividualScale ? (T(), x("text", {
key: 0,
ref_key: "yAxisLabel",
ref: Mi,
"font-size": B.value.yAxis,
fill: V.value.chart.grid.labels.color,
transform: `translate(${q.value ? J.value.right + J.value.scaleLabelsOffset + V.value.chart.grid.labels.axis.yLabelOffsetX + B.value.yAxis : V.value.chart.grid.labels.axis.fontSize + V.value.chart.grid.labels.axis.yLabelOffsetX}, ${J.value?.top + J.value.height / 2}) rotate(-90)`,
"text-anchor": "middle",
style: { transition: "none" }
}, k(V.value.chart.grid.labels.axis.yLabel), 9, Cr)) : b("", !0), V.value.chart.grid.labels.axis.xLabel ? (T(), x("text", {
key: 1,
ref_key: "xAxisLabel",
ref: ji,
"text-anchor": "middle",
x: P.value / 2,
y: Bi.value - 3,
"font-size": B.value.yAxis,
fill: V.value.chart.grid.labels.color
}, k(V.value.chart.grid.labels.axis.xLabel), 9, wr)) : b("", !0)]),
V.value.chart.grid.labels.xAxisLabels.show ? (T(), x("g", {
key: 17,
ref_key: "timeLabelsEls",
ref: Ni,
opacity: du.value ? .1 : 1,
style: { transition: "opacity 0.2s" }
}, [t.$slots["time-label"] ? (T(!0), x(v, { key: 0 }, D($c.value, (e, n) => O(t.$slots, "time-label", ut({ ref_for: !0 }, {
x: el(e, n),
y: J.value?.bottom,
fontSize: B.value.xAxis,
fill: V.value.chart.grid.labels.xAxisLabels.color,
transform: `translate(${el(e, n)}, ${J.value?.bottom + B.value.xAxis * 1.3 + V.value.chart.grid.labels.xAxisLabels.yOffset}), rotate(${V.value.chart.grid.labels.xAxisLabels.rotation})`,
absoluteIndex: e.absoluteIndex,
content: e.text,
textAnchor: V.value.chart.grid.labels.xAxisLabels.rotation > 0 ? "start" : V.value.chart.grid.labels.xAxisLabels.rotation < 0 ? "end" : "middle",
show: e && e.text
}), void 0, !0, `time_label_${e.id}`)), 128)) : (T(!0), x(v, { key: 1 }, D($c.value, (e, t) => (T(), x("g", { key: `time_label_${t}` }, [e && e.text ? (T(), x(v, { key: 0 }, [String(e.text).includes("\n") ? (T(), x("text", {
key: 1,
class: "vue-data-ui-time-label",
"text-anchor": V.value.chart.grid.labels.xAxisLabels.rotation > 0 ? "start" : V.value.chart.grid.labels.xAxisLabels.rotation < 0 ? "end" : "middle",
"font-size": B.value.xAxis,
fill: V.value.chart.grid.labels.xAxisLabels.color,
transform: `translate(${el(e, t)}, ${J.value?.bottom + B.value.xAxis * 1.5}), rotate(${V.value.chart.grid.labels.xAxisLabels.rotation})`,
style: w({ cursor: Io() && La.value ? "pointer" : "default" }),
innerHTML: A(c)({
content: String(e.text),
fontSize: B.value.xAxis,
fill: V.value.chart.grid.labels.xAxisLabels.color,
x: 0,
y: 0
}),
onClick: (n) => Zo(e, t)
}, null, 12, Dr)) : (T(), x("text", {
key: 0,
class: "vue-data-ui-time-label",
"text-anchor": V.value.chart.grid.labels.xAxisLabels.rotation > 0 ? "start" : V.value.chart.grid.labels.xAxisLabels.rotation < 0 ? "end" : "middle",
"font-size": B.value.xAxis,
fill: V.value.chart.grid.labels.xAxisLabels.color,
transform: `translate(${el(e, t)}, ${J.value?.bottom + B.value.xAxis * 1.5}), rotate(${V.value.chart.grid.labels.xAxisLabels.rotation})`,
style: w({ cursor: Io() && La.value ? "pointer" : "default" }),
onClick: (n) => Zo(e, t)
}, k(e.text || ""), 13, Er))], 64)) : b("", !0)]))), 128))], 8, Tr)) : b("", !0),
pu.value ? (T(), x("g", Or, [S("text", {
class: "vue-data-ui-time-label",
"text-anchor": V.value.chart.grid.labels.xAxisLabels.rotation > 0 ? "start" : V.value.chart.grid.labels.xAxisLabels.rotation < 0 ? "end" : "middle",
"font-size": B.value.xAxis,
fill: V.value.chart.grid.labels.xAxisLabels.color,
transform: `translate(${pu.value.x}, ${J.value?.bottom + B.value.xAxis * 1.5}), rotate(${V.value.chart.grid.labels.xAxisLabels.rotation})`,
"font-weight": "bold",
style: {
transition: "none !important",
animation: "none !important",
"pointer-events": "none"
},
innerHTML: A(c)({
content: String(pu.value.text),
fontSize: B.value.xAxis,
fill: V.value.chart.grid.labels.xAxisLabels.color,
x: 0,
y: 0
})
}, null, 8, kr)])) : b("", !0),
Uc.value.length && !H.value.isStacked ? (T(), x("g", Ar, [(T(!0), x(v, null, D(Uc.value, (e) => (T(), x("g", { key: e.id }, [
e.yTop && e.show && isFinite(e.yTop) ? (T(), x("line", {
key: 0,
x1: e.x1,
y1: e.yTop,
x2: e.x2,
y2: e.yTop,
stroke: e.config.line.stroke,
"stroke-width": e.config.line.strokeWidth,
"stroke-dasharray": e.config.line.strokeDasharray,
"stroke-linecap": "round",
style: { animation: "none !important" }
}, null, 8, jr)) : b("", !0),
e.yBottom && e.show && isFinite(e.yBottom) ? (T(), x("line", {
key: 1,
x1: e.x1,
y1: e.yBottom,
x2: e.x2,
y2: e.yBottom,
stroke: e.config.line.stroke,
"stroke-width": e.config.line.strokeWidth,
"stroke-dasharray": e.config.line.strokeDasharray,
"stroke-linecap": "round",
style: { animation: "none !important" }
}, null, 8, Mr)) : b("", !0),
e.hasArea && e.show && isFinite(e.yTop) && isFinite(e.yBottom) ? (T(), x("rect", {
key: 2,
y: Math.min(e.yTop, e.yBottom),
x: e.x1,
width: J.value.width,
height: A(p)(e.areaHeight, 0),
fill: A(i)(e.config.area.fill, e.config.area.opacity),
style: { animation: "none !important" }
}, null, 8, Nr)) : b("", !0),
e.config.label.text && e.show && isFinite(e._box.y) ? (T(), x("rect", ut({
key: 3,
class: "vue-ui-xy-annotation-label-box"
}, { ref_for: !0 }, e._box, { style: {
animation: "none !important",
transition: "none !important"
} }), null, 16)) : b("", !0),
e.config.label.text && e.show && isFinite(e._text.y) ? (T(), x("text", {
key: 4,
id: e.id,
class: C(["vue-ui-xy-annotation-label", { "vue-data-ui-transition": A(Ia) }]),
transform: `translate(${e._text.x}, ${e._text.y})`,
"font-size": e.config.label.fontSize,
fill: e.config.label.color,
"text-anchor": e.config.label.textAnchor
}, k(e.config.label.text), 11, Pr)) : b("", !0)
]))), 128))])) : b("", !0),
!du.value && V.value.chart.timeTag.show && (G.value ? A(a)($l.value) : ![null, void 0].includes(R.value) || ![null, void 0].includes(I.value)) ? (T(), x("g", Fr, [(T(), x("foreignObject", {
x: tu(),
y: J.value?.bottom,
width: "200",
height: "40",
style: { overflow: "visible !important" }
}, [S("div", {
ref_key: "timeTagEl",
ref: Xl,
class: "vue-ui-xy-time-tag",
style: w(`width: fit-content;margin: 0 auto;text-align:center;padding:3px 12px;background:${V.value.chart.timeTag.backgroundColor};color:${V.value.chart.timeTag.color};font-size:${V.value.chart.timeTag.fontSize}px`),
innerHTML: au.value
}, null, 12, Lr)], 8, Ir)), S("circle", {
cx: G.value && A(a)($l.value) ? tl({ x: $l.value }) : hc((R.value === null ? 0 : R.value) || (I.value === null ? 0 : I.value)),
cy: J.value?.bottom,
r: V.value.chart.timeTag.circleMarker.radius,
fill: V.value.chart.timeTag.circleMarker.color
}, null, 8, Rr)])) : b("", !0)
])) : b("", !0),
Qa.value ? (T(), x("rect", ut({ key: 2 }, to.value, {
"data-start": U.value.start,
"data-end": U.value.end
}), null, 16, zr)) : b("", !0),
O(t.$slots, "svg", { svg: {
...Da.value,
slicer: U.value,
isPrintingImg: A(no) || A(ro) || ca.value,
isPrintingSvg: la.value,
data: [
...Q.value,
...gl.value,
...$.value
],
drawingArea: J.value
} }, void 0, !0)
], 512)], 46, Lt)), t.$slots.hint ? (T(), x("div", Br, [O(t.$slots, "hint", ft(lt({
hint: V.value.a11y.translations.keyboardNavigation,
isVisible: Iu.value
})), void 0, !0)])) : b("", !0)]),
t.$slots.watermark ? (T(), x("div", Vr, [O(t.$slots, "watermark", ft(lt({ isPrinting: A(no) || A(ro) || ca.value || la.value })), void 0, !0)])) : b("", !0),
(T(!0), x(v, null, D(Q.value, (e, t) => (T(), x(v, { key: `tag_line_${e.id}` }, [(T(!0), x(v, null, D(e.plots, (n, r) => (T(), x(v, { key: `tag_line_${t}_${r}` }, [[
I.value,
R.value,
qi.value
].includes(r) && e.useTag && e.useTag === "end" && V.value.line.tag.followValue ? (T(), x("div", {
key: 0,
ref_for: !0,
ref: (e) => zo(t, r, e, "right", "line"),
class: "vue-ui-xy-tag",
"data-tag": "right",
style: w({
position: "fixed",
top: A(d)({
svgElement: L.value,
x: J.value?.right + V.value.line.tag.fontSize / 1.5,
y: n.y,
element: ia.value[`${t}_${r}_right_line`],
position: "right"
})?.top + "px",
left: A(d)({
svgElement: L.value,
x: J.value?.right + V.value.line.tag.fontSize / 1.5,
y: n.y,
element: ia.value[`${t}_${r}_right_line`],
position: "right"
})?.left + "px",
height: "fit-content",
width: "fit-content",
background: e.color,
color: A(Ce)(e.color),
padding: "0 6px",
fontSize: V.value.line.tag.fontSize + "px",
opacity: 1
})
}, [(T(), x("svg", Hr, [S("path", {
d: "M 0,10 10,0 10,20 Z",
fill: e.color,
stroke: "none"
}, null, 8, Ur)])), S("div", {
class: "vue-ui-xy-tag-content",
innerHTML: A(g)(V.value.line.tag.formatter, n.value, e.name, {
datapoint: n,
seriesIndex: r,
serieName: e.name
})
}, null, 8, Wr)], 4)) : b("", !0), [
I.value,
R.value,
qi.value
].includes(r) && e.useTag && e.useTag === "start" && V.value.line.tag.followValue ? (T(), x("div", {
key: 1,
ref_for: !0,
ref: (e) => zo(t, r, e, "left", "line"),
class: "vue-ui-xy-tag",
"data-tag": "left",
style: w({
position: "fixed",
top: A(d)({
svgElement: L.value,
x: J.value?.left - V.value.line.tag.fontSize / 1.5,
y: n.y,
element: ia.value[`${t}_${r}_left_line`],
position: "left"
})?.top + "px",
left: A(d)({
svgElement: L.value,
x: J.value?.left - V.value.line.tag.fontSize / 1.5,
y: n.y,
element: ia.value[`${t}_${r}_left_line`],
position: "left"
})?.left + "px",
height: "fit-content",
width: "fit-content",
background: e.color,
color: A(Ce)(e.color),
padding: "0 6px",
fontSize: V.value.line.tag.fontSize + "px",
opacity: 1
})
}, [(T(), x("svg", Gr, [S("path", {
d: "M 0,0 10,10 0,20 Z",
fill: e.color,
stroke: "none"
}, null, 8, Kr)])), S("div", {
class: "vue-ui-xy-tag-content",
innerHTML: A(g)(V.value.line.tag.formatter, n.value, e.name, {
datapoint: n,
seriesIndex: r,
serieName: e.name
})
}, null, 8, qr)], 4)) : b("", !0)], 64))), 128))], 64))), 128)),
(T(!0), x(v, null, D($.value, (e, t) => (T(), x(v, { key: `tag_plot_${e.id}` }, [(T(!0), x(v, null, D(e.plots, (n, r) => (T(), x(v, { key: `tag_plot_${t}_${r}` }, [[
I.value,
R.value,
qi.value
].includes(r) && e.useTag && e.useTag === "end" && V.value.plot.tag.followValue ? (T(), x("div", {
key: 0,
ref_for: !0,
ref: (e) => zo(t, r, e, "right", "plot"),
class: "vue-ui-xy-tag",
"data-tag": "right",
style: w({
position: "fixed",
top: A(d)({
svgElement: L.value,
x: J.value?.right + V.value.plot.tag.fontSize / 1.5,
y: n.y,
element: ia.value[`${t}_${r}_right_plot`],
position: "right"
})?.top + "px",
left: A(d)({
svgElement: L.value,
x: J.value?.right + V.value.plot.tag.fontSize / 1.5,
y: n.y,
element: ia.value[`${t}_${r}_right_plot`],
position: "right"
})?.left + "px",
height: "fit-content",
width: "fit-content",
background: e.color,
color: A(Ce)(e.color),
padding: "0 6px",
fontSize: V.value.plot.tag.fontSize + "px",
opacity: 1
})
}, [(T(), x("svg", Jr, [S("path", {
d: "M 0,10 10,0 10,20 Z",
fill: e.color,
stroke: "none"
}, null, 8, Yr)])), S("div", {
class: "vue-ui-xy-tag-content",
innerHTML: A(g)(V.value.plot.tag.formatter, n.value, e.name, {
datapoint: n,
seriesIndex: r,
serieName: e.name
})
}, null, 8, Xr)], 4)) : b("", !0), [
I.value,
R.value,
qi.value
].includes(r) && e.useTag && e.useTag === "start" && V.value.plot.tag.followValue ? (T(), x("div", {
key: 1,
ref_for: !0,
ref: (e) => zo(t, r, e, "left", "plot"),
class: "vue-ui-xy-tag",
"data-tag": "left",
style: w({
position: "fixed",
top: A(d)({
svgElement: L.value,
x: J.value?.left - V.value.plot.tag.fontSize / 1.5,
y: n.y,
element: ia.value[`${t}_${r}_left_plot`],
position: "left"
})?.top + "px",
left: A(d)({
svgElement: L.value,
x: J.value?.left - V.value.plot.tag.fontSize / 1.5,
y: n.y,
element: ia.value[`${t}_${r}_left_plot`],
position: "left"
})?.left + "px",
height: "fit-content",
width: "fit-content",
background: e.color,
color: A(Ce)(e.color),
padding: "0 6px",
fontSize: V.value.plot.tag.fontSize + "px",
opacity: 1
})
}, [(T(), x("svg", Zr, [S("path", {
d: "M 0,0 10,10 0,20 Z",
fill: e.color,
stroke: "none"
}, null, 8, Qr)])), S("div", {
class: "vue-ui-xy-tag-content",
innerHTML: A(g)(V.value.plot.tag.formatter, n.value, e.name, {
datapoint: n,
seriesIndex: r,
serieName: e.name
})
}, null, 8, $r)], 4)) : b("", !0)], 64))), 128))], 64))), 128)),
V.value.chart.zoom.show && Xa.value > 6 && Fa.value && as.value ? (T(), rt(Qe, {
key: 6,
ref_key: "chartSlicer",
ref: Ei,
uuid: F.value,
allMinimaps: Bc.value,
background: V.value.chart.zoom.color,
borderColor: V.value.chart.backgroundColor,
customFormat: V.value.chart.zoom.customFormat,
cutNullValues: V.value.line.cutNullValues,
enableRangeHandles: V.value.chart.zoom.enableRangeHandles,
enableSelectionDrag: V.value.chart.zoom.enableSelectionDrag,
end: U.value.end,
focusOnDrag: V.value.chart.zoom.focusOnDrag,
focusRangeRatio: V.value.chart.zoom.focusRangeRatio,
fontSize: V.value.chart.zoom.fontSize,
useResetSlot: V.value.chart.zoom.useResetSlot,
immediate: !V.value.chart.zoom.preview.enable,
inputColor: V.value.chart.zoom.color,
isPreview: Qa.value,
labelLeft: Y.value[0] ? Y.value[0].text : "",
labelRight: Y.value.at(-1) ? Y.value.at(-1).text : "",
max: il.value,
min: rl.value,
precision: G.value ? V.value.chart.grid.labels.xAxis.rounding : 0,
useValueRange: G.value,
minimap: zc.value,
minimapCompact: V.value.chart.zoom.minimap.compact,
minimapFrameColor: V.value.chart.zoom.minimap.frameColor,
minimapIndicatorColor: V.value.chart.zoom.minimap.indicatorColor,
minimapLineColor: V.value.chart.zoom.minimap.lineColor,
minimapMerged: V.value.chart.zoom.minimap.merged,
minimapSelectedColor: V.value.chart.zoom.minimap.selectedColor,
minimapSelectedColorOpacity: V.value.chart.zoom.minimap.selectedColorOpacity,
minimapSelectedIndex: G.value ? ua.value : R.value ?? I.value,
minimapSelectionRadius: V.value.chart.zoom.minimap.selectionRadius,
preciseLabels: wl.value.length ? wl.value : Go.value,
refreshStartPoint: G.value ? rl.value : V.value.chart.zoom.startIndex === null ? 0 : V.value.chart.zoom.startIndex,
refreshEndPoint: G.value ? il.value : V.value.chart.zoom.endIndex === null ? Math.max(...e.dataset.map((e) => Ka(e.series).length)) : V.value.chart.zoom.endIndex + 1,
selectColor: V.value.chart.zoom.highlightColor,
selectedSeries: Vc.value,
smoothMinimap: V.value.chart.zoom.minimap.smooth,
start: U.value.start,
textColor: V.value.chart.color,
timeLabels: Go.value,
usePreciseLabels: V.value.chart.grid.labels.xAxisLabels.datetimeFormatter.enable && !V.value.chart.zoom.useDefaultFormat,
valueEnd: U.value.end,
valueStart: U.value.start,
verticalHandles: V.value.chart.zoom.minimap.verticalHandles,
minScale: V.value.chart.grid.labels.yAxis.scaleMin,
maxScale: V.value.chart.grid.labels.yAxis.scaleMax,
maxWidth: V.value.chart.zoom.maxWidth,
minimapLeftInsetRatio: P.value > 0 && V.value.chart.zoom.autoFit ? J.value.left / P.value : null,
minimapRightInsetRatio: P.value > 0 && V.value.chart.zoom.autoFit ? (P.value - J.value.right) / P.value : null,
additionalMinimapHeight: V.value.chart.zoom.minimap.additionalHeight,
handleType: V.value.chart.zoom.minimap.handleType,
handleIconColor: V.value.chart.zoom.minimap.handleIconColor,
handleBorderWidth: V.value.chart.zoom.minimap.handleBorderWidth,
handleBorderColor: V.value.chart.zoom.minimap.handleBorderColor,
handleFill: V.value.chart.zoom.minimap.handleFill,
handleWidth: V.value.chart.zoom.minimap.handleWidth,
isCursorPointer: La.value,
onFutureEnd: n[1] ||= (e) => $a("end", e),
onFutureStart: n[2] ||= (e) => $a("start", e),
onReset: ys,
onTrapMouse: Qo,
onTrapMouseValue: $o,
"onUpdate:end": vs,
"onUpdate:start": _s
}, {
"reset-action": j(({ reset: e }) => [O(t.$slots, "reset-action", ft(lt({ reset: e })), void 0, !0)]),
_: 3
}, 8, /* @__PURE__ */ "uuid.allMinimaps.background.borderColor.customFormat.cutNullValues.enableRangeHandles.enableSelectionDrag.end.focusOnDrag.focusRangeRatio.fontSize.useResetSlot.immediate.inputColor.isPreview.labelLeft.labelRight.max.min.precision.useValueRange.minimap.minimapCompact.minimapFrameColor.minimapIndicatorColor.minimapLineColor.minimapMerged.minimapSelectedColor.minimapSelectedColorOpacity.minimapSelectedIndex.minimapSelectionRadius.preciseLabels.refreshStartPoint.refreshEndPoint.selectColor.selectedSeries.smoothMinimap.start.textColor.timeLabels.usePreciseLabels.valueEnd.valueStart.verticalHandles.minScale.maxScale.maxWidth.minimapLeftInsetRatio.minimapRightInsetRatio.additionalMinimapHeight.handleType.handleIconColor.handleBorderWidth.handleBorderColor.handleFill.handleWidth.isCursorPointer".split("."))) : b("", !0),
S("div", { id: `legend-bottom-${F.value}` }, null, 8, ei),
oa.value && (V.value.chart.legend.show || t.$slots.legend) ? (T(), rt(nt, {
key: 7,
to: V.value.chart.legend.position === "top" ? `#legend-top-${F.value}` : `#legend-bottom-${F.value}`
}, [S("div", {
ref_key: "chartLegend",
ref: Di
}, [O(t.$slots, "legend", { legend: Co.value }, () => [V.value.chart.legend.show ? (T(), x("div", {
key: 0,
class: "vue-ui-xy-legend",
style: w({ fontSize: `var(--legend-font-size, ${V.value.chart.legend.fontSize ?? 14}px)` })
}, [V.value.chart.legend.selectAllToggle.show && Co.value.length > 2 && !A(Ha) ? (T(), rt(et, {
key: 0,
backgroundColor: V.value.chart.legend.selectAllToggle.backgroundColor,
color: V.value.chart.legend.selectAllToggle.color,
fontSize: V.value.chart.legend.fontSize,
checked: Ji.value.length > 0,
onToggle: $s
}, null, 8, [
"backgroundColor",
"color",
"fontSize",
"checked"
])) : b("", !0), (T(!0), x(v, null, D(Co.value, (e, n) => (T(), x("div", {
key: `div_legend_item_${n}`,
onClick: (t) => nc(e),
onKeydown: (t) => ec(t, e),
role: "button",
tabindex: "0",
class: C({
"vue-ui-xy-legend-item-alone": Co.value.length === 1,
"vue-ui-xy-legend-item": !0,
"vue-ui-xy-legend-item-segregated": Yi.value.has(e.id)
}),
style: w({ cursor: La.value ? "pointer" : "default" })
}, [Ui.value[e.type] === "line" ? (T(), x("svg", ni, [S("rect", {
x: "0",
y: "7.5",
rx: "1.5",
stroke: V.value.chart.backgroundColor,
"stroke-width": .5,
height: "3",
width: "20",
fill: e.color
}, null, 8, ri), ot(Ye, {
plot: {
x: 10,
y: 9
},
radius: 4,
color: e.color,
shape: [
"triangle",
"square",
"diamond",
"pentagon",
"hexagon",
"star"
].includes(e.shape) ? e.shape : "circle",
stroke: V.value.chart.backgroundColor,
strokeWidth: .5
}, null, 8, [
"color",
"shape",
"stroke"
])])) : Ui.value[e.type] === "bar" ? (T(), x("svg", ii, [Ui.value[e.type] === "bar" && t.$slots.pattern ? (T(), x("rect", {
key: 0,
x: "4",
y: "4",
rx: "1",
height: "32",
width: "32",
stroke: "none",
fill: e.color
}, null, 8, ai)) : b("", !0), Ui.value[e.type] === "bar" ? (T(), x("rect", {
key: 1,
x: "4",
y: "4",
rx: "1",
height: "32",
width: "32",
stroke: "none",
fill: t.$slots.pattern ? `url(#pattern_${F.value}_${e.slotAbsoluteIndex})` : e.color
}, null, 8, oi)) : b("", !0)])) : (T(), x("svg", si, [ot(Ye, {
plot: {
x: 6,
y: 6
},
radius: 5,
color: e.color,
shape: [
"triangle",
"square",
"diamond",
"pentagon",
"hexagon",
"star"
].includes(e.shape) ? e.shape : "circle"
}, null, 8, ["color", "shape"])])), S("span", { style: w(`color:${V.value.chart.legend.color}`) }, k(e.name), 5)], 46, ti))), 128))], 4)) : b("", !0)], !0)], 512)], 8, ["to"])) : b("", !0),
t.$slots.source ? (T(), x("div", {
key: 8,
ref_key: "source",
ref: Oi,
dir: "auto"
}, [O(t.$slots, "source", {}, void 0, !0)], 512)) : b("", !0),
ot(A(di), {
teleportTo: V.value.chart.tooltip.teleportTo,
show: H.value.showTooltip && Ki.value,
backgroundColor: V.value.chart.tooltip.backgroundColor,
color: V.value.chart.tooltip.color,
fontSize: V.value.chart.tooltip.fontSize,
borderRadius: V.value.chart.tooltip.borderRadius,
borderColor: V.value.chart.tooltip.borderColor,
borderWidth: V.value.chart.tooltip.borderWidth,
backgroundOpacity: V.value.chart.tooltip.backgroundOpacity,
position: V.value.chart.tooltip.position,
offsetX: V.value.chart.tooltip.offsetX,
offsetY: V.value.chart.tooltip.offsetY,
parent: t.$refs.chart,
content: kl.value,
isFullscreen: Gi.value,
isCustom: V.value.chart.tooltip.customFormat && typeof V.value.chart.tooltip.customFormat == "function",
smooth: V.value.chart.tooltip.smooth,
backdropFilter: V.value.chart.tooltip.backdropFilter,
smoothForce: V.value.chart.tooltip.smoothForce,
smoothSnapThreshold: V.value.chart.tooltip.smoothSnapThreshold,
isA11yMode: da.value != null,
a11yPosition: fa.value
}, {
"tooltip-before": j(() => [O(t.$slots, "tooltip-before", ft(lt({ ...bl.value })), void 0, !0)]),
tooltip: j(() => [O(t.$slots, "tooltip", ft(lt({ ...bl.value })), void 0, !0)]),
"tooltip-after": j(() => [O(t.$slots, "tooltip-after", ft(lt({ ...bl.value })), void 0, !0)]),
_: 3
}, 8, [
"teleportTo",
"show",
"backgroundColor",
"color",
"fontSize",
"borderRadius",
"borderColor",
"borderWidth",
"backgroundOpacity",
"position",
"offsetX",
"offsetY",
"parent",
"content",
"isFullscreen",
"isCustom",
"smooth",
"backdropFilter",
"smoothForce",
"smoothSnapThreshold",
"isA11yMode",
"a11yPosition"
]),
Fa.value && V.value.chart.userOptions.buttons.table ? (T(), rt(ht(Tu.value.component), ut({ key: 9 }, Tu.value.props, {
ref_key: "tableUnit",
ref: sa,
onClose: Eu
}), it({
content: j(() => [S("div", { style: w(`${A(no) || V.value.table.useDialog ? "" : "max-height:400px"};${V.value.table.useDialog ? "height: fit-content; " : ""};overflow:auto;width:100%;${V.value.table.useDialog ? "" : "margin-top:48px"}`) }, [S("div", ci, [St(S("input", {
type: "checkbox",
"onUpdate:modelValue": n[4] ||= (e) => $i.value = e
}, null, 512), [[yt, $i.value]]), S("div", {
onClick: n[5] ||= (e) => $i.value = !$i.value,
style: w({ cursor: La.value ? "pointer" : "default" })
}, [ot(A(pi), {
name: "chartLine",
size: 20,
stroke: V.value.chart.color
}, null, 8, ["stroke"])], 4)]), $i.value ? (T(), rt(A(mi), {
key: `sparkline_${ea.value}`,
dataset: dc.value,
config: fc.value
}, null, 8, ["dataset", "config"])) : (T(), rt(A(ui), {
key: `table_${Zi.value}`,
colNames: zl.value.colNames,
head: zl.value.head,
body: zl.value.body,
config: zl.value.config,
title: V.value.table.useDialog ? "" : Tu.value.title,
withCloseButton: !V.value.table.useDialog,
onClose: Eu
}, {
th: j(({ th: e }) => [S("div", { innerHTML: e }, null, 8, li)]),
td: j(({ td: e }) => [at(k(isNaN(Number(e)) ? e : A(pe)({
p: V.value.chart.labels.prefix,
v: e,
s: V.value.chart.labels.suffix,
r: V.value.table.rounding
})), 1)]),
_: 1
}, 8, [
"colNames",
"head",
"body",
"config",
"title",
"withCloseButton"
]))], 4)]),
_: 2
}, [V.value.table.useDialog ? {
name: "title",
fn: j(() => [at(k(Tu.value.title), 1)]),
key: "0"
} : void 0, V.value.table.useDialog ? {
name: "actions",
fn: j(() => [S("button", {
tabindex: "0",
class: "vue-ui-user-options-button",
onClick: n[3] ||= (e) => Bl(V.value.chart.userOptions.callbacks.csv)
}, [ot(A(pi), {
name: "fileCsv",
stroke: Tu.value.props.color
}, null, 8, ["stroke"])])]),
key: "1"
} : void 0]), 1040)) : b("", !0),
O(t.$slots, "skeleton", {}, () => [A(Ha) ? (T(), rt(ze, { key: 0 })) : b("", !0)], !0)
], 46, Nt));
}
}, [["__scopeId", "data-v-9479c4b1"]]);
//#endregion
export { Mt as n, M as t };