vue-data-ui 2.17.1 → 2.17.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 (91) hide show
  1. package/dist/{Arrow-BDCVJzQB.js → Arrow-BTMGMUmx.js} +1 -1
  2. package/dist/{BaseDraggableDialog-BvuWrldK.js → BaseDraggableDialog-BfOocRr8.js} +2 -2
  3. package/dist/{BaseIcon-D9Tz8ARD.js → BaseIcon-BbMobh7K.js} +1 -1
  4. package/dist/{ColorPicker-wGf46G2G.js → ColorPicker-B6Sp3c4c.js} +2 -2
  5. package/dist/{DataTable-Dt-TIOyY.js → DataTable-DYfj8fkI.js} +2 -2
  6. package/dist/{Legend-3LNqqLDg.js → Legend-CBtdQB1X.js} +11 -11
  7. package/dist/{NonSvgPenAndPaper-iDdMuUEo.js → NonSvgPenAndPaper-CSVs2_us.js} +3 -3
  8. package/dist/{PackageVersion-C-4Ee8BQ.js → PackageVersion-CyCZzZoq.js} +1 -1
  9. package/dist/{PenAndPaper-Cde-wJ3N.js → PenAndPaper-CQsBADPj.js} +3 -3
  10. package/dist/{Shape-C75836Jl.js → Shape-CcUotAzd.js} +1 -1
  11. package/dist/{Slicer-CpSu7plp.js → Slicer-e6Fu4bdw.js} +2 -2
  12. package/dist/{SparkTooltip-B_GXa2tb.js → SparkTooltip-mAzbe6tU.js} +1 -1
  13. package/dist/{Title-DpERl1yr.js → Title-3wMCFSf0.js} +1 -1
  14. package/dist/{Tooltip-DA0bYKFG.js → Tooltip-BGmS4aac.js} +1 -1
  15. package/dist/{UserOptions-DTEJ3UM_.js → UserOptions-1nAEZymQ.js} +2 -2
  16. package/dist/{dom-to-png-DWDGYXFL.js → dom-to-png-hx6tOenl.js} +1 -1
  17. package/dist/img-mWN3Fgb9.js +33 -0
  18. package/dist/{index-CobsZUkv.js → index-Bud6SV_P.js} +1 -1
  19. package/dist/{pdf-DWZ8IB56.js → pdf-DOTqaRqF.js} +1 -1
  20. package/dist/style.css +1 -1
  21. package/dist/types/vue-data-ui.d.cts +2 -0
  22. package/dist/types/vue-data-ui.d.ts +2 -0
  23. package/dist/{useNestedProp-BwL5wmVa.js → useNestedProp-7mwoL9cx.js} +1 -1
  24. package/dist/{usePrinter-DPh6U_Qk.js → usePrinter-DGmosLLF.js} +2 -2
  25. package/dist/{vue-data-ui-D7ZgRDQ_.js → vue-data-ui-9W5DQCGc.js} +99 -97
  26. package/dist/vue-data-ui.js +1 -1
  27. package/dist/{vue-ui-3d-bar-ORUAjkg7.js → vue-ui-3d-bar-D2EiM2vA.js} +7 -7
  28. package/dist/{vue-ui-accordion-UewqY6OI.js → vue-ui-accordion-CREcMROd.js} +3 -3
  29. package/dist/{vue-ui-age-pyramid-Yl4aRpNc.js → vue-ui-age-pyramid-BgNDdlvJ.js} +7 -7
  30. package/dist/{vue-ui-annotator-B1gqiBqq.js → vue-ui-annotator-Bf-UZvL2.js} +2 -2
  31. package/dist/{vue-ui-bullet-C307lCPt.js → vue-ui-bullet-DrlFRN2W.js} +8 -8
  32. package/dist/{vue-ui-candlestick-BE6PcEdh.js → vue-ui-candlestick-yyNh8ETw.js} +11 -10
  33. package/dist/{vue-ui-carousel-table-Cpvjr677.js → vue-ui-carousel-table-nY-jD1BN.js} +4 -4
  34. package/dist/{vue-ui-chestnut-CUw74AgC.js → vue-ui-chestnut-Db3kvToE.js} +7 -7
  35. package/dist/{vue-ui-chord-CCPGeAiY.js → vue-ui-chord-BNnz8DTC.js} +10 -10
  36. package/dist/{vue-ui-circle-pack-dfyPiQmy.js → vue-ui-circle-pack-FXniwYZQ.js} +9 -9
  37. package/dist/{vue-ui-cursor-C2zmfeoD.js → vue-ui-cursor-6im5R6b0.js} +2 -2
  38. package/dist/{vue-ui-dashboard-CotAqRbX.js → vue-ui-dashboard-CH8nQvpD.js} +62 -62
  39. package/dist/{vue-ui-digits-7qJFCuoI.js → vue-ui-digits-CVsoGBpZ.js} +2 -2
  40. package/dist/vue-ui-donut-5mX7woMC.js +1338 -0
  41. package/dist/{vue-ui-donut-evolution-Deg0dsYg.js → vue-ui-donut-evolution-WDlLM5ey.js} +9 -9
  42. package/dist/{vue-ui-dumbbell-DDwNoTPG.js → vue-ui-dumbbell-_rOVgpSm.js} +8 -8
  43. package/dist/{vue-ui-flow-6oR7IMyi.js → vue-ui-flow-CjQLBaxO.js} +8 -8
  44. package/dist/{vue-ui-funnel-BnXtOJmh.js → vue-ui-funnel-Ctfl6t-d.js} +8 -8
  45. package/dist/{vue-ui-galaxy-75XC8SpV.js → vue-ui-galaxy-CwMIu0XG.js} +6 -6
  46. package/dist/{vue-ui-gauge-w31j915C.js → vue-ui-gauge-CKje44TR.js} +7 -7
  47. package/dist/{vue-ui-gizmo-bZqk6oZS.js → vue-ui-gizmo-DH_i2OoP.js} +3 -3
  48. package/dist/{vue-ui-heatmap-BfU62tMW.js → vue-ui-heatmap-K8cbz1Qo.js} +9 -9
  49. package/dist/{vue-ui-history-plot-CFfco-Yj.js → vue-ui-history-plot-CVZvE8MM.js} +8 -8
  50. package/dist/{vue-ui-kpi-DaJ1U3wf.js → vue-ui-kpi--BrljU7w.js} +3 -3
  51. package/dist/{vue-ui-mini-loader-CF_2jAI8.js → vue-ui-mini-loader-GPkQ5n6A.js} +2 -2
  52. package/dist/{vue-ui-molecule-Tdk3Gd8M.js → vue-ui-molecule-CnPTygcA.js} +7 -7
  53. package/dist/{vue-ui-mood-radar-Dg5wS7W5.js → vue-ui-mood-radar-C5rAOr4e.js} +8 -8
  54. package/dist/{vue-ui-nested-donuts-CpRe0sQB.js → vue-ui-nested-donuts-G-EAN1VI.js} +489 -475
  55. package/dist/{vue-ui-onion-B8o4ft2v.js → vue-ui-onion-DQgLhK1j.js} +8 -8
  56. package/dist/{vue-ui-parallel-coordinate-plot-zW-CNqWC.js → vue-ui-parallel-coordinate-plot-CJ7Egdb8.js} +9 -9
  57. package/dist/{vue-ui-quadrant-DiRtZ16w.js → vue-ui-quadrant-Du7l3Qfl.js} +9 -9
  58. package/dist/{vue-ui-quick-chart-BRlYC_yT.js → vue-ui-quick-chart-CIMSQcAN.js} +7 -7
  59. package/dist/{vue-ui-radar-DKgX1Ibx.js → vue-ui-radar-BhntWG08.js} +8 -8
  60. package/dist/{vue-ui-rating-DlklKr-X.js → vue-ui-rating-B8PD_1QG.js} +2 -2
  61. package/dist/{vue-ui-relation-circle-MHiAp8dC.js → vue-ui-relation-circle-JJUMoh93.js} +10 -10
  62. package/dist/{vue-ui-ridgeline-DA8verAe.js → vue-ui-ridgeline-CHr061YJ.js} +9 -9
  63. package/dist/{vue-ui-rings-Dh6lFqun.js → vue-ui-rings-6ogAiLq8.js} +9 -9
  64. package/dist/{vue-ui-scatter-CLC5sTOi.js → vue-ui-scatter-Vwpdrx8E.js} +9 -9
  65. package/dist/{vue-ui-skeleton-8s4xts8z.js → vue-ui-skeleton-DbpwcguY.js} +3 -3
  66. package/dist/{vue-ui-smiley-utuzw8uI.js → vue-ui-smiley-ue-S88dP.js} +2 -2
  67. package/dist/{vue-ui-spark-trend-BODEqGRr.js → vue-ui-spark-trend-BX58GxY4.js} +3 -3
  68. package/dist/{vue-ui-sparkbar-B8MB-kn9.js → vue-ui-sparkbar-DgLauN3j.js} +3 -3
  69. package/dist/{vue-ui-sparkgauge-CuD7kTS3.js → vue-ui-sparkgauge-lNM2_XP0.js} +3 -3
  70. package/dist/{vue-ui-sparkhistogram-BYJszvna.js → vue-ui-sparkhistogram-DcoRlAwz.js} +4 -4
  71. package/dist/{vue-ui-sparkline-D77GyWzG.js → vue-ui-sparkline-XnwKSODH.js} +3 -3
  72. package/dist/{vue-ui-sparkstackbar-DNb1yD64.js → vue-ui-sparkstackbar-BsXj8yRw.js} +3 -3
  73. package/dist/{vue-ui-stackbar-C6rjCYDD.js → vue-ui-stackbar-tmA7OHzt.js} +9 -9
  74. package/dist/{vue-ui-strip-plot-B6cYojHQ.js → vue-ui-strip-plot-CP782XAw.js} +8 -8
  75. package/dist/{vue-ui-table-IC7SmWVd.js → vue-ui-table-Bz8mGR24.js} +3 -3
  76. package/dist/{vue-ui-table-heatmap-DHFpJMpA.js → vue-ui-table-heatmap-JSYK1pzV.js} +5 -5
  77. package/dist/{vue-ui-table-sparkline-D7wz-sCj.js → vue-ui-table-sparkline-D0PNuB9g.js} +4 -4
  78. package/dist/{vue-ui-thermometer-D-oiVT3n.js → vue-ui-thermometer-CBLKUjmw.js} +10 -10
  79. package/dist/{vue-ui-timer-C9jVyX5l.js → vue-ui-timer-4Tgx4Y1w.js} +5 -5
  80. package/dist/{vue-ui-tiremarks-B1bM9Aoo.js → vue-ui-tiremarks-Bok1XREk.js} +28 -28
  81. package/dist/{vue-ui-treemap-DX48YlU5.js → vue-ui-treemap-BfaPUVmV.js} +9 -9
  82. package/dist/{vue-ui-vertical-bar-6SjKPQWR.js → vue-ui-vertical-bar-BgnuKeI6.js} +178 -178
  83. package/dist/{vue-ui-waffle-CYao9MMw.js → vue-ui-waffle-C_BRBzJp.js} +9 -9
  84. package/dist/{vue-ui-wheel-USuDhMwW.js → vue-ui-wheel--VQdXoUV.js} +7 -7
  85. package/dist/{vue-ui-word-cloud-TOBTs7yF.js → vue-ui-word-cloud-DyFYiwnG.js} +8 -8
  86. package/dist/{vue-ui-world-C2qikqBa.js → vue-ui-world-B6NQJW84.js} +7 -7
  87. package/dist/{vue-ui-xy-DxwgKoO-.js → vue-ui-xy-B9YlxDqu.js} +18 -18
  88. package/dist/{vue-ui-xy-canvas-N69OpVn8.js → vue-ui-xy-canvas-Dz2tu3dk.js} +9 -9
  89. package/package.json +1 -1
  90. package/dist/img-utitT2Gd.js +0 -27
  91. package/dist/vue-ui-donut-D41WeqQU.js +0 -1325
