vue-data-ui 2.2.92 → 2.2.93

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (58) hide show
  1. package/dist/index-DZlxUin4.js +57288 -0
  2. package/dist/{index.es-Dc9Fd4o6.js → index.es-Cgqo-FBk.js} +1 -1
  3. package/dist/style.css +1 -1
  4. package/dist/vue-data-ui.js +61 -455
  5. package/package.json +1 -1
  6. package/dist/data-table-d-VcuH-r.js +0 -1488
  7. package/dist/legend-DJCYLsl_.js +0 -61
  8. package/dist/themes-lgjsYHsH.js +0 -4967
  9. package/dist/title-BF-9Qcni.js +0 -56
  10. package/dist/tooltip-D85WEOKi.js +0 -94
  11. package/dist/user-options-DZgCz8UA.js +0 -415
  12. package/dist/vue-ui-3d-bar-DW7kGJSz.js +0 -20360
  13. package/dist/vue-ui-age-pyramid-4hcuKpFY.js +0 -781
  14. package/dist/vue-ui-annotator-C83FVvl8.js +0 -2175
  15. package/dist/vue-ui-candlestick-diclGj95.js +0 -807
  16. package/dist/vue-ui-chestnut-ACetHLdG.js +0 -1049
  17. package/dist/vue-ui-cursor-Rx7UNaYT.js +0 -229
  18. package/dist/vue-ui-dashboard-B3PlN0ks.js +0 -231
  19. package/dist/vue-ui-digits-CxMXID42.js +0 -154
  20. package/dist/vue-ui-donut-DMiwVXNd.js +0 -1534
  21. package/dist/vue-ui-dumbbell-B_X1T8TR.js +0 -621
  22. package/dist/vue-ui-flow-B72wzQ6V.js +0 -451
  23. package/dist/vue-ui-galaxy-DXX5yivT.js +0 -482
  24. package/dist/vue-ui-gauge-Cs9PDurH.js +0 -466
  25. package/dist/vue-ui-heatmap-PcoNSLdN.js +0 -581
  26. package/dist/vue-ui-kpi-DchEmPtB.js +0 -55
  27. package/dist/vue-ui-mini-loader-DltJLkqy.js +0 -131
  28. package/dist/vue-ui-molecule-CWvukBzs.js +0 -746
  29. package/dist/vue-ui-mood-radar-DEfdtIi8.js +0 -544
  30. package/dist/vue-ui-nested-donuts-9URpqgXE.js +0 -768
  31. package/dist/vue-ui-onion-C0eowUT6.js +0 -551
  32. package/dist/vue-ui-parallel-coordinate-plot-Bc_pAaPJ.js +0 -647
  33. package/dist/vue-ui-quadrant-_ddVAm9V.js +0 -1174
  34. package/dist/vue-ui-quick-chart-Cio0hDYO.js +0 -1310
  35. package/dist/vue-ui-radar-Dyg38i33.js +0 -853
  36. package/dist/vue-ui-rating-CE1Lmwd2.js +0 -271
  37. package/dist/vue-ui-relation-circle-BMlB3k3d.js +0 -303
  38. package/dist/vue-ui-rings-BuXeijvb.js +0 -507
  39. package/dist/vue-ui-scatter-B1hZfOua.js +0 -870
  40. package/dist/vue-ui-screenshot-0QXgxzGs.js +0 -160
  41. package/dist/vue-ui-smiley-B7kR7exr.js +0 -763
  42. package/dist/vue-ui-spark-trend-BmL2KiYL.js +0 -245
  43. package/dist/vue-ui-sparkgauge-BMzFv14L.js +0 -158
  44. package/dist/vue-ui-sparkhistogram-DWpOXqHm.js +0 -243
  45. package/dist/vue-ui-sparkstackbar-DB9VQXlc.js +0 -244
  46. package/dist/vue-ui-strip-plot-DyN6P0JO.js +0 -614
  47. package/dist/vue-ui-table-DM3zL89q.js +0 -2180
  48. package/dist/vue-ui-table-heatmap-gWx0Nslu.js +0 -237
  49. package/dist/vue-ui-thermometer-Bcqv5kd_.js +0 -384
  50. package/dist/vue-ui-timer-BIFxjujK.js +0 -451
  51. package/dist/vue-ui-tiremarks-zBwHpED_.js +0 -248
  52. package/dist/vue-ui-treemap-BaplVc_z.js +0 -719
  53. package/dist/vue-ui-vertical-bar-CdK6ZJPM.js +0 -734
  54. package/dist/vue-ui-waffle-COOzH7M3.js +0 -635
  55. package/dist/vue-ui-wheel-BEpuVTBk.js +0 -226
  56. package/dist/vue-ui-word-cloud-DNqxAAiX.js +0 -344
  57. package/dist/vue-ui-xy-_mHq-czW.js +0 -2058
  58. package/dist/vue-ui-xy-canvas-DqX8Gee5.js +0 -1003
