vue-data-ui 2.17.0 → 2.17.2

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 (93) hide show
  1. package/README.md +2 -1
  2. package/dist/{Arrow-BAEkZGzL.js → Arrow-Dr2lyXds.js} +1 -1
  3. package/dist/{BaseDraggableDialog-ChCkcmj_.js → BaseDraggableDialog-DQ6yA8di.js} +2 -2
  4. package/dist/{BaseIcon-naqtCxVi.js → BaseIcon-C2f-EcZc.js} +1 -1
  5. package/dist/{ColorPicker-CfIPgxcj.js → ColorPicker-D-JmDe31.js} +2 -2
  6. package/dist/{DataTable-D0VYDhfx.js → DataTable-6BxhjBzt.js} +2 -2
  7. package/dist/{Legend-Bxlv67uY.js → Legend-1R-B-7st.js} +11 -11
  8. package/dist/{NonSvgPenAndPaper-b_oVy-Dd.js → NonSvgPenAndPaper-CLNy5uCL.js} +3 -3
  9. package/dist/{PackageVersion-5TR4ocqp.js → PackageVersion-CIX1W_aa.js} +1 -1
  10. package/dist/{PenAndPaper-D6AqipIO.js → PenAndPaper-CqJ4wudB.js} +3 -3
  11. package/dist/{Shape-DtFT5EJa.js → Shape-DJKQgAbU.js} +1 -1
  12. package/dist/{Slicer-CL6-MRI6.js → Slicer-Dju6LE-h.js} +2 -2
  13. package/dist/{SparkTooltip-Bcv1aoA5.js → SparkTooltip-D2mROH3o.js} +1 -1
  14. package/dist/{Title-B-2bV0SW.js → Title-BQb7X_OR.js} +1 -1
  15. package/dist/{Tooltip-CoQnTnr-.js → Tooltip-BTnTpPdO.js} +1 -1
  16. package/dist/{UserOptions-Dd34lEKb.js → UserOptions-lneAyZKu.js} +2 -2
  17. package/dist/{dom-to-png-2AA0wHlX.js → dom-to-png-C-9BWdwN.js} +1 -1
  18. package/dist/{img-Y_hYz-ZC.js → img-D0DpKcFX.js} +1 -1
  19. package/dist/{index-pPGk-uhD.js → index-JzUbx__y.js} +22 -8
  20. package/dist/{pdf-yfk3d1is.js → pdf-BgVDfZPT.js} +1 -1
  21. package/dist/style.css +1 -1
  22. package/dist/types/vue-data-ui.d.cts +65 -160
  23. package/dist/types/vue-data-ui.d.ts +65 -160
  24. package/dist/{useNestedProp-DjACxgdZ.js → useNestedProp-D_jd2dz9.js} +1 -1
  25. package/dist/{usePrinter-DDHcrl0A.js → usePrinter-CsyliflB.js} +2 -2
  26. package/dist/{vue-data-ui-CIWxgKjd.js → vue-data-ui-BMv8hEcb.js} +99 -97
  27. package/dist/vue-data-ui.js +1 -1
  28. package/dist/{vue-ui-3d-bar-D5Wpdqfk.js → vue-ui-3d-bar-CrdssfKx.js} +41 -34
  29. package/dist/{vue-ui-accordion-CVnA550V.js → vue-ui-accordion-CcTUbiHq.js} +3 -3
  30. package/dist/{vue-ui-age-pyramid-BuAl-zC5.js → vue-ui-age-pyramid-ZYFAAcwc.js} +134 -127
  31. package/dist/{vue-ui-annotator-gl2A20m3.js → vue-ui-annotator-BEgBoRWQ.js} +2 -2
  32. package/dist/{vue-ui-bullet-D-VMKpwe.js → vue-ui-bullet-DYzLfkYB.js} +90 -83
  33. package/dist/{vue-ui-candlestick-1r6YwiUV.js → vue-ui-candlestick-Cdu2ozig.js} +101 -94
  34. package/dist/{vue-ui-carousel-table-B6UJoNtP.js → vue-ui-carousel-table-Dce2wfVw.js} +4 -4
  35. package/dist/{vue-ui-chestnut-DnlBYpC5.js → vue-ui-chestnut-CCMAbLrw.js} +270 -263
  36. package/dist/{vue-ui-chord-D3kpzYjp.js → vue-ui-chord-B8Sl_FwD.js} +60 -53
  37. package/dist/{vue-ui-circle-pack-CHgdpoYu.js → vue-ui-circle-pack-BX6_ToJl.js} +121 -114
  38. package/dist/{vue-ui-cursor-63EAvElT.js → vue-ui-cursor-CyaF0qp7.js} +2 -2
  39. package/dist/{vue-ui-dashboard-Da6CPET-.js → vue-ui-dashboard-BmL_vnj5.js} +62 -62
  40. package/dist/{vue-ui-digits-CA8pUKej.js → vue-ui-digits-BRKjd-LQ.js} +2 -2
  41. package/dist/vue-ui-donut-LZR-vpdS.js +1338 -0
  42. package/dist/{vue-ui-donut-evolution-qeBEA4W8.js → vue-ui-donut-evolution-dax3dN9r.js} +215 -211
  43. package/dist/{vue-ui-dumbbell-Bm0PvAKT.js → vue-ui-dumbbell-C7ZNBVSy.js} +117 -110
  44. package/dist/{vue-ui-flow-C2dqXvrU.js → vue-ui-flow-BeLwkeHo.js} +105 -98
  45. package/dist/{vue-ui-funnel-Dvy5rRld.js → vue-ui-funnel-BywaRLZR.js} +138 -131
  46. package/dist/{vue-ui-galaxy-Y8LYp5n2.js → vue-ui-galaxy-DYavEd4o.js} +150 -146
  47. package/dist/{vue-ui-gauge-BBo0jWAP.js → vue-ui-gauge-DwQRlRWp.js} +125 -118
  48. package/dist/{vue-ui-gizmo-DjXfTOWn.js → vue-ui-gizmo-CjRczit6.js} +3 -3
  49. package/dist/{vue-ui-heatmap-BbxRpltP.js → vue-ui-heatmap-cRy0tcES.js} +155 -148
  50. package/dist/{vue-ui-history-plot-ChYf3Nvc.js → vue-ui-history-plot-D8aTdU23.js} +141 -134
  51. package/dist/{vue-ui-kpi-Vfc5-JnE.js → vue-ui-kpi-B10h_Hbt.js} +3 -3
  52. package/dist/{vue-ui-mini-loader-C0-Nsz8K.js → vue-ui-mini-loader-DNhr_0fr.js} +2 -2
  53. package/dist/{vue-ui-molecule-B7Yu7vzF.js → vue-ui-molecule-4MeyWn0c.js} +141 -134
  54. package/dist/{vue-ui-mood-radar-C8JUTwNw.js → vue-ui-mood-radar-DJmgRVT2.js} +126 -119
  55. package/dist/vue-ui-nested-donuts-CgaPLxV2.js +1177 -0
  56. package/dist/{vue-ui-onion-D4U7TL_N.js → vue-ui-onion-swDxtTT3.js} +88 -81
  57. package/dist/{vue-ui-parallel-coordinate-plot-CXMT7Rjr.js → vue-ui-parallel-coordinate-plot-DayzzOmK.js} +123 -116
  58. package/dist/{vue-ui-quadrant-B13pTVVZ.js → vue-ui-quadrant-CLf81ioF.js} +151 -144
  59. package/dist/{vue-ui-quick-chart-C0UL4o63.js → vue-ui-quick-chart-smKrpIwq.js} +39 -32
  60. package/dist/{vue-ui-radar-XpdiXnhz.js → vue-ui-radar-D8CIvG2q.js} +58 -51
  61. package/dist/{vue-ui-rating-CM8ZrUb1.js → vue-ui-rating-YZivkWBI.js} +2 -2
  62. package/dist/{vue-ui-relation-circle-CYoFNekk.js → vue-ui-relation-circle-DsEYbNs_.js} +127 -120
  63. package/dist/{vue-ui-ridgeline-QUquE6ck.js → vue-ui-ridgeline-Do6C5lMY.js} +98 -91
  64. package/dist/{vue-ui-rings-DwT0IfOh.js → vue-ui-rings-CMryJR1g.js} +208 -204
  65. package/dist/{vue-ui-scatter-zDpy1udm.js → vue-ui-scatter-BtLKWQbX.js} +172 -165
  66. package/dist/{vue-ui-skeleton-DJPjyNYn.js → vue-ui-skeleton-B4KQLEQy.js} +3 -3
  67. package/dist/{vue-ui-smiley-DoDXl6k0.js → vue-ui-smiley-CZBuA-1x.js} +2 -2
  68. package/dist/{vue-ui-spark-trend-CniV6Cpr.js → vue-ui-spark-trend-CdgyexDu.js} +3 -3
  69. package/dist/{vue-ui-sparkbar-Ds2ITgwn.js → vue-ui-sparkbar-DuZulYgD.js} +3 -3
  70. package/dist/{vue-ui-sparkgauge-CosfK-kw.js → vue-ui-sparkgauge-Di0FmUXs.js} +3 -3
  71. package/dist/{vue-ui-sparkhistogram-C7O1wPAJ.js → vue-ui-sparkhistogram-CHNHz9Gm.js} +4 -4
  72. package/dist/{vue-ui-sparkline-B_iUj3F2.js → vue-ui-sparkline-TaWMi8gF.js} +3 -3
  73. package/dist/{vue-ui-sparkstackbar-DBhWrysr.js → vue-ui-sparkstackbar-Bv2HEegT.js} +3 -3
  74. package/dist/{vue-ui-stackbar-C3aV4IcL.js → vue-ui-stackbar-Bk3Bbzjk.js} +61 -54
  75. package/dist/{vue-ui-strip-plot-Bvr1GAzH.js → vue-ui-strip-plot-BNMDY4GI.js} +116 -109
  76. package/dist/{vue-ui-table-DQKKRgyo.js → vue-ui-table-JG0B8HuS.js} +3 -3
  77. package/dist/{vue-ui-table-heatmap-Dyqj5XJC.js → vue-ui-table-heatmap-CCdWeNZj.js} +5 -5
  78. package/dist/{vue-ui-table-sparkline-D4RubyLj.js → vue-ui-table-sparkline-C1u_b0RG.js} +4 -4
  79. package/dist/{vue-ui-thermometer-B0FKI5cG.js → vue-ui-thermometer-DkldIXw7.js} +88 -81
  80. package/dist/{vue-ui-timer-DUCBRIl-.js → vue-ui-timer-0KDTN-Gt.js} +5 -5
  81. package/dist/{vue-ui-tiremarks-CRt4UQZD.js → vue-ui-tiremarks-FPtGzTGi.js} +127 -120
  82. package/dist/vue-ui-treemap-BA5wC5Bs.js +965 -0
  83. package/dist/{vue-ui-vertical-bar-C5fPYltO.js → vue-ui-vertical-bar-DUJWYMRn.js} +233 -226
  84. package/dist/{vue-ui-waffle-BpWLlfpg.js → vue-ui-waffle-BIngg99N.js} +183 -179
  85. package/dist/{vue-ui-wheel-CTzuCroy.js → vue-ui-wheel-l5U2UH9c.js} +121 -114
  86. package/dist/{vue-ui-word-cloud-BPokdaP1.js → vue-ui-word-cloud-CTKuxhFY.js} +152 -145
  87. package/dist/{vue-ui-world-CS6k-oil.js → vue-ui-world-Dx5O9Is5.js} +77 -70
  88. package/dist/{vue-ui-xy-CQ425kLR.js → vue-ui-xy-JjA1CMAo.js} +229 -222
  89. package/dist/{vue-ui-xy-canvas-D2IFwAr7.js → vue-ui-xy-canvas-CH82b2Lp.js} +154 -147
  90. package/package.json +1 -1
  91. package/dist/vue-ui-donut-CKa7nFjt.js +0 -1324
  92. package/dist/vue-ui-nested-donuts-D0RgFifU.js +0 -1163
  93. package/dist/vue-ui-treemap-CWP5nYDx.js +0 -961
