vue-data-ui 3.0.0-next.1 → 3.0.0-next.3

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 (95) hide show
  1. package/README.md +16 -1
  2. package/dist/{Arrow-BKKETqRi.js → Arrow-C8ztMhxn.js} +1 -1
  3. package/dist/{BaseDraggableDialog-Duz4Bd3A.js → BaseDraggableDialog-DoA1cXmQ.js} +2 -2
  4. package/dist/{BaseIcon-BAHAKjob.js → BaseIcon-TJm1JI2f.js} +1 -1
  5. package/dist/{ColorPicker-oPTO1J9Q.js → ColorPicker-DwhabPvD.js} +2 -2
  6. package/dist/{DataTable-vByThHdN.js → DataTable-DObwKftY.js} +2 -2
  7. package/dist/{Legend-CIElSUHU.js → Legend-C-EDWcHp.js} +19 -18
  8. package/dist/{NonSvgPenAndPaper-CsY6Bf4e.js → NonSvgPenAndPaper-Cmy4Opaq.js} +3 -3
  9. package/dist/{PackageVersion-B0wGS6pw.js → PackageVersion-B_SVQo0g.js} +1 -1
  10. package/dist/{PenAndPaper-7o0xS-d4.js → PenAndPaper-CFbTGuB_.js} +3 -3
  11. package/dist/{Shape-Blrp5ZfP.js → Shape-DGduPk8q.js} +1 -1
  12. package/dist/{Slicer-CcM8hzCn.js → Slicer-VumiAmDi.js} +2 -2
  13. package/dist/{SparkTooltip-iaouYun8.js → SparkTooltip-DrRmoIkR.js} +1 -1
  14. package/dist/{Title-CWxjC3bE.js → Title-Dahu_Ia-.js} +1 -1
  15. package/dist/Tooltip-j8grOyYT.js +157 -0
  16. package/dist/{UserOptions-BEBaPSlU.js → UserOptions-BOIQ8NtD.js} +2 -2
  17. package/dist/{dom-to-png-CrAOuxmd.js → dom-to-png-00aHI4Vj.js} +1 -1
  18. package/dist/{img-D3JvqNF8.js → img-DFeNRkbq.js} +1 -1
  19. package/dist/{index-BSa4GlHG.js → index-DKjAxJY6.js} +1180 -1130
  20. package/dist/{pdf-DROWzopj.js → pdf-COmwjbLG.js} +1 -1
  21. package/dist/style.css +1 -1
  22. package/dist/types/vue-data-ui.d.cts +41 -51
  23. package/dist/types/vue-data-ui.d.ts +41 -51
  24. package/dist/useLoading-Bt5Doa8m.js +28 -0
  25. package/dist/{useNestedProp-uR74_CFG.js → useNestedProp-Cmx8ApWu.js} +1 -1
  26. package/dist/{usePrinter-j3g1L2nh.js → usePrinter-BefhLUKK.js} +2 -2
  27. package/dist/{vue-data-ui-BzMRz9Un.js → vue-data-ui-kdcEQgS0.js} +63 -63
  28. package/dist/vue-data-ui.js +13 -13
  29. package/dist/{vue-ui-3d-bar-BAOGEe-m.js → vue-ui-3d-bar-Lv9eoXpT.js} +6 -6
  30. package/dist/{vue-ui-accordion-DzF-SPaZ.js → vue-ui-accordion-BhrF0D_h.js} +3 -3
  31. package/dist/{vue-ui-age-pyramid-BRdQ44O4.js → vue-ui-age-pyramid-DN94DM1L.js} +6 -6
  32. package/dist/{vue-ui-annotator-mjIKrhYa.js → vue-ui-annotator-D-YFzFco.js} +2 -2
  33. package/dist/{vue-ui-bullet-CLYmLvSB.js → vue-ui-bullet--c-hIC1J.js} +7 -7
  34. package/dist/{vue-ui-candlestick-BFLmoEEN.js → vue-ui-candlestick-Dz0D7t8f.js} +7 -7
  35. package/dist/{vue-ui-carousel-table-V89TMa5p.js → vue-ui-carousel-table-Bg4_nEqO.js} +4 -4
  36. package/dist/{vue-ui-chestnut-C7eNjkFo.js → vue-ui-chestnut-D9BP8n-D.js} +6 -6
  37. package/dist/{vue-ui-chord-BuYDLE7K.js → vue-ui-chord-DDa4TTtv.js} +8 -8
  38. package/dist/{vue-ui-circle-pack-CCMbsOpk.js → vue-ui-circle-pack-DWxEHCSN.js} +26 -26
  39. package/dist/{vue-ui-cursor-BrKIImfp.js → vue-ui-cursor-BtLD4k-n.js} +2 -2
  40. package/dist/{vue-ui-dashboard-WMKjx3iE.js → vue-ui-dashboard-DvyNEYA8.js} +62 -62
  41. package/dist/{vue-ui-digits-BoYPIuXn.js → vue-ui-digits-XkSs-Fvw.js} +2 -2
  42. package/dist/vue-ui-donut-BO2QuXBj.js +1532 -0
  43. package/dist/{vue-ui-donut-evolution-DSG8NUG0.js → vue-ui-donut-evolution-CQDtCf7k.js} +8 -8
  44. package/dist/{vue-ui-dumbbell-BMveoLd_.js → vue-ui-dumbbell-jtJmPKky.js} +7 -7
  45. package/dist/{vue-ui-flow-Dnsik-8f.js → vue-ui-flow-D1hSlRXa.js} +7 -7
  46. package/dist/{vue-ui-funnel-CQ0nHCvy.js → vue-ui-funnel-BlLlAOtx.js} +6 -6
  47. package/dist/{vue-ui-galaxy-D5L31IXm.js → vue-ui-galaxy-BZAhXSnB.js} +5 -5
  48. package/dist/{vue-ui-gauge-BnuDe4Wj.js → vue-ui-gauge-FdnYVol9.js} +6 -6
  49. package/dist/{vue-ui-gizmo-DYYw-JEs.js → vue-ui-gizmo-BXiMNDNp.js} +3 -3
  50. package/dist/{vue-ui-heatmap-9KJYiKzE.js → vue-ui-heatmap-BUmZvmK0.js} +7 -7
  51. package/dist/{vue-ui-history-plot-QOaVWh5L.js → vue-ui-history-plot-CTT0NO2g.js} +7 -7
  52. package/dist/{vue-ui-kpi-EtTBwHGS.js → vue-ui-kpi-BNNqPORJ.js} +3 -3
  53. package/dist/{vue-ui-mini-loader-CRnUCpsm.js → vue-ui-mini-loader-wa4WjqZj.js} +2 -2
  54. package/dist/{vue-ui-molecule-Bfk3Vhbi.js → vue-ui-molecule-NGbWYvw-.js} +5 -5
  55. package/dist/{vue-ui-mood-radar-BfRkWvgp.js → vue-ui-mood-radar-Dz2YUYPG.js} +7 -7
  56. package/dist/{vue-ui-nested-donuts-Ck9Zm1UU.js → vue-ui-nested-donuts-ywwGdEJO.js} +269 -269
  57. package/dist/{vue-ui-onion-DF7Z21x-.js → vue-ui-onion-DUeU3zvH.js} +7 -7
  58. package/dist/{vue-ui-parallel-coordinate-plot-JVogg7k5.js → vue-ui-parallel-coordinate-plot-5158EX3T.js} +8 -8
  59. package/dist/{vue-ui-quadrant-DpFjMZoK.js → vue-ui-quadrant-BEaCxPxR.js} +8 -8
  60. package/dist/{vue-ui-quick-chart-NfXEFkoL.js → vue-ui-quick-chart-C3yTivjK.js} +6 -6
  61. package/dist/{vue-ui-radar-Dg8UovnR.js → vue-ui-radar-CwRo-de_.js} +7 -7
  62. package/dist/{vue-ui-rating-D3cpdLRt.js → vue-ui-rating-nHTBjTie.js} +2 -2
  63. package/dist/{vue-ui-relation-circle-BZTTPLCi.js → vue-ui-relation-circle-w7TYrdHz.js} +6 -6
  64. package/dist/{vue-ui-ridgeline-CtY_J3hk.js → vue-ui-ridgeline-Dk9xpHSw.js} +8 -8
  65. package/dist/{vue-ui-rings-BiA-bRgU.js → vue-ui-rings-tCL5utj_.js} +8 -8
  66. package/dist/{vue-ui-scatter-C3sCChYD.js → vue-ui-scatter-BJUJRCto.js} +8 -8
  67. package/dist/{vue-ui-skeleton-DY48gQ96.js → vue-ui-skeleton-Cf09cngz.js} +3 -3
  68. package/dist/{vue-ui-smiley-DopwmgcY.js → vue-ui-smiley-BvoOjmJx.js} +2 -2
  69. package/dist/{vue-ui-spark-trend-DO7P-2x8.js → vue-ui-spark-trend-Bdz2gHnU.js} +3 -3
  70. package/dist/{vue-ui-sparkbar-mqLbTvAg.js → vue-ui-sparkbar-CS1FzyFk.js} +3 -3
  71. package/dist/{vue-ui-sparkgauge-CdfZYUAZ.js → vue-ui-sparkgauge-auWy_YMm.js} +3 -3
  72. package/dist/{vue-ui-sparkhistogram-DAy--kFA.js → vue-ui-sparkhistogram-yA_F8Ls5.js} +4 -4
  73. package/dist/{vue-ui-sparkline-KkG0FnmI.js → vue-ui-sparkline-B-sCAUEL.js} +3 -3
  74. package/dist/{vue-ui-sparkstackbar-LDRannBB.js → vue-ui-sparkstackbar-BhqOPIZT.js} +3 -3
  75. package/dist/{vue-ui-stackbar-Bys4yWs_.js → vue-ui-stackbar-CZzqF-ZH.js} +9 -9
  76. package/dist/{vue-ui-strip-plot-DUBqioS2.js → vue-ui-strip-plot-D7KgSU5y.js} +7 -7
  77. package/dist/{vue-ui-table-CPWgP-71.js → vue-ui-table-BDJg5T9l.js} +3 -3
  78. package/dist/{vue-ui-table-heatmap-DfrMVDEE.js → vue-ui-table-heatmap-Pp2gbL5G.js} +5 -5
  79. package/dist/{vue-ui-table-sparkline-CNC7Lp0t.js → vue-ui-table-sparkline-CmZBjiWv.js} +4 -4
  80. package/dist/{vue-ui-thermometer-Bby5nWIi.js → vue-ui-thermometer-ClY99Umm.js} +6 -6
  81. package/dist/{vue-ui-timer-ym9etXUy.js → vue-ui-timer-_Bck3rxo.js} +5 -5
  82. package/dist/{vue-ui-tiremarks-C0V_XedF.js → vue-ui-tiremarks-C2CtoJT_.js} +6 -6
  83. package/dist/{vue-ui-treemap-B5k0NEO3.js → vue-ui-treemap-CM-zqI6U.js} +8 -8
  84. package/dist/{vue-ui-vertical-bar-DRmHFEMu.js → vue-ui-vertical-bar-CET-9MDi.js} +279 -273
  85. package/dist/{vue-ui-waffle-DrEQsTIO.js → vue-ui-waffle-B21kT4HO.js} +8 -8
  86. package/dist/{vue-ui-wheel-BOTBLBOr.js → vue-ui-wheel-Dqv-ta7L.js} +6 -6
  87. package/dist/{vue-ui-word-cloud-Btay9XOs.js → vue-ui-word-cloud-DHjvCwD8.js} +6 -6
  88. package/dist/{vue-ui-world-zBvIXrWH.js → vue-ui-world-h3Csu0YN.js} +6 -6
  89. package/dist/vue-ui-xy-CZ7mScyg.js +2958 -0
  90. package/dist/{vue-ui-xy-canvas-CDjYeEkq.js → vue-ui-xy-canvas-sIRUM_Be.js} +8 -8
  91. package/package.json +2 -2
  92. package/dist/Tooltip-Cq9HywcX.js +0 -149
  93. package/dist/useMouse-AicQS8Vf.js +0 -13
  94. package/dist/vue-ui-donut-DJVqqXEb.js +0 -1338
  95. package/dist/vue-ui-xy-C7uPPKm9.js +0 -3149
@@ -1,1338 +0,0 @@
1
- import { defineAsyncComponent as Z, useSlots as Vt, computed as f, shallowRef as E, ref as b, onMounted as at, onBeforeUnmount as Dt, watch as ot, createElementBlock as n, openBlock as u, normalizeStyle as w, normalizeClass as $e, createBlock as ee, createCommentVNode as i, renderSlot as m, createElementVNode as h, createVNode as xe, unref as r, createSlots as ut, withCtx as C, normalizeProps as ue, guardReactiveProps as se, Fragment as g, renderList as A, mergeProps as st, toDisplayString as T, createTextVNode as Bt, nextTick as Gt } from "vue";
2
- import { u as Rt, o as Wt, e as nt, g as Et, c as Ut, b as jt, v as Ht, d as rt, p as te, m as it, $ as qt, f as M, X as Jt, s as ge, w as Kt, j as Qt, N as L, i as V, k as ce, n as k, t as Zt, a as el, q as tl, r as ll, x as al, T as vt } from "./index-BSa4GlHG.js";
3
- import { t as ol, u as ul } from "./useResponsive-DfdjqQps.js";
4
- import { u as ct } from "./useNestedProp-uR74_CFG.js";
5
- import { u as sl } from "./usePrinter-j3g1L2nh.js";
6
- import { u as nl } from "./useUserOptionState-BIvW1Kz7.js";
7
- import { u as rl } from "./useChartAccessibility-9icAAmYg.js";
8
- import il from "./Legend-CIElSUHU.js";
9
- import vl from "./Title-CWxjC3bE.js";
10
- import { _ as cl } from "./Shape-Blrp5ZfP.js";
11
- import dl from "./img-D3JvqNF8.js";
12
- import { _ as hl } from "./_plugin-vue_export-helper-CHgC5LLL.js";
13
- const yl = ["id"], fl = ["xmlns", "viewBox"], gl = ["width", "height"], pl = { key: 1 }, ml = ["id"], bl = ["stop-color"], wl = ["offset", "stop-color"], kl = ["offset", "stop-color"], _l = ["stop-color"], $l = { key: 2 }, xl = ["id", "cx", "cy"], Cl = ["stop-color", "stop-opacity"], Pl = ["stop-color"], Tl = ["id"], Al = ["id"], Sl = ["id"], Fl = ["flood-color"], Ll = ["id"], zl = ["flood-color"], Ol = ["d", "stroke", "filter"], Nl = ["d", "stroke", "filter"], Ml = ["cx", "cy", "r", "fill", "filter"], Yl = { key: 6 }, Il = ["stroke", "d"], Xl = ["d", "fill", "stroke", "stroke-width", "filter"], Vl = { key: 0 }, Dl = ["d", "fill", "stroke", "stroke-width", "filter"], Bl = { key: 0 }, Gl = ["stroke", "d"], Rl = { key: 0 }, Wl = ["d", "stroke", "stroke-width", "filter"], El = { key: 1 }, Ul = ["d", "fill", "stroke", "stroke-width", "filter"], jl = ["d", "fill", "stroke", "stroke-width", "filter"], Hl = { key: 1 }, ql = ["cx", "cy", "r", "fill", "stroke", "stroke-width"], Jl = ["cx", "cy", "r", "fill", "stroke", "stroke-width"], Kl = { key: 0 }, Ql = ["d", "fill", "stroke", "stroke-width"], Zl = ["cx", "cy", "r", "stroke"], ea = ["cx", "cy", "r", "fill"], ta = { key: 0 }, la = ["d", "fill", "onMouseenter", "onClick"], aa = { key: 1 }, oa = ["cx", "cy", "r"], ua = ["x", "y", "fill", "font-size"], sa = ["x", "y", "fill", "font-size"], na = ["x", "y", "fill", "font-size"], ra = ["x", "y", "fill", "font-size"], ia = ["filter"], va = { key: 0 }, ca = ["x", "y"], da = { key: 1 }, ha = ["cx", "cy", "fill", "stroke", "filter", "onClick"], ya = ["cx", "cy", "fill", "stroke", "filter", "onClick"], fa = ["text-anchor", "x", "y", "fill", "font-size", "onClick"], ga = ["text-anchor", "x", "y", "fill", "font-size", "onClick"], pa = ["text-anchor", "x", "y", "fill", "font-size", "onClick"], ma = ["text-anchor", "x", "y", "fill", "font-size", "onClick"], ba = { key: 2 }, wa = ["x", "y", "width"], ka = ["x", "y", "width"], _a = {
14
- key: 5,
15
- class: "vue-data-ui-watermark"
16
- }, $a = ["onClick"], xa = ["innerHTML"], Ca = {
17
- __name: "vue-ui-donut",
18
- props: {
19
- config: {
20
- type: Object,
21
- default() {
22
- return {};
23
- }
24
- },
25
- dataset: {
26
- type: Array,
27
- default() {
28
- return [];
29
- }
30
- }
31
- },
32
- emits: ["selectLegend", "selectDatapoint"],
33
- setup(Ce, { expose: dt, emit: ht }) {
34
- const yt = Z(() => import("./vue-ui-accordion-DzF-SPaZ.js")), ft = Z(() => import("./DataTable-vByThHdN.js")), gt = Z(() => import("./PackageVersion-B0wGS6pw.js")), pt = Z(() => import("./PenAndPaper-7o0xS-d4.js")), mt = Z(() => import("./vue-ui-skeleton-DY48gQ96.js")), bt = Z(() => import("./Tooltip-Cq9HywcX.js")), wt = Z(() => import("./UserOptions-BEBaPSlU.js")), { vue_ui_donut: kt } = Rt(), _t = Vt(), z = Ce, ne = f({
35
- get() {
36
- return !!z.dataset && z.dataset.length;
37
- },
38
- set(l) {
39
- return l;
40
- }
41
- }), U = E(null), Pe = E(null), Te = E(null), j = E(null), le = E(null), Ae = E(null), Se = E(null), Fe = b(0), Le = b(0), ze = b(0);
42
- at(() => {
43
- Oe();
44
- }), Dt(() => {
45
- j.value && (le.value && j.value.unobserve(le.value), j.value.disconnect());
46
- });
47
- function Oe() {
48
- if (Wt(z.dataset) ? nt({
49
- componentName: "VueUiDonut",
50
- type: "dataset"
51
- }) : z.dataset.forEach((l, o) => {
52
- Et({
53
- datasetObject: l,
54
- requiredAttributes: ["name", "values"]
55
- }).forEach((t) => {
56
- ne.value = !1, nt({
57
- componentName: "VueUiDonut",
58
- type: "datasetSerieAttribute",
59
- property: t,
60
- index: o
61
- });
62
- });
63
- }), e.value.responsive) {
64
- const l = ol(() => {
65
- const { width: o, height: t } = ul({
66
- chart: U.value,
67
- title: e.value.style.chart.title.text ? Pe.value : null,
68
- legend: e.value.style.chart.legend.show ? Te.value : null,
69
- source: Ae.value,
70
- noTitle: Se.value,
71
- padding: Xe.value
72
- });
73
- requestAnimationFrame(() => {
74
- s.value.width = o, s.value.height = t;
75
- });
76
- });
77
- j.value && (le.value && j.value.unobserve(le.value), j.value.disconnect()), j.value = new ResizeObserver(l), le.value = U.value.parentNode, j.value.observe(le.value);
78
- }
79
- }
80
- const p = b(Ut()), $t = b(null), de = b(!1), pe = b(""), O = b(null), Ne = b(0);
81
- function Me() {
82
- const l = ct({
83
- userConfig: z.config,
84
- defaultConfig: kt
85
- });
86
- return l.theme ? {
87
- ...ct({
88
- userConfig: el.vue_ui_donut[l.theme] || z.config,
89
- defaultConfig: l
90
- }),
91
- customPalette: Zt[l.theme] || te
92
- } : l;
93
- }
94
- const e = f({
95
- get: () => Me(),
96
- set: (l) => l
97
- }), P = b(!0), B = E([]);
98
- function xt(l, o = 1e3, t = 50) {
99
- return new Promise((a) => {
100
- const v = l.length;
101
- B.value = Array(v).fill(0);
102
- let d = 0;
103
- l.forEach(($, x) => {
104
- setTimeout(() => {
105
- const W = performance.now();
106
- function X(ve) {
107
- const fe = Math.min((ve - W) / o, 1), Xt = vt(fe);
108
- B.value[x] = $ * Xt, B.value = [...B.value], fe < 1 ? requestAnimationFrame(X) : (B.value[x] = $, B.value = [...B.value], d += 1, d === v && a());
109
- }
110
- requestAnimationFrame(X);
111
- }, x * t);
112
- });
113
- });
114
- }
115
- at(async () => {
116
- const l = z.dataset.map((o) => o.values.reduce((t, a) => t + a, 0));
117
- e.value.startAnimation.show && await xt(
118
- l,
119
- e.value.startAnimation.durationMs,
120
- e.value.startAnimation.staggerMs
121
- ), P.value = !1;
122
- });
123
- const { userOptionsVisible: me, setUserOptionsVisibility: Ye, keepUserOptionState: Ie } = nl({ config: e.value }), { svgRef: re } = rl({ config: e.value.style.chart.title });
124
- function Ct() {
125
- Ye(!0);
126
- }
127
- function Pt() {
128
- Ye(!1);
129
- }
130
- ot(() => z.config, (l) => {
131
- e.value = Me(), me.value = !e.value.userOptions.showOnChartHover, Oe(), Fe.value += 1, Le.value += 1, ze.value += 1, y.value.dataLabels.show = e.value.style.chart.layout.labels.dataLabels.show, y.value.showTable = e.value.table.show, y.value.showTooltip = e.value.style.chart.tooltip.show, s.value.height = e.value.style.chart.height, s.value.width = e.value.style.chart.width;
132
- }, { deep: !0 });
133
- const Xe = f(() => {
134
- const { top: l, right: o, bottom: t, left: a } = e.value.style.chart.padding;
135
- return {
136
- css: `padding:${l}px ${o}px ${t}px ${a}px`,
137
- top: l,
138
- right: o,
139
- bottom: t,
140
- left: a
141
- };
142
- }), { isPrinting: Ve, isImaging: De, generatePdf: Be, generateImage: Ge } = sl({
143
- elementId: `donut__${p.value}`,
144
- fileName: e.value.style.chart.title.text || "vue-ui-donut",
145
- options: e.value.userOptions.print
146
- }), Tt = f(() => e.value.userOptions.show && !e.value.style.chart.title.text), Re = f(() => jt(e.value.customPalette)), y = b({
147
- dataLabels: {
148
- show: e.value.style.chart.layout.labels.dataLabels.show
149
- },
150
- showTable: e.value.table.show,
151
- showTooltip: e.value.style.chart.tooltip.show
152
- }), s = b({
153
- height: e.value.style.chart.height,
154
- width: e.value.style.chart.width
155
- }), J = f(() => {
156
- const l = e.value.style.chart.layout.donut.strokeWidth / 512, o = Math.min(s.value.width, s.value.height) * l, t = o > _.value ? _.value : o;
157
- return Math.max(t, 3);
158
- }), We = ht, G = f(() => z.dataset.map((l, o) => ({
159
- name: l.name,
160
- color: rt(l.color) || Re.value[o] || te[o] || te[o % te.length],
161
- value: Ht(l.values.reduce((t, a) => t + a, 0)),
162
- absoluteValues: l.values,
163
- comment: l.comment || "",
164
- patternIndex: o,
165
- seriesIndex: o,
166
- ghost: !1,
167
- pattern: `pattern_${p.value}_${o}`
168
- }))), N = E(G.value);
169
- ot(() => G.value, (l) => N.value = l);
170
- function At() {
171
- return G.value.map((l) => ({
172
- name: l.name,
173
- color: l.color,
174
- value: l.value
175
- }));
176
- }
177
- const D = b([]), K = b(!1);
178
- function Ee({ from: l, to: o, duration: t, onUpdate: a, onDone: v, easing: d = vt }) {
179
- const $ = performance.now();
180
- function x(W) {
181
- const X = Math.min((W - $) / t, 1), ve = d(X), fe = l + (o - l) * ve;
182
- a(fe, X), X < 1 ? requestAnimationFrame(x) : (a(o, 1), v && v());
183
- }
184
- requestAnimationFrame(x);
185
- }
186
- function Ue(l) {
187
- const o = G.value.find((v, d) => d === l);
188
- let a = N.value.find((v, d) => d === l).value;
189
- if (D.value.includes(l)) {
190
- let d = function() {
191
- N.value = N.value.map(
192
- (x, W) => l === W ? { ...x, value: v } : x
193
- );
194
- }, $ = function() {
195
- K.value = !0, Ee({
196
- from: a,
197
- to: v,
198
- duration: e.value.serieToggleAnimation.durationMs,
199
- onUpdate: (x, W) => {
200
- N.value = N.value.map(
201
- (X, ve) => l === ve ? { ...X, value: x } : X
202
- );
203
- },
204
- onDone: () => {
205
- d(), K.value = !1;
206
- }
207
- });
208
- };
209
- D.value = D.value.filter((x) => x !== l);
210
- const v = o.value;
211
- e.value.serieToggleAnimation.show && e.value.type === "classic" ? $() : d();
212
- } else if (D.value.length < G.value.length - 1) {
213
- let v = function() {
214
- D.value.push(l), N.value = N.value.map(
215
- ($, x) => l === x ? { ...$, value: 0 } : $
216
- );
217
- }, d = function() {
218
- K.value = !0, Ee({
219
- from: a,
220
- to: 0,
221
- duration: e.value.serieToggleAnimation.durationMs,
222
- onUpdate: ($, x) => {
223
- N.value = N.value.map(
224
- (W, X) => l === X ? { ...W, value: $ } : W
225
- );
226
- },
227
- onDone: () => {
228
- v(), K.value = !1;
229
- }
230
- });
231
- };
232
- e.value.serieToggleAnimation.show && e.value.type === "classic" ? d() : v();
233
- }
234
- We("selectLegend", R.value.map((v) => ({
235
- name: v.name,
236
- color: v.color,
237
- value: v.value
238
- })));
239
- }
240
- const St = f(() => z.dataset.reduce((l, o) => l + o.values.reduce((t, a) => t + a, 0), 0)), R = f(() => {
241
- if (P.value) {
242
- const l = B.value.map((t, a) => ({
243
- ...G.value[a],
244
- value: t,
245
- color: G.value[a].color,
246
- ghost: !1
247
- })), o = St.value - B.value.reduce((t, a) => t + a, 0);
248
- return o > 0 && l.push({
249
- name: "__ghost__",
250
- value: o,
251
- color: "transparent",
252
- ghost: !0
253
- }), l;
254
- } else
255
- return N.value.forEach((l, o) => {
256
- if ([null, void 0].includes(l.values))
257
- return {
258
- ...l,
259
- values: []
260
- };
261
- }), N.value.map((l, o) => ({
262
- ...l,
263
- seriesIndex: o
264
- })).filter((l, o) => !D.value.includes(o));
265
- }), je = f(() => z.dataset.map((l, o) => ({
266
- name: l.name,
267
- color: rt(l.color) || Re.value[o] || te[o] || te[o % te.length],
268
- value: (l.values || []).reduce((t, a) => t + a, 0),
269
- shape: "circle",
270
- patternIndex: o
271
- })).map((l, o) => ({
272
- ...l,
273
- proportion: l.value / z.dataset.map((t) => (t.values || []).reduce((a, v) => a + v, 0)).reduce((t, a) => t + a, 0),
274
- opacity: D.value.includes(o) ? 0.5 : 1,
275
- segregate: () => !K.value && Ue(o),
276
- isSegregated: D.value.includes(o)
277
- }))), Ft = f(() => ({
278
- cy: "donut-div-legend",
279
- backgroundColor: e.value.style.chart.legend.backgroundColor,
280
- color: e.value.style.chart.legend.color,
281
- fontSize: e.value.style.chart.legend.fontSize,
282
- paddingBottom: 12,
283
- fontWeight: e.value.style.chart.legend.bold ? "bold" : ""
284
- })), _ = f(() => {
285
- const l = Math.min(s.value.width / 3, s.value.height / 3);
286
- return l < 55 ? 55 : l;
287
- }), S = f(() => it({ series: R.value }, s.value.width / 2, s.value.height / 2, _.value, _.value, 1.99999, 2, 1, 360, 105.25, J.value)), Lt = f(() => Math.abs(R.value.map((l) => l.value).reduce((l, o) => l + o, 0)) > 0), zt = f(() => it({
288
- series: [
289
- {
290
- value: 1,
291
- color: e.value.style.chart.layout.donut.emptyFill,
292
- name: "_",
293
- seriesIndex: 0,
294
- patternIndex: -1,
295
- ghost: !1,
296
- absoluteValues: [1]
297
- }
298
- ]
299
- }, s.value.width / 2, s.value.height / 2, _.value, _.value, 1.99999, 2, 1, 360, 105.25, J.value)), Y = f(() => S.value.filter((l) => !l.ghost)), c = f(() => {
300
- const l = Math.max(...R.value.map((t) => t.value)), o = R.value.map((t) => t.value / l);
301
- return qt({
302
- series: o,
303
- center: {
304
- x: s.value.width / 2,
305
- y: s.value.height / 2
306
- },
307
- maxRadius: Math.min(s.value.width, s.value.height) / 3,
308
- hasGhost: P.value
309
- });
310
- });
311
- function ae(l) {
312
- return l.x > s.value.width / 2 + 6 ? "start" : l.x < s.value.width / 2 - 6 ? "end" : "middle";
313
- }
314
- function Ot(l) {
315
- return l.middlePoint.y > s.value.height / 2 ? L({ initX: l.middlePoint.x, initY: l.middlePoint.y, offset: 100, centerX: s.value.width / 2, centerY: s.value.height / 2 }).y : L({ initX: l.middlePoint.x, initY: l.middlePoint.y, offset: 0, centerX: s.value.width / 2, centerY: s.value.height / 2 }).y - 100;
316
- }
317
- function I(l) {
318
- return l.proportion * 100 > e.value.style.chart.layout.labels.dataLabels.hideUnderValue;
319
- }
320
- function be(l, o) {
321
- const t = l.value / Nt(o);
322
- return isNaN(t) ? 0 : V(
323
- e.value.style.chart.layout.labels.percentage.formatter,
324
- t * 100,
325
- M({
326
- v: t * 100,
327
- s: "%",
328
- r: e.value.style.chart.layout.labels.percentage.rounding
329
- }),
330
- { datapoint: l }
331
- );
332
- }
333
- function Nt(l) {
334
- return [...l].map((o) => o.value).reduce((o, t) => o + t, 0);
335
- }
336
- const F = f(() => R.value.map((l) => l.value).reduce((l, o) => l + o, 0)), He = f(() => F.value / R.value.length), qe = f(() => (l) => K.value ? l.proportion * 100 : l.value / F.value * 100), we = b(null), ie = b(!1);
337
- function Je({ datapoint: l, relativeIndex: o, seriesIndex: t, show: a = !1 }) {
338
- we.value = { datapoint: l, seriesIndex: t, config: e.value, series: G.value }, de.value = a, O.value = o;
339
- let v = "";
340
- const d = e.value.style.chart.tooltip.customFormat;
341
- if (ie.value = !1, al(d))
342
- try {
343
- const $ = d({
344
- seriesIndex: t,
345
- datapoint: l,
346
- series: G.value,
347
- config: e.value
348
- });
349
- typeof $ == "string" && (pe.value = $, ie.value = !0);
350
- } catch {
351
- console.warn("Custom format cannot be applied."), ie.value = !1;
352
- }
353
- if (!ie.value) {
354
- if (v += `<div style="width:100%;text-align:center;border-bottom:1px solid ${e.value.style.chart.tooltip.borderColor};padding-bottom:6px;margin-bottom:3px;">${l.name}</div>`, v += `<div style="display:flex;flex-direction:row;gap:6px;align-items:center;"><svg viewBox="0 0 60 60" height="14" width="14"><circle cx="30" cy="30" r="30" stroke="none" fill="${l.color}"/>${_t.pattern ? `<circle cx="30" cy="30" r="30" stroke="none" fill="url(#pattern_${p.value}_${t})"/>` : ""}</svg>`, e.value.style.chart.tooltip.showValue && (v += `<b>${V(
355
- e.value.style.chart.layout.labels.value.formatter,
356
- l.value,
357
- M({
358
- p: e.value.style.chart.layout.labels.dataLabels.prefix,
359
- v: l.value,
360
- s: e.value.style.chart.layout.labels.dataLabels.suffix,
361
- r: e.value.style.chart.tooltip.roundingValue
362
- }),
363
- {
364
- datapoint: l,
365
- relativeIndex: o,
366
- seriesIndex: t
367
- }
368
- )}</b>`), e.value.style.chart.tooltip.showPercentage) {
369
- const $ = V(
370
- e.value.style.chart.layout.labels.percentage.formatter,
371
- l.proportion * 100,
372
- M({
373
- v: l.proportion * 100,
374
- s: "%",
375
- r: e.value.style.chart.tooltip.roundingPercentage
376
- }),
377
- {
378
- datapoint: l,
379
- relativeIndex: o,
380
- seriesIndex: t
381
- }
382
- );
383
- e.value.style.chart.tooltip.showValue ? v += `<span>(${$})</span></div>` : v += `<b>${$}</b></div>`;
384
- }
385
- e.value.style.chart.comments.showInTooltip && l.comment && (v += `<div class="vue-data-ui-tooltip-comment" style="background:${l.color}20; padding: 6px; margin-bottom: 6px; margin-top:6px; border-left: 1px solid ${l.color}">${l.comment}</div>`), pe.value = `<div>${v}</div>`;
386
- }
387
- }
388
- function Q(l) {
389
- return e.value.useBlurOnHover && ![null, void 0].includes(O.value) && O.value !== l ? `url(#blur_${p.value})` : "";
390
- }
391
- const H = f(() => {
392
- const l = R.value.map((t) => ({
393
- name: t.name,
394
- color: t.color
395
- })), o = R.value.map((t) => t.value);
396
- return { head: l, body: o };
397
- });
398
- function Ke(l = null) {
399
- Gt(() => {
400
- const o = H.value.head.map((v, d) => [[
401
- v.name
402
- ], [H.value.body[d]], [isNaN(H.value.body[d] / F.value) ? "-" : H.value.body[d] / F.value * 100]]), t = [[e.value.style.chart.title.text], [e.value.style.chart.title.subtitle.text], [[""], ["val"], ["%"]]].concat(o), a = tl(t);
403
- l ? l(a) : ll({ csvContent: a, title: e.value.style.chart.title.text || "vue-ui-donut" });
404
- });
405
- }
406
- const he = f(() => {
407
- const l = [
408
- ' <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>',
409
- M({ p: e.value.style.chart.layout.labels.dataLabels.prefix, v: F.value, s: e.value.style.chart.layout.labels.dataLabels.suffix, r: e.value.table.td.roundingValue }),
410
- "100%"
411
- ], o = H.value.head.map((v, d) => [
412
- {
413
- color: v.color,
414
- name: v.name
415
- },
416
- H.value.body[d],
417
- isNaN(H.value.body[d] / F.value) ? "-" : (H.value.body[d] / F.value * 100).toFixed(e.value.table.td.roundingPercentage) + "%"
418
- ]), t = {
419
- th: {
420
- backgroundColor: e.value.table.th.backgroundColor,
421
- color: e.value.table.th.color,
422
- outline: e.value.table.th.outline
423
- },
424
- td: {
425
- backgroundColor: e.value.table.td.backgroundColor,
426
- color: e.value.table.td.color,
427
- outline: e.value.table.td.outline
428
- },
429
- breakpoint: e.value.table.responsiveBreakpoint
430
- };
431
- return {
432
- colNames: [
433
- e.value.table.columnNames.series,
434
- e.value.table.columnNames.value,
435
- e.value.table.columnNames.percentage
436
- ],
437
- head: l,
438
- body: o,
439
- config: t
440
- };
441
- }), oe = b(!1);
442
- function Qe(l) {
443
- oe.value = l, Ne.value += 1;
444
- }
445
- const Ze = f(() => /^((?!chrome|android).)*safari/i.test(navigator.userAgent));
446
- function Mt(l) {
447
- return l.toFixed(e.value.style.chart.legend.roundingPercentage).split("").map((o) => "-").join("");
448
- }
449
- function q(l, o) {
450
- We("selectDatapoint", { datapoint: l, index: o });
451
- }
452
- function et() {
453
- y.value.showTable = !y.value.showTable;
454
- }
455
- function tt() {
456
- y.value.dataLabels.show = !y.value.dataLabels.show;
457
- }
458
- function lt() {
459
- y.value.showTooltip = !y.value.showTooltip;
460
- }
461
- const ye = b(!1);
462
- function ke() {
463
- ye.value = !ye.value;
464
- }
465
- async function Yt({ scale: l = 2 } = {}) {
466
- if (!U.value) return;
467
- const { width: o, height: t } = U.value.getBoundingClientRect(), a = o / t, { imageUri: v, base64: d } = await dl({ domElement: U.value, base64: !0, img: !0, scale: l });
468
- return {
469
- imageUri: v,
470
- base64: d,
471
- title: e.value.style.chart.title.text,
472
- width: o,
473
- height: t,
474
- aspectRatio: a
475
- };
476
- }
477
- const _e = b(null);
478
- function It() {
479
- if (!_e.value) return;
480
- const { x: l, y: o, width: t, height: a } = _e.value.getBBox();
481
- re.value && re.value.setAttribute("viewBox", `${l} ${o} ${t + Math.min(0, l)} ${a + Math.min(0, o)}`);
482
- }
483
- return dt({
484
- autoSize: It,
485
- getData: At,
486
- getImage: Yt,
487
- generatePdf: Be,
488
- generateCsv: Ke,
489
- generateImage: Ge,
490
- toggleTable: et,
491
- toggleLabels: tt,
492
- toggleTooltip: lt,
493
- toggleAnnotator: ke,
494
- toggleFullscreen: Qe
495
- }), (l, o) => (u(), n("div", {
496
- ref_key: "donutChart",
497
- ref: U,
498
- class: $e(`vue-ui-donut ${oe.value ? "vue-data-ui-wrapper-fullscreen" : ""} ${e.value.useCssAnimation ? "" : "vue-ui-dna"}`),
499
- style: w(`font-family:${e.value.style.fontFamily};width:100%; ${e.value.responsive ? "height:100%;" : ""} text-align:center;background:${e.value.style.chart.backgroundColor}`),
500
- id: `donut__${p.value}`,
501
- onMouseenter: Ct,
502
- onMouseleave: Pt
503
- }, [
504
- e.value.userOptions.buttons.annotator && r(re) ? (u(), ee(r(pt), {
505
- key: 0,
506
- color: e.value.style.chart.color,
507
- backgroundColor: e.value.style.chart.backgroundColor,
508
- active: ye.value,
509
- svgRef: r(re),
510
- onClose: ke
511
- }, null, 8, ["color", "backgroundColor", "active", "svgRef"])) : i("", !0),
512
- m(l.$slots, "userConfig", {}, void 0, !0),
513
- Tt.value ? (u(), n("div", {
514
- key: 1,
515
- ref_key: "noTitle",
516
- ref: Se,
517
- class: "vue-data-ui-no-title-space",
518
- style: "height:36px; width: 100%;background:transparent"
519
- }, null, 512)) : i("", !0),
520
- e.value.style.chart.title.text ? (u(), n("div", {
521
- key: 2,
522
- ref_key: "chartTitle",
523
- ref: Pe,
524
- style: "width:100%;background:transparent;padding-bottom:24px"
525
- }, [
526
- (u(), ee(vl, {
527
- key: `title_${Fe.value}`,
528
- config: {
529
- title: {
530
- cy: "donut-div-title",
531
- ...e.value.style.chart.title
532
- },
533
- subtitle: {
534
- cy: "donut-div-subtitle",
535
- ...e.value.style.chart.title.subtitle
536
- }
537
- }
538
- }, null, 8, ["config"]))
539
- ], 512)) : i("", !0),
540
- e.value.userOptions.show && ne.value && (r(Ie) || r(me)) ? (u(), ee(r(wt), {
541
- ref_key: "details",
542
- ref: $t,
543
- key: `user_option_${Ne.value}`,
544
- backgroundColor: e.value.style.chart.backgroundColor,
545
- color: e.value.style.chart.color,
546
- isPrinting: r(Ve),
547
- isImaging: r(De),
548
- uid: p.value,
549
- hasTooltip: e.value.style.chart.tooltip.show && e.value.userOptions.buttons.tooltip,
550
- hasPdf: e.value.userOptions.buttons.pdf,
551
- hasImg: e.value.userOptions.buttons.img,
552
- hasXls: e.value.userOptions.buttons.csv,
553
- hasTable: e.value.userOptions.buttons.table,
554
- hasLabel: e.value.userOptions.buttons.labels,
555
- hasFullscreen: e.value.userOptions.buttons.fullscreen,
556
- isFullscreen: oe.value,
557
- chartElement: U.value,
558
- position: e.value.userOptions.position,
559
- callbacks: e.value.userOptions.callbacks,
560
- isTooltip: y.value.showTooltip,
561
- titles: { ...e.value.userOptions.buttonTitles },
562
- hasAnnotator: e.value.userOptions.buttons.annotator,
563
- isAnnotation: ye.value,
564
- printScale: e.value.userOptions.print.scale,
565
- onToggleFullscreen: Qe,
566
- onGeneratePdf: r(Be),
567
- onGenerateCsv: Ke,
568
- onGenerateImage: r(Ge),
569
- onToggleTable: et,
570
- onToggleLabels: tt,
571
- onToggleTooltip: lt,
572
- onToggleAnnotator: ke,
573
- style: w({
574
- visibility: r(Ie) ? r(me) ? "visible" : "hidden" : "visible"
575
- })
576
- }, ut({ _: 2 }, [
577
- l.$slots.menuIcon ? {
578
- name: "menuIcon",
579
- fn: C(({ isOpen: t, color: a }) => [
580
- m(l.$slots, "menuIcon", ue(se({ isOpen: t, color: a })), void 0, !0)
581
- ]),
582
- key: "0"
583
- } : void 0,
584
- l.$slots.optionTooltip ? {
585
- name: "optionTooltip",
586
- fn: C(() => [
587
- m(l.$slots, "optionTooltip", {}, void 0, !0)
588
- ]),
589
- key: "1"
590
- } : void 0,
591
- l.$slots.optionPdf ? {
592
- name: "optionPdf",
593
- fn: C(() => [
594
- m(l.$slots, "optionPdf", {}, void 0, !0)
595
- ]),
596
- key: "2"
597
- } : void 0,
598
- l.$slots.optionCsv ? {
599
- name: "optionCsv",
600
- fn: C(() => [
601
- m(l.$slots, "optionCsv", {}, void 0, !0)
602
- ]),
603
- key: "3"
604
- } : void 0,
605
- l.$slots.optionImg ? {
606
- name: "optionImg",
607
- fn: C(() => [
608
- m(l.$slots, "optionImg", {}, void 0, !0)
609
- ]),
610
- key: "4"
611
- } : void 0,
612
- l.$slots.optionTable ? {
613
- name: "optionTable",
614
- fn: C(() => [
615
- m(l.$slots, "optionTable", {}, void 0, !0)
616
- ]),
617
- key: "5"
618
- } : void 0,
619
- l.$slots.optionLabels ? {
620
- name: "optionLabels",
621
- fn: C(() => [
622
- m(l.$slots, "optionLabels", {}, void 0, !0)
623
- ]),
624
- key: "6"
625
- } : void 0,
626
- l.$slots.optionFullscreen ? {
627
- name: "optionFullscreen",
628
- fn: C(({ toggleFullscreen: t, isFullscreen: a }) => [
629
- m(l.$slots, "optionFullscreen", ue(se({ toggleFullscreen: t, isFullscreen: a })), void 0, !0)
630
- ]),
631
- key: "7"
632
- } : void 0,
633
- l.$slots.optionAnnotator ? {
634
- name: "optionAnnotator",
635
- fn: C(({ toggleAnnotator: t, isAnnotator: a }) => [
636
- m(l.$slots, "optionAnnotator", ue(se({ toggleAnnotator: t, isAnnotator: a })), void 0, !0)
637
- ]),
638
- key: "8"
639
- } : void 0
640
- ]), 1032, ["backgroundColor", "color", "isPrinting", "isImaging", "uid", "hasTooltip", "hasPdf", "hasImg", "hasXls", "hasTable", "hasLabel", "hasFullscreen", "isFullscreen", "chartElement", "position", "callbacks", "isTooltip", "titles", "hasAnnotator", "isAnnotation", "printScale", "onGeneratePdf", "onGenerateImage", "style"])) : i("", !0),
641
- ne.value ? (u(), n("svg", {
642
- key: 4,
643
- ref_key: "svgRef",
644
- ref: re,
645
- xmlns: r(Jt),
646
- class: $e({ "vue-data-ui-fullscreen--on": oe.value, "vue-data-ui-fulscreen--off": !oe.value, "vue-data-ui-svg": !0 }),
647
- viewBox: `0 0 ${s.value.width <= 0 ? 10 : s.value.width} ${s.value.height <= 0 ? 10 : s.value.height}`,
648
- style: w(`max-width:100%; overflow: visible; background:transparent;color:${e.value.style.chart.color};${Xe.value.css}`)
649
- }, [
650
- h("g", {
651
- ref_key: "G",
652
- ref: _e,
653
- class: "vue-data-ui-g"
654
- }, [
655
- xe(r(gt)),
656
- l.$slots["chart-background"] ? (u(), n("foreignObject", {
657
- key: 0,
658
- x: 0,
659
- y: 0,
660
- width: s.value.width <= 0 ? 10 : s.value.width,
661
- height: s.value.height <= 0 ? 10 : s.value.height,
662
- style: {
663
- pointerEvents: "none"
664
- }
665
- }, [
666
- m(l.$slots, "chart-background", {}, void 0, !0)
667
- ], 8, gl)) : i("", !0),
668
- e.value.type === "classic" && !isNaN(J.value / _.value) ? (u(), n("defs", pl, [
669
- e.value.style.chart.useGradient ? (u(), n("radialGradient", {
670
- key: 0,
671
- id: `gradient_${p.value}`
672
- }, [
673
- h("stop", {
674
- offset: "0%",
675
- "stop-color": r(ge)(e.value.style.chart.backgroundColor, 0),
676
- "stop-opacity": "0"
677
- }, null, 8, bl),
678
- h("stop", {
679
- offset: `${(1 - J.value / _.value) * 100}%`,
680
- "stop-color": r(ge)("#FFFFFF", 0),
681
- "stop-opacity": "0"
682
- }, null, 8, wl),
683
- h("stop", {
684
- offset: `${(1 - J.value / _.value / 2) * 100}%`,
685
- "stop-color": r(ge)("#FFFFFF", e.value.style.chart.gradientIntensity)
686
- }, null, 8, kl),
687
- h("stop", {
688
- offset: "100%",
689
- "stop-color": r(ge)(e.value.style.chart.backgroundColor, 0),
690
- "stop-opacity": "0"
691
- }, null, 8, _l)
692
- ], 8, ml)) : i("", !0)
693
- ])) : i("", !0),
694
- e.value.type === "polar" ? (u(), n("defs", $l, [
695
- (u(!0), n(g, null, A(c.value, (t, a) => (u(), n("radialGradient", {
696
- id: `polar_gradient_${a}_${p.value}`,
697
- cx: (isNaN(t.middlePoint.x / s.value.width * 100) ? 0 : t.middlePoint.x / s.value.width * 100) + "%",
698
- cy: (isNaN(t.middlePoint.y / s.value.height * 100) ? 0 : t.middlePoint.y / s.value.height * 100) + "%",
699
- r: "62%"
700
- }, [
701
- h("stop", {
702
- offset: "0%",
703
- "stop-color": r(Kt)(S.value[a].color, 0.05),
704
- "stop-opacity": e.value.style.chart.gradientIntensity / 100
705
- }, null, 8, Cl),
706
- h("stop", {
707
- offset: "100%",
708
- "stop-color": S.value[a].color
709
- }, null, 8, Pl)
710
- ], 8, xl))), 256))
711
- ])) : i("", !0),
712
- h("defs", null, [
713
- h("filter", {
714
- id: `blur_${p.value}`,
715
- x: "-50%",
716
- y: "-50%",
717
- width: "200%",
718
- height: "200%"
719
- }, [
720
- h("feGaussianBlur", {
721
- in: "SourceGraphic",
722
- stdDeviation: 2,
723
- id: `blur_std_${p.value}`
724
- }, null, 8, Al),
725
- o[6] || (o[6] = h("feColorMatrix", {
726
- type: "saturate",
727
- values: "0"
728
- }, null, -1))
729
- ], 8, Tl),
730
- h("filter", {
731
- id: `shadow_${p.value}`,
732
- "color-interpolation-filters": "sRGB"
733
- }, [
734
- h("feDropShadow", {
735
- dx: "0",
736
- dy: "0",
737
- stdDeviation: "10",
738
- "flood-opacity": "0.5",
739
- "flood-color": e.value.style.chart.layout.donut.shadowColor
740
- }, null, 8, Fl)
741
- ], 8, Sl),
742
- h("filter", {
743
- id: `drop_shadow_${p.value}`,
744
- "color-interpolation-filters": "sRGB",
745
- x: "-50%",
746
- y: "-50%",
747
- width: "200%",
748
- height: "200%"
749
- }, [
750
- h("feDropShadow", {
751
- dx: "0",
752
- dy: "0",
753
- stdDeviation: "3",
754
- "flood-opacity": "1",
755
- "flood-color": e.value.style.chart.layout.donut.shadowColor
756
- }, null, 8, zl)
757
- ], 8, Ll)
758
- ]),
759
- e.value.type === "classic" ? (u(!0), n(g, { key: 3 }, A(S.value.filter((t) => !t.ghost), (t, a) => (u(), n("g", null, [
760
- I(t) && y.value.dataLabels.show ? (u(), n("path", {
761
- key: 0,
762
- d: r(Qt)(t, { x: s.value.width / 2, y: s.value.height / 2 }, 16, 16, !1, !1, J.value, 12, e.value.style.chart.layout.curvedMarkers),
763
- stroke: t.color,
764
- "stroke-width": "1",
765
- "stroke-linecap": "round",
766
- "stroke-linejoin": "round",
767
- fill: "none",
768
- filter: Q(a)
769
- }, null, 8, Ol)) : i("", !0)
770
- ]))), 256)) : i("", !0),
771
- e.value.type === "polar" ? (u(!0), n(g, { key: 4 }, A(S.value.filter((t) => !t.ghost), (t, a) => (u(), n("g", null, [
772
- I(t) && y.value.dataLabels.show ? (u(), n("path", {
773
- key: 0,
774
- d: `M ${r(L)({ initX: c.value[a].middlePoint.x, initY: c.value[a].middlePoint.y, offset: 24, centerX: s.value.width / 2, centerY: s.value.height / 2 }).x},${r(L)({ initX: c.value[a].middlePoint.x, initY: c.value[a].middlePoint.y, offset: 24, centerX: s.value.width / 2, centerY: s.value.height / 2 }).y} ${c.value[a].middlePoint.x},${c.value[a].middlePoint.y}`,
775
- stroke: t.color,
776
- "stroke-width": "1",
777
- "stroke-linecap": "round",
778
- "stroke-linejoin": "round",
779
- fill: "none",
780
- filter: Q(a),
781
- style: w({
782
- transition: P.value || !e.value.serieToggleAnimation.show ? "none" : `all ${e.value.serieToggleAnimation.durationMs}ms ease-in-out`
783
- })
784
- }, null, 12, Nl)) : i("", !0)
785
- ]))), 256)) : i("", !0),
786
- e.value.type === "classic" && e.value.style.chart.layout.donut.useShadow ? (u(), n("circle", {
787
- key: 5,
788
- cx: s.value.width / 2,
789
- cy: s.value.height / 2,
790
- r: _.value <= 0 ? 10 : _.value,
791
- fill: e.value.style.chart.backgroundColor,
792
- filter: `url(#shadow_${p.value})`
793
- }, null, 8, Ml)) : i("", !0),
794
- l.$slots.pattern ? (u(), n("g", Yl, [
795
- (u(!0), n(g, null, A(Ce.dataset, (t, a) => (u(), n("defs", {
796
- key: `pattern-${t.patternIndex}`
797
- }, [
798
- m(l.$slots, "pattern", st({ ref_for: !0 }, { seriesIndex: a, patternId: `pattern_${p.value}_${a}` }), void 0, !0)
799
- ]))), 128))
800
- ])) : i("", !0),
801
- F.value && e.value.type === "classic" ? (u(), n(g, { key: 7 }, [
802
- (u(!0), n(g, null, A(Y.value, (t, a) => (u(), n("path", {
803
- stroke: e.value.style.chart.backgroundColor,
804
- d: t.arcSlice,
805
- fill: "#FFFFFF"
806
- }, null, 8, Il))), 256)),
807
- (u(!0), n(g, null, A(Y.value, (t, a) => (u(), n("path", {
808
- class: "vue-ui-donut-arc-path",
809
- d: t.arcSlice,
810
- fill: t.color,
811
- stroke: e.value.style.chart.backgroundColor,
812
- "stroke-width": e.value.style.chart.layout.donut.borderWidth,
813
- filter: Q(a)
814
- }, null, 8, Xl))), 256)),
815
- l.$slots.pattern ? (u(), n("g", Vl, [
816
- (u(!0), n(g, null, A(Y.value, (t, a) => (u(), n("path", {
817
- class: "vue-ui-donut-arc-path",
818
- d: t.arcSlice,
819
- fill: `url(#${t.pattern})`,
820
- stroke: e.value.style.chart.backgroundColor,
821
- "stroke-width": e.value.style.chart.layout.donut.borderWidth,
822
- filter: Q(a)
823
- }, null, 8, Dl))), 256))
824
- ])) : i("", !0)
825
- ], 64)) : i("", !0),
826
- F.value && e.value.type === "polar" ? (u(), n(g, { key: 8 }, [
827
- S.value.length > 1 ? (u(), n("g", Bl, [
828
- (u(!0), n(g, null, A(Y.value, (t, a) => (u(), n("path", {
829
- stroke: e.value.style.chart.backgroundColor,
830
- d: c.value[a].path,
831
- fill: "#FFFFFF",
832
- style: w({
833
- transition: P.value || !e.value.serieToggleAnimation.show ? "none" : `all ${e.value.serieToggleAnimation.durationMs}ms ease-in-out`
834
- })
835
- }, null, 12, Gl))), 256)),
836
- e.value.style.chart.layout.donut.useShadow ? (u(), n("g", Rl, [
837
- (u(!0), n(g, null, A(Y.value, (t, a) => (u(), n("path", {
838
- class: "vue-ui-donut-arc-path",
839
- d: c.value[a].path,
840
- fill: "transparent",
841
- stroke: e.value.style.chart.backgroundColor,
842
- "stroke-width": e.value.style.chart.layout.donut.borderWidth,
843
- filter: `url(#drop_shadow_${p.value})`,
844
- style: w({
845
- transition: P.value || !e.value.serieToggleAnimation.show ? "none" : `all ${e.value.serieToggleAnimation.durationMs}ms ease-in-out`
846
- })
847
- }, null, 12, Wl))), 256))
848
- ])) : i("", !0),
849
- l.$slots.pattern ? (u(), n("g", El, [
850
- (u(!0), n(g, null, A(Y.value, (t, a) => (u(), n("path", {
851
- class: "vue-ui-donut-arc-path",
852
- d: c.value[a].path,
853
- fill: `url(#${t.pattern})`,
854
- stroke: e.value.style.chart.backgroundColor,
855
- "stroke-width": e.value.style.chart.layout.donut.borderWidth,
856
- filter: Q(a),
857
- style: w({
858
- transition: P.value || !e.value.serieToggleAnimation.show ? "none" : `all ${e.value.serieToggleAnimation.durationMs}ms ease-in-out`
859
- })
860
- }, null, 12, Ul))), 256))
861
- ])) : i("", !0),
862
- (u(!0), n(g, null, A(Y.value, (t, a) => (u(), n("path", {
863
- class: "vue-ui-donut-arc-path",
864
- d: c.value[a].path,
865
- fill: e.value.style.chart.useGradient ? `url(#polar_gradient_${a}_${p.value})` : t.color,
866
- stroke: e.value.style.chart.backgroundColor,
867
- "stroke-width": e.value.style.chart.layout.donut.borderWidth,
868
- filter: Q(a),
869
- style: w({
870
- transition: P.value || !e.value.serieToggleAnimation.show ? "none" : `all ${e.value.serieToggleAnimation.durationMs}ms ease-in-out`
871
- })
872
- }, null, 12, jl))), 256))
873
- ])) : (u(), n("g", Hl, [
874
- l.$slots.pattern ? (u(), n("circle", {
875
- key: 0,
876
- cx: s.value.width / 2,
877
- cy: s.value.height / 2,
878
- r: _.value,
879
- fill: `url(#pattern_${p.value}_${S.value[0].patternIndex})`,
880
- stroke: e.value.style.chart.backgroundColor,
881
- "stroke-width": e.value.style.chart.layout.donut.borderWidth
882
- }, null, 8, ql)) : i("", !0),
883
- h("circle", {
884
- cx: s.value.width / 2,
885
- cy: s.value.height / 2,
886
- r: _.value,
887
- fill: e.value.style.chart.useGradient ? `url(#polar_gradient_0_${p.value})` : S.value[0].color,
888
- stroke: e.value.style.chart.backgroundColor,
889
- "stroke-width": e.value.style.chart.layout.donut.borderWidth
890
- }, null, 8, Jl)
891
- ]))
892
- ], 64)) : (u(), n(g, { key: 9 }, [
893
- e.value.type === "classic" && !Lt.value ? (u(), n("g", Kl, [
894
- (u(!0), n(g, null, A(zt.value, (t, a) => (u(), n("path", {
895
- class: "vue-ui-donut-arc-path",
896
- d: t.arcSlice,
897
- fill: t.color,
898
- stroke: e.value.style.chart.backgroundColor,
899
- "stroke-width": e.value.style.chart.layout.donut.borderWidth
900
- }, null, 8, Ql))), 256))
901
- ])) : i("", !0),
902
- h("circle", {
903
- cx: s.value.width / 2,
904
- cy: s.value.height / 2,
905
- r: _.value <= 0 ? 10 : _.value,
906
- fill: "transparent",
907
- stroke: e.value.style.chart.backgroundColor
908
- }, null, 8, Zl)
909
- ], 64)),
910
- e.value.style.chart.useGradient && e.value.type === "classic" ? (u(), n("circle", {
911
- key: 10,
912
- cx: s.value.width / 2,
913
- cy: s.value.height / 2,
914
- r: (
915
- /* This might require adjustments */
916
- _.value <= 0 ? 10 : _.value
917
- ),
918
- fill: `url(#gradient_${p.value})`
919
- }, null, 8, ea)) : i("", !0),
920
- F.value ? (u(), n(g, { key: 11 }, [
921
- S.value.length > 1 || e.value.type === "classic" ? (u(), n("g", ta, [
922
- (u(!0), n(g, null, A(S.value.filter((t) => !t.ghost), (t, a) => (u(), n("path", {
923
- d: e.value.type === "classic" ? t.arcSlice : c.value[a].path,
924
- fill: O.value === a ? "rgba(0,0,0,0.1)" : "transparent",
925
- onMouseenter: (v) => Je({
926
- datapoint: t,
927
- relativeIndex: a,
928
- seriesIndex: t.seriesIndex,
929
- show: !0
930
- }),
931
- onMouseleave: o[0] || (o[0] = (v) => {
932
- de.value = !1, O.value = null;
933
- }),
934
- onClick: (v) => q(t, a)
935
- }, null, 40, la))), 256))
936
- ])) : (u(), n("g", aa, [
937
- h("circle", {
938
- cx: s.value.width / 2,
939
- cy: s.value.height / 2,
940
- r: _.value,
941
- fill: "transparent",
942
- onMouseenter: o[1] || (o[1] = (t) => Je({
943
- datapoint: S.value[0],
944
- relativeIndex: 0,
945
- seriesIndex: S.value[0].seriesIndex,
946
- show: !0
947
- })),
948
- onMouseleave: o[2] || (o[2] = (t) => {
949
- de.value = !1, O.value = null;
950
- }),
951
- onClick: o[3] || (o[3] = (t) => q(S.value[0], l.i))
952
- }, null, 40, oa)
953
- ]))
954
- ], 64)) : i("", !0),
955
- e.value.type === "classic" ? (u(), n(g, { key: 12 }, [
956
- e.value.style.chart.layout.labels.hollow.total.show ? (u(), n("text", {
957
- key: 0,
958
- "text-anchor": "middle",
959
- x: s.value.width / 2,
960
- y: s.value.height / 2 - (e.value.style.chart.layout.labels.hollow.average.show ? e.value.style.chart.layout.labels.hollow.total.fontSize : 0) + e.value.style.chart.layout.labels.hollow.total.offsetY,
961
- fill: e.value.style.chart.layout.labels.hollow.total.color,
962
- "font-size": e.value.style.chart.layout.labels.hollow.total.fontSize,
963
- style: w(`font-weight:${e.value.style.chart.layout.labels.hollow.total.bold ? "bold" : ""}`)
964
- }, T(e.value.style.chart.layout.labels.hollow.total.text), 13, ua)) : i("", !0),
965
- e.value.style.chart.layout.labels.hollow.total.show ? (u(), n("text", {
966
- key: 1,
967
- "text-anchor": "middle",
968
- x: s.value.width / 2,
969
- y: s.value.height / 2 + e.value.style.chart.layout.labels.hollow.total.fontSize - (e.value.style.chart.layout.labels.hollow.average.show ? e.value.style.chart.layout.labels.hollow.total.fontSize : 0) + e.value.style.chart.layout.labels.hollow.total.value.offsetY,
970
- fill: e.value.style.chart.layout.labels.hollow.total.value.color,
971
- "font-size": e.value.style.chart.layout.labels.hollow.total.value.fontSize,
972
- style: w(`font-weight:${e.value.style.chart.layout.labels.hollow.total.value.bold ? "bold" : ""}`)
973
- }, T(r(V)(
974
- e.value.style.chart.layout.labels.hollow.total.value.formatter,
975
- F.value,
976
- r(M)({
977
- p: e.value.style.chart.layout.labels.hollow.total.value.prefix,
978
- v: F.value,
979
- s: e.value.style.chart.layout.labels.hollow.total.value.suffix
980
- })
981
- )), 13, sa)) : i("", !0),
982
- e.value.style.chart.layout.labels.hollow.average.show ? (u(), n("text", {
983
- key: 2,
984
- "text-anchor": "middle",
985
- x: s.value.width / 2,
986
- y: s.value.height / 2 + (e.value.style.chart.layout.labels.hollow.total.show ? e.value.style.chart.layout.labels.hollow.average.fontSize : 0) + e.value.style.chart.layout.labels.hollow.average.offsetY,
987
- fill: e.value.style.chart.layout.labels.hollow.average.color,
988
- "font-size": e.value.style.chart.layout.labels.hollow.average.fontSize,
989
- style: w(`font-weight:${e.value.style.chart.layout.labels.hollow.average.bold ? "bold" : ""}`)
990
- }, T(e.value.style.chart.layout.labels.hollow.average.text), 13, na)) : i("", !0),
991
- e.value.style.chart.layout.labels.hollow.average.show ? (u(), n("text", {
992
- key: 3,
993
- "text-anchor": "middle",
994
- x: s.value.width / 2,
995
- y: s.value.height / 2 + (e.value.style.chart.layout.labels.hollow.total.show ? e.value.style.chart.layout.labels.hollow.average.fontSize : 0) + e.value.style.chart.layout.labels.hollow.average.fontSize + e.value.style.chart.layout.labels.hollow.average.value.offsetY,
996
- fill: e.value.style.chart.layout.labels.hollow.average.value.color,
997
- "font-size": e.value.style.chart.layout.labels.hollow.average.value.fontSize,
998
- style: w(`font-weight:${e.value.style.chart.layout.labels.hollow.average.value.bold ? "bold" : ""}`)
999
- }, T(K.value || P.value ? "--" : r(V)(
1000
- e.value.style.chart.layout.labels.hollow.average.value.formatter,
1001
- He.value,
1002
- r(M)({
1003
- p: e.value.style.chart.layout.labels.hollow.average.value.prefix,
1004
- v: He.value,
1005
- s: e.value.style.chart.layout.labels.hollow.average.value.suffix,
1006
- r: e.value.style.chart.layout.labels.hollow.average.value.rounding
1007
- })
1008
- )), 13, ra)) : i("", !0)
1009
- ], 64)) : i("", !0),
1010
- (u(!0), n(g, null, A(Y.value.filter((t) => !t.ghost), (t, a) => (u(), n("g", {
1011
- filter: Q(a),
1012
- class: $e({ animated: e.value.useCssAnimation })
1013
- }, [
1014
- e.value.style.chart.layout.labels.dataLabels.useLabelSlots ? (u(), n("g", va, [
1015
- (u(), n("foreignObject", {
1016
- x: r(k)(t, !0).anchor === "end" ? r(k)(t).x - 120 : r(k)(t, !0).anchor === "middle" ? r(k)(t).x - 60 : r(k)(t).x,
1017
- y: r(ce)(t) - (Ze.value ? 20 : 0),
1018
- width: "120",
1019
- height: "60",
1020
- style: { overflow: "visible" }
1021
- }, [
1022
- h("div", null, [
1023
- m(l.$slots, "dataLabel", st({ ref_for: !0 }, {
1024
- datapoint: t,
1025
- isBlur: !e.value.useBlurOnHover || [null, void 0].includes(O.value) || O.value === a,
1026
- isSafari: Ze.value,
1027
- isVisible: I(t) && y.value.dataLabels.show,
1028
- textAlign: r(k)(t, !0, 16, !0).anchor,
1029
- flexAlign: r(k)(t, !0, 16).anchor,
1030
- percentage: be(t, Y.value)
1031
- }), void 0, !0)
1032
- ])
1033
- ], 8, ca))
1034
- ])) : (u(), n("g", da, [
1035
- e.value.type === "classic" ? (u(), n(g, { key: 0 }, [
1036
- I(t) && y.value.dataLabels.show ? (u(), n("circle", {
1037
- key: 0,
1038
- cx: r(k)(t).x,
1039
- cy: r(ce)(t) - 3.5,
1040
- fill: t.color,
1041
- stroke: e.value.style.chart.backgroundColor,
1042
- "stroke-width": 1,
1043
- r: 3,
1044
- filter: !e.value.useBlurOnHover || [null, void 0].includes(O.value) || O.value === a ? "" : `url(#blur_${p.value})`,
1045
- onClick: (v) => q(t, a)
1046
- }, null, 8, ha)) : i("", !0)
1047
- ], 64)) : i("", !0),
1048
- e.value.type === "polar" ? (u(), n(g, { key: 1 }, [
1049
- I(t) && y.value.dataLabels.show ? (u(), n("circle", {
1050
- key: 0,
1051
- cx: r(L)({ initX: c.value[a].middlePoint.x, initY: c.value[a].middlePoint.y, offset: 24, centerX: s.value.width / 2, centerY: s.value.height / 2 }).x,
1052
- cy: r(L)({ initX: c.value[a].middlePoint.x, initY: c.value[a].middlePoint.y, offset: 24, centerX: s.value.width / 2, centerY: s.value.height / 2 }).y,
1053
- fill: t.color,
1054
- stroke: e.value.style.chart.backgroundColor,
1055
- "stroke-width": 1,
1056
- r: 3,
1057
- filter: !e.value.useBlurOnHover || [null, void 0].includes(O.value) || O.value === a ? "" : `url(#blur_${p.value})`,
1058
- onClick: (v) => q(t, a),
1059
- style: w({
1060
- transition: P.value || !e.value.serieToggleAnimation.show ? "none" : `all ${e.value.serieToggleAnimation.durationMs}ms ease-in-out`
1061
- })
1062
- }, null, 12, ya)) : i("", !0)
1063
- ], 64)) : i("", !0),
1064
- e.value.type === "classic" ? (u(), n(g, { key: 2 }, [
1065
- I(t) && y.value.dataLabels.show ? (u(), n("text", {
1066
- key: 0,
1067
- "text-anchor": r(k)(t, !0, 12).anchor,
1068
- x: r(k)(t, !0, 12).x,
1069
- y: r(ce)(t),
1070
- fill: e.value.style.chart.layout.labels.percentage.color,
1071
- "font-size": e.value.style.chart.layout.labels.percentage.fontSize,
1072
- style: w(`font-weight:${e.value.style.chart.layout.labels.percentage.bold ? "bold" : ""}`),
1073
- onClick: (v) => q(t, a)
1074
- }, T(be(t, Y.value)) + " " + T(e.value.style.chart.layout.labels.value.show ? `(${r(V)(
1075
- e.value.style.chart.layout.labels.value.formatter,
1076
- t.value,
1077
- r(M)({
1078
- p: e.value.style.chart.layout.labels.dataLabels.prefix,
1079
- v: t.value,
1080
- s: e.value.style.chart.layout.labels.dataLabels.suffix,
1081
- r: e.value.style.chart.layout.labels.value.rounding
1082
- }),
1083
- { datapoint: t }
1084
- )})` : ""), 13, fa)) : i("", !0),
1085
- I(t) && y.value.dataLabels.show ? (u(), n("text", {
1086
- key: 1,
1087
- "text-anchor": r(k)(t).anchor,
1088
- x: r(k)(t, !0, 12).x,
1089
- y: r(ce)(t) + e.value.style.chart.layout.labels.percentage.fontSize,
1090
- fill: e.value.style.chart.layout.labels.name.color,
1091
- "font-size": e.value.style.chart.layout.labels.name.fontSize,
1092
- style: w(`font-weight:${e.value.style.chart.layout.labels.name.bold ? "bold" : ""}`),
1093
- onClick: (v) => q(t, a)
1094
- }, T(t.name), 13, ga)) : i("", !0)
1095
- ], 64)) : i("", !0),
1096
- e.value.type === "polar" ? (u(), n(g, { key: 3 }, [
1097
- I(t) && y.value.dataLabels.show ? (u(), n("text", {
1098
- key: 0,
1099
- "text-anchor": ae(c.value[a].middlePoint),
1100
- x: r(L)({ initX: c.value[a].middlePoint.x, initY: c.value[a].middlePoint.y, offset: 42, centerX: s.value.width / 2, centerY: s.value.height / 2 }).x,
1101
- y: r(L)({ initX: c.value[a].middlePoint.x, initY: c.value[a].middlePoint.y, offset: 42, centerX: s.value.width / 2, centerY: s.value.height / 2 }).y,
1102
- fill: e.value.style.chart.layout.labels.percentage.color,
1103
- "font-size": e.value.style.chart.layout.labels.percentage.fontSize,
1104
- style: w({
1105
- transition: P.value || !e.value.serieToggleAnimation.show ? "none" : `all ${e.value.serieToggleAnimation.durationMs}ms ease-in-out`,
1106
- fontWeight: e.value.style.chart.layout.labels.percentage.bold ? "bold" : "normal"
1107
- }),
1108
- onClick: (v) => q(t, a)
1109
- }, T(be(t, Y.value)) + " " + T(e.value.style.chart.layout.labels.value.show ? `(${r(V)(
1110
- e.value.style.chart.layout.labels.value.formatter,
1111
- t.value,
1112
- r(M)({
1113
- p: e.value.style.chart.layout.labels.dataLabels.prefix,
1114
- v: t.value,
1115
- s: e.value.style.chart.layout.labels.dataLabels.suffix,
1116
- r: e.value.style.chart.layout.labels.value.rounding
1117
- }),
1118
- { datapoint: t }
1119
- )})` : ""), 13, pa)) : i("", !0),
1120
- I(t) && y.value.dataLabels.show ? (u(), n("text", {
1121
- key: 1,
1122
- "text-anchor": ae(c.value[a].middlePoint),
1123
- x: r(L)({ initX: c.value[a].middlePoint.x, initY: c.value[a].middlePoint.y, offset: 42, centerX: s.value.width / 2, centerY: s.value.height / 2 }).x,
1124
- y: r(L)({ initX: c.value[a].middlePoint.x, initY: c.value[a].middlePoint.y, offset: 42, centerX: s.value.width / 2, centerY: s.value.height / 2 }).y + e.value.style.chart.layout.labels.percentage.fontSize,
1125
- fill: e.value.style.chart.layout.labels.name.color,
1126
- "font-size": e.value.style.chart.layout.labels.name.fontSize,
1127
- style: w({
1128
- transition: P.value || !e.value.serieToggleAnimation.show ? "none" : `all ${e.value.serieToggleAnimation.durationMs}ms ease-in-out`,
1129
- fontWeight: e.value.style.chart.layout.labels.name.bold ? "bold" : "normal"
1130
- }),
1131
- onClick: (v) => q(t, a)
1132
- }, T(t.name), 13, ma)) : i("", !0)
1133
- ], 64)) : i("", !0)
1134
- ])),
1135
- y.value.dataLabels.show && e.value.style.chart.comments.show && t.comment ? (u(), n("g", ba, [
1136
- I(t) && e.value.type === "classic" ? (u(), n("foreignObject", {
1137
- key: 0,
1138
- x: e.value.style.chart.comments.offsetX + (r(k)(t, !0).anchor === "end" ? r(k)(t).x - e.value.style.chart.comments.width : r(k)(t, !0).anchor === "middle" ? r(k)(t).x - e.value.style.chart.comments.width / 2 : r(k)(t).x),
1139
- y: r(ce)(t) + 24 + e.value.style.chart.comments.offsetY,
1140
- width: e.value.style.chart.comments.width,
1141
- height: "200",
1142
- style: { overflow: "visible", "pointer-events": "none" }
1143
- }, [
1144
- h("div", null, [
1145
- m(l.$slots, "plot-comment", {
1146
- plot: { ...t, textAlign: r(k)(t, !0, 16, !0).anchor, flexAlign: r(k)(t, !0, 16).anchor, isFirstLoad: P.value }
1147
- }, void 0, !0)
1148
- ])
1149
- ], 8, wa)) : i("", !0),
1150
- I(t) && e.value.type === "polar" ? (u(), n("foreignObject", {
1151
- key: 1,
1152
- x: e.value.style.chart.comments.offsetX + (ae(c.value[a].middlePoint) === "end" ? r(L)({ initX: c.value[a].middlePoint.x, initY: c.value[a].middlePoint.y, offset: 42, centerX: s.value.width / 2, centerY: s.value.height / 2 }).x - e.value.style.chart.comments.width : ae(c.value[a].middlePoint) === "middle" ? r(L)({ initX: c.value[a].middlePoint.x, initY: c.value[a].middlePoint.y, offset: 42, centerX: s.value.width / 2, centerY: s.value.height / 2 }).x - e.value.style.chart.comments.width / 2 : r(L)({ initX: c.value[a].middlePoint.x, initY: c.value[a].middlePoint.y, offset: 42, centerX: s.value.width / 2, centerY: s.value.height / 2 }).x),
1153
- y: Ot(c.value[a]) + e.value.style.chart.comments.offsetY,
1154
- width: e.value.style.chart.comments.width,
1155
- height: "200",
1156
- style: w({
1157
- transition: P.value || !e.value.serieToggleAnimation.show ? "none" : `all ${e.value.serieToggleAnimation.durationMs}ms ease-in-out`,
1158
- overflow: "visible",
1159
- pointerEvents: "none"
1160
- })
1161
- }, [
1162
- h("div", null, [
1163
- m(l.$slots, "plot-comment", {
1164
- plot: { ...t, textAlign: ae(c.value[a].middlePoint), flexAlign: ae(c.value[a].middlePoint), isFirstLoad: P.value }
1165
- }, void 0, !0)
1166
- ])
1167
- ], 12, ka)) : i("", !0)
1168
- ])) : i("", !0)
1169
- ], 10, ia))), 256)),
1170
- m(l.$slots, "svg", { svg: s.value }, void 0, !0)
1171
- ], 512)
1172
- ], 14, fl)) : i("", !0),
1173
- l.$slots.watermark ? (u(), n("div", _a, [
1174
- m(l.$slots, "watermark", ue(se({ isPrinting: r(Ve) || r(De) })), void 0, !0)
1175
- ])) : i("", !0),
1176
- ne.value ? i("", !0) : (u(), ee(r(mt), {
1177
- key: 6,
1178
- config: {
1179
- type: "donut",
1180
- style: {
1181
- backgroundColor: e.value.style.chart.backgroundColor,
1182
- donut: {
1183
- color: "#CCCCCC",
1184
- strokeWidth: J.value * 0.8
1185
- }
1186
- }
1187
- }
1188
- }, null, 8, ["config"])),
1189
- h("div", {
1190
- ref_key: "chartLegend",
1191
- ref: Te
1192
- }, [
1193
- e.value.style.chart.legend.show ? (u(), ee(il, {
1194
- key: `legend_${ze.value}`,
1195
- legendSet: je.value,
1196
- config: Ft.value,
1197
- onClickMarker: o[4] || (o[4] = ({ i: t }) => Ue(t))
1198
- }, ut({
1199
- item: C(({ legend: t, index: a }) => [
1200
- h("div", {
1201
- style: w(`opacity:${D.value.includes(a) ? 0.5 : 1}`),
1202
- onClick: (v) => t.segregate()
1203
- }, T(t.name) + T(e.value.style.chart.legend.showPercentage || e.value.style.chart.legend.showValue ? ":" : "") + " " + T(e.value.style.chart.legend.showValue ? r(V)(
1204
- e.value.style.chart.layout.labels.value.formatter,
1205
- t.value,
1206
- r(M)({
1207
- p: e.value.style.chart.layout.labels.dataLabels.prefix,
1208
- v: t.value,
1209
- s: e.value.style.chart.layout.labels.dataLabels.suffix,
1210
- r: e.value.style.chart.legend.roundingValue
1211
- }),
1212
- {
1213
- datapoint: t,
1214
- index: a
1215
- }
1216
- ) : "") + " " + T(e.value.style.chart.legend.showPercentage ? D.value.includes(a) ? `${e.value.style.chart.legend.showValue ? "(" : ""}${Mt(t.proportion * 100)}%${e.value.style.chart.legend.showValue ? ")" : ""}` : `${e.value.style.chart.legend.showValue ? "(" : ""}${isNaN(t.value / F.value) ? "-" : r(V)(
1217
- e.value.style.chart.layout.labels.percentage.formatter,
1218
- qe.value(t),
1219
- r(M)({
1220
- v: qe.value(t),
1221
- s: "%",
1222
- r: e.value.style.chart.legend.roundingPercentage
1223
- })
1224
- )}${e.value.style.chart.legend.showValue ? ")" : ""}` : ""), 13, $a)
1225
- ]),
1226
- _: 2
1227
- }, [
1228
- l.$slots.pattern ? {
1229
- name: "legend-pattern",
1230
- fn: C(({ legend: t, index: a }) => [
1231
- xe(cl, {
1232
- shape: t.shape,
1233
- radius: 30,
1234
- stroke: "none",
1235
- plot: { x: 30, y: 30 },
1236
- fill: `url(#pattern_${p.value}_${a})`
1237
- }, null, 8, ["shape", "fill"])
1238
- ]),
1239
- key: "0"
1240
- } : void 0
1241
- ]), 1032, ["legendSet", "config"])) : i("", !0),
1242
- m(l.$slots, "legend", { legend: je.value }, void 0, !0)
1243
- ], 512),
1244
- l.$slots.source ? (u(), n("div", {
1245
- key: 7,
1246
- ref_key: "source",
1247
- ref: Ae,
1248
- dir: "auto"
1249
- }, [
1250
- m(l.$slots, "source", {}, void 0, !0)
1251
- ], 512)) : i("", !0),
1252
- xe(r(bt), {
1253
- show: y.value.showTooltip && de.value,
1254
- backgroundColor: e.value.style.chart.tooltip.backgroundColor,
1255
- color: e.value.style.chart.tooltip.color,
1256
- fontSize: e.value.style.chart.tooltip.fontSize,
1257
- borderRadius: e.value.style.chart.tooltip.borderRadius,
1258
- borderColor: e.value.style.chart.tooltip.borderColor,
1259
- borderWidth: e.value.style.chart.tooltip.borderWidth,
1260
- backgroundOpacity: e.value.style.chart.tooltip.backgroundOpacity,
1261
- position: e.value.style.chart.tooltip.position,
1262
- offsetY: e.value.style.chart.tooltip.offsetY,
1263
- parent: U.value,
1264
- content: pe.value,
1265
- isCustom: ie.value,
1266
- isFullscreen: oe.value
1267
- }, {
1268
- "tooltip-before": C(() => [
1269
- m(l.$slots, "tooltip-before", ue(se({ ...we.value })), void 0, !0)
1270
- ]),
1271
- "tooltip-after": C(() => [
1272
- m(l.$slots, "tooltip-after", ue(se({ ...we.value })), void 0, !0)
1273
- ]),
1274
- _: 3
1275
- }, 8, ["show", "backgroundColor", "color", "fontSize", "borderRadius", "borderColor", "borderWidth", "backgroundOpacity", "position", "offsetY", "parent", "content", "isCustom", "isFullscreen"]),
1276
- ne.value ? (u(), ee(r(yt), {
1277
- key: 8,
1278
- hideDetails: "",
1279
- config: {
1280
- open: y.value.showTable,
1281
- maxHeight: 1e4,
1282
- body: {
1283
- backgroundColor: e.value.style.chart.backgroundColor,
1284
- color: e.value.style.chart.color
1285
- },
1286
- head: {
1287
- backgroundColor: e.value.style.chart.backgroundColor,
1288
- color: e.value.style.chart.color
1289
- }
1290
- }
1291
- }, {
1292
- content: C(() => [
1293
- (u(), ee(r(ft), {
1294
- key: `table_${Le.value}`,
1295
- colNames: he.value.colNames,
1296
- head: he.value.head,
1297
- body: he.value.body,
1298
- config: he.value.config,
1299
- title: `${e.value.style.chart.title.text}${e.value.style.chart.title.subtitle.text ? ` : ${e.value.style.chart.title.subtitle.text}` : ""}`,
1300
- onClose: o[5] || (o[5] = (t) => y.value.showTable = !1)
1301
- }, {
1302
- th: C(({ th: t }) => [
1303
- h("div", {
1304
- innerHTML: t,
1305
- style: { display: "flex", "align-items": "center" }
1306
- }, null, 8, xa)
1307
- ]),
1308
- td: C(({ td: t }) => [
1309
- Bt(T(t.name ? t.name : isNaN(Number(t)) ? t.includes("%") ? t : r(V)(
1310
- e.value.style.chart.layout.labels.percentage.formatter,
1311
- t,
1312
- r(M)({
1313
- v: t,
1314
- s: "%",
1315
- r: e.value.style.chart.layout.labels.percentage.rounding
1316
- })
1317
- ) : r(V)(
1318
- e.value.style.chart.layout.labels.value.formatter,
1319
- t,
1320
- r(M)({
1321
- p: e.value.style.chart.layout.labels.dataLabels.prefix,
1322
- v: t,
1323
- s: e.value.style.chart.layout.labels.dataLabels.suffix,
1324
- r: e.value.style.chart.layout.labels.value.rounding
1325
- })
1326
- )), 1)
1327
- ]),
1328
- _: 1
1329
- }, 8, ["colNames", "head", "body", "config", "title"]))
1330
- ]),
1331
- _: 1
1332
- }, 8, ["config"])) : i("", !0)
1333
- ], 46, yl));
1334
- }
1335
- }, Xa = /* @__PURE__ */ hl(Ca, [["__scopeId", "data-v-539a130c"]]);
1336
- export {
1337
- Xa as default
1338
- };