@@ -1,1003 +0,0 @@
1
- import { ref as c, computed as b, watch as le, onMounted as da, onBeforeUnmount as ha, openBlock as O, createElementBlock as de, normalizeStyle as U, normalizeClass as ya, createVNode as he, createCommentVNode as te, createBlock as X, unref as Y, createSlots as fa, withCtx as m, renderSlot as C, normalizeProps as oe, guardReactiveProps as ue, createElementVNode as Z, toDisplayString as _e, createTextVNode as ga } from "vue";
2
- import { _ as pa, e as ba, f as ma, p as E, g as xa, A as ye, n as G, h as De, U as La, i as ka, j as Ca, y as He, D as wa, z as Sa, v as za, w as $a, o as j, l as Ta } from "./data-table-d-VcuH-r.js";
3
- import { d as Ma, c as Ra, a as We, t as Oa, l as k, r as fe, b as I, p as Ae, u as Ia } from "./vue-ui-age-pyramid-4hcuKpFY.js";
4
- import { t as Pa } from "./themes-lgjsYHsH.js";
5
- import { _ as Fa } from "./tooltip-D85WEOKi.js";
6
- import { L as Ea } from "./legend-DJCYLsl_.js";
7
- import { u as Be, _ as Na } from "./title-BF-9Qcni.js";
8
- import { S as _a } from "./vue-ui-candlestick-diclGj95.js";
9
- import { U as Da } from "./user-options-DZgCz8UA.js";
10
- import { u as Ha, a as Wa, S as Aa, A as Ba } from "./vue-ui-3d-bar-DW7kGJSz.js";
11
- const Ua = ["id"], Xa = ["onClick"], Ya = ["innerHTML"], Za = {
12
- __name: "vue-ui-xy-canvas",
13
- props: {
14
- dataset: {
15
- type: Array,
16
- default() {
17
- return [];
18
- }
19
- },
20
- config: {
21
- type: Object,
22
- default() {
23
- return {};
24
- }
25
- }
26
- },
27
- emits: ["selectLegend"],
28
- setup(ge, { expose: Ue, emit: Xe }) {
29
- const N = ge, { vue_ui_xy_canvas: Ye } = Ha(), re = c(ba()), V = c(null), S = c(null), D = c(null), s = c(null), y = c(1), T = c(1), q = c(!1), d = c(null), J = c(""), pe = c(null), w = c([]), _ = c(1), P = c(!0), z = c(!0), se = c(null), be = c(0), me = c(0), ne = c(!1), xe = c(null), Le = c(null), ke = c(null), ie = b(() => !!N.dataset && N.dataset.length), a = b(() => {
30
- const e = Be({
31
- userConfig: N.config,
32
- defaultConfig: Ye
33
- });
34
- return e.theme ? {
35
- ...Be({
36
- userConfig: Pa.vue_ui_xy_canvas[e.theme] || N.config,
37
- defaultConfig: e
38
- }),
39
- customPalette: ma[e.theme] || E
40
- } : e;
41
- }), Ce = c(a.value.style.chart.aspectRatio), { isPrinting: Ze, isImaging: Ge, generatePdf: we, generateImage: Se } = Wa({
42
- elementId: `xy_canvas_${re.value}`,
43
- fileName: a.value.style.chart.title.text || "vue-ui-xy-canvas"
44
- }), r = c({
45
- showTable: a.value.table.show,
46
- showDataLabels: a.value.style.chart.dataLabels.show,
47
- stacked: a.value.style.chart.stacked,
48
- showTooltip: a.value.style.chart.tooltip.show
49
- });
50
- function je(e) {
51
- ne.value = e, me.value += 1;
52
- }
53
- const ze = b(() => xa(a.value.customPalette)), F = b(() => Math.max(...H.value.filter((e, t) => !w.value.includes(e.absoluteIndex)).map((e) => e.series.length))), l = b(() => {
54
- const e = y.value - y.value * (a.value.style.chart.paddingProportions.left + a.value.style.chart.paddingProportions.right);
55
- return {
56
- canvasWidth: y.value,
57
- canvasHeight: T.value,
58
- left: y.value * a.value.style.chart.paddingProportions.left,
59
- top: T.value * a.value.style.chart.paddingProportions.top,
60
- right: y.value - y.value * a.value.style.chart.paddingProportions.right,
61
- bottom: T.value - T.value * a.value.style.chart.paddingProportions.bottom,
62
- width: e,
63
- height: T.value - T.value * (a.value.style.chart.paddingProportions.top + a.value.style.chart.paddingProportions.bottom),
64
- slot: e / (u.value.end - u.value.start)
65
- };
66
- });
67
- function $e(e, t) {
68
- return e / t;
69
- }
70
- function Ve({ hasAutoScale: e, series: t, min: o, max: i, scale: v, yOffset: f, individualHeight: n, stackIndex: g = null }) {
71
- return t.map((L, ce) => {
72
- const $ = v.min < 0 ? Math.abs(v.min) : 0, M = $e(L + $, $ + v.max);
73
- let R, W;
74
- e && (R = Math.abs(v.min), W = $e(L + R, v.max + R));
75
- let A = 0;
76
- return g === null ? A = l.value.bottom - l.value.height * (e ? W : M) : A = l.value.bottom - f - n * (e ? W : M), {
77
- x: l.value.left + l.value.slot * ce + l.value.slot / 2,
78
- y: A,
79
- value: L
80
- };
81
- });
82
- }
83
- const p = b(() => {
84
- const e = Math.min(...H.value.filter((n, g) => !w.value.includes(n.absoluteIndex)).flatMap((n) => n.series.slice(u.value.start, u.value.end))), t = Math.max(...H.value.filter((n, g) => !w.value.includes(n.absoluteIndex)).flatMap((n) => n.series.slice(u.value.start, u.value.end))), o = ye(e < 0 ? e : 0, t === e ? e + 1 < 0 ? 0 : e + 1 : t < 0 ? 0 : t, a.value.style.chart.scale.ticks), i = o.min < 0 ? Math.abs(o.min) : 0, v = l.value.bottom - l.value.height * (i / (o.max + i)), f = o.ticks.map((n) => ({
85
- y: l.value.bottom - l.value.height * ((n + i) / (o.max + i)),
86
- x: l.value.left - 8,
87
- value: n
88
- }));
89
- return {
90
- absoluteMin: i,
91
- max: t,
92
- min: e,
93
- scale: o,
94
- yLabels: f,
95
- zero: v
96
- };
97
- }), qe = b(() => h.value.map((e) => `
98
- <div style="display:flex;flex-direction:row;gap:6px;align-items:center;">
99
- <svg viewBox="0 0 10 10" height="12" width="12">
100
- <circle cx="5" cy="5" r="5" fill="${e.color}"/>
101
- </svg>
102
- <span>${e.name ? e.name + ": " : ""}</span>
103
- <span>${G({
104
- p: e.prefix || "",
105
- v: e.series[d.value],
106
- s: e.suffix || "",
107
- r: e.rounding || 0
108
- })}</span>
109
- </div>
110
- `)), H = b(() => N.dataset.map((e, t) => ({
111
- ...e,
112
- absoluteIndex: t,
113
- color: De(e.color || ze.value[t] || E[t] || E[t % E.length])
114
- }))), h = b(() => La(H.value.filter((e, t) => !w.value.includes(e.absoluteIndex))).map((e, t) => ({
115
- ...e,
116
- series: e.series.slice(u.value.start, u.value.end)
117
- })).map((e, t) => {
118
- let o = Math.min(...e.series) || 0, i = Math.max(...e.series) || 1;
119
- o === i && (o = o >= 0 ? i - 1 : o, i = i >= 0 ? i : o + 1);
120
- const f = {
121
- ratios: e.series.filter((B) => ![null, void 0].includes(B)).map((B) => (B - o) / (i - o)),
122
- valueMin: o,
123
- valueMax: i
124
- }, n = e.scaleSteps || a.value.style.chart.scale.ticks;
125
- let g;
126
- e.autoScaling ? g = ye(f.valueMin, f.valueMax, n) : g = ye(f.valueMin < 0 ? f.valueMin : 0, f.valueMax <= 0 ? 0 : f.valueMax, n);
127
- const L = r.value.stacked ? l.value.height * (1 - e.cumulatedStackRatio) : 0, ce = r.value.stacked ? l.value.height / a.value.style.chart.stackGap : 0, $ = r.value.stacked ? l.value.height * e.stackRatio - ce : l.value.height, M = g.min < 0 ? Math.abs(g.min) : 0;
128
- let R;
129
- e.autoScaling && r.value.stacked && i <= 0 ? R = l.value.bottom - L - $ : R = l.value.bottom - L - $ * (M / (g.max + M));
130
- const W = g.ticks.map((B, ca) => ({
131
- y: l.value.bottom - L - $ * (ca / (g.ticks.length - 1)),
132
- x: l.value.left - 8,
133
- value: B
134
- })), A = Ve({
135
- hasAutoScale: r.value.stacked && e.autoScaling,
136
- series: e.series,
137
- min: r.value.stacked ? o : p.value.min,
138
- max: r.value.stacked ? i : p.value.max,
139
- scale: r.value.stacked ? g : p.value.scale,
140
- yOffset: L,
141
- individualHeight: $,
142
- stackIndex: r.value.stacked ? t : null
143
- });
144
- return {
145
- ...e,
146
- coordinatesLine: A,
147
- min: o,
148
- max: i,
149
- localScale: g,
150
- localZero: R,
151
- localMin: M,
152
- localYLabels: W,
153
- yOffset: L,
154
- individualHeight: $
155
- };
156
- })), u = c({
157
- start: 0,
158
- end: F.value
159
- });
160
- function Je() {
161
- u.value = {
162
- start: 0,
163
- end: F.value
164
- }, be.value += 1;
165
- }
166
- const Ke = b(() => h.value.filter((e) => ["line", "plot", void 0].includes(e.type))), x = b(() => h.value.filter((e) => e.type === "bar"));
167
- function Qe() {
168
- if (!S.value)
169
- return;
170
- const e = D.value.offsetWidth, t = D.value.offsetHeight;
171
- S.value.width = e * _.value * 2, S.value.height = t * _.value * 2, y.value = e * _.value * 2, T.value = t * _.value * 2, s.value.scale(_.value, _.value), ve();
172
- }
173
- function ea() {
174
- if (s.value.fillStyle = a.value.style.chart.backgroundColor, s.value.fillRect(0, 0, l.value.canvasWidth, l.value.canvasHeight), r.value.stacked)
175
- a.value.style.chart.grid.y.verticalLines.show && u.value.end - u.value.start < a.value.style.chart.grid.y.verticalLines.hideUnderXLength && h.value.forEach((e) => {
176
- for (let t = 0; t < u.value.end - u.value.start + 1; t += 1)
177
- k(
178
- s.value,
179
- [
180
- {
181
- x: l.value.left + l.value.slot * t,
182
- y: l.value.bottom - e.yOffset - e.individualHeight
183
- },
184
- {
185
- x: l.value.left + l.value.slot * t,
186
- y: l.value.bottom - e.yOffset
187
- }
188
- ],
189
- {
190
- color: a.value.style.chart.grid.y.verticalLines.color
191
- }
192
- );
193
- }), a.value.style.chart.grid.x.horizontalLines.show && (a.value.style.chart.grid.x.horizontalLines.alternate ? h.value.forEach((e) => {
194
- e.localYLabels.forEach((t, o) => {
195
- o < e.localYLabels.length - 1 && fe(
196
- s.value,
197
- [
198
- { x: l.value.left, y: t.y },
199
- { x: l.value.right, y: t.y },
200
- { x: l.value.right, y: e.localYLabels[o + 1].y },
201
- { x: l.value.left, y: e.localYLabels[o + 1].y }
202
- ],
203
- {
204
- fillColor: o % 2 === 0 ? "transparent" : a.value.style.chart.grid.x.horizontalLines.color + j[a.value.style.chart.grid.x.horizontalLines.opacity],
205
- strokeColor: "transparent"
206
- }
207
- );
208
- });
209
- }) : h.value.forEach((e) => {
210
- e.localYLabels.slice(u.value.start, u.value.end).forEach((t) => {
211
- k(
212
- s.value,
213
- [
214
- { x: l.value.left, y: t.y },
215
- { x: l.value.right, y: t.y }
216
- ],
217
- {
218
- color: a.value.style.chart.grid.x.horizontalLines.color
219
- }
220
- );
221
- });
222
- })), a.value.style.chart.grid.zeroLine.show && h.value.forEach((e) => {
223
- k(
224
- s.value,
225
- [
226
- { x: l.value.left, y: e.localZero },
227
- { x: l.value.right, y: e.localZero }
228
- ],
229
- {
230
- color: a.value.style.chart.grid.zeroLine.color,
231
- lineDash: a.value.style.chart.grid.zeroLine.dashed ? [10, 10] : [0, 0]
232
- }
233
- );
234
- }), a.value.style.chart.grid.y.axisLabels.show && h.value.forEach((e) => {
235
- k(
236
- s.value,
237
- [
238
- { x: l.value.left, y: l.value.bottom - e.yOffset },
239
- { x: l.value.left, y: l.value.bottom - e.yOffset - e.individualHeight }
240
- ],
241
- {
242
- color: e.color
243
- }
244
- ), k(
245
- s.value,
246
- [
247
- { x: l.value.right, y: l.value.bottom - e.yOffset },
248
- { x: l.value.right, y: l.value.bottom - e.yOffset - e.individualHeight }
249
- ],
250
- {
251
- color: e.color
252
- }
253
- ), e.localYLabels.forEach((t) => {
254
- I(
255
- s.value,
256
- G({
257
- p: e.prefix || a.value.style.chart.grid.y.axisLabels.prefix || "",
258
- v: t.value,
259
- s: e.suffix || a.value.style.chart.grid.y.axisLabels.suffix || "",
260
- r: e.rounding || a.value.style.chart.grid.y.axisLabels.rounding || 0
261
- }),
262
- t.x + a.value.style.chart.grid.y.axisLabels.offsetX,
263
- t.y,
264
- {
265
- align: "right",
266
- font: `${y.value / 40 * a.value.style.chart.grid.y.axisLabels.fontSizeRatio}px ${a.value.style.fontFamily}`,
267
- color: e.color
268
- }
269
- );
270
- });
271
- }), h.value.forEach((e) => {
272
- I(
273
- s.value,
274
- e.name,
275
- y.value / 35,
276
- l.value.bottom - e.yOffset - e.individualHeight / 2,
277
- {
278
- align: "center",
279
- rotation: -90,
280
- color: e.color,
281
- font: `${y.value / 40 * a.value.style.chart.grid.y.axisLabels.fontSizeRatio}px ${a.value.style.fontFamily}`
282
- }
283
- );
284
- });
285
- else {
286
- if (a.value.style.chart.grid.y.verticalLines.show && u.value.end - u.value.start < a.value.style.chart.grid.y.verticalLines.hideUnderXLength)
287
- for (let e = 0; e < u.value.end - u.value.start + 1; e += 1)
288
- k(
289
- s.value,
290
- [
291
- { x: l.value.left + l.value.slot * e, y: l.value.top },
292
- { x: l.value.left + l.value.slot * e, y: l.value.bottom }
293
- ],
294
- {
295
- color: a.value.style.chart.grid.y.verticalLines.color
296
- }
297
- );
298
- a.value.style.chart.grid.x.horizontalLines.show && (a.value.style.chart.grid.x.horizontalLines.alternate ? p.value.yLabels.forEach((e, t) => {
299
- t < p.value.yLabels.length - 1 && fe(
300
- s.value,
301
- [
302
- { x: l.value.left, y: e.y },
303
- { x: l.value.right, y: e.y },
304
- { x: l.value.right, y: p.value.yLabels[t + 1].y },
305
- { x: l.value.left, y: p.value.yLabels[t + 1].y }
306
- ],
307
- {
308
- fillColor: t % 2 === 0 ? "transparent" : a.value.style.chart.grid.x.horizontalLines.color + j[a.value.style.chart.grid.x.horizontalLines.opacity],
309
- strokeColor: "transparent"
310
- }
311
- );
312
- }) : p.value.yLabels.forEach((e) => {
313
- k(
314
- s.value,
315
- [
316
- { x: l.value.left, y: e.y },
317
- { x: l.value.right, y: e.y }
318
- ],
319
- {
320
- color: a.value.style.chart.grid.x.horizontalLines.color
321
- }
322
- );
323
- })), a.value.style.chart.grid.y.showAxis && k(
324
- s.value,
325
- [
326
- { x: l.value.left, y: l.value.top },
327
- { x: l.value.left, y: l.value.bottom }
328
- ],
329
- {
330
- color: a.value.style.chart.grid.y.axisColor,
331
- lineWidth: a.value.style.chart.grid.y.axisThickness
332
- }
333
- ), a.value.style.chart.grid.x.showAxis && k(
334
- s.value,
335
- [
336
- { x: l.value.left, y: l.value.bottom },
337
- { x: l.value.right, y: l.value.bottom }
338
- ],
339
- {
340
- color: a.value.style.chart.grid.x.axisColor,
341
- lineWidth: a.value.style.chart.grid.x.axisThickness
342
- }
343
- ), a.value.style.chart.grid.zeroLine.show && k(
344
- s.value,
345
- [
346
- { x: l.value.left, y: p.value.zero },
347
- { x: l.value.right, y: p.value.zero }
348
- ],
349
- {
350
- color: a.value.style.chart.grid.zeroLine.color,
351
- lineDash: a.value.style.chart.grid.zeroLine.dashed ? [10, 10] : [0, 0]
352
- }
353
- ), a.value.style.chart.grid.y.axisLabels.show && p.value.yLabels.forEach((e) => {
354
- I(
355
- s.value,
356
- G({
357
- p: a.value.style.chart.grid.y.axisLabels.prefix || "",
358
- v: e.value,
359
- s: a.value.style.chart.grid.y.axisLabels.suffix || "",
360
- r: a.value.style.chart.grid.y.axisLabels.rounding || 0
361
- }),
362
- e.x + a.value.style.chart.grid.y.axisLabels.offsetX,
363
- e.y,
364
- {
365
- align: "right",
366
- font: `${y.value / 40 * a.value.style.chart.grid.y.axisLabels.fontSizeRatio}px ${a.value.style.fontFamily}`,
367
- color: a.value.style.chart.grid.y.axisLabels.color
368
- }
369
- );
370
- });
371
- }
372
- a.value.style.chart.grid.y.axisName && I(
373
- s.value,
374
- a.value.style.chart.grid.y.axisName,
375
- y.value - y.value / 40 * a.value.style.chart.grid.y.axisLabels.fontSizeRatio * 1.2,
376
- l.value.bottom - l.value.height / 2,
377
- {
378
- font: `${y.value / 40 * a.value.style.chart.grid.y.axisLabels.fontSizeRatio}px ${a.value.style.fontFamily}`,
379
- color: a.value.style.chart.color,
380
- align: "center",
381
- rotation: 90
382
- }
383
- ), a.value.style.chart.grid.x.axisName && I(
384
- s.value,
385
- a.value.style.chart.grid.x.axisName,
386
- y.value / 2,
387
- T.value,
388
- {
389
- font: `${y.value / 40 * a.value.style.chart.grid.y.axisLabels.fontSizeRatio}px ${a.value.style.fontFamily}`,
390
- color: a.value.style.chart.color,
391
- align: "center"
392
- }
393
- );
394
- }
395
- function aa(e) {
396
- for (let t = 0; t < e.coordinatesLine.length; t += 1) {
397
- const o = (d.value === t ? y.value / 150 : a.value.style.chart.line.plots.show ? y.value / 200 : 0) * a.value.style.chart.line.plots.radiusRatio;
398
- We(
399
- s.value,
400
- { x: e.coordinatesLine[t].x, y: e.coordinatesLine[t].y },
401
- o,
402
- {
403
- color: a.value.style.chart.backgroundColor,
404
- fillStyle: e.color,
405
- strokeColor: "transparent"
406
- }
407
- );
408
- }
409
- }
410
- function la(e) {
411
- for (let t = 0; t < e.coordinatesLine.length; t += 1)
412
- I(
413
- s.value,
414
- G({
415
- p: e.prefix || "",
416
- v: e.coordinatesLine[t].value,
417
- s: e.suffix || "",
418
- r: e.rounding || 0
419
- }),
420
- e.coordinatesLine[t].x,
421
- e.coordinatesLine[t].y + a.value.style.chart.dataLabels.offsetY,
422
- {
423
- align: "center",
424
- font: `${y.value / 40 * a.value.style.chart.dataLabels.fontSizeRatio}px ${a.value.style.fontFamily}`,
425
- color: a.value.style.chart.dataLabels.useSerieColor ? e.color : a.value.style.chart.dataLabels.color,
426
- strokeColor: a.value.style.chart.backgroundColor,
427
- lineWidth: 0.8
428
- }
429
- );
430
- }
431
- function ta() {
432
- for (let e = u.value.start; e < u.value.end; e += 1)
433
- (u.value.end - u.value.start < a.value.style.chart.grid.y.timeLabels.modulo || u.value.end - u.value.start >= a.value.style.chart.grid.y.timeLabels.modulo && (e % Math.floor((u.value.end - u.value.start) / a.value.style.chart.grid.y.timeLabels.modulo) === 0 || e === d.value + u.value.start)) && I(
434
- s.value,
435
- a.value.style.chart.grid.y.timeLabels.values[e] || e + 1,
436
- l.value.left + l.value.slot * (e - u.value.start) + l.value.slot / 2,
437
- l.value.bottom + y.value / a.value.style.chart.grid.y.timeLabels.offsetY,
438
- {
439
- align: a.value.style.chart.grid.y.timeLabels.rotation === 0 ? "center" : a.value.style.chart.grid.y.timeLabels.rotation > 0 ? "left" : "right",
440
- font: `${y.value / 40 * a.value.style.chart.grid.y.timeLabels.fontSizeRatio}px ${a.value.style.fontFamily}`,
441
- color: a.value.style.chart.grid.y.timeLabels.color + j[d.value !== null ? d.value + u.value.start === e ? 100 : 20 : 100],
442
- rotation: a.value.style.chart.grid.y.timeLabels.rotation
443
- }
444
- );
445
- }
446
- function Te() {
447
- k(
448
- s.value,
449
- [
450
- { x: l.value.left + l.value.slot * d.value + l.value.slot / 2, y: l.value.top },
451
- { x: l.value.left + l.value.slot * d.value + l.value.slot / 2, y: l.value.bottom }
452
- ],
453
- {
454
- color: a.value.style.chart.selector.color,
455
- lineDash: a.value.style.chart.selector.dashed ? [8, 8] : [0, 0],
456
- lineWidth: 2,
457
- linceCap: "round"
458
- }
459
- );
460
- }
461
- function oa() {
462
- x.value.forEach((e, t) => {
463
- for (let o = 0; o < e.coordinatesLine.length; o += 1)
464
- fe(
465
- s.value,
466
- [
467
- {
468
- x: l.value.left + l.value.slot * o + l.value.slot / 10 + (r.value.stacked ? 0 : l.value.slot / x.value.length * t - (t === 0 ? 0 : l.value.slot / (5 * x.value.length) * t)),
469
- y: r.value.stacked ? e.localZero : p.value.zero
470
- },
471
- {
472
- x: l.value.left + l.value.slot * o + l.value.slot / 10 + (r.value.stacked ? 0 : l.value.slot / x.value.length * t - (t === 0 ? 0 : l.value.slot / (5 * x.value.length) * t)) + l.value.slot * 0.8 / (r.value.stacked ? 1 : x.value.length),
473
- y: r.value.stacked ? e.localZero : p.value.zero
474
- },
475
- {
476
- x: l.value.left + l.value.slot * o + l.value.slot / 10 + (r.value.stacked ? 0 : l.value.slot / x.value.length * t - (t === 0 ? 0 : l.value.slot / (5 * x.value.length) * t)) + l.value.slot * 0.8 / (r.value.stacked ? 1 : x.value.length),
477
- y: e.coordinatesLine[o].y
478
- },
479
- {
480
- x: l.value.left + l.value.slot * o + l.value.slot / 10 + (r.value.stacked ? 0 : l.value.slot / x.value.length * t - (t === 0 ? 0 : l.value.slot / (5 * x.value.length) * t)),
481
- y: e.coordinatesLine[o].y
482
- }
483
- ],
484
- {
485
- strokeColor: a.value.style.chart.backgroundColor,
486
- gradient: {
487
- type: "linear",
488
- start: {
489
- x: e.coordinatesLine[o].x,
490
- y: e.coordinatesLine[o].y
491
- },
492
- end: {
493
- x: e.coordinatesLine[o].x,
494
- y: r.value.stacked ? e.localZero : p.value.zero
495
- },
496
- stops: [
497
- { offset: 0, color: e.color },
498
- { offset: 1, color: Ta(e.color, 0.5) }
499
- ]
500
- }
501
- }
502
- ), r.value.showDataLabels && [!0, void 0].includes(e.dataLabels) && I(
503
- s.value,
504
- G({
505
- p: e.prefix || "",
506
- v: e.coordinatesLine[o].value,
507
- s: e.suffix || "",
508
- r: e.rounding || 0
509
- }),
510
- l.value.left + l.value.slot * o + l.value.slot / 10 + (r.value.stacked ? 0 : l.value.slot / x.value.length * t - (t === 0 ? 0 : l.value.slot / (5 * x.value.length) * t)) + l.value.slot * 0.4 / (r.value.stacked ? 1 : x.value.length),
511
- (e.coordinatesLine[o].value < 0 ? r.value.stacked ? e.localZero : p.value.zero : e.coordinatesLine[o].y) + a.value.style.chart.dataLabels.offsetY,
512
- {
513
- align: "center",
514
- font: `${y.value / 40 * a.value.style.chart.dataLabels.fontSizeRatio}px ${a.value.style.fontFamily}`,
515
- color: a.value.style.chart.dataLabels.useSerieColor ? e.color : a.value.style.chart.dataLabels.color,
516
- strokeColor: a.value.style.chart.backgroundColor,
517
- lineWidth: 0.8
518
- }
519
- );
520
- });
521
- }
522
- function ua(e) {
523
- e.useArea ? r.value.stacked ? Ae(
524
- s.value,
525
- [{ x: e.coordinatesLine[0].x, y: e.localZero }, ...e.coordinatesLine, { x: e.coordinatesLine.at(-1).x, y: e.localZero }],
526
- {
527
- fillColor: e.color + j[a.value.style.chart.area.opacity],
528
- strokeColor: "transparent"
529
- }
530
- ) : Ae(
531
- s.value,
532
- [{ x: e.coordinatesLine[0].x, y: p.value.zero }, ...e.coordinatesLine, { x: e.coordinatesLine.at(-1).x, y: p.value.zero }],
533
- {
534
- fillColor: e.color + j[a.value.style.chart.area.opacity],
535
- strokeColor: "transparent"
536
- }
537
- ) : k(s.value, e.coordinatesLine, {
538
- color: e.color,
539
- lineWidth: 3
540
- });
541
- }
542
- function ra() {
543
- h.value.forEach((e, t) => {
544
- k(
545
- s.value,
546
- [
547
- { x: l.value.left, y: l.value.bottom - e.yOffset },
548
- { x: l.value.right, y: l.value.bottom - e.yOffset }
549
- ],
550
- {
551
- color: a.value.style.chart.grid.x.horizontalLines.color,
552
- lineWidth: 1
553
- }
554
- );
555
- });
556
- }
557
- function ve() {
558
- ea(), P.value ? (z.value && d.value !== null && a.value.style.chart.selector.show && Te(), oa(), r.value.stacked && a.value.style.chart.grid.x.showAxis && ra(), Ke.value.forEach((e) => {
559
- (e.type === "line" || !e.type) && ua(e), z.value && (aa(e), r.value.showDataLabels && [!0, void 0].includes(e.dataLabels) && la(e));
560
- }), se.value = Ra(S.value)) : (se.value && s.value.drawImage(se.value, 0, 0), z.value && d.value !== null && a.value.style.chart.selector.show && Te(), z.value && d.value !== null && h.value.forEach((e) => {
561
- if (e.type === "line" || !e.type || e.type === "plot") {
562
- if (!e.coordinatesLine[d.value]) return;
563
- e.coordinatesLine[d.value].x !== void 0 && e.coordinatesLine[d.value].y !== void 0 && We(
564
- s.value,
565
- {
566
- x: e.coordinatesLine[d.value].x,
567
- y: e.coordinatesLine[d.value].y
568
- },
569
- y.value / 150 * a.value.style.chart.line.plots.radiusRatio,
570
- {
571
- color: a.value.style.chart.backgroundColor,
572
- fillStyle: e.color,
573
- strokeColor: "transparent"
574
- }
575
- );
576
- }
577
- })), a.value.style.chart.grid.y.timeLabels.show && ta(), P.value = !1;
578
- }
579
- const K = Ma(() => {
580
- z.value = !0, Qe();
581
- }, F.value > 200 ? 10 : 1, !z.value);
582
- function sa(e) {
583
- const { left: t } = S.value.getBoundingClientRect(), o = e.clientX - t;
584
- if (o * 2 < l.value.left || o * 2 > l.value.right) {
585
- q.value = !1, d.value = null;
586
- return;
587
- }
588
- const i = o * 2 - l.value.left;
589
- if (d.value = Math.floor(i / l.value.slot), q.value = !0, !z.value) return;
590
- let v = "";
591
- const f = a.value.style.chart.tooltip.customFormat;
592
- He(f) && Sa(() => f({
593
- seriesIndex: d.value,
594
- datapoint: h.value.map((n) => ({
595
- shape: n.shape || null,
596
- name: n.name,
597
- color: n.color,
598
- type: n.type || "line",
599
- value: n.series.find((g, L) => L === d.value)
600
- })),
601
- series: h.value,
602
- config: a.value
603
- })) ? J.value = f({
604
- seriesIndex: d.value,
605
- datapoint: h.value.map((n) => ({
606
- shape: n.shape || null,
607
- name: n.name,
608
- color: n.color,
609
- type: n.type || "line",
610
- value: n.series.find((g, L) => L === d.value)
611
- })),
612
- series: h.value,
613
- config: a.value
614
- }) : (a.value.style.chart.grid.y.timeLabels.values.slice(u.value.start, u.value.end)[d.value] && (v += `<div style="padding-bottom: 6px; margin-bottom: 4px; border-bottom: 1px solid ${a.value.style.chart.tooltip.borderColor}; width:100%">${a.value.style.chart.grid.y.timeLabels.values.slice(u.value.start, u.value.end)[d.value]}</div>`), v += qe.value.join(""), J.value = v), z.value = !1;
615
- }
616
- le(() => d.value, (e) => {
617
- K();
618
- }), le(() => u.value, (e) => {
619
- P.value = !0, ve();
620
- }, {
621
- deep: !0
622
- }), le(() => r.value.showDataLabels, (e) => {
623
- P.value = !0, ve();
624
- }), le(() => r.value.stacked, (e) => {
625
- P.value = !0, z.value = !0, K();
626
- });
627
- function na() {
628
- q.value = !1, d.value = null, J.value = "";
629
- }
630
- const Q = c(null), ee = c(null);
631
- da(() => {
632
- if (ka(N.dataset) ? Ca({
633
- componentName: "VueUiXyCanvas",
634
- type: "dataset"
635
- }) : S.value && (s.value = S.value.getContext("2d", { willReadFrequently: !0 })), a.value.responsive) {
636
- const e = Oa(() => {
637
- const { width: t, height: o } = Ia({
638
- chart: V.value,
639
- title: a.value.style.chart.title.text ? xe.value : null,
640
- legend: a.value.style.chart.legend.show ? Le.value : null,
641
- slicer: a.value.style.chart.zoom.show && F.value > 1 ? ke.value : null
642
- });
643
- Ce.value = `${t} / ${o}`;
644
- });
645
- Q.value = new ResizeObserver(e), Q.value.observe(V.value.parentNode);
646
- }
647
- ee.value = new ResizeObserver((e) => {
648
- for (const t of e)
649
- t.contentBoxSize && D.value && (P.value = !0, K());
650
- }), ee.value.observe(D.value);
651
- }), ha(() => {
652
- ee.value && ee.value.disconnect(), Q.value && Q.value.disconnect();
653
- });
654
- function Me(e) {
655
- Xe("selectLegend", h.value.find((t) => t.absoluteIndex === e)), w.value.includes(e) ? w.value = w.value.filter((t) => t !== e) : w.value.push(e), P.value = !0, K();
656
- }
657
- const Re = b(() => H.value.map((e, t) => ({
658
- ...e,
659
- name: e.name,
660
- color: De(e.color) || ze.value[t] || E[t] || E[t % E.length],
661
- shape: e.shape || "circle",
662
- prefix: e.prefix || "",
663
- suffix: e.suffix || "",
664
- rounding: e.rounding || 0
665
- })).map((e) => ({
666
- ...e,
667
- opacity: w.value.includes(e.absoluteIndex) ? 0.5 : 1,
668
- segregate: () => Me(e.absoluteIndex),
669
- isSegregated: w.value.includes(e.absoluteIndex)
670
- }))), ia = b(() => ({
671
- cy: "donut-div-legend",
672
- backgroundColor: a.value.style.chart.legend.backgroundColor,
673
- color: a.value.style.chart.legend.color,
674
- fontSize: a.value.style.chart.legend.fontSize,
675
- paddingBottom: 12,
676
- fontWeight: a.value.style.chart.legend.bold ? "bold" : ""
677
- })), ae = b(() => {
678
- const e = [""].concat(h.value.map((v) => v.name)).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>');
679
- let t = [];
680
- for (let v = 0; v < F.value; v += 1) {
681
- const f = h.value.map((n) => n.series[v] ?? 0).reduce((n, g) => n + g, 0);
682
- t.push([a.value.style.chart.grid.y.timeLabels.values.slice(u.value.start, u.value.end)[v] ?? v + 1].concat(h.value.map((n) => (n.series[v] ?? 0).toFixed(a.value.table.rounding))).concat((f ?? 0).toFixed(a.value.table.rounding)));
683
- }
684
- const o = {
685
- th: {
686
- backgroundColor: a.value.table.th.backgroundColor,
687
- color: a.value.table.th.color,
688
- outline: a.value.table.th.outline
689
- },
690
- td: {
691
- backgroundColor: a.value.table.td.backgroundColor,
692
- color: a.value.table.td.color,
693
- outline: a.value.table.td.outline
694
- },
695
- breakpoint: a.value.table.responsiveBreakpoint
696
- }, i = [a.value.table.columnNames.period].concat(h.value.map((v) => v.name)).concat(a.value.table.columnNames.total);
697
- return { head: e, body: t.slice(0, u.value.end - u.value.start), config: o, colNames: i };
698
- }), Oe = b(() => {
699
- if (h.value.length === 0) return { head: [], body: [], config: {}, columnNames: [] };
700
- const e = h.value.map((o) => ({
701
- label: o.name,
702
- color: o.color,
703
- type: o.type
704
- })), t = [];
705
- for (let o = u.value.start; o < u.value.end; o += 1) {
706
- const i = [a.value.style.chart.grid.y.timeLabels.values[o] || o + 1];
707
- h.value.forEach((v) => {
708
- i.push(Number((v.series[o] || 0).toFixed(a.value.table.rounding)));
709
- }), t.push(i);
710
- }
711
- return { head: e, body: t };
712
- });
713
- function Ie() {
714
- const e = [[a.value.style.chart.title.text], [a.value.style.chart.title.subtitle.text], [""]], t = ["", ...Oe.value.head.map((f) => f.label)], o = Oe.value.body, i = e.concat([t]).concat(o), v = za(i);
715
- $a({ csvContent: v, title: a.value.style.chart.title.text || "vue-ui-xy-canvas" });
716
- }
717
- function va() {
718
- return h.value;
719
- }
720
- function Pe() {
721
- r.value.showTable = !r.value.showTable;
722
- }
723
- function Fe() {
724
- r.value.showDataLabels = !r.value.showDataLabels;
725
- }
726
- function Ee() {
727
- r.value.stacked = !r.value.stacked;
728
- }
729
- function Ne() {
730
- r.value.showTooltip = !r.value.showTooltip;
731
- }
732
- return Ue({
733
- getData: va,
734
- generateCsv: Ie,
735
- generatePdf: we,
736
- generateImage: Se,
737
- toggleTable: Pe,
738
- toggleLabels: Fe,
739
- toggleStack: Ee,
740
- toggleTooltip: Ne
741
- }), (e, t) => (O(), de("div", {
742
- style: U(`width:100%; position: relative;${a.value.responsive ? "height: 100%" : ""}`),
743
- ref_key: "xy",
744
- ref: V,
745
- id: `xy_canvas_${re.value}`,
746
- class: ya(`vue-ui-donut ${ne.value ? "vue-data-ui-wrapper-fullscreen" : ""}`)
747
- }, [
748
- a.value.style.chart.title.text ? (O(), de("div", {
749
- key: 0,
750
- ref_key: "chartTitle",
751
- ref: xe,
752
- style: U(`width:100%;background:${a.value.style.chart.backgroundColor};`)
753
- }, [
754
- he(Na, {
755
- config: {
756
- title: {
757
- cy: "xy-canvas-title",
758
- ...a.value.style.chart.title
759
- },
760
- subtitle: {
761
- cy: "xy-canvas-subtitle",
762
- ...a.value.style.chart.title.subtitle
763
- }
764
- }
765
- }, null, 8, ["config"])
766
- ], 4)) : te("", !0),
767
- a.value.userOptions.show && ie.value ? (O(), X(Da, {
768
- ref: "details",
769
- key: `user_option_${me.value}`,
770
- backgroundColor: a.value.style.chart.backgroundColor,
771
- color: a.value.style.chart.color,
772
- isPrinting: Y(Ze),
773
- isImaging: Y(Ge),
774
- uid: re.value,
775
- hasTooltip: a.value.userOptions.buttons.tooltip && a.value.style.chart.tooltip.show,
776
- hasPdf: a.value.userOptions.buttons.pdf,
777
- hasImg: a.value.userOptions.buttons.img,
778
- hasXls: a.value.userOptions.buttons.csv,
779
- hasLabel: a.value.userOptions.buttons.labels,
780
- hasStack: ge.dataset.length > 1 && a.value.userOptions.buttons.stack,
781
- hasFullscreen: a.value.userOptions.buttons.fullscreen,
782
- hasTable: u.value.end - u.value.start < 200 && a.value.userOptions.buttons.table,
783
- isFullscreen: ne.value,
784
- isTooltip: r.value.showTooltip,
785
- isStacked: r.value.stacked,
786
- titles: { ...a.value.userOptions.buttonTitles },
787
- chartElement: V.value,
788
- onToggleFullscreen: je,
789
- onGeneratePdf: Y(we),
790
- onGenerateCsv: Ie,
791
- onGenerateImage: Y(Se),
792
- onToggleTable: Pe,
793
- onToggleLabels: Fe,
794
- onToggleStack: Ee,
795
- onToggleTooltip: Ne
796
- }, fa({ _: 2 }, [
797
- e.$slots.optionTooltip ? {
798
- name: "optionTooltip",
799
- fn: m(() => [
800
- C(e.$slots, "optionTooltip", {}, void 0, !0)
801
- ]),
802
- key: "0"
803
- } : void 0,
804
- e.$slots.optionPdf ? {
805
- name: "optionPdf",
806
- fn: m(() => [
807
- C(e.$slots, "optionPdf", {}, void 0, !0)
808
- ]),
809
- key: "1"
810
- } : void 0,
811
- e.$slots.optionCsv ? {
812
- name: "optionCsv",
813
- fn: m(() => [
814
- C(e.$slots, "optionCsv", {}, void 0, !0)
815
- ]),
816
- key: "2"
817
- } : void 0,
818
- e.$slots.optionImg ? {
819
- name: "optionImg",
820
- fn: m(() => [
821
- C(e.$slots, "optionImg", {}, void 0, !0)
822
- ]),
823
- key: "3"
824
- } : void 0,
825
- e.$slots.optionTable ? {
826
- name: "optionTable",
827
- fn: m(() => [
828
- C(e.$slots, "optionTable", {}, void 0, !0)
829
- ]),
830
- key: "4"
831
- } : void 0,
832
- e.$slots.optionLabels ? {
833
- name: "optionLabels",
834
- fn: m(() => [
835
- C(e.$slots, "optionLabels", {}, void 0, !0)
836
- ]),
837
- key: "5"
838
- } : void 0,
839
- e.$slots.optionStack ? {
840
- name: "optionStack",
841
- fn: m(() => [
842
- C(e.$slots, "optionStack", {}, void 0, !0)
843
- ]),
844
- key: "6"
845
- } : void 0,
846
- e.$slots.optionFullscreen ? {
847
- name: "optionFullscreen",
848
- fn: m(({ toggleFullscreen: o, isFullscreen: i }) => [
849
- C(e.$slots, "optionFullscreen", oe(ue({ toggleFullscreen: o, isFullscreen: i })), void 0, !0)
850
- ]),
851
- key: "7"
852
- } : void 0
853
- ]), 1032, ["backgroundColor", "color", "isPrinting", "isImaging", "uid", "hasTooltip", "hasPdf", "hasImg", "hasXls", "hasLabel", "hasStack", "hasFullscreen", "hasTable", "isFullscreen", "isTooltip", "isStacked", "titles", "chartElement", "onGeneratePdf", "onGenerateImage"])) : te("", !0),
854
- Z("div", {
855
- class: "vue-ui-xy-canvas",
856
- style: U(`position: relative; aspect-ratio: ${Ce.value}`),
857
- ref_key: "container",
858
- ref: D
859
- }, [
860
- ie.value ? (O(), de("canvas", {
861
- key: 0,
862
- ref_key: "canvas",
863
- ref: S,
864
- style: { width: "100%", height: "100%" },
865
- onMousemove: t[0] || (t[0] = (o) => sa(o)),
866
- onMouseleave: na
867
- }, null, 544)) : (O(), X(Aa, {
868
- key: 1,
869
- config: {
870
- type: "line",
871
- style: {
872
- backgroundColor: a.value.style.chart.backgroundColor,
873
- line: {
874
- axis: {
875
- color: "#CCCCCC"
876
- },
877
- path: {
878
- color: "#CCCCCC",
879
- strokeWidth: 0.5
880
- }
881
- }
882
- }
883
- }
884
- }, null, 8, ["config"])),
885
- he(Fa, {
886
- show: r.value.showTooltip && q.value,
887
- backgroundColor: a.value.style.chart.tooltip.backgroundColor,
888
- color: a.value.style.chart.tooltip.color,
889
- fontSize: a.value.style.chart.tooltip.fontSize,
890
- borderRadius: a.value.style.chart.tooltip.borderRadius,
891
- borderColor: a.value.style.chart.tooltip.borderColor,
892
- borderWidth: a.value.style.chart.tooltip.borderWidth,
893
- parent: S.value,
894
- content: J.value,
895
- backgroundOpacity: a.value.style.chart.tooltip.backgroundOpacity,
896
- isCustom: Y(He)(a.value.style.chart.tooltip.customFormat)
897
- }, {
898
- "tooltip-before": m(() => [
899
- C(e.$slots, "tooltip-before", oe(ue({ ...pe.value })), void 0, !0)
900
- ]),
901
- "tooltip-after": m(() => [
902
- C(e.$slots, "tooltip-after", oe(ue({ ...pe.value })), void 0, !0)
903
- ]),
904
- _: 3
905
- }, 8, ["show", "backgroundColor", "color", "fontSize", "borderRadius", "borderColor", "borderWidth", "parent", "content", "backgroundOpacity", "isCustom"])
906
- ], 4),
907
- Z("div", {
908
- ref_key: "chartSlicer",
909
- ref: ke,
910
- style: U(`width:100%;background:${a.value.style.chart.backgroundColor}`),
911
- "data-html2canvas-ignore": ""
912
- }, [
913
- a.value.style.chart.zoom.show && F.value > 1 ? (O(), X(_a, {
914
- key: `slicer_${be.value}`,
915
- background: a.value.style.chart.zoom.color,
916
- borderColor: a.value.style.chart.backgroundColor,
917
- fontSize: a.value.style.chart.zoom.fontSize,
918
- useResetSlot: a.value.style.chart.zoom.useResetSlot,
919
- labelLeft: a.value.style.chart.grid.y.timeLabels.values[u.value.start] ? a.value.style.chart.grid.y.timeLabels.values[u.value.start] : "",
920
- labelRight: a.value.style.chart.grid.y.timeLabels.values[u.value.end - 1] ? a.value.style.chart.grid.y.timeLabels.values[u.value.end - 1] : "",
921
- textColor: a.value.style.chart.color,
922
- inputColor: a.value.style.chart.zoom.color,
923
- selectColor: a.value.style.chart.zoom.highlightColor,
924
- max: F.value,
925
- min: 0,
926
- valueStart: u.value.start,
927
- valueEnd: u.value.end,
928
- start: u.value.start,
929
- "onUpdate:start": t[1] || (t[1] = (o) => u.value.start = o),
930
- end: u.value.end,
931
- "onUpdate:end": t[2] || (t[2] = (o) => u.value.end = o),
932
- onReset: Je
933
- }, {
934
- "reset-action": m(({ reset: o }) => [
935
- C(e.$slots, "reset-action", oe(ue({ reset: o })), void 0, !0)
936
- ]),
937
- _: 3
938
- }, 8, ["background", "borderColor", "fontSize", "useResetSlot", "labelLeft", "labelRight", "textColor", "inputColor", "selectColor", "max", "valueStart", "valueEnd", "start", "end"])) : te("", !0)
939
- ], 4),
940
- Z("div", {
941
- ref_key: "chartLegend",
942
- ref: Le
943
- }, [
944
- a.value.style.chart.legend.show && ie.value ? (O(), X(Ea, {
945
- key: 0,
946
- legendSet: Re.value,
947
- config: ia.value,
948
- onClickMarker: t[3] || (t[3] = ({ i: o }) => Me(o))
949
- }, {
950
- item: m(({ legend: o, index: i }) => [
951
- Z("div", {
952
- onClick: (v) => o.segregate(),
953
- style: U(`opacity:${w.value.includes(i) ? 0.5 : 1}`)
954
- }, _e(o.name), 13, Xa)
955
- ]),
956
- _: 1
957
- }, 8, ["legendSet", "config"])) : C(e.$slots, "legend", {
958
- key: 1,
959
- legend: Re.value
960
- }, void 0, !0)
961
- ], 512),
962
- u.value.end - u.value.start < 200 ? (O(), X(Ba, {
963
- key: 2,
964
- hideDetails: "",
965
- config: {
966
- open: r.value.showTable,
967
- maxHeight: 1e4,
968
- body: {
969
- backgroundColor: a.value.style.chart.backgroundColor,
970
- color: a.value.style.chart.color
971
- },
972
- head: {
973
- backgroundColor: a.value.style.chart.backgroundColor,
974
- color: a.value.style.chart.color
975
- }
976
- }
977
- }, {
978
- content: m(() => [
979
- he(wa, {
980
- colNames: ae.value.colNames,
981
- head: ae.value.head,
982
- body: ae.value.body,
983
- config: ae.value.config,
984
- title: `${a.value.style.chart.title.text}${a.value.style.chart.title.subtitle.text ? ` : ${a.value.style.chart.title.subtitle.text}` : ""}`,
985
- onClose: t[4] || (t[4] = (o) => r.value.showTable = !1)
986
- }, {
987
- th: m(({ th: o }) => [
988
- Z("div", { innerHTML: o }, null, 8, Ya)
989
- ]),
990
- td: m(({ td: o }) => [
991
- ga(_e(o), 1)
992
- ]),
993
- _: 1
994
- }, 8, ["colNames", "head", "body", "config", "title"])
995
- ]),
996
- _: 1
997
- }, 8, ["config"])) : te("", !0)
998
- ], 14, Ua));
999
- }
1000
- }, tl = /* @__PURE__ */ pa(Za, [["__scopeId", "data-v-2630b430"]]);
1001
- export {
1002
- tl as default
1003
- };