@@ -1,1325 +0,0 @@
1
- import { defineAsyncComponent as Z, useSlots as It, computed as y, shallowRef as E, ref as $, onMounted as lt, onBeforeUnmount as Xt, watch as at, createElementBlock as n, openBlock as u, normalizeStyle as b, normalizeClass as _e, createBlock as ee, createCommentVNode as i, renderSlot as m, createElementVNode as f, createVNode as $e, unref as r, createSlots as ot, withCtx as C, normalizeProps as ue, guardReactiveProps as se, Fragment as g, renderList as A, mergeProps as ut, toDisplayString as T, createTextVNode as Vt, nextTick as Dt } from "vue";
2
- import { u as Bt, o as Gt, e as st, g as Rt, c as Wt, b as Et, v as Ut, d as nt, p as te, m as rt, $ as jt, f as M, X as Ht, s as fe, w as qt, j as Jt, N as L, i as V, k as ve, n as w, t as Kt, a as Qt, q as Zt, r as el, x as tl, T as it } from "./index-CobsZUkv.js";
3
- import { t as ll, u as al } from "./useResponsive-DfdjqQps.js";
4
- import { u as vt } from "./useNestedProp-BwL5wmVa.js";
5
- import { u as ol } from "./usePrinter-DPh6U_Qk.js";
6
- import { u as ul } from "./useUserOptionState-BIvW1Kz7.js";
7
- import { u as sl } from "./useChartAccessibility-9icAAmYg.js";
8
- import nl from "./Legend-3LNqqLDg.js";
9
- import rl from "./Title-DpERl1yr.js";
10
- import { _ as il } from "./Shape-C75836Jl.js";
11
- import vl from "./img-utitT2Gd.js";
12
- import { _ as cl } from "./_plugin-vue_export-helper-CHgC5LLL.js";
13
- const dl = ["id"], hl = ["xmlns", "viewBox"], yl = ["width", "height"], fl = { key: 1 }, gl = ["id"], pl = ["stop-color"], ml = ["offset", "stop-color"], bl = ["offset", "stop-color"], wl = ["stop-color"], kl = { key: 2 }, _l = ["id", "cx", "cy"], $l = ["stop-color", "stop-opacity"], xl = ["stop-color"], Cl = ["id"], Pl = ["id"], Tl = ["id"], Al = ["flood-color"], Sl = ["id"], Fl = ["flood-color"], Ll = ["d", "stroke", "filter"], Ol = ["d", "stroke", "filter"], zl = ["cx", "cy", "r", "fill", "filter"], Nl = { key: 6 }, Ml = ["stroke", "d"], Yl = ["d", "fill", "stroke", "stroke-width", "filter"], Il = { key: 0 }, Xl = ["d", "fill", "stroke", "stroke-width", "filter"], Vl = { key: 0 }, Dl = ["stroke", "d"], Bl = { key: 0 }, Gl = ["d", "stroke", "stroke-width", "filter"], Rl = { key: 1 }, Wl = ["d", "fill", "stroke", "stroke-width", "filter"], El = ["d", "fill", "stroke", "stroke-width", "filter"], Ul = { key: 1 }, jl = ["cx", "cy", "r", "fill", "stroke", "stroke-width"], Hl = ["cx", "cy", "r", "fill", "stroke", "stroke-width"], ql = { key: 0 }, Jl = ["d", "fill", "stroke", "stroke-width"], Kl = ["cx", "cy", "r", "stroke"], Ql = ["cx", "cy", "r", "fill"], Zl = { key: 0 }, ea = ["d", "fill", "onMouseenter", "onClick"], ta = { key: 1 }, la = ["cx", "cy", "r"], aa = ["x", "y", "fill", "font-size"], oa = ["x", "y", "fill", "font-size"], ua = ["x", "y", "fill", "font-size"], sa = ["x", "y", "fill", "font-size"], na = ["filter"], ra = { key: 0 }, ia = ["x", "y"], va = { key: 1 }, ca = ["cx", "cy", "fill", "stroke", "filter", "onClick"], da = ["cx", "cy", "fill", "stroke", "filter", "onClick"], ha = ["text-anchor", "x", "y", "fill", "font-size", "onClick"], ya = ["text-anchor", "x", "y", "fill", "font-size", "onClick"], fa = ["text-anchor", "x", "y", "fill", "font-size", "onClick"], ga = ["text-anchor", "x", "y", "fill", "font-size", "onClick"], pa = { key: 2 }, ma = ["x", "y", "width"], ba = ["x", "y", "width"], wa = {
14
- key: 5,
15
- class: "vue-data-ui-watermark"
16
- }, ka = ["onClick"], _a = ["innerHTML"], $a = {
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(xe, { expose: ct, emit: dt }) {
34
- const ht = Z(() => import("./vue-ui-accordion-UewqY6OI.js")), yt = Z(() => import("./DataTable-Dt-TIOyY.js")), ft = Z(() => import("./PackageVersion-C-4Ee8BQ.js")), gt = Z(() => import("./PenAndPaper-Cde-wJ3N.js")), pt = Z(() => import("./vue-ui-skeleton-8s4xts8z.js")), mt = Z(() => import("./Tooltip-DA0bYKFG.js")), bt = Z(() => import("./UserOptions-DTEJ3UM_.js")), { vue_ui_donut: wt } = Bt(), kt = It(), O = xe, ne = y({
35
- get() {
36
- return !!O.dataset && O.dataset.length;
37
- },
38
- set(l) {
39
- return l;
40
- }
41
- }), U = E(null), Ce = E(null), Pe = E(null), j = E(null), le = E(null), Te = E(null), Ae = E(null), Se = $(0), Fe = $(0), Le = $(0);
42
- lt(() => {
43
- Oe();
44
- }), Xt(() => {
45
- j.value && (le.value && j.value.unobserve(le.value), j.value.disconnect());
46
- });
47
- function Oe() {
48
- if (Gt(O.dataset) ? st({
49
- componentName: "VueUiDonut",
50
- type: "dataset"
51
- }) : O.dataset.forEach((l, o) => {
52
- Rt({
53
- datasetObject: l,
54
- requiredAttributes: ["name", "values"]
55
- }).forEach((t) => {
56
- ne.value = !1, st({
57
- componentName: "VueUiDonut",
58
- type: "datasetSerieAttribute",
59
- property: t,
60
- index: o
61
- });
62
- });
63
- }), e.value.responsive) {
64
- const l = ll(() => {
65
- const { width: o, height: t } = al({
66
- chart: U.value,
67
- title: e.value.style.chart.title.text ? Ce.value : null,
68
- legend: e.value.style.chart.legend.show ? Pe.value : null,
69
- source: Te.value,
70
- noTitle: Ae.value,
71
- padding: Ie.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 = $(Wt()), _t = $(null), ce = $(!1), ge = $(""), z = $(null), ze = $(0);
81
- function Ne() {
82
- const l = vt({
83
- userConfig: O.config,
84
- defaultConfig: wt
85
- });
86
- return l.theme ? {
87
- ...vt({
88
- userConfig: Qt.vue_ui_donut[l.theme] || O.config,
89
- defaultConfig: l
90
- }),
91
- customPalette: Kt[l.theme] || te
92
- } : l;
93
- }
94
- const e = y({
95
- get: () => Ne(),
96
- set: (l) => l
97
- }), P = $(!0), B = E([]);
98
- function $t(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(ie) {
107
- const ye = Math.min((ie - W) / o, 1), Yt = it(ye);
108
- B.value[x] = _ * Yt, B.value = [...B.value], ye < 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
- lt(async () => {
116
- const l = O.dataset.map((o) => o.values.reduce((t, a) => t + a, 0));
117
- e.value.startAnimation.show && await $t(
118
- l,
119
- e.value.startAnimation.durationMs,
120
- e.value.startAnimation.staggerMs
121
- ), P.value = !1;
122
- });
123
- const { userOptionsVisible: pe, setUserOptionsVisibility: Me, keepUserOptionState: Ye } = ul({ config: e.value }), { svgRef: me } = sl({ config: e.value.style.chart.title });
124
- function xt() {
125
- Me(!0);
126
- }
127
- function Ct() {
128
- Me(!1);
129
- }
130
- at(() => O.config, (l) => {
131
- e.value = Ne(), pe.value = !e.value.userOptions.showOnChartHover, Oe(), Se.value += 1, Fe.value += 1, Le.value += 1, h.value.dataLabels.show = e.value.style.chart.layout.labels.dataLabels.show, h.value.showTable = e.value.table.show, h.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 Ie = y(() => {
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: Xe, isImaging: Ve, generatePdf: De, generateImage: Be } = ol({
143
- elementId: `donut__${p.value}`,
144
- fileName: e.value.style.chart.title.text || "vue-ui-donut",
145
- options: e.value.userOptions.print
146
- }), Pt = y(() => e.value.userOptions.show && !e.value.style.chart.title.text), Ge = y(() => Et(e.value.customPalette)), h = $({
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 = $({
153
- height: e.value.style.chart.height,
154
- width: e.value.style.chart.width
155
- }), J = y(() => {
156
- const l = e.value.style.chart.layout.donut.strokeWidth / 512, o = Math.min(s.value.width, s.value.height) * l, t = o > k.value ? k.value : o;
157
- return Math.max(t, 3);
158
- }), Re = dt, G = y(() => O.dataset.map((l, o) => ({
159
- name: l.name,
160
- color: nt(l.color) || Ge.value[o] || te[o] || te[o % te.length],
161
- value: Ut(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
- at(() => G.value, (l) => N.value = l);
170
- function Tt() {
171
- return G.value.map((l) => ({
172
- name: l.name,
173
- color: l.color,
174
- value: l.value
175
- }));
176
- }
177
- const D = $([]), K = $(!1);
178
- function We({ from: l, to: o, duration: t, onUpdate: a, onDone: v, easing: d = it }) {
179
- const _ = performance.now();
180
- function x(W) {
181
- const X = Math.min((W - _) / t, 1), ie = d(X), ye = l + (o - l) * ie;
182
- a(ye, X), X < 1 ? requestAnimationFrame(x) : (a(o, 1), v && v());
183
- }
184
- requestAnimationFrame(x);
185
- }
186
- function Ee(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, We({
196
- from: a,
197
- to: v,
198
- duration: e.value.serieToggleAnimation.durationMs,
199
- onUpdate: (x, W) => {
200
- N.value = N.value.map(
201
- (X, ie) => l === ie ? { ...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, We({
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
- Re("selectLegend", R.value.map((v) => ({
235
- name: v.name,
236
- color: v.color,
237
- value: v.value
238
- })));
239
- }
240
- const At = y(() => O.dataset.reduce((l, o) => l + o.values.reduce((t, a) => t + a, 0), 0)), R = y(() => {
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 = At.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
- }), Ue = y(() => O.dataset.map((l, o) => ({
266
- name: l.name,
267
- color: nt(l.color) || Ge.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 / O.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 && Ee(o),
276
- isSegregated: D.value.includes(o)
277
- }))), St = y(() => ({
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
- })), k = y(() => {
285
- const l = Math.min(s.value.width / 3, s.value.height / 3);
286
- return l < 55 ? 55 : l;
287
- }), S = y(() => rt({ series: R.value }, s.value.width / 2, s.value.height / 2, k.value, k.value, 1.99999, 2, 1, 360, 105.25, J.value)), Ft = y(() => Math.abs(R.value.map((l) => l.value).reduce((l, o) => l + o, 0)) > 0), Lt = y(() => rt({
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, k.value, k.value, 1.99999, 2, 1, 360, 105.25, J.value)), Y = y(() => S.value.filter((l) => !l.ghost)), c = y(() => {
300
- const l = Math.max(...R.value.map((t) => t.value)), o = R.value.map((t) => t.value / l);
301
- return jt({
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 / zt(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 zt(l) {
334
- return [...l].map((o) => o.value).reduce((o, t) => o + t, 0);
335
- }
336
- const F = y(() => R.value.map((l) => l.value).reduce((l, o) => l + o, 0)), je = y(() => F.value / R.value.length), He = y(() => (l) => K.value ? l.proportion * 100 : l.value / F.value * 100), we = $(null), re = $(!1);
337
- function qe({ datapoint: l, relativeIndex: o, seriesIndex: t, show: a = !1 }) {
338
- we.value = { datapoint: l, seriesIndex: t, config: e.value, series: G.value }, ce.value = a, z.value = o;
339
- let v = "";
340
- const d = e.value.style.chart.tooltip.customFormat;
341
- if (re.value = !1, tl(d))
342
- try {
343
- const _ = d({
344
- seriesIndex: t,
345
- datapoint: l,
346
- series: G.value,
347
- config: e.value
348
- });
349
- typeof _ == "string" && (ge.value = _, re.value = !0);
350
- } catch {
351
- console.warn("Custom format cannot be applied."), re.value = !1;
352
- }
353
- if (!re.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}"/>${kt.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>`), ge.value = `<div>${v}</div>`;
386
- }
387
- }
388
- function Q(l) {
389
- return e.value.useBlurOnHover && ![null, void 0].includes(z.value) && z.value !== l ? `url(#blur_${p.value})` : "";
390
- }
391
- const H = y(() => {
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 Je(l = null) {
399
- Dt(() => {
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 = Zt(t);
403
- l ? l(a) : el({ csvContent: a, title: e.value.style.chart.title.text || "vue-ui-donut" });
404
- });
405
- }
406
- const de = y(() => {
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 = $(!1);
442
- function Ke(l) {
443
- oe.value = l, ze.value += 1;
444
- }
445
- const Qe = y(() => /^((?!chrome|android).)*safari/i.test(navigator.userAgent));
446
- function Nt(l) {
447
- return l.toFixed(e.value.style.chart.legend.roundingPercentage).split("").map((o) => "-").join("");
448
- }
449
- function q(l, o) {
450
- Re("selectDatapoint", { datapoint: l, index: o });
451
- }
452
- function Ze() {
453
- h.value.showTable = !h.value.showTable;
454
- }
455
- function et() {
456
- h.value.dataLabels.show = !h.value.dataLabels.show;
457
- }
458
- function tt() {
459
- h.value.showTooltip = !h.value.showTooltip;
460
- }
461
- const he = $(!1);
462
- function ke() {
463
- he.value = !he.value;
464
- }
465
- async function Mt({ 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 vl({ 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
- return ct({
478
- getData: Tt,
479
- getImage: Mt,
480
- generatePdf: De,
481
- generateCsv: Je,
482
- generateImage: Be,
483
- toggleTable: Ze,
484
- toggleLabels: et,
485
- toggleTooltip: tt,
486
- toggleAnnotator: ke,
487
- toggleFullscreen: Ke
488
- }), (l, o) => (u(), n("div", {
489
- ref_key: "donutChart",
490
- ref: U,
491
- class: _e(`vue-ui-donut ${oe.value ? "vue-data-ui-wrapper-fullscreen" : ""} ${e.value.useCssAnimation ? "" : "vue-ui-dna"}`),
492
- style: b(`font-family:${e.value.style.fontFamily};width:100%; ${e.value.responsive ? "height:100%;" : ""} text-align:center;background:${e.value.style.chart.backgroundColor}`),
493
- id: `donut__${p.value}`,
494
- onMouseenter: xt,
495
- onMouseleave: Ct
496
- }, [
497
- e.value.userOptions.buttons.annotator && r(me) ? (u(), ee(r(gt), {
498
- key: 0,
499
- color: e.value.style.chart.color,
500
- backgroundColor: e.value.style.chart.backgroundColor,
501
- active: he.value,
502
- svgRef: r(me),
503
- onClose: ke
504
- }, null, 8, ["color", "backgroundColor", "active", "svgRef"])) : i("", !0),
505
- m(l.$slots, "userConfig", {}, void 0, !0),
506
- Pt.value ? (u(), n("div", {
507
- key: 1,
508
- ref_key: "noTitle",
509
- ref: Ae,
510
- class: "vue-data-ui-no-title-space",
511
- style: "height:36px; width: 100%;background:transparent"
512
- }, null, 512)) : i("", !0),
513
- e.value.style.chart.title.text ? (u(), n("div", {
514
- key: 2,
515
- ref_key: "chartTitle",
516
- ref: Ce,
517
- style: "width:100%;background:transparent;padding-bottom:24px"
518
- }, [
519
- (u(), ee(rl, {
520
- key: `title_${Se.value}`,
521
- config: {
522
- title: {
523
- cy: "donut-div-title",
524
- ...e.value.style.chart.title
525
- },
526
- subtitle: {
527
- cy: "donut-div-subtitle",
528
- ...e.value.style.chart.title.subtitle
529
- }
530
- }
531
- }, null, 8, ["config"]))
532
- ], 512)) : i("", !0),
533
- e.value.userOptions.show && ne.value && (r(Ye) || r(pe)) ? (u(), ee(r(bt), {
534
- ref_key: "details",
535
- ref: _t,
536
- key: `user_option_${ze.value}`,
537
- backgroundColor: e.value.style.chart.backgroundColor,
538
- color: e.value.style.chart.color,
539
- isPrinting: r(Xe),
540
- isImaging: r(Ve),
541
- uid: p.value,
542
- hasTooltip: e.value.style.chart.tooltip.show && e.value.userOptions.buttons.tooltip,
543
- hasPdf: e.value.userOptions.buttons.pdf,
544
- hasImg: e.value.userOptions.buttons.img,
545
- hasXls: e.value.userOptions.buttons.csv,
546
- hasTable: e.value.userOptions.buttons.table,
547
- hasLabel: e.value.userOptions.buttons.labels,
548
- hasFullscreen: e.value.userOptions.buttons.fullscreen,
549
- isFullscreen: oe.value,
550
- chartElement: U.value,
551
- position: e.value.userOptions.position,
552
- callbacks: e.value.userOptions.callbacks,
553
- isTooltip: h.value.showTooltip,
554
- titles: { ...e.value.userOptions.buttonTitles },
555
- hasAnnotator: e.value.userOptions.buttons.annotator,
556
- isAnnotation: he.value,
557
- printScale: e.value.userOptions.print.scale,
558
- onToggleFullscreen: Ke,
559
- onGeneratePdf: r(De),
560
- onGenerateCsv: Je,
561
- onGenerateImage: r(Be),
562
- onToggleTable: Ze,
563
- onToggleLabels: et,
564
- onToggleTooltip: tt,
565
- onToggleAnnotator: ke,
566
- style: b({
567
- visibility: r(Ye) ? r(pe) ? "visible" : "hidden" : "visible"
568
- })
569
- }, ot({ _: 2 }, [
570
- l.$slots.menuIcon ? {
571
- name: "menuIcon",
572
- fn: C(({ isOpen: t, color: a }) => [
573
- m(l.$slots, "menuIcon", ue(se({ isOpen: t, color: a })), void 0, !0)
574
- ]),
575
- key: "0"
576
- } : void 0,
577
- l.$slots.optionTooltip ? {
578
- name: "optionTooltip",
579
- fn: C(() => [
580
- m(l.$slots, "optionTooltip", {}, void 0, !0)
581
- ]),
582
- key: "1"
583
- } : void 0,
584
- l.$slots.optionPdf ? {
585
- name: "optionPdf",
586
- fn: C(() => [
587
- m(l.$slots, "optionPdf", {}, void 0, !0)
588
- ]),
589
- key: "2"
590
- } : void 0,
591
- l.$slots.optionCsv ? {
592
- name: "optionCsv",
593
- fn: C(() => [
594
- m(l.$slots, "optionCsv", {}, void 0, !0)
595
- ]),
596
- key: "3"
597
- } : void 0,
598
- l.$slots.optionImg ? {
599
- name: "optionImg",
600
- fn: C(() => [
601
- m(l.$slots, "optionImg", {}, void 0, !0)
602
- ]),
603
- key: "4"
604
- } : void 0,
605
- l.$slots.optionTable ? {
606
- name: "optionTable",
607
- fn: C(() => [
608
- m(l.$slots, "optionTable", {}, void 0, !0)
609
- ]),
610
- key: "5"
611
- } : void 0,
612
- l.$slots.optionLabels ? {
613
- name: "optionLabels",
614
- fn: C(() => [
615
- m(l.$slots, "optionLabels", {}, void 0, !0)
616
- ]),
617
- key: "6"
618
- } : void 0,
619
- l.$slots.optionFullscreen ? {
620
- name: "optionFullscreen",
621
- fn: C(({ toggleFullscreen: t, isFullscreen: a }) => [
622
- m(l.$slots, "optionFullscreen", ue(se({ toggleFullscreen: t, isFullscreen: a })), void 0, !0)
623
- ]),
624
- key: "7"
625
- } : void 0,
626
- l.$slots.optionAnnotator ? {
627
- name: "optionAnnotator",
628
- fn: C(({ toggleAnnotator: t, isAnnotator: a }) => [
629
- m(l.$slots, "optionAnnotator", ue(se({ toggleAnnotator: t, isAnnotator: a })), void 0, !0)
630
- ]),
631
- key: "8"
632
- } : void 0
633
- ]), 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),
634
- ne.value ? (u(), n("svg", {
635
- key: 4,
636
- ref_key: "svgRef",
637
- ref: me,
638
- xmlns: r(Ht),
639
- class: _e({ "vue-data-ui-fullscreen--on": oe.value, "vue-data-ui-fulscreen--off": !oe.value }),
640
- viewBox: `0 0 ${s.value.width <= 0 ? 10 : s.value.width} ${s.value.height <= 0 ? 10 : s.value.height}`,
641
- style: b(`max-width:100%; overflow: visible; background:transparent;color:${e.value.style.chart.color};${Ie.value.css}`)
642
- }, [
643
- $e(r(ft)),
644
- l.$slots["chart-background"] ? (u(), n("foreignObject", {
645
- key: 0,
646
- x: 0,
647
- y: 0,
648
- width: s.value.width <= 0 ? 10 : s.value.width,
649
- height: s.value.height <= 0 ? 10 : s.value.height,
650
- style: {
651
- pointerEvents: "none"
652
- }
653
- }, [
654
- m(l.$slots, "chart-background", {}, void 0, !0)
655
- ], 8, yl)) : i("", !0),
656
- e.value.type === "classic" && !isNaN(J.value / k.value) ? (u(), n("defs", fl, [
657
- e.value.style.chart.useGradient ? (u(), n("radialGradient", {
658
- key: 0,
659
- id: `gradient_${p.value}`
660
- }, [
661
- f("stop", {
662
- offset: "0%",
663
- "stop-color": r(fe)(e.value.style.chart.backgroundColor, 0),
664
- "stop-opacity": "0"
665
- }, null, 8, pl),
666
- f("stop", {
667
- offset: `${(1 - J.value / k.value) * 100}%`,
668
- "stop-color": r(fe)("#FFFFFF", 0),
669
- "stop-opacity": "0"
670
- }, null, 8, ml),
671
- f("stop", {
672
- offset: `${(1 - J.value / k.value / 2) * 100}%`,
673
- "stop-color": r(fe)("#FFFFFF", e.value.style.chart.gradientIntensity)
674
- }, null, 8, bl),
675
- f("stop", {
676
- offset: "100%",
677
- "stop-color": r(fe)(e.value.style.chart.backgroundColor, 0),
678
- "stop-opacity": "0"
679
- }, null, 8, wl)
680
- ], 8, gl)) : i("", !0)
681
- ])) : i("", !0),
682
- e.value.type === "polar" ? (u(), n("defs", kl, [
683
- (u(!0), n(g, null, A(c.value, (t, a) => (u(), n("radialGradient", {
684
- id: `polar_gradient_${a}_${p.value}`,
685
- cx: (isNaN(t.middlePoint.x / s.value.width * 100) ? 0 : t.middlePoint.x / s.value.width * 100) + "%",
686
- cy: (isNaN(t.middlePoint.y / s.value.height * 100) ? 0 : t.middlePoint.y / s.value.height * 100) + "%",
687
- r: "62%"
688
- }, [
689
- f("stop", {
690
- offset: "0%",
691
- "stop-color": r(qt)(S.value[a].color, 0.05),
692
- "stop-opacity": e.value.style.chart.gradientIntensity / 100
693
- }, null, 8, $l),
694
- f("stop", {
695
- offset: "100%",
696
- "stop-color": S.value[a].color
697
- }, null, 8, xl)
698
- ], 8, _l))), 256))
699
- ])) : i("", !0),
700
- f("defs", null, [
701
- f("filter", {
702
- id: `blur_${p.value}`,
703
- x: "-50%",
704
- y: "-50%",
705
- width: "200%",
706
- height: "200%"
707
- }, [
708
- f("feGaussianBlur", {
709
- in: "SourceGraphic",
710
- stdDeviation: 2,
711
- id: `blur_std_${p.value}`
712
- }, null, 8, Pl),
713
- o[6] || (o[6] = f("feColorMatrix", {
714
- type: "saturate",
715
- values: "0"
716
- }, null, -1))
717
- ], 8, Cl),
718
- f("filter", {
719
- id: `shadow_${p.value}`,
720
- "color-interpolation-filters": "sRGB"
721
- }, [
722
- f("feDropShadow", {
723
- dx: "0",
724
- dy: "0",
725
- stdDeviation: "10",
726
- "flood-opacity": "0.5",
727
- "flood-color": e.value.style.chart.layout.donut.shadowColor
728
- }, null, 8, Al)
729
- ], 8, Tl),
730
- f("filter", {
731
- id: `drop_shadow_${p.value}`,
732
- "color-interpolation-filters": "sRGB",
733
- x: "-50%",
734
- y: "-50%",
735
- width: "200%",
736
- height: "200%"
737
- }, [
738
- f("feDropShadow", {
739
- dx: "0",
740
- dy: "0",
741
- stdDeviation: "3",
742
- "flood-opacity": "1",
743
- "flood-color": e.value.style.chart.layout.donut.shadowColor
744
- }, null, 8, Fl)
745
- ], 8, Sl)
746
- ]),
747
- e.value.type === "classic" ? (u(!0), n(g, { key: 3 }, A(S.value.filter((t) => !t.ghost), (t, a) => (u(), n("g", null, [
748
- I(t) && h.value.dataLabels.show ? (u(), n("path", {
749
- key: 0,
750
- d: r(Jt)(t, { x: s.value.width / 2, y: s.value.height / 2 }, 16, 16, !1, !1, J.value, 12, e.value.style.chart.layout.curvedMarkers),
751
- stroke: t.color,
752
- "stroke-width": "1",
753
- "stroke-linecap": "round",
754
- "stroke-linejoin": "round",
755
- fill: "none",
756
- filter: Q(a)
757
- }, null, 8, Ll)) : i("", !0)
758
- ]))), 256)) : i("", !0),
759
- e.value.type === "polar" ? (u(!0), n(g, { key: 4 }, A(S.value.filter((t) => !t.ghost), (t, a) => (u(), n("g", null, [
760
- I(t) && h.value.dataLabels.show ? (u(), n("path", {
761
- key: 0,
762
- 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}`,
763
- stroke: t.color,
764
- "stroke-width": "1",
765
- "stroke-linecap": "round",
766
- "stroke-linejoin": "round",
767
- fill: "none",
768
- filter: Q(a),
769
- style: b({
770
- transition: P.value || !e.value.serieToggleAnimation.show ? "none" : `all ${e.value.serieToggleAnimation.durationMs}ms ease-in-out`
771
- })
772
- }, null, 12, Ol)) : i("", !0)
773
- ]))), 256)) : i("", !0),
774
- e.value.type === "classic" && e.value.style.chart.layout.donut.useShadow ? (u(), n("circle", {
775
- key: 5,
776
- cx: s.value.width / 2,
777
- cy: s.value.height / 2,
778
- r: k.value <= 0 ? 10 : k.value,
779
- fill: e.value.style.chart.backgroundColor,
780
- filter: `url(#shadow_${p.value})`
781
- }, null, 8, zl)) : i("", !0),
782
- l.$slots.pattern ? (u(), n("g", Nl, [
783
- (u(!0), n(g, null, A(xe.dataset, (t, a) => (u(), n("defs", {
784
- key: `pattern-${t.patternIndex}`
785
- }, [
786
- m(l.$slots, "pattern", ut({ ref_for: !0 }, { seriesIndex: a, patternId: `pattern_${p.value}_${a}` }), void 0, !0)
787
- ]))), 128))
788
- ])) : i("", !0),
789
- F.value && e.value.type === "classic" ? (u(), n(g, { key: 7 }, [
790
- (u(!0), n(g, null, A(Y.value, (t, a) => (u(), n("path", {
791
- stroke: e.value.style.chart.backgroundColor,
792
- d: t.arcSlice,
793
- fill: "#FFFFFF"
794
- }, null, 8, Ml))), 256)),
795
- (u(!0), n(g, null, A(Y.value, (t, a) => (u(), n("path", {
796
- class: "vue-ui-donut-arc-path",
797
- d: t.arcSlice,
798
- fill: t.color,
799
- stroke: e.value.style.chart.backgroundColor,
800
- "stroke-width": e.value.style.chart.layout.donut.borderWidth,
801
- filter: Q(a)
802
- }, null, 8, Yl))), 256)),
803
- l.$slots.pattern ? (u(), n("g", Il, [
804
- (u(!0), n(g, null, A(Y.value, (t, a) => (u(), n("path", {
805
- class: "vue-ui-donut-arc-path",
806
- d: t.arcSlice,
807
- fill: `url(#${t.pattern})`,
808
- stroke: e.value.style.chart.backgroundColor,
809
- "stroke-width": e.value.style.chart.layout.donut.borderWidth,
810
- filter: Q(a)
811
- }, null, 8, Xl))), 256))
812
- ])) : i("", !0)
813
- ], 64)) : i("", !0),
814
- F.value && e.value.type === "polar" ? (u(), n(g, { key: 8 }, [
815
- S.value.length > 1 ? (u(), n("g", Vl, [
816
- (u(!0), n(g, null, A(Y.value, (t, a) => (u(), n("path", {
817
- stroke: e.value.style.chart.backgroundColor,
818
- d: c.value[a].path,
819
- fill: "#FFFFFF",
820
- style: b({
821
- transition: P.value || !e.value.serieToggleAnimation.show ? "none" : `all ${e.value.serieToggleAnimation.durationMs}ms ease-in-out`
822
- })
823
- }, null, 12, Dl))), 256)),
824
- e.value.style.chart.layout.donut.useShadow ? (u(), n("g", Bl, [
825
- (u(!0), n(g, null, A(Y.value, (t, a) => (u(), n("path", {
826
- class: "vue-ui-donut-arc-path",
827
- d: c.value[a].path,
828
- fill: "transparent",
829
- stroke: e.value.style.chart.backgroundColor,
830
- "stroke-width": e.value.style.chart.layout.donut.borderWidth,
831
- filter: `url(#drop_shadow_${p.value})`,
832
- style: b({
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
- ])) : i("", !0),
837
- l.$slots.pattern ? (u(), n("g", Rl, [
838
- (u(!0), n(g, null, A(Y.value, (t, a) => (u(), n("path", {
839
- class: "vue-ui-donut-arc-path",
840
- d: c.value[a].path,
841
- fill: `url(#${t.pattern})`,
842
- stroke: e.value.style.chart.backgroundColor,
843
- "stroke-width": e.value.style.chart.layout.donut.borderWidth,
844
- filter: Q(a),
845
- style: b({
846
- transition: P.value || !e.value.serieToggleAnimation.show ? "none" : `all ${e.value.serieToggleAnimation.durationMs}ms ease-in-out`
847
- })
848
- }, null, 12, Wl))), 256))
849
- ])) : i("", !0),
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: e.value.style.chart.useGradient ? `url(#polar_gradient_${a}_${p.value})` : t.color,
854
- stroke: e.value.style.chart.backgroundColor,
855
- "stroke-width": e.value.style.chart.layout.donut.borderWidth,
856
- filter: Q(a),
857
- style: b({
858
- transition: P.value || !e.value.serieToggleAnimation.show ? "none" : `all ${e.value.serieToggleAnimation.durationMs}ms ease-in-out`
859
- })
860
- }, null, 12, El))), 256))
861
- ])) : (u(), n("g", Ul, [
862
- l.$slots.pattern ? (u(), n("circle", {
863
- key: 0,
864
- cx: s.value.width / 2,
865
- cy: s.value.height / 2,
866
- r: k.value,
867
- fill: `url(#pattern_${p.value}_${S.value[0].patternIndex})`,
868
- stroke: e.value.style.chart.backgroundColor,
869
- "stroke-width": e.value.style.chart.layout.donut.borderWidth
870
- }, null, 8, jl)) : i("", !0),
871
- f("circle", {
872
- cx: s.value.width / 2,
873
- cy: s.value.height / 2,
874
- r: k.value,
875
- fill: e.value.style.chart.useGradient ? `url(#polar_gradient_0_${p.value})` : S.value[0].color,
876
- stroke: e.value.style.chart.backgroundColor,
877
- "stroke-width": e.value.style.chart.layout.donut.borderWidth
878
- }, null, 8, Hl)
879
- ]))
880
- ], 64)) : (u(), n(g, { key: 9 }, [
881
- e.value.type === "classic" && !Ft.value ? (u(), n("g", ql, [
882
- (u(!0), n(g, null, A(Lt.value, (t, a) => (u(), n("path", {
883
- class: "vue-ui-donut-arc-path",
884
- d: t.arcSlice,
885
- fill: t.color,
886
- stroke: e.value.style.chart.backgroundColor,
887
- "stroke-width": e.value.style.chart.layout.donut.borderWidth
888
- }, null, 8, Jl))), 256))
889
- ])) : i("", !0),
890
- f("circle", {
891
- cx: s.value.width / 2,
892
- cy: s.value.height / 2,
893
- r: k.value <= 0 ? 10 : k.value,
894
- fill: "transparent",
895
- stroke: e.value.style.chart.backgroundColor
896
- }, null, 8, Kl)
897
- ], 64)),
898
- e.value.style.chart.useGradient && e.value.type === "classic" ? (u(), n("circle", {
899
- key: 10,
900
- cx: s.value.width / 2,
901
- cy: s.value.height / 2,
902
- r: (
903
- /* This might require adjustments */
904
- k.value <= 0 ? 10 : k.value
905
- ),
906
- fill: `url(#gradient_${p.value})`
907
- }, null, 8, Ql)) : i("", !0),
908
- F.value ? (u(), n(g, { key: 11 }, [
909
- S.value.length > 1 || e.value.type === "classic" ? (u(), n("g", Zl, [
910
- (u(!0), n(g, null, A(S.value.filter((t) => !t.ghost), (t, a) => (u(), n("path", {
911
- d: e.value.type === "classic" ? t.arcSlice : c.value[a].path,
912
- fill: z.value === a ? "rgba(0,0,0,0.1)" : "transparent",
913
- onMouseenter: (v) => qe({
914
- datapoint: t,
915
- relativeIndex: a,
916
- seriesIndex: t.seriesIndex,
917
- show: !0
918
- }),
919
- onMouseleave: o[0] || (o[0] = (v) => {
920
- ce.value = !1, z.value = null;
921
- }),
922
- onClick: (v) => q(t, a)
923
- }, null, 40, ea))), 256))
924
- ])) : (u(), n("g", ta, [
925
- f("circle", {
926
- cx: s.value.width / 2,
927
- cy: s.value.height / 2,
928
- r: k.value,
929
- fill: "transparent",
930
- onMouseenter: o[1] || (o[1] = (t) => qe({
931
- datapoint: S.value[0],
932
- relativeIndex: 0,
933
- seriesIndex: S.value[0].seriesIndex,
934
- show: !0
935
- })),
936
- onMouseleave: o[2] || (o[2] = (t) => {
937
- ce.value = !1, z.value = null;
938
- }),
939
- onClick: o[3] || (o[3] = (t) => q(S.value[0], l.i))
940
- }, null, 40, la)
941
- ]))
942
- ], 64)) : i("", !0),
943
- e.value.type === "classic" ? (u(), n(g, { key: 12 }, [
944
- e.value.style.chart.layout.labels.hollow.total.show ? (u(), n("text", {
945
- key: 0,
946
- "text-anchor": "middle",
947
- x: s.value.width / 2,
948
- 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,
949
- fill: e.value.style.chart.layout.labels.hollow.total.color,
950
- "font-size": e.value.style.chart.layout.labels.hollow.total.fontSize,
951
- style: b(`font-weight:${e.value.style.chart.layout.labels.hollow.total.bold ? "bold" : ""}`)
952
- }, T(e.value.style.chart.layout.labels.hollow.total.text), 13, aa)) : i("", !0),
953
- e.value.style.chart.layout.labels.hollow.total.show ? (u(), n("text", {
954
- key: 1,
955
- "text-anchor": "middle",
956
- x: s.value.width / 2,
957
- 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,
958
- fill: e.value.style.chart.layout.labels.hollow.total.value.color,
959
- "font-size": e.value.style.chart.layout.labels.hollow.total.value.fontSize,
960
- style: b(`font-weight:${e.value.style.chart.layout.labels.hollow.total.value.bold ? "bold" : ""}`)
961
- }, T(r(V)(
962
- e.value.style.chart.layout.labels.hollow.total.value.formatter,
963
- F.value,
964
- r(M)({
965
- p: e.value.style.chart.layout.labels.hollow.total.value.prefix,
966
- v: F.value,
967
- s: e.value.style.chart.layout.labels.hollow.total.value.suffix
968
- })
969
- )), 13, oa)) : i("", !0),
970
- e.value.style.chart.layout.labels.hollow.average.show ? (u(), n("text", {
971
- key: 2,
972
- "text-anchor": "middle",
973
- x: s.value.width / 2,
974
- 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,
975
- fill: e.value.style.chart.layout.labels.hollow.average.color,
976
- "font-size": e.value.style.chart.layout.labels.hollow.average.fontSize,
977
- style: b(`font-weight:${e.value.style.chart.layout.labels.hollow.average.bold ? "bold" : ""}`)
978
- }, T(e.value.style.chart.layout.labels.hollow.average.text), 13, ua)) : i("", !0),
979
- e.value.style.chart.layout.labels.hollow.average.show ? (u(), n("text", {
980
- key: 3,
981
- "text-anchor": "middle",
982
- x: s.value.width / 2,
983
- 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,
984
- fill: e.value.style.chart.layout.labels.hollow.average.value.color,
985
- "font-size": e.value.style.chart.layout.labels.hollow.average.value.fontSize,
986
- style: b(`font-weight:${e.value.style.chart.layout.labels.hollow.average.value.bold ? "bold" : ""}`)
987
- }, T(K.value || P.value ? "--" : r(V)(
988
- e.value.style.chart.layout.labels.hollow.average.value.formatter,
989
- je.value,
990
- r(M)({
991
- p: e.value.style.chart.layout.labels.hollow.average.value.prefix,
992
- v: je.value,
993
- s: e.value.style.chart.layout.labels.hollow.average.value.suffix,
994
- r: e.value.style.chart.layout.labels.hollow.average.value.rounding
995
- })
996
- )), 13, sa)) : i("", !0)
997
- ], 64)) : i("", !0),
998
- (u(!0), n(g, null, A(Y.value.filter((t) => !t.ghost), (t, a) => (u(), n("g", {
999
- filter: Q(a),
1000
- class: _e({ animated: e.value.useCssAnimation })
1001
- }, [
1002
- e.value.style.chart.layout.labels.dataLabels.useLabelSlots ? (u(), n("g", ra, [
1003
- (u(), n("foreignObject", {
1004
- x: r(w)(t, !0).anchor === "end" ? r(w)(t).x - 120 : r(w)(t, !0).anchor === "middle" ? r(w)(t).x - 60 : r(w)(t).x,
1005
- y: r(ve)(t) - (Qe.value ? 20 : 0),
1006
- width: "120",
1007
- height: "60",
1008
- style: { overflow: "visible" }
1009
- }, [
1010
- f("div", null, [
1011
- m(l.$slots, "dataLabel", ut({ ref_for: !0 }, {
1012
- datapoint: t,
1013
- isBlur: !e.value.useBlurOnHover || [null, void 0].includes(z.value) || z.value === a,
1014
- isSafari: Qe.value,
1015
- isVisible: I(t) && h.value.dataLabels.show,
1016
- textAlign: r(w)(t, !0, 16, !0).anchor,
1017
- flexAlign: r(w)(t, !0, 16).anchor,
1018
- percentage: be(t, Y.value)
1019
- }), void 0, !0)
1020
- ])
1021
- ], 8, ia))
1022
- ])) : (u(), n("g", va, [
1023
- e.value.type === "classic" ? (u(), n(g, { key: 0 }, [
1024
- I(t) && h.value.dataLabels.show ? (u(), n("circle", {
1025
- key: 0,
1026
- cx: r(w)(t).x,
1027
- cy: r(ve)(t) - 3.5,
1028
- fill: t.color,
1029
- stroke: e.value.style.chart.backgroundColor,
1030
- "stroke-width": 1,
1031
- r: 3,
1032
- filter: !e.value.useBlurOnHover || [null, void 0].includes(z.value) || z.value === a ? "" : `url(#blur_${p.value})`,
1033
- onClick: (v) => q(t, a)
1034
- }, null, 8, ca)) : i("", !0)
1035
- ], 64)) : i("", !0),
1036
- e.value.type === "polar" ? (u(), n(g, { key: 1 }, [
1037
- I(t) && h.value.dataLabels.show ? (u(), n("circle", {
1038
- key: 0,
1039
- 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,
1040
- 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,
1041
- fill: t.color,
1042
- stroke: e.value.style.chart.backgroundColor,
1043
- "stroke-width": 1,
1044
- r: 3,
1045
- filter: !e.value.useBlurOnHover || [null, void 0].includes(z.value) || z.value === a ? "" : `url(#blur_${p.value})`,
1046
- onClick: (v) => q(t, a),
1047
- style: b({
1048
- transition: P.value || !e.value.serieToggleAnimation.show ? "none" : `all ${e.value.serieToggleAnimation.durationMs}ms ease-in-out`
1049
- })
1050
- }, null, 12, da)) : i("", !0)
1051
- ], 64)) : i("", !0),
1052
- e.value.type === "classic" ? (u(), n(g, { key: 2 }, [
1053
- I(t) && h.value.dataLabels.show ? (u(), n("text", {
1054
- key: 0,
1055
- "text-anchor": r(w)(t, !0, 12).anchor,
1056
- x: r(w)(t, !0, 12).x,
1057
- y: r(ve)(t),
1058
- fill: e.value.style.chart.layout.labels.percentage.color,
1059
- "font-size": e.value.style.chart.layout.labels.percentage.fontSize,
1060
- style: b(`font-weight:${e.value.style.chart.layout.labels.percentage.bold ? "bold" : ""}`),
1061
- onClick: (v) => q(t, a)
1062
- }, T(be(t, Y.value)) + " " + T(e.value.style.chart.layout.labels.value.show ? `(${r(V)(
1063
- e.value.style.chart.layout.labels.value.formatter,
1064
- t.value,
1065
- r(M)({
1066
- p: e.value.style.chart.layout.labels.dataLabels.prefix,
1067
- v: t.value,
1068
- s: e.value.style.chart.layout.labels.dataLabels.suffix,
1069
- r: e.value.style.chart.layout.labels.value.rounding
1070
- }),
1071
- { datapoint: t }
1072
- )})` : ""), 13, ha)) : i("", !0),
1073
- I(t) && h.value.dataLabels.show ? (u(), n("text", {
1074
- key: 1,
1075
- "text-anchor": r(w)(t).anchor,
1076
- x: r(w)(t, !0, 12).x,
1077
- y: r(ve)(t) + e.value.style.chart.layout.labels.percentage.fontSize,
1078
- fill: e.value.style.chart.layout.labels.name.color,
1079
- "font-size": e.value.style.chart.layout.labels.name.fontSize,
1080
- style: b(`font-weight:${e.value.style.chart.layout.labels.name.bold ? "bold" : ""}`),
1081
- onClick: (v) => q(t, a)
1082
- }, T(t.name), 13, ya)) : i("", !0)
1083
- ], 64)) : i("", !0),
1084
- e.value.type === "polar" ? (u(), n(g, { key: 3 }, [
1085
- I(t) && h.value.dataLabels.show ? (u(), n("text", {
1086
- key: 0,
1087
- "text-anchor": ae(c.value[a].middlePoint),
1088
- 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,
1089
- 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,
1090
- fill: e.value.style.chart.layout.labels.percentage.color,
1091
- "font-size": e.value.style.chart.layout.labels.percentage.fontSize,
1092
- style: b({
1093
- transition: P.value || !e.value.serieToggleAnimation.show ? "none" : `all ${e.value.serieToggleAnimation.durationMs}ms ease-in-out`,
1094
- fontWeight: e.value.style.chart.layout.labels.percentage.bold ? "bold" : "normal"
1095
- }),
1096
- onClick: (v) => q(t, a)
1097
- }, T(be(t, Y.value)) + " " + T(e.value.style.chart.layout.labels.value.show ? `(${r(V)(
1098
- e.value.style.chart.layout.labels.value.formatter,
1099
- t.value,
1100
- r(M)({
1101
- p: e.value.style.chart.layout.labels.dataLabels.prefix,
1102
- v: t.value,
1103
- s: e.value.style.chart.layout.labels.dataLabels.suffix,
1104
- r: e.value.style.chart.layout.labels.value.rounding
1105
- }),
1106
- { datapoint: t }
1107
- )})` : ""), 13, fa)) : i("", !0),
1108
- I(t) && h.value.dataLabels.show ? (u(), n("text", {
1109
- key: 1,
1110
- "text-anchor": ae(c.value[a].middlePoint),
1111
- 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,
1112
- 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,
1113
- fill: e.value.style.chart.layout.labels.name.color,
1114
- "font-size": e.value.style.chart.layout.labels.name.fontSize,
1115
- style: b({
1116
- transition: P.value || !e.value.serieToggleAnimation.show ? "none" : `all ${e.value.serieToggleAnimation.durationMs}ms ease-in-out`,
1117
- fontWeight: e.value.style.chart.layout.labels.name.bold ? "bold" : "normal"
1118
- }),
1119
- onClick: (v) => q(t, a)
1120
- }, T(t.name), 13, ga)) : i("", !0)
1121
- ], 64)) : i("", !0)
1122
- ])),
1123
- h.value.dataLabels.show && e.value.style.chart.comments.show && t.comment ? (u(), n("g", pa, [
1124
- I(t) && e.value.type === "classic" ? (u(), n("foreignObject", {
1125
- key: 0,
1126
- x: e.value.style.chart.comments.offsetX + (r(w)(t, !0).anchor === "end" ? r(w)(t).x - e.value.style.chart.comments.width : r(w)(t, !0).anchor === "middle" ? r(w)(t).x - e.value.style.chart.comments.width / 2 : r(w)(t).x),
1127
- y: r(ve)(t) + 24 + e.value.style.chart.comments.offsetY,
1128
- width: e.value.style.chart.comments.width,
1129
- height: "200",
1130
- style: { overflow: "visible", "pointer-events": "none" }
1131
- }, [
1132
- f("div", null, [
1133
- m(l.$slots, "plot-comment", {
1134
- plot: { ...t, textAlign: r(w)(t, !0, 16, !0).anchor, flexAlign: r(w)(t, !0, 16).anchor, isFirstLoad: P.value }
1135
- }, void 0, !0)
1136
- ])
1137
- ], 8, ma)) : i("", !0),
1138
- I(t) && e.value.type === "polar" ? (u(), n("foreignObject", {
1139
- key: 1,
1140
- 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),
1141
- y: Ot(c.value[a]) + e.value.style.chart.comments.offsetY,
1142
- width: e.value.style.chart.comments.width,
1143
- height: "200",
1144
- style: b({
1145
- transition: P.value || !e.value.serieToggleAnimation.show ? "none" : `all ${e.value.serieToggleAnimation.durationMs}ms ease-in-out`,
1146
- overflow: "visible",
1147
- pointerEvents: "none"
1148
- })
1149
- }, [
1150
- f("div", null, [
1151
- m(l.$slots, "plot-comment", {
1152
- plot: { ...t, textAlign: ae(c.value[a].middlePoint), flexAlign: ae(c.value[a].middlePoint), isFirstLoad: P.value }
1153
- }, void 0, !0)
1154
- ])
1155
- ], 12, ba)) : i("", !0)
1156
- ])) : i("", !0)
1157
- ], 10, na))), 256)),
1158
- m(l.$slots, "svg", { svg: s.value }, void 0, !0)
1159
- ], 14, hl)) : i("", !0),
1160
- l.$slots.watermark ? (u(), n("div", wa, [
1161
- m(l.$slots, "watermark", ue(se({ isPrinting: r(Xe) || r(Ve) })), void 0, !0)
1162
- ])) : i("", !0),
1163
- ne.value ? i("", !0) : (u(), ee(r(pt), {
1164
- key: 6,
1165
- config: {
1166
- type: "donut",
1167
- style: {
1168
- backgroundColor: e.value.style.chart.backgroundColor,
1169
- donut: {
1170
- color: "#CCCCCC",
1171
- strokeWidth: J.value * 0.8
1172
- }
1173
- }
1174
- }
1175
- }, null, 8, ["config"])),
1176
- f("div", {
1177
- ref_key: "chartLegend",
1178
- ref: Pe
1179
- }, [
1180
- e.value.style.chart.legend.show ? (u(), ee(nl, {
1181
- key: `legend_${Le.value}`,
1182
- legendSet: Ue.value,
1183
- config: St.value,
1184
- onClickMarker: o[4] || (o[4] = ({ i: t }) => Ee(t))
1185
- }, ot({
1186
- item: C(({ legend: t, index: a }) => [
1187
- f("div", {
1188
- style: b(`opacity:${D.value.includes(a) ? 0.5 : 1}`),
1189
- onClick: (v) => t.segregate()
1190
- }, 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)(
1191
- e.value.style.chart.layout.labels.value.formatter,
1192
- t.value,
1193
- r(M)({
1194
- p: e.value.style.chart.layout.labels.dataLabels.prefix,
1195
- v: t.value,
1196
- s: e.value.style.chart.layout.labels.dataLabels.suffix,
1197
- r: e.value.style.chart.legend.roundingValue
1198
- }),
1199
- {
1200
- datapoint: t,
1201
- index: a
1202
- }
1203
- ) : "") + " " + T(e.value.style.chart.legend.showPercentage ? D.value.includes(a) ? `${e.value.style.chart.legend.showValue ? "(" : ""}${Nt(t.proportion * 100)}%${e.value.style.chart.legend.showValue ? ")" : ""}` : `${e.value.style.chart.legend.showValue ? "(" : ""}${isNaN(t.value / F.value) ? "-" : r(V)(
1204
- e.value.style.chart.layout.labels.percentage.formatter,
1205
- He.value(t),
1206
- r(M)({
1207
- v: He.value(t),
1208
- s: "%",
1209
- r: e.value.style.chart.legend.roundingPercentage
1210
- })
1211
- )}${e.value.style.chart.legend.showValue ? ")" : ""}` : ""), 13, ka)
1212
- ]),
1213
- _: 2
1214
- }, [
1215
- l.$slots.pattern ? {
1216
- name: "legend-pattern",
1217
- fn: C(({ legend: t, index: a }) => [
1218
- $e(il, {
1219
- shape: t.shape,
1220
- radius: 30,
1221
- stroke: "none",
1222
- plot: { x: 30, y: 30 },
1223
- fill: `url(#pattern_${p.value}_${a})`
1224
- }, null, 8, ["shape", "fill"])
1225
- ]),
1226
- key: "0"
1227
- } : void 0
1228
- ]), 1032, ["legendSet", "config"])) : i("", !0),
1229
- m(l.$slots, "legend", { legend: Ue.value }, void 0, !0)
1230
- ], 512),
1231
- l.$slots.source ? (u(), n("div", {
1232
- key: 7,
1233
- ref_key: "source",
1234
- ref: Te,
1235
- dir: "auto"
1236
- }, [
1237
- m(l.$slots, "source", {}, void 0, !0)
1238
- ], 512)) : i("", !0),
1239
- $e(r(mt), {
1240
- show: h.value.showTooltip && ce.value,
1241
- backgroundColor: e.value.style.chart.tooltip.backgroundColor,
1242
- color: e.value.style.chart.tooltip.color,
1243
- fontSize: e.value.style.chart.tooltip.fontSize,
1244
- borderRadius: e.value.style.chart.tooltip.borderRadius,
1245
- borderColor: e.value.style.chart.tooltip.borderColor,
1246
- borderWidth: e.value.style.chart.tooltip.borderWidth,
1247
- backgroundOpacity: e.value.style.chart.tooltip.backgroundOpacity,
1248
- position: e.value.style.chart.tooltip.position,
1249
- offsetY: e.value.style.chart.tooltip.offsetY,
1250
- parent: U.value,
1251
- content: ge.value,
1252
- isCustom: re.value,
1253
- isFullscreen: oe.value
1254
- }, {
1255
- "tooltip-before": C(() => [
1256
- m(l.$slots, "tooltip-before", ue(se({ ...we.value })), void 0, !0)
1257
- ]),
1258
- "tooltip-after": C(() => [
1259
- m(l.$slots, "tooltip-after", ue(se({ ...we.value })), void 0, !0)
1260
- ]),
1261
- _: 3
1262
- }, 8, ["show", "backgroundColor", "color", "fontSize", "borderRadius", "borderColor", "borderWidth", "backgroundOpacity", "position", "offsetY", "parent", "content", "isCustom", "isFullscreen"]),
1263
- ne.value ? (u(), ee(r(ht), {
1264
- key: 8,
1265
- hideDetails: "",
1266
- config: {
1267
- open: h.value.showTable,
1268
- maxHeight: 1e4,
1269
- body: {
1270
- backgroundColor: e.value.style.chart.backgroundColor,
1271
- color: e.value.style.chart.color
1272
- },
1273
- head: {
1274
- backgroundColor: e.value.style.chart.backgroundColor,
1275
- color: e.value.style.chart.color
1276
- }
1277
- }
1278
- }, {
1279
- content: C(() => [
1280
- (u(), ee(r(yt), {
1281
- key: `table_${Fe.value}`,
1282
- colNames: de.value.colNames,
1283
- head: de.value.head,
1284
- body: de.value.body,
1285
- config: de.value.config,
1286
- title: `${e.value.style.chart.title.text}${e.value.style.chart.title.subtitle.text ? ` : ${e.value.style.chart.title.subtitle.text}` : ""}`,
1287
- onClose: o[5] || (o[5] = (t) => h.value.showTable = !1)
1288
- }, {
1289
- th: C(({ th: t }) => [
1290
- f("div", {
1291
- innerHTML: t,
1292
- style: { display: "flex", "align-items": "center" }
1293
- }, null, 8, _a)
1294
- ]),
1295
- td: C(({ td: t }) => [
1296
- Vt(T(t.name ? t.name : isNaN(Number(t)) ? t.includes("%") ? t : r(V)(
1297
- e.value.style.chart.layout.labels.percentage.formatter,
1298
- t,
1299
- r(M)({
1300
- v: t,
1301
- s: "%",
1302
- r: e.value.style.chart.layout.labels.percentage.rounding
1303
- })
1304
- ) : r(V)(
1305
- e.value.style.chart.layout.labels.value.formatter,
1306
- t,
1307
- r(M)({
1308
- p: e.value.style.chart.layout.labels.dataLabels.prefix,
1309
- v: t,
1310
- s: e.value.style.chart.layout.labels.dataLabels.suffix,
1311
- r: e.value.style.chart.layout.labels.value.rounding
1312
- })
1313
- )), 1)
1314
- ]),
1315
- _: 1
1316
- }, 8, ["colNames", "head", "body", "config", "title"]))
1317
- ]),
1318
- _: 1
1319
- }, 8, ["config"])) : i("", !0)
1320
- ], 46, dl));
1321
- }
1322
- }, Ya = /* @__PURE__ */ cl($a, [["__scopeId", "data-v-ac4cbcc5"]]);
1323
- export {
1324
- Ya as default
1325
- };