@@ -1,1163 +0,0 @@
1
- import { defineAsyncComponent as U, computed as $, ref as h, watch as at, onMounted as ot, nextTick as st, shallowRef as ut, onBeforeUnmount as Mt, createElementBlock as i, openBlock as n, unref as r, normalizeStyle as ue, normalizeClass as R, createBlock as B, createCommentVNode as m, createVNode as nt, createSlots as Et, withCtx as L, renderSlot as x, normalizeProps as X, guardReactiveProps as W, createElementVNode as g, Fragment as T, renderList as O, toDisplayString as I, withDirectives as rt, vShow as it, createTextVNode as ne } from "vue";
2
- import { u as Ut, c as Rt, t as Bt, p as Ce, a as Gt, G as D, o as Yt, e as q, b as Xt, d as Wt, m as _e, f as F, X as qt, s as Ht, L as Jt, k as Te, n as H, i as K, x as dt, q as Kt, r as Qt, y as Zt, v as Oe, T as ct } from "./index-pPGk-uhD.js";
3
- import { t as jt, u as el } from "./useResponsive-DfdjqQps.js";
4
- import { u as vt } from "./useNestedProp-DjACxgdZ.js";
5
- import { u as tl } from "./usePrinter-DDHcrl0A.js";
6
- import { u as ll } from "./useUserOptionState-BIvW1Kz7.js";
7
- import { u as al } from "./useChartAccessibility-9icAAmYg.js";
8
- import ol from "./Title-B-2bV0SW.js";
9
- import sl from "./Legend-Bxlv67uY.js";
10
- import ul from "./img-Y_hYz-ZC.js";
11
- import { _ as nl } from "./_plugin-vue_export-helper-CHgC5LLL.js";
12
- const rl = ["id"], il = ["xmlns", "viewBox"], dl = ["width", "height"], cl = ["id"], vl = ["offset", "stop-color"], hl = ["offset", "stop-opacity"], fl = ["id"], pl = ["id"], yl = ["id"], bl = ["flood-color"], gl = ["d", "fill", "stroke", "stroke-width", "filter"], ml = ["d", "fill", "stroke", "stroke-width"], wl = { key: 1 }, kl = ["d", "fill"], $l = { key: 2 }, Ll = ["x", "y", "font-size", "font-weight", "fill"], xl = { key: 3 }, Cl = ["filter"], _l = ["opacity", "text-anchor", "x", "y", "fill", "font-size", "font-weight"], Tl = ["opacity", "text-anchor", "x", "y", "fill", "font-size", "font-weight"], Ol = ["text-anchor", "x", "y", "fill", "font-size", "font-weight"], Fl = ["d", "fill", "onMouseenter", "onClick"], Nl = {
13
- key: 5,
14
- class: "vue-data-ui-watermark"
15
- }, Sl = {
16
- key: 0,
17
- class: "vue-ui-nested-donuts-legend-title"
18
- }, Al = ["onClick"], Il = ["innerHTML"], Vl = {
19
- __name: "vue-ui-nested-donuts",
20
- props: {
21
- config: {
22
- type: Object,
23
- default() {
24
- return {};
25
- }
26
- },
27
- dataset: {
28
- type: Array,
29
- default() {
30
- return [];
31
- }
32
- }
33
- },
34
- emits: ["selectLegend", "selectDatapoint"],
35
- setup(ht, { expose: ft, emit: pt }) {
36
- const yt = U(() => import("./vue-ui-accordion-CVnA550V.js")), bt = U(() => import("./DataTable-D0VYDhfx.js")), gt = U(() => import("./PackageVersion-5TR4ocqp.js")), mt = U(() => import("./PenAndPaper-D6AqipIO.js")), wt = U(() => import("./vue-ui-skeleton-DJPjyNYn.js")), kt = U(() => import("./Tooltip-CoQnTnr-.js")), $t = U(() => import("./UserOptions-Dd34lEKb.js")), { vue_ui_nested_donuts: Lt } = Ut(), C = ht, Q = $(() => !!C.dataset && C.dataset.length), y = h(Rt()), re = h(!1), ie = h(""), xt = h(null), Fe = h(0), z = h(null), Ne = h(null), de = h(null), Se = h(null), Ae = h(null), Ie = h(0), Ve = h(0), Pe = h(0), M = h(!0), E = h([]), J = h([]), G = h(!1);
37
- function De(l) {
38
- G.value = l, Fe.value += 1;
39
- }
40
- const e = $({
41
- get: () => Ue(),
42
- set: (l) => l
43
- }), { userOptionsVisible: ce, setUserOptionsVisibility: ze, keepUserOptionState: Me } = ll({ config: e.value }), { svgRef: Ee } = al({
44
- config: e.value.style.chart.title
45
- });
46
- function Ue() {
47
- const l = vt({
48
- userConfig: C.config,
49
- defaultConfig: Lt
50
- });
51
- return l.theme ? {
52
- ...vt({
53
- userConfig: Gt.vue_ui_nested_donuts[l.theme] || C.config,
54
- defaultConfig: l
55
- }),
56
- customPalette: Bt[l.theme] || Ce
57
- } : l;
58
- }
59
- at(
60
- () => C.config,
61
- (l) => {
62
- e.value = Ue(), ce.value = !e.value.userOptions.showOnChartHover, ve(), Ie.value += 1, Ve.value += 1, Pe.value += 1, k.value.dataLabels.show = e.value.style.chart.layout.labels.dataLabels.show, k.value.showTable = e.value.table.show, k.value.showTooltip = e.value.style.chart.tooltip.show, f.value.width = e.value.style.chart.width, f.value.height = e.value.style.chart.height;
63
- },
64
- { deep: !0 }
65
- );
66
- const Re = $(() => {
67
- const { top: l, right: s, bottom: a, left: o } = e.value.style.chart.padding;
68
- return {
69
- css: `padding:${l}px ${s}px ${a}px ${o}px`,
70
- top: l,
71
- right: s,
72
- bottom: a,
73
- left: o
74
- };
75
- });
76
- function Ct(l, s = 1e3, a = 50) {
77
- return new Promise((o) => {
78
- const t = l.length;
79
- E.value = Array(t).fill(0), J.value = [];
80
- let u = 0;
81
- l.forEach((c, v) => {
82
- setTimeout(() => {
83
- const N = performance.now();
84
- function d(p) {
85
- const _ = Math.min((p - N) / s, 1), ge = ct(_), me = c * ge;
86
- E.value[v] = me, E.value = [...E.value];
87
- const oe = [];
88
- let we = 0;
89
- C.dataset.forEach((se, ke) => {
90
- const Vt = Oe(se.series.reduce(
91
- (Le, xe) => Le + Oe(D(xe.values).reduce((Dt, zt) => Dt + zt, 0)),
92
- 0
93
- )), Pt = Oe(E.value.slice(we, we + se.series.length).reduce((Le, xe) => Le + xe, 0)), $e = Vt - Pt;
94
- $e > Number.MIN_VALUE && oe.push({
95
- name: "__ghost__",
96
- arcOf: se.name,
97
- arcOfId: `${y.value}_${ke}`,
98
- id: `ghost_${y.value}_${ke}`,
99
- seriesIndex: -1,
100
- datasetIndex: ke,
101
- color: "transparent",
102
- value: $e,
103
- fullValue: $e,
104
- absoluteValues: [],
105
- ghost: !0
106
- }), we += se.series.length;
107
- }), J.value = oe, _ < 1 ? requestAnimationFrame(d) : (u += 1, u === t && o());
108
- }
109
- requestAnimationFrame(d);
110
- }, v * a);
111
- });
112
- });
113
- }
114
- ot(async () => {
115
- if (ve(), e.value.startAnimation?.show) {
116
- const s = C.dataset.flatMap((a) => a.series).map(
117
- (a) => D(a.values).reduce((o, t) => o + t, 0)
118
- );
119
- E.value = s.map(() => 0), M.value = !0, J.value = C.dataset.map((a, o) => {
120
- const t = a.series.reduce(
121
- (u, c) => u + D(c.values).reduce((v, N) => v + N, 0),
122
- 0
123
- );
124
- return {
125
- name: "__ghost__",
126
- arcOf: a.name,
127
- arcOfId: `${y.value}_${o}`,
128
- id: `ghost_${y.value}_${o}`,
129
- seriesIndex: -1,
130
- datasetIndex: o,
131
- color: "transparent",
132
- value: t,
133
- fullValue: t,
134
- absoluteValues: [],
135
- ghost: !0
136
- };
137
- }), await st(), Ct(
138
- s,
139
- e.value.startAnimation.durationMs,
140
- e.value.startAnimation.staggerMs
141
- ).then(() => {
142
- M.value = !1, J.value = [];
143
- });
144
- } else
145
- M.value = !1;
146
- });
147
- const V = ut(null), Y = ut(null);
148
- ot(() => {
149
- ve();
150
- });
151
- function ve() {
152
- if (Yt(C.dataset) && q({
153
- componentName: "VueUiNestedDonuts",
154
- type: "dataset"
155
- }), e.value.responsive) {
156
- const l = jt(() => {
157
- const { width: s, height: a } = el({
158
- chart: z.value,
159
- title: e.value.style.chart.title.text ? Ne.value : null,
160
- legend: e.value.style.chart.legend.show ? de.value : null,
161
- source: Se.value,
162
- noTitle: Ae.value,
163
- padding: Re.value
164
- });
165
- requestAnimationFrame(() => {
166
- f.value.width = s, f.value.height = a;
167
- });
168
- });
169
- V.value && (Y.value && V.value.unobserve(Y.value), V.value.disconnect()), V.value = new ResizeObserver(l), Y.value = z.value.parentNode, V.value.observe(Y.value);
170
- }
171
- }
172
- Mt(() => {
173
- V.value && (Y.value && V.value.unobserve(Y.value), V.value.disconnect());
174
- });
175
- const { isPrinting: Be, isImaging: Ge, generatePdf: Ye, generateImage: Xe } = tl({
176
- elementId: `nested_donuts_${y.value}`,
177
- fileName: e.value.style.chart.title.text || "vue-ui-nested-donuts",
178
- options: e.value.userOptions.print
179
- }), _t = $(() => e.value.userOptions.show && !e.value.style.chart.title.text), Tt = $(() => Xt(e.value.customPalette)), k = h({
180
- dataLabels: {
181
- show: e.value.style.chart.layout.labels.dataLabels.show
182
- },
183
- showTable: e.value.table.show,
184
- showTooltip: e.value.style.chart.tooltip.show
185
- }), f = h({
186
- width: e.value.style.chart.width,
187
- height: e.value.style.chart.height
188
- }), We = pt;
189
- function Ot({ datapoint: l, index: s }) {
190
- We("selectDatapoint", { datapoint: l, index: s });
191
- }
192
- function qe({
193
- from: l,
194
- to: s,
195
- duration: a,
196
- onUpdate: o,
197
- onDone: t,
198
- easing: u = ct
199
- }) {
200
- const c = performance.now();
201
- function v(N) {
202
- const d = Math.min((N - c) / a, 1), p = u(d), _ = l + (s - l) * p;
203
- o(_, d), d < 1 ? requestAnimationFrame(v) : (o(s, 1), t && t());
204
- }
205
- requestAnimationFrame(v);
206
- }
207
- const w = h([]), S = $(() => {
208
- C.dataset.forEach((s, a) => {
209
- [null, void 0].includes(s.name) && q({
210
- componentName: "VueUiNestedDonuts",
211
- type: "datasetSerieAttribute",
212
- property: "name",
213
- index: a
214
- }), [null, void 0].includes(s.series) ? q({
215
- componentName: "VueUiNestedDonuts",
216
- type: "datasetSerieAttribute",
217
- property: "series",
218
- index: a
219
- }) : s.series.length === 0 ? q({
220
- componentName: "VueUiNestedDonuts",
221
- type: "datasetAttributeEmpty",
222
- property: `series at index ${a}`
223
- }) : s.series.forEach((o, t) => {
224
- [null, void 0].includes(o.name) && q({
225
- componentName: "VueUiNestedDonuts",
226
- type: "datasetSerieAttribute",
227
- property: "name",
228
- index: t,
229
- key: "serie"
230
- }), [null, void 0].includes(o.values) && q({
231
- componentName: "VueUiNestedDonuts",
232
- type: "datasetSerieAttribute",
233
- property: "values",
234
- index: t,
235
- key: "serie"
236
- });
237
- });
238
- });
239
- let l = 0;
240
- return C.dataset.map((s, a) => ({
241
- ...s,
242
- total: s.series.filter((o) => !w.value.includes(o.id)).map((o) => D(o.values).reduce((t, u) => t + u, 0)).reduce((o, t) => o + t, 0),
243
- datasetIndex: a,
244
- id: `${y.value}_${a}`,
245
- series: s.series.map((o, t) => {
246
- const u = D(o.values).reduce((c, v) => c + v, 0);
247
- return {
248
- name: o.name,
249
- arcOf: s.name,
250
- arcOfId: `${y.value}_${a}`,
251
- id: `${y.value}_${a}_${t}`,
252
- seriesIndex: t,
253
- datasetIndex: a,
254
- color: Wt(o.color) || Tt.value[t] || Ce[t % Ce.length],
255
- value: M.value ? E.value[l++] ?? 0 : u,
256
- absoluteValues: o.values || []
257
- };
258
- })
259
- }));
260
- }), A = $(() => Math.min(f.value.height, f.value.width) * (e.value.style.chart.layout.donut.strokeWidth / 512)), He = $(() => [...S.value].map((l, s) => {
261
- const a = l.series.filter((o) => !w.value.includes(o.id)).map((o) => o.value).reduce((o, t) => o + t, 0);
262
- return {
263
- ...l,
264
- total: a,
265
- series: l.series.filter((o) => !w.value.includes(o.id)).map((o) => ({
266
- ...o,
267
- proportion: o.value / a
268
- }))
269
- };
270
- }));
271
- function Ft(l, s, a) {
272
- let o = 0;
273
- for (let t = 0; t < l.length; t += 1)
274
- a.includes(l[t]) && (o += 1);
275
- return o < s;
276
- }
277
- const b = h(He.value);
278
- at(
279
- () => He.value,
280
- (l) => b.value = l
281
- );
282
- function he(l) {
283
- We("selectLegend", l);
284
- const s = C.dataset.flatMap(
285
- (d, p) => d.series.map((_, ge) => ({
286
- value: D(_.values).reduce((me, oe) => me + oe, 0),
287
- id: `${y.value}_${p}_${ge}`,
288
- arcOfId: `${y.value}_${p}`
289
- }))
290
- ).find((d) => d.id === l.id);
291
- if (!s) return;
292
- const a = S.value.flatMap((d) => d.series).find((d) => d.id === l.id)?.value ?? 0, o = b.value.flatMap((d) => d.series).find((d) => d.id === l.id);
293
- let u = o ? o.value : 0;
294
- const c = S.value.find(
295
- (d) => d.id === s.arcOfId
296
- );
297
- if (!c) return;
298
- const v = c.series.map((d) => d.id), N = Ft(
299
- v,
300
- v.length - 1,
301
- w.value
302
- );
303
- w.value.includes(l.id) ? (w.value = w.value.filter((d) => d !== l.id), e.value.serieToggleAnimation.show ? qe({
304
- from: u,
305
- to: a,
306
- duration: e.value.serieToggleAnimation.durationMs,
307
- onUpdate: (d) => {
308
- b.value = b.value.map((p) => ({
309
- ...p,
310
- series: p.series.map((_) => _.id === l.id ? { ..._, value: d } : _)
311
- }));
312
- }
313
- }) : b.value = b.value.map((d) => ({
314
- ...d,
315
- series: d.series.map((p) => p.id === l.id ? { ...p, value: a } : p)
316
- }))) : N && (e.value.serieToggleAnimation.show ? qe({
317
- from: u,
318
- to: 0,
319
- duration: e.value.serieToggleAnimation.durationMs,
320
- onUpdate: (d) => {
321
- b.value = b.value.map((p) => ({
322
- ...p,
323
- series: p.series.map((_) => _.id === l.id ? { ..._, value: d } : _)
324
- }));
325
- },
326
- onDone: () => {
327
- w.value.push(l.id);
328
- }
329
- }) : (b.value = b.value.map((d) => ({
330
- ...d,
331
- series: d.series.map((p) => p.id === l.id ? { ...p, value: 0 } : p)
332
- })), w.value.push(l.id)));
333
- }
334
- const Z = $(() => A.value / S.value.length * e.value.style.chart.layout.donut.spacingRatio), Je = $(() => b.value.map((l, s) => A.value - s * A.value / S.value.length)), j = $(() => b.value.map((l, s) => {
335
- const a = Math.abs(l.series.map((v) => v.value).reduce((v, N) => v + N, 0)) > 0, o = A.value - s * A.value / b.value.length, t = M.value ? J.value.find((v) => v.datasetIndex === s) : null, u = [...l.series, ...t ? [t] : []].map((v) => ({
336
- ...v,
337
- value: v.value < 1e-11 ? Number.MIN_VALUE : v.value
338
- })), c = _e(
339
- { series: [
340
- { name: "_", color: e.value.style.chart.layout.donut.emptyFill, value: 1 }
341
- ] },
342
- f.value.width / 2,
343
- f.value.height / 2,
344
- o,
345
- o,
346
- 1.99999,
347
- 2,
348
- 1,
349
- 360,
350
- 105.25,
351
- Z.value
352
- );
353
- return {
354
- ...l,
355
- hasData: a,
356
- radius: o,
357
- skeleton: c,
358
- donut: _e(
359
- { series: u },
360
- f.value.width / 2,
361
- f.value.height / 2,
362
- o,
363
- o,
364
- 1.99999,
365
- 2,
366
- 1,
367
- 360,
368
- 105.25,
369
- Z.value
370
- )
371
- };
372
- })), Ke = $(() => [...S.value].map((l, s) => {
373
- const a = s * A.value / S.value.length;
374
- return {
375
- sizeRatio: a,
376
- donut: _e(
377
- { series: [{ value: 1 }] },
378
- f.value.width / 2,
379
- f.value.height / 2,
380
- A.value - a,
381
- A.value - a,
382
- 1.99999,
383
- 2,
384
- 1,
385
- 360,
386
- 105.25,
387
- A.value / S.value.length * e.value.style.chart.layout.donut.spacingRatio
388
- )[0]
389
- };
390
- })), Qe = h(null), ee = h(null), te = h(null), fe = h(null);
391
- function Nt({ datapoint: l, _relativeIndex: s, seriesIndex: a }) {
392
- Qe.value = l.arcOfId, ee.value = l.id, te.value = a, fe.value = {
393
- datapoint: l,
394
- seriesIndex: a,
395
- series: b.value,
396
- config: e.value
397
- };
398
- const o = e.value.style.chart.tooltip.customFormat;
399
- if (dt(o) && Zt(
400
- () => o({
401
- seriesIndex: a,
402
- datapoint: l,
403
- series: b.value,
404
- config: e.value
405
- })
406
- ))
407
- ie.value = o({
408
- seriesIndex: a,
409
- datapoint: l,
410
- series: b.value,
411
- config: e.value
412
- });
413
- else {
414
- let t = "";
415
- if (e.value.style.chart.tooltip.showAllItemsAtIndex && w.value.length === 0) {
416
- const u = b.value.map((c) => c.series.find((v) => v.seriesIndex === a));
417
- u.forEach((c, v) => {
418
- if (!c) return "";
419
- t += `
420
- <div style="display:flex; flex-direction: column; justify-content:flex-start; align-items:flex-start;padding:6px 0; ${v < u.length - 1 ? `border-bottom:1px solid ${e.value.style.chart.tooltip.borderColor}` : ""}">
421
- <div style="display:flex; flex-direction: row; gap: 3px; justify-content:flex-start; align-items:center;">
422
- <svg viewBox="0 0 20 20" height="${e.value.style.chart.tooltip.fontSize}" width="${e.value.style.chart.tooltip.fontSize}">
423
- <circle cx="10" cy="10" r="10" fill="${c.color}"/>
424
- </svg>
425
- <span>
426
- ${c.arcOf ?? ""} - ${c.name}
427
- </span>
428
- </div>
429
- <span>
430
- ${e.value.style.chart.tooltip.showValue ? `<b>${K(
431
- e.value.style.chart.layout.labels.dataLabels.formatter,
432
- l.value,
433
- F({
434
- p: e.value.style.chart.layout.labels.dataLabels.prefix,
435
- v: l.value,
436
- s: e.value.style.chart.layout.labels.dataLabels.suffix,
437
- r: e.value.style.chart.tooltip.roundingValue
438
- }),
439
- { datapoint: l, seriesIndex: a }
440
- )}
441
- </b>` : ""}
442
- ${e.value.style.chart.tooltip.showPercentage ? `(${F({
443
- v: c.proportion * 100,
444
- s: "%",
445
- r: e.value.style.chart.tooltip.roundingPercentage
446
- })})` : ""}
447
- </span>
448
- </div>
449
- `;
450
- });
451
- } else
452
- t += `<div style="width:100%;text-align:center;border-bottom:1px solid ${e.value.style.chart.tooltip.borderColor};padding-bottom:6px;margin-bottom:3px;">${l.arcOf ?? ""} - ${l.name}</div>`, t += `<div style="display:flex;flex-direction:row;gap:6px;align-items:center;"><svg viewBox="0 0 12 12" height="14" width="14"><circle cx="6" cy="6" r="6" stroke="none" fill="${l.color}"/></svg>`, e.value.style.chart.tooltip.showValue && (t += `<b>${K(
453
- e.value.style.chart.layout.labels.dataLabels.formatter,
454
- l.value,
455
- F({
456
- p: e.value.style.chart.layout.labels.dataLabels.prefix,
457
- v: l.value,
458
- s: e.value.style.chart.layout.labels.dataLabels.suffix,
459
- r: e.value.style.chart.tooltip.roundingValue
460
- }),
461
- { datapoint: l, seriesIndex: a }
462
- )}</b>`), e.value.style.chart.tooltip.showPercentage && (e.value.style.chart.tooltip.showValue ? t += `<span>(${F({
463
- v: l.proportion * 100,
464
- s: "%",
465
- r: e.value.style.chart.tooltip.roundingPercentage
466
- })})</span></div>` : t += `<b>${F({
467
- v: l.proportion * 100,
468
- s: "%",
469
- r: e.value.style.chart.tooltip.roundingPercentage
470
- })}</b></div>`);
471
- ie.value = `<div style="font-size:${e.value.style.chart.tooltip.fontSize}px">${t}</div>`;
472
- }
473
- re.value = !0;
474
- }
475
- function pe(l) {
476
- return l.proportion * 100 > e.value.style.chart.layout.labels.dataLabels.hideUnderValue;
477
- }
478
- function Ze(l, s) {
479
- if (!e.value.useBlurOnHover)
480
- return "";
481
- if (e.value.style.chart.tooltip.showAllItemsAtIndex && w.value.length === 0)
482
- return [null, void 0].includes(te.value) || te.value === s ? "" : `url(#blur_${y.value})`;
483
- if (!e.value.style.chart.tooltip.showAllItemsAtIndex || w.value.length)
484
- return [null, void 0].includes(ee.value) || ee.value === l.id ? "" : `url(#blur_${y.value})`;
485
- }
486
- const ye = $(() => S.value.map((l, s) => {
487
- const a = l.series.filter(
488
- (t) => !w.value.includes(t.id)
489
- ), o = M.value ? a.map((t) => {
490
- const u = C.dataset[s].series.findIndex(
491
- (c) => c.name === t.name
492
- );
493
- return D(
494
- C.dataset[s].series[u].values
495
- ).reduce((c, v) => c + v, 0);
496
- }).reduce((t, u) => t + u, 0) : a.map((t) => t.value).reduce((t, u) => t + u, 0);
497
- return l.series.map((t, u) => {
498
- const c = D(C.dataset[s].series[u].values).reduce(
499
- (N, d) => N + d,
500
- 0
501
- ), v = M.value ? c : t.value;
502
- return {
503
- name: t.name,
504
- color: t.color,
505
- value: v,
506
- shape: "circle",
507
- arcOf: t.arcOf,
508
- id: t.id,
509
- seriesIndex: u,
510
- datasetIndex: s,
511
- total: o,
512
- opacity: w.value.includes(t.id) ? 0.5 : 1,
513
- segregate: () => he(t),
514
- isSegregated: w.value.includes(t.id)
515
- };
516
- });
517
- })), St = $(() => ({
518
- cy: "nested-donuts-legend",
519
- backgroundColor: e.value.style.chart.legend.backgroundColor,
520
- color: e.value.style.chart.legend.color,
521
- fontSize: e.value.style.chart.legend.fontSize,
522
- paddingBottom: 12,
523
- fontWeight: e.value.style.chart.legend.bold ? "bold" : ""
524
- })), P = $(() => {
525
- const l = b.value.flatMap((a) => a.series.map((o) => ({
526
- name: `${a.name} - ${o.name}`,
527
- color: o.color,
528
- total: a.total
529
- }))), s = b.value.flatMap((a) => a.series.map((o) => o.value));
530
- return { head: l, body: s };
531
- });
532
- function je(l = null) {
533
- st(() => {
534
- const s = P.value.head.map((t, u) => [
535
- [t.name],
536
- [P.value.body[u]],
537
- [
538
- isNaN(P.value.body[u] / t.total) ? "-" : P.value.body[u] / t.total * 100
539
- ]
540
- ]), a = [
541
- [e.value.style.chart.title.text],
542
- [e.value.style.chart.title.subtitle.text],
543
- [[""], ["val"], ["%"]]
544
- ].concat(s), o = Kt(a);
545
- l ? l(o) : Qt({
546
- csvContent: o,
547
- title: e.value.style.chart.title.text || "vue-ui-nested-donuts"
548
- });
549
- });
550
- }
551
- const le = $(() => {
552
- const l = [
553
- e.value.table.columnNames.series,
554
- e.value.table.columnNames.value,
555
- e.value.table.columnNames.percentage
556
- ], s = P.value.head.map((t, u) => {
557
- const c = F({
558
- p: e.value.style.chart.layout.labels.dataLabels.prefix,
559
- v: P.value.body[u],
560
- s: e.value.style.chart.layout.labels.dataLabels.suffix,
561
- r: e.value.table.td.roundingValue
562
- });
563
- return [
564
- {
565
- color: t.color,
566
- name: t.name
567
- },
568
- c,
569
- isNaN(P.value.body[u] / t.total) ? "-" : F({
570
- v: P.value.body[u] / t.total * 100,
571
- s: "%",
572
- r: e.value.table.td.roundingPercentage
573
- })
574
- ];
575
- }), a = {
576
- th: {
577
- backgroundColor: e.value.table.th.backgroundColor,
578
- color: e.value.table.th.color,
579
- outline: e.value.table.th.outline
580
- },
581
- td: {
582
- backgroundColor: e.value.table.td.backgroundColor,
583
- color: e.value.table.td.color,
584
- outline: e.value.table.td.outline
585
- },
586
- breakpoint: e.value.table.responsiveBreakpoint
587
- };
588
- return {
589
- colNames: [
590
- e.value.table.columnNames.series,
591
- e.value.table.columnNames.value,
592
- e.value.table.columnNames.percentage
593
- ],
594
- head: l,
595
- body: s,
596
- config: a
597
- };
598
- });
599
- function At() {
600
- return S.value;
601
- }
602
- function et() {
603
- k.value.showTable = !k.value.showTable;
604
- }
605
- function tt() {
606
- k.value.dataLabels.show = !k.value.dataLabels.show;
607
- }
608
- function lt() {
609
- k.value.showTooltip = !k.value.showTooltip;
610
- }
611
- const ae = h(!1);
612
- function be() {
613
- ae.value = !ae.value;
614
- }
615
- async function It({ scale: l = 2 } = {}) {
616
- if (!z.value) return;
617
- const { imageUri: s, base64: a } = await ul({ domElement: z.value, base64: !0, img: !0, scale: l });
618
- return { imageUri: s, base64: a };
619
- }
620
- return ft({
621
- getData: At,
622
- getImage: It,
623
- generatePdf: Ye,
624
- generateCsv: je,
625
- generateImage: Xe,
626
- toggleTable: et,
627
- toggleLabels: tt,
628
- toggleTooltip: lt,
629
- toggleAnnotator: be,
630
- toggleFullscreen: De
631
- }), (l, s) => (n(), i("div", {
632
- ref_key: "nestedDonutsChart",
633
- ref: z,
634
- class: R(`vue-ui-nested-donuts ${G.value ? "vue-data-ui-wrapper-fullscreen" : ""} ${e.value.useCssAnimation ? "" : "vue-ui-dna"}`),
635
- style: ue(`font-family:${e.value.style.fontFamily};width:100%; text-align:center;background:${e.value.style.chart.backgroundColor}`),
636
- id: `nested_donuts_${y.value}`,
637
- onMouseenter: s[3] || (s[3] = () => r(ze)(!0)),
638
- onMouseleave: s[4] || (s[4] = () => r(ze)(!1))
639
- }, [
640
- e.value.userOptions.buttons.annotator ? (n(), B(r(mt), {
641
- key: 0,
642
- svgRef: r(Ee),
643
- backgroundColor: e.value.style.chart.backgroundColor,
644
- color: e.value.style.chart.color,
645
- active: ae.value,
646
- onClose: be
647
- }, null, 8, ["svgRef", "backgroundColor", "color", "active"])) : m("", !0),
648
- _t.value ? (n(), i("div", {
649
- key: 1,
650
- ref_key: "noTitle",
651
- ref: Ae,
652
- class: "vue-data-ui-no-title-space",
653
- style: "height:36px; width: 100%;background:transparent"
654
- }, null, 512)) : m("", !0),
655
- e.value.style.chart.title.text ? (n(), i("div", {
656
- key: 2,
657
- ref_key: "chartTitle",
658
- ref: Ne
659
- }, [
660
- (n(), B(ol, {
661
- key: `title_${Ie.value}`,
662
- config: {
663
- title: {
664
- cy: "donut-div-title",
665
- ...e.value.style.chart.title
666
- },
667
- subtitle: {
668
- cy: "donut-div-subtitle",
669
- ...e.value.style.chart.title.subtitle
670
- }
671
- }
672
- }, null, 8, ["config"]))
673
- ], 512)) : m("", !0),
674
- e.value.userOptions.show && Q.value && (r(Me) || r(ce)) ? (n(), B(r($t), {
675
- ref: "details",
676
- key: `user_option_${Fe.value}`,
677
- backgroundColor: e.value.style.chart.backgroundColor,
678
- color: e.value.style.chart.color,
679
- isPrinting: r(Be),
680
- isImaging: r(Ge),
681
- uid: y.value,
682
- hasTooltip: e.value.userOptions.buttons.tooltip && e.value.style.chart.tooltip.show,
683
- hasPdf: e.value.userOptions.buttons.pdf,
684
- hasXls: e.value.userOptions.buttons.csv,
685
- hasImg: e.value.userOptions.buttons.img,
686
- hasTable: e.value.userOptions.buttons.table,
687
- hasLabel: e.value.userOptions.buttons.labels,
688
- hasFullscreen: e.value.userOptions.buttons.fullscreen,
689
- isFullscreen: G.value,
690
- isTooltip: k.value.showTooltip,
691
- titles: { ...e.value.userOptions.buttonTitles },
692
- chartElement: z.value,
693
- position: e.value.userOptions.position,
694
- hasAnnotator: e.value.userOptions.buttons.annotator,
695
- isAnnotation: ae.value,
696
- callbacks: e.value.userOptions.callbacks,
697
- printScale: e.value.userOptions.print.scale,
698
- onToggleFullscreen: De,
699
- onGeneratePdf: r(Ye),
700
- onGenerateCsv: je,
701
- onGenerateImage: r(Xe),
702
- onToggleTable: et,
703
- onToggleLabels: tt,
704
- onToggleTooltip: lt,
705
- onToggleAnnotator: be,
706
- style: ue({
707
- visibility: r(Me) ? r(ce) ? "visible" : "hidden" : "visible"
708
- })
709
- }, Et({ _: 2 }, [
710
- l.$slots.menuIcon ? {
711
- name: "menuIcon",
712
- fn: L(({ isOpen: a, color: o }) => [
713
- x(l.$slots, "menuIcon", X(W({ isOpen: a, color: o })), void 0, !0)
714
- ]),
715
- key: "0"
716
- } : void 0,
717
- l.$slots.optionTooltip ? {
718
- name: "optionTooltip",
719
- fn: L(() => [
720
- x(l.$slots, "optionTooltip", {}, void 0, !0)
721
- ]),
722
- key: "1"
723
- } : void 0,
724
- l.$slots.optionPdf ? {
725
- name: "optionPdf",
726
- fn: L(() => [
727
- x(l.$slots, "optionPdf", {}, void 0, !0)
728
- ]),
729
- key: "2"
730
- } : void 0,
731
- l.$slots.optionCsv ? {
732
- name: "optionCsv",
733
- fn: L(() => [
734
- x(l.$slots, "optionCsv", {}, void 0, !0)
735
- ]),
736
- key: "3"
737
- } : void 0,
738
- l.$slots.optionImg ? {
739
- name: "optionImg",
740
- fn: L(() => [
741
- x(l.$slots, "optionImg", {}, void 0, !0)
742
- ]),
743
- key: "4"
744
- } : void 0,
745
- l.$slots.optionTable ? {
746
- name: "optionTable",
747
- fn: L(() => [
748
- x(l.$slots, "optionTable", {}, void 0, !0)
749
- ]),
750
- key: "5"
751
- } : void 0,
752
- l.$slots.optionLabels ? {
753
- name: "optionLabels",
754
- fn: L(() => [
755
- x(l.$slots, "optionLabels", {}, void 0, !0)
756
- ]),
757
- key: "6"
758
- } : void 0,
759
- l.$slots.optionFullscreen ? {
760
- name: "optionFullscreen",
761
- fn: L(({ toggleFullscreen: a, isFullscreen: o }) => [
762
- x(l.$slots, "optionFullscreen", X(W({ toggleFullscreen: a, isFullscreen: o })), void 0, !0)
763
- ]),
764
- key: "7"
765
- } : void 0,
766
- l.$slots.optionAnnotator ? {
767
- name: "optionAnnotator",
768
- fn: L(({ toggleAnnotator: a, isAnnotator: o }) => [
769
- x(l.$slots, "optionAnnotator", X(W({ toggleAnnotator: a, isAnnotator: o })), void 0, !0)
770
- ]),
771
- key: "8"
772
- } : void 0
773
- ]), 1032, ["backgroundColor", "color", "isPrinting", "isImaging", "uid", "hasTooltip", "hasPdf", "hasXls", "hasImg", "hasTable", "hasLabel", "hasFullscreen", "isFullscreen", "isTooltip", "titles", "chartElement", "position", "hasAnnotator", "isAnnotation", "callbacks", "printScale", "onGeneratePdf", "onGenerateImage", "style"])) : m("", !0),
774
- Q.value ? (n(), i("svg", {
775
- key: 4,
776
- ref_key: "svgRef",
777
- ref: Ee,
778
- xmlns: r(qt),
779
- class: R({
780
- "vue-data-ui-fullscreen--on": G.value,
781
- "vue-data-ui-fulscreen--off": !G.value
782
- }),
783
- viewBox: `0 0 ${f.value.width <= 0 ? 1e-3 : f.value.width} ${f.value.height < 0 ? 1e-3 : f.value.height}`,
784
- style: ue(`max-width:100%; overflow: visible; background:transparent;color:${e.value.style.chart.color};${Re.value.css}`)
785
- }, [
786
- nt(r(gt)),
787
- l.$slots["chart-background"] ? (n(), i("foreignObject", {
788
- key: 0,
789
- x: 0,
790
- y: 0,
791
- width: f.value.width <= 0 ? 1e-3 : f.value.width,
792
- height: f.value.height < 0 ? 1e-3 : f.value.height,
793
- style: {
794
- pointerEvents: "none"
795
- }
796
- }, [
797
- x(l.$slots, "chart-background", {}, void 0, !0)
798
- ], 8, dl)) : m("", !0),
799
- g("defs", null, [
800
- (n(!0), i(T, null, O(Ke.value, (a, o) => (n(), i("radialGradient", {
801
- id: `radial_${y.value}_${o}`
802
- }, [
803
- s[5] || (s[5] = g("stop", {
804
- offset: "0%",
805
- "stop-color": "#FFFFFF",
806
- "stop-opacity": "0"
807
- }, null, -1)),
808
- g("stop", {
809
- offset: `${(1 - Z.value / Je.value[o]) * 100}%`,
810
- "stop-color": r(Ht)("#FFFFFF", 0),
811
- "stop-opacity": "0"
812
- }, null, 8, vl),
813
- g("stop", {
814
- offset: `${(1 - Z.value / Je.value[o] / 2) * 100}%`,
815
- "stop-color": "#FFFFFF",
816
- "stop-opacity": e.value.style.chart.gradientIntensity / 100
817
- }, null, 8, hl),
818
- s[6] || (s[6] = g("stop", {
819
- offset: "100%",
820
- "stop-color": "#FFFFFF",
821
- "stop-opacity": "0"
822
- }, null, -1))
823
- ], 8, cl))), 256))
824
- ]),
825
- g("defs", null, [
826
- g("filter", {
827
- id: `blur_${y.value}`,
828
- x: "-50%",
829
- y: "-50%",
830
- width: "200%",
831
- height: "200%"
832
- }, [
833
- g("feGaussianBlur", {
834
- in: "SourceGraphic",
835
- stdDeviation: 2,
836
- id: `blur_std_${y.value}`
837
- }, null, 8, pl),
838
- s[7] || (s[7] = g("feColorMatrix", {
839
- type: "saturate",
840
- values: "0"
841
- }, null, -1))
842
- ], 8, fl),
843
- g("filter", {
844
- id: `shadow_${y.value}`,
845
- "color-interpolation-filters": "sRGB"
846
- }, [
847
- g("feDropShadow", {
848
- dx: "0",
849
- dy: "0",
850
- stdDeviation: "10",
851
- "flood-opacity": "0.5",
852
- "flood-color": e.value.style.chart.layout.donut.shadowColor
853
- }, null, 8, bl)
854
- ], 8, yl)
855
- ]),
856
- (n(!0), i(T, null, O(j.value, (a, o) => (n(), i("g", null, [
857
- a.hasData ? (n(!0), i(T, { key: 0 }, O(a.donut.filter((t) => !t.ghost), (t, u) => (n(), i("g", null, [
858
- g("path", {
859
- class: "vue-ui-donut-arc-path",
860
- d: t.arcSlice,
861
- fill: t.color,
862
- stroke: e.value.style.chart.backgroundColor,
863
- "stroke-width": e.value.style.chart.layout.donut.borderWidth,
864
- filter: Ze(t, u)
865
- }, null, 8, gl)
866
- ]))), 256)) : (n(!0), i(T, { key: 1 }, O(a.skeleton, (t, u) => (n(), i("g", null, [
867
- g("path", {
868
- class: "vue-ui-donut-arc-path",
869
- d: t.arcSlice,
870
- fill: t.color,
871
- stroke: e.value.style.chart.backgroundColor,
872
- "stroke-width": e.value.style.chart.layout.donut.borderWidth
873
- }, null, 8, ml)
874
- ]))), 256))
875
- ]))), 256)),
876
- e.value.style.chart.useGradient ? (n(), i("g", wl, [
877
- (n(!0), i(T, null, O(Ke.value, (a, o) => (n(), i("g", null, [
878
- g("path", {
879
- d: a.donut.arcSlice,
880
- fill: `url(#radial_${y.value}_${o})`,
881
- stroke: "transparent",
882
- "stroke-width": "0"
883
- }, null, 8, kl)
884
- ]))), 256))
885
- ])) : m("", !0),
886
- e.value.style.chart.layout.labels.dataLabels.showDonutName ? (n(), i("g", $l, [
887
- (n(!0), i(T, null, O(j.value, (a, o) => (n(), i("g", null, [
888
- (n(!0), i(T, null, O(a.donut, (t, u) => (n(), i("g", null, [
889
- u === 0 && f.value.width && f.value.height ? (n(), i("text", {
890
- key: 0,
891
- class: R({ animated: e.value.useCssAnimation }),
892
- x: f.value.width / 2,
893
- y: t.startY - e.value.style.chart.layout.labels.dataLabels.fontSize + e.value.style.chart.layout.labels.dataLabels.donutNameOffsetY,
894
- "text-anchor": "middle",
895
- "font-size": e.value.style.chart.layout.labels.dataLabels.fontSize,
896
- "font-weight": e.value.style.chart.layout.labels.dataLabels.boldDonutName ? "bold" : "normal",
897
- fill: e.value.style.chart.layout.labels.dataLabels.color
898
- }, I(e.value.style.chart.layout.labels.dataLabels.donutNameAbbreviation ? r(Jt)({
899
- source: a.name,
900
- length: e.value.style.chart.layout.labels.dataLabels.donutNameMaxAbbreviationSize
901
- }) : a.name), 11, Ll)) : m("", !0)
902
- ]))), 256))
903
- ]))), 256))
904
- ])) : m("", !0),
905
- e.value.style.chart.layout.labels.dataLabels.show ? (n(), i("g", xl, [
906
- (n(!0), i(T, null, O(j.value, (a, o) => (n(), i("g", null, [
907
- (n(!0), i(T, null, O(a.donut.filter((t) => !t.ghost), (t, u) => (n(), i("g", {
908
- filter: Ze(t, u)
909
- }, [
910
- rt(g("text", {
911
- class: R({ animated: e.value.useCssAnimation }),
912
- opacity: pe(t) ? 1 : 0,
913
- "text-anchor": r(H)(t, !0).anchor,
914
- x: r(H)(
915
- t,
916
- !1,
917
- e.value.style.chart.layout.labels.dataLabels.offsetX
918
- ).x || 0,
919
- y: r(Te)(
920
- t,
921
- e.value.style.chart.layout.labels.dataLabels.offsetY,
922
- e.value.style.chart.layout.labels.dataLabels.offsetY
923
- ),
924
- fill: e.value.style.chart.layout.labels.dataLabels.useSerieColor ? t.color : e.value.style.chart.layout.labels.dataLabels.color,
925
- "font-size": e.value.style.chart.layout.labels.dataLabels.fontSize,
926
- "font-weight": e.value.style.chart.layout.labels.dataLabels.boldPercentage ? "bold" : "normal"
927
- }, I(r(F)({
928
- v: t.proportion * 100,
929
- s: "%",
930
- r: e.value.style.chart.layout.labels.dataLabels.roundingPercentage
931
- })), 11, _l), [
932
- [
933
- it,
934
- k.value.dataLabels.show && e.value.style.chart.layout.labels.dataLabels.showPercentage
935
- ]
936
- ]),
937
- rt(g("text", {
938
- class: R({ animated: e.value.useCssAnimation }),
939
- opacity: pe(t) ? 1 : 0,
940
- "text-anchor": r(H)(t, !0).anchor,
941
- x: r(H)(
942
- t,
943
- !1,
944
- e.value.style.chart.layout.labels.dataLabels.offsetX
945
- ).x || 0,
946
- y: r(Te)(
947
- t,
948
- e.value.style.chart.layout.labels.dataLabels.offsetY,
949
- e.value.style.chart.layout.labels.dataLabels.offsetY
950
- ) + e.value.style.chart.layout.labels.dataLabels.fontSize,
951
- fill: e.value.style.chart.layout.labels.dataLabels.useSerieColor ? t.color : e.value.style.chart.layout.labels.dataLabels.color,
952
- "font-size": e.value.style.chart.layout.labels.dataLabels.fontSize,
953
- "font-weight": e.value.style.chart.layout.labels.dataLabels.boldValue ? "bold" : "normal"
954
- }, " (" + I(r(K)(
955
- e.value.style.chart.layout.labels.dataLabels.formatter,
956
- t.value,
957
- r(F)({
958
- p: e.value.style.chart.layout.labels.dataLabels.prefix,
959
- v: t.value,
960
- s: e.value.style.chart.layout.labels.dataLabels.suffix,
961
- r: e.value.style.chart.layout.labels.dataLabels.roundingValue
962
- }),
963
- { datapoint: t, seriesIndex: o, datapointIndex: u }
964
- )) + ") ", 11, Tl), [
965
- [
966
- it,
967
- k.value.dataLabels.show && e.value.style.chart.layout.labels.dataLabels.showPercentage && e.value.style.chart.layout.labels.dataLabels.showValue
968
- ]
969
- ]),
970
- pe(t) && k.value.dataLabels.show && !e.value.style.chart.layout.labels.dataLabels.showPercentage && e.value.style.chart.layout.labels.dataLabels.showValue ? (n(), i("text", {
971
- key: 0,
972
- class: R({ animated: e.value.useCssAnimation }),
973
- "text-anchor": r(H)(t, !0).anchor,
974
- x: r(H)(
975
- t,
976
- !1,
977
- e.value.style.chart.layout.labels.dataLabels.offsetX
978
- ).x || 0,
979
- y: r(Te)(
980
- t,
981
- e.value.style.chart.layout.labels.dataLabels.offsetY,
982
- e.value.style.chart.layout.labels.dataLabels.offsetY
983
- ),
984
- fill: e.value.style.chart.layout.labels.dataLabels.useSerieColor ? t.color : e.value.style.chart.layout.labels.dataLabels.color,
985
- "font-size": e.value.style.chart.layout.labels.dataLabels.fontSize,
986
- "font-weight": e.value.style.chart.layout.labels.dataLabels.boldValue ? "bold" : "normal"
987
- }, I(r(K)(
988
- e.value.style.chart.layout.labels.dataLabels.formatter,
989
- t.value,
990
- r(F)({
991
- p: e.value.style.chart.layout.labels.dataLabels.prefix,
992
- v: t.value,
993
- s: e.value.style.chart.layout.labels.dataLabels.suffix,
994
- r: e.value.style.chart.layout.labels.dataLabels.roundingValue
995
- }),
996
- { datapoint: t, seriesIndex: o, datapointIndex: u }
997
- )), 11, Ol)) : m("", !0)
998
- ], 8, Cl))), 256))
999
- ]))), 256))
1000
- ])) : m("", !0),
1001
- (n(!0), i(T, null, O(j.value, (a, o) => (n(), i("g", null, [
1002
- (n(!0), i(T, null, O(a.donut, (t, u) => (n(), i("g", null, [
1003
- g("path", {
1004
- d: t.arcSlice,
1005
- fill: xt.value === o ? "rgba(0,0,0,0.1)" : "transparent",
1006
- onMouseenter: (c) => Nt({
1007
- datapoint: t,
1008
- seriesIndex: t.seriesIndex
1009
- }),
1010
- onClick: (c) => Ot({ datapoint: t, index: u }),
1011
- onMouseleave: s[0] || (s[0] = (c) => {
1012
- re.value = !1, Qe.value = null, ee.value = null, te.value = null;
1013
- })
1014
- }, null, 40, Fl)
1015
- ]))), 256))
1016
- ]))), 256)),
1017
- x(l.$slots, "svg", { svg: f.value }, void 0, !0)
1018
- ], 14, il)) : m("", !0),
1019
- l.$slots.watermark ? (n(), i("div", Nl, [
1020
- x(l.$slots, "watermark", X(W({ isPrinting: r(Be) || r(Ge) })), void 0, !0)
1021
- ])) : m("", !0),
1022
- Q.value ? m("", !0) : (n(), B(r(wt), {
1023
- key: 6,
1024
- config: {
1025
- type: "donut",
1026
- style: {
1027
- backgroundColor: e.value.style.chart.backgroundColor,
1028
- donut: {
1029
- color: "#CCCCCC"
1030
- }
1031
- }
1032
- }
1033
- }, null, 8, ["config"])),
1034
- nt(r(kt), {
1035
- show: k.value.showTooltip && re.value,
1036
- backgroundColor: e.value.style.chart.tooltip.backgroundColor,
1037
- color: e.value.style.chart.tooltip.color,
1038
- borderRadius: e.value.style.chart.tooltip.borderRadius,
1039
- borderColor: e.value.style.chart.tooltip.borderColor,
1040
- borderWidth: e.value.style.chart.tooltip.borderWidth,
1041
- fontSize: e.value.style.chart.tooltip.fontSize,
1042
- backgroundOpacity: e.value.style.chart.tooltip.backgroundOpacity,
1043
- position: e.value.style.chart.tooltip.position,
1044
- offsetY: e.value.style.chart.tooltip.offsetY,
1045
- parent: z.value,
1046
- content: ie.value,
1047
- isFullscreen: G.value,
1048
- isCustom: r(dt)(e.value.style.chart.tooltip.customFormat)
1049
- }, {
1050
- "tooltip-before": L(() => [
1051
- x(l.$slots, "tooltip-before", X(W({ ...fe.value })), void 0, !0)
1052
- ]),
1053
- "tooltip-after": L(() => [
1054
- x(l.$slots, "tooltip-after", X(W({ ...fe.value })), void 0, !0)
1055
- ]),
1056
- _: 3
1057
- }, 8, ["show", "backgroundColor", "color", "borderRadius", "borderColor", "borderWidth", "fontSize", "backgroundOpacity", "position", "offsetY", "parent", "content", "isFullscreen", "isCustom"]),
1058
- e.value.style.chart.legend.show ? (n(), i("div", {
1059
- key: 7,
1060
- ref_key: "chartLegend",
1061
- ref: de,
1062
- class: R({ "vue-ui-nested-donuts-legend": ye.value.length > 1 })
1063
- }, [
1064
- (n(!0), i(T, null, O(ye.value, (a, o) => (n(), B(sl, {
1065
- key: `legend_${o}_${Pe.value}`,
1066
- legendSet: a,
1067
- config: St.value,
1068
- onClickMarker: s[1] || (s[1] = ({ legend: t }) => he(t))
1069
- }, {
1070
- legendTitle: L(({ titleSet: t }) => [
1071
- t[0] && t[0].arcOf ? (n(), i("div", Sl, I(t[0].arcOf), 1)) : m("", !0)
1072
- ]),
1073
- item: L(({ legend: t, index: u }) => [
1074
- g("div", {
1075
- onClick: (c) => he(t),
1076
- style: ue(`opacity:${w.value.includes(t.id) ? 0.5 : 1}`)
1077
- }, [
1078
- ne(I(t.name) + ": " + I(r(K)(
1079
- e.value.style.chart.layout.labels.dataLabels.formatter,
1080
- t.value,
1081
- r(F)({
1082
- p: e.value.style.chart.layout.labels.dataLabels.prefix,
1083
- v: t.value,
1084
- s: e.value.style.chart.layout.labels.dataLabels.suffix,
1085
- r: e.value.style.chart.legend.roundingValue
1086
- }),
1087
- { datapoint: t, seriesIndex: u }
1088
- )) + " ", 1),
1089
- w.value.includes(t.id) ? (n(), i(T, { key: 1 }, [
1090
- ne(" ( - % ) ")
1091
- ], 64)) : (n(), i(T, { key: 0 }, [
1092
- ne(" (" + I(isNaN(t.value / t.total) ? "-" : r(F)({
1093
- v: t.value / t.total * 100,
1094
- s: "%",
1095
- r: e.value.style.chart.legend.roundingPercentage
1096
- })) + ") ", 1)
1097
- ], 64))
1098
- ], 12, Al)
1099
- ]),
1100
- _: 2
1101
- }, 1032, ["legendSet", "config"]))), 128))
1102
- ], 2)) : m("", !0),
1103
- e.value.style.chart.legend.show ? m("", !0) : (n(), i("div", {
1104
- key: 8,
1105
- ref_key: "chartLegend",
1106
- ref: de
1107
- }, [
1108
- x(l.$slots, "legend", { legend: ye.value }, void 0, !0)
1109
- ], 512)),
1110
- l.$slots.source ? (n(), i("div", {
1111
- key: 9,
1112
- ref_key: "source",
1113
- ref: Se,
1114
- dir: "auto"
1115
- }, [
1116
- x(l.$slots, "source", {}, void 0, !0)
1117
- ], 512)) : m("", !0),
1118
- Q.value ? (n(), B(r(yt), {
1119
- key: 10,
1120
- hideDetails: "",
1121
- config: {
1122
- open: k.value.showTable,
1123
- maxHeight: 1e4,
1124
- body: {
1125
- backgroundColor: e.value.style.chart.backgroundColor,
1126
- color: e.value.style.chart.color
1127
- },
1128
- head: {
1129
- backgroundColor: e.value.style.chart.backgroundColor,
1130
- color: e.value.style.chart.color
1131
- }
1132
- }
1133
- }, {
1134
- content: L(() => [
1135
- (n(), B(r(bt), {
1136
- key: `table_${Ve.value}`,
1137
- colNames: le.value.colNames,
1138
- head: le.value.head,
1139
- body: le.value.body,
1140
- config: le.value.config,
1141
- title: `${e.value.style.chart.title.text}${e.value.style.chart.title.subtitle.text ? ` : ${e.value.style.chart.title.subtitle.text}` : ""}`,
1142
- onClose: s[2] || (s[2] = (a) => k.value.showTable = !1)
1143
- }, {
1144
- th: L(({ th: a }) => [
1145
- g("div", {
1146
- innerHTML: a,
1147
- style: { display: "flex", "align-items": "center" }
1148
- }, null, 8, Il)
1149
- ]),
1150
- td: L(({ td: a }) => [
1151
- ne(I(a.name || a), 1)
1152
- ]),
1153
- _: 1
1154
- }, 8, ["colNames", "head", "body", "config", "title"]))
1155
- ]),
1156
- _: 1
1157
- }, 8, ["config"])) : m("", !0)
1158
- ], 46, rl));
1159
- }
1160
- }, Wl = /* @__PURE__ */ nl(Vl, [["__scopeId", "data-v-6a801edc"]]);
1161
- export {
1162
- Wl as default
1163
- };