vue-data-ui 3.4.9 → 3.5.1

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 (151) hide show
  1. package/README.md +114 -37
  2. package/dist/{ColorPicker-J5wOPCeB.js → ColorPicker-ChuwChMo.js} +58 -56
  3. package/dist/{NonSvgPenAndPaper-C7TRn0_3.js → NonSvgPenAndPaper-DVgKKLIf.js} +1 -1
  4. package/dist/{PackageVersion-CTUqGqWV.js → PackageVersion-DQvyATVa.js} +1 -1
  5. package/dist/PenAndPaper-SZQIAgkg.js +388 -0
  6. package/dist/{Title-l36lOBMx.js → Title-isbiM8i8.js} +1 -1
  7. package/dist/components/vue-ui-3d-bar.js +1 -1
  8. package/dist/components/vue-ui-accordion.js +1 -1
  9. package/dist/components/vue-ui-age-pyramid.js +1 -1
  10. package/dist/components/vue-ui-annotator.js +1 -1
  11. package/dist/components/vue-ui-bullet.js +1 -1
  12. package/dist/components/vue-ui-candlestick.js +1 -1
  13. package/dist/components/vue-ui-carousel-table.js +1 -1
  14. package/dist/components/vue-ui-chestnut.js +1 -1
  15. package/dist/components/vue-ui-chord.js +1 -1
  16. package/dist/components/vue-ui-circle-pack.js +1 -1
  17. package/dist/components/vue-ui-cursor.js +1 -1
  18. package/dist/components/vue-ui-dashboard.js +1 -1
  19. package/dist/components/vue-ui-digits.js +1 -1
  20. package/dist/components/vue-ui-donut-evolution.js +1 -1
  21. package/dist/components/vue-ui-donut.js +1 -1
  22. package/dist/components/vue-ui-dumbbell.js +1 -1
  23. package/dist/components/vue-ui-flow.js +1 -1
  24. package/dist/components/vue-ui-funnel.js +1 -1
  25. package/dist/components/vue-ui-galaxy.js +1 -1
  26. package/dist/components/vue-ui-gauge.js +1 -1
  27. package/dist/components/vue-ui-gizmo.js +1 -1
  28. package/dist/components/vue-ui-heatmap.js +1 -1
  29. package/dist/components/vue-ui-history-plot.js +1 -1
  30. package/dist/components/vue-ui-horizontal-bar.js +1 -1
  31. package/dist/components/vue-ui-kpi.js +1 -1
  32. package/dist/components/vue-ui-mini-loader.js +1 -1
  33. package/dist/components/vue-ui-molecule.js +1 -1
  34. package/dist/components/vue-ui-mood-radar.js +1 -1
  35. package/dist/components/vue-ui-nested-donuts.js +1 -1
  36. package/dist/components/vue-ui-onion.js +1 -1
  37. package/dist/components/vue-ui-parallel-coordinate-plot.js +1 -1
  38. package/dist/components/vue-ui-quadrant.js +1 -1
  39. package/dist/components/vue-ui-quick-chart.js +1 -1
  40. package/dist/components/vue-ui-radar.js +1 -1
  41. package/dist/components/vue-ui-rating.js +1 -1
  42. package/dist/components/vue-ui-relation-circle.js +1 -1
  43. package/dist/components/vue-ui-ridgeline.js +1 -1
  44. package/dist/components/vue-ui-rings.js +1 -1
  45. package/dist/components/vue-ui-scatter.js +1 -1
  46. package/dist/components/vue-ui-skeleton.js +1 -1
  47. package/dist/components/vue-ui-smiley.js +1 -1
  48. package/dist/components/vue-ui-spark-trend.js +1 -1
  49. package/dist/components/vue-ui-sparkbar.js +1 -1
  50. package/dist/components/vue-ui-sparkgauge.js +1 -1
  51. package/dist/components/vue-ui-sparkhistogram.js +1 -1
  52. package/dist/components/vue-ui-sparkline.js +1 -1
  53. package/dist/components/vue-ui-sparkstackbar.js +1 -1
  54. package/dist/components/vue-ui-stackbar.js +1 -1
  55. package/dist/components/vue-ui-strip-plot.js +1 -1
  56. package/dist/components/vue-ui-table-heatmap.js +1 -1
  57. package/dist/components/vue-ui-table-sparkline.js +1 -1
  58. package/dist/components/vue-ui-table.js +1 -1
  59. package/dist/components/vue-ui-thermometer.js +1 -1
  60. package/dist/components/vue-ui-timer.js +1 -1
  61. package/dist/components/vue-ui-tiremarks.js +1 -1
  62. package/dist/components/vue-ui-treemap.js +1 -1
  63. package/dist/components/vue-ui-vertical-bar.js +1 -1
  64. package/dist/components/vue-ui-waffle.js +1 -1
  65. package/dist/components/vue-ui-wheel.js +1 -1
  66. package/dist/components/vue-ui-word-cloud.js +1 -1
  67. package/dist/components/vue-ui-world.js +1 -1
  68. package/dist/components/vue-ui-xy-canvas.js +1 -1
  69. package/dist/components/vue-ui-xy.js +1 -1
  70. package/dist/style.css +1 -1
  71. package/dist/types/vue-data-ui.d.ts +17 -8
  72. package/dist/{useNestedProp-BjZe1Y85.js → useNestedProp-DjGXw6S9.js} +22 -8
  73. package/dist/{vue-data-ui-DjxWWa78.js → vue-data-ui-B_RxfmEm.js} +113 -107
  74. package/dist/vue-data-ui.js +64 -64
  75. package/dist/{vue-ui-3d-bar-CLE7f9pl.js → vue-ui-3d-bar-CMNYyVa2.js} +454 -434
  76. package/dist/{vue-ui-accordion-CZ0thhxa.js → vue-ui-accordion-CqhVCfc2.js} +1 -1
  77. package/dist/{vue-ui-age-pyramid-D73uIOPm.js → vue-ui-age-pyramid-Vqa9iYXE.js} +180 -160
  78. package/dist/{vue-ui-annotator-BylDgUVb.js → vue-ui-annotator-nNv10fBm.js} +3 -3
  79. package/dist/{vue-ui-bullet-Bybo0xK2.js → vue-ui-bullet-BWEBeYV5.js} +190 -170
  80. package/dist/{vue-ui-candlestick-D_FyMdqH.js → vue-ui-candlestick-BoLzL0g1.js} +201 -181
  81. package/dist/{vue-ui-carousel-table-BvMlNdVo.js → vue-ui-carousel-table-Bi6wvUUU.js} +2 -2
  82. package/dist/{vue-ui-chestnut-DA0g0bDV.js → vue-ui-chestnut-BGz1TLXG.js} +375 -355
  83. package/dist/vue-ui-chord-CebhS7ln.js +1153 -0
  84. package/dist/{vue-ui-circle-pack-BPDm-ro5.js → vue-ui-circle-pack-7PJVyKjp.js} +289 -269
  85. package/dist/{vue-ui-cursor-ik59bfC4.js → vue-ui-cursor-qYLAwvzn.js} +1 -1
  86. package/dist/vue-ui-dashboard-DcmMvhgM.js +432 -0
  87. package/dist/{vue-ui-digits-ByNNcWXi.js → vue-ui-digits-DyE8eU1m.js} +1 -1
  88. package/dist/vue-ui-donut-CxZcJFTo.js +1681 -0
  89. package/dist/{vue-ui-donut-evolution-Ca3Svr0B.js → vue-ui-donut-evolution-BVYL-BUJ.js} +480 -444
  90. package/dist/{vue-ui-dumbbell-CxCE2luV.js → vue-ui-dumbbell-QxZn86A3.js} +210 -190
  91. package/dist/{vue-ui-flow-DEvwXd4W.js → vue-ui-flow-DEI5LRch.js} +339 -319
  92. package/dist/{vue-ui-funnel-Bgcx7xia.js → vue-ui-funnel-B_A5orFg.js} +218 -198
  93. package/dist/{vue-ui-galaxy-BWr1EMob.js → vue-ui-galaxy-CUoDRr-O.js} +313 -277
  94. package/dist/{vue-ui-gauge-DQricvo2.js → vue-ui-gauge-46tSRZN5.js} +311 -291
  95. package/dist/{vue-ui-gizmo-C-fKe3io.js → vue-ui-gizmo-BOgbsXao.js} +2 -2
  96. package/dist/{vue-ui-heatmap-B-o_i7Hu.js → vue-ui-heatmap-DKKjl1A2.js} +303 -283
  97. package/dist/{vue-ui-history-plot-DzQ9DPUJ.js → vue-ui-history-plot-C6p_aThr.js} +478 -442
  98. package/dist/{vue-ui-kpi-BGGff8LM.js → vue-ui-kpi-B1yJ83aF.js} +2 -2
  99. package/dist/{vue-ui-mini-loader-CSF-7TJL.js → vue-ui-mini-loader-BudcNBg-.js} +1 -1
  100. package/dist/{vue-ui-molecule-I2OhrCR2.js → vue-ui-molecule-L90GnHee.js} +156 -136
  101. package/dist/{vue-ui-mood-radar-BAT7kZUy.js → vue-ui-mood-radar-Dhigm5rw.js} +266 -246
  102. package/dist/{vue-ui-nested-donuts-CjhJDAQi.js → vue-ui-nested-donuts-D0MCLs5n.js} +597 -557
  103. package/dist/vue-ui-onion-B7yPJ3gL.js +915 -0
  104. package/dist/vue-ui-parallel-coordinate-plot-DY21ivNe.js +1051 -0
  105. package/dist/{vue-ui-quadrant-DGnasrCR.js → vue-ui-quadrant-b0vMRaq-.js} +532 -495
  106. package/dist/{vue-ui-quick-chart-Cam_sWet.js → vue-ui-quick-chart-VK2EN7sh.js} +288 -268
  107. package/dist/{vue-ui-radar-DNI9WI2R.js → vue-ui-radar-B5Vkoz9M.js} +412 -373
  108. package/dist/{vue-ui-rating-CiMoFM_c.js → vue-ui-rating-BH4DW1ZY.js} +1 -1
  109. package/dist/{vue-ui-relation-circle-Dj1jhcsl.js → vue-ui-relation-circle-XHbE-ZUX.js} +228 -208
  110. package/dist/{vue-ui-ridgeline-adIls6bj.js → vue-ui-ridgeline-CAMNq-p_.js} +517 -481
  111. package/dist/vue-ui-rings-ImGOqm_J.js +855 -0
  112. package/dist/vue-ui-scatter-CterNJYe.js +1590 -0
  113. package/dist/{vue-ui-skeleton-DUdI2uOO.js → vue-ui-skeleton-CykXHWj-.js} +2 -2
  114. package/dist/{vue-ui-smiley-sGFRbn31.js → vue-ui-smiley-DnGm6qrK.js} +1 -1
  115. package/dist/{vue-ui-spark-trend-DxpRfUJz.js → vue-ui-spark-trend-N1AsNQJA.js} +2 -2
  116. package/dist/{vue-ui-sparkbar-B44oER5n.js → vue-ui-sparkbar-Bvsi5DTT.js} +2 -2
  117. package/dist/{vue-ui-sparkgauge-ix12NZ7M.js → vue-ui-sparkgauge-DyJmWCWT.js} +2 -2
  118. package/dist/{vue-ui-sparkhistogram-Cs-QDYBR.js → vue-ui-sparkhistogram-5eKrkmSb.js} +143 -140
  119. package/dist/{vue-ui-sparkline-Cb8ZmyUq.js → vue-ui-sparkline-ChKAzlVq.js} +2 -2
  120. package/dist/vue-ui-sparkstackbar-BXNy6nuw.js +441 -0
  121. package/dist/vue-ui-stackbar-1IwvUYBO.js +1827 -0
  122. package/dist/{vue-ui-strip-plot-BjG-Jxnb.js → vue-ui-strip-plot-B1wGxP8-.js} +245 -225
  123. package/dist/{vue-ui-table-DdBdLrAL.js → vue-ui-table-DSsIrT4L.js} +3 -3
  124. package/dist/{vue-ui-table-heatmap-BqCEBoUf.js → vue-ui-table-heatmap-DXFHy7-E.js} +1 -1
  125. package/dist/{vue-ui-table-sparkline-EpCo2Be5.js → vue-ui-table-sparkline-DpqY_4ay.js} +2 -2
  126. package/dist/vue-ui-thermometer-CMKvSA8p.js +584 -0
  127. package/dist/{vue-ui-timer-Br3wp8hG.js → vue-ui-timer-BpdCY_wg.js} +3 -3
  128. package/dist/vue-ui-tiremarks-CNipzVli.js +450 -0
  129. package/dist/vue-ui-treemap-DPE8SY0_.js +1330 -0
  130. package/dist/{vue-ui-vertical-bar-yfbEfLqy.js → vue-ui-vertical-bar-ZU1GCbX0.js} +484 -448
  131. package/dist/{vue-ui-waffle-m-9sqQik.js → vue-ui-waffle-z7nuSuSV.js} +398 -362
  132. package/dist/vue-ui-wheel-DLRoRjeM.js +663 -0
  133. package/dist/{vue-ui-word-cloud-vNwswYZD.js → vue-ui-word-cloud-D2r5E3pP.js} +248 -228
  134. package/dist/{vue-ui-world-BsCNyZy_.js → vue-ui-world-goXYnTyM.js} +287 -267
  135. package/dist/{vue-ui-xy-CIrw1lWQ.js → vue-ui-xy-NDDbNbds.js} +1263 -1227
  136. package/dist/{vue-ui-xy-canvas-DXnLFwW3.js → vue-ui-xy-canvas-2a6NlQe3.js} +338 -322
  137. package/package.json +4 -4
  138. package/dist/PenAndPaper-DSvu9dwa.js +0 -373
  139. package/dist/vue-ui-chord-CDgzolI-.js +0 -1133
  140. package/dist/vue-ui-dashboard-CeJwbiON.js +0 -412
  141. package/dist/vue-ui-donut-DjQXHBJE.js +0 -1645
  142. package/dist/vue-ui-onion-DTY2p87s.js +0 -873
  143. package/dist/vue-ui-parallel-coordinate-plot-C8aWTcNn.js +0 -1014
  144. package/dist/vue-ui-rings-CnTMFK6R.js +0 -813
  145. package/dist/vue-ui-scatter-fzR2c0St.js +0 -1554
  146. package/dist/vue-ui-sparkstackbar-BiRZ51OU.js +0 -424
  147. package/dist/vue-ui-stackbar-DubS6Pg8.js +0 -1708
  148. package/dist/vue-ui-thermometer-DTnfnf9z.js +0 -564
  149. package/dist/vue-ui-tiremarks-CrC_tlIx.js +0 -430
  150. package/dist/vue-ui-treemap-kyuyi2ES.js +0 -1294
  151. package/dist/vue-ui-wheel-BasM7FWt.js +0 -643
@@ -1,1014 +0,0 @@
1
- import { defineAsyncComponent as P, computed as p, ref as d, toRefs as St, watch as Z, shallowRef as qe, onMounted as Lt, onBeforeUnmount as Pt, watchEffect as Ot, createElementBlock as u, openBlock as n, unref as v, normalizeStyle as M, normalizeClass as X, createBlock as _, createCommentVNode as y, createElementVNode as N, createVNode as me, createSlots as Qe, withCtx as g, renderSlot as b, normalizeProps as W, guardReactiveProps as U, Fragment as A, renderList as I, toDisplayString as B, Teleport as Dt, resolveDynamicComponent as Rt, mergeProps as Bt, createTextVNode as Je, nextTick as Et } from "vue";
2
- import { c as ye, t as Ht, b as Wt, p as ee, o as Ke, f as Ze, g as Ut, e as Vt, h as Gt, m as jt, B as Xt, z as Yt, a9 as qt, X as Qt, M as Jt, G as et, R as te, P as Kt, Q as Zt, a as tt, d as at, H as ea } from "./lib-C_mNZmhD.js";
3
- import { t as lt, u as ta } from "./useResponsive-DfdjqQps.js";
4
- import { u as aa, a as ot } from "./useNestedProp-BjZe1Y85.js";
5
- import { u as la } from "./usePrinter-DTzqpYKF.js";
6
- import { u as oa, B as sa } from "./BaseScanner-BgWxam9d.js";
7
- import { u as na } from "./useSvgExport-DrjCWun4.js";
8
- import { u as ia } from "./useUserOptionState-BIvW1Kz7.js";
9
- import { u as ua } from "./useChartAccessibility-9icAAmYg.js";
10
- import { u as ra } from "./useTimeLabelCollider-CIsgDrl9.js";
11
- import { t as ca } from "./themes-AUNCOb2G.js";
12
- import va from "./Title-l36lOBMx.js";
13
- import da from "./Legend-G6GMcdAc.js";
14
- import { _ as ha } from "./Shape-CNXKB8O0.js";
15
- import pa from "./img-BecE5qXd.js";
16
- import { _ as ma } from "./_plugin-vue_export-helper-CHgC5LLL.js";
17
- const ya = ["id"], fa = ["id"], ga = ["xmlns", "viewBox"], ba = ["x", "y", "width", "height"], xa = { style: { "pointer-events": "none" } }, ka = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], wa = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Ca = { key: 0 }, Aa = ["x", "y", "fill", "font-size", "font-weight"], $a = ["fill", "font-size", "font-weight", "text-anchor", "transform"], Ta = ["fill", "font-size", "font-weight", "text-anchor", "transform", "innerHTML"], za = { key: 0 }, Fa = ["x", "y", "font-size", "fill"], Ma = ["width", "x", "y"], _a = { style: { width: "100%" } }, Na = ["x", "y", "fill", "font-weight", "font-size", "onMouseenter", "onMouseleave", "onClick"], Ia = ["d", "stroke", "stroke-width", "onMouseenter", "onMouseleave", "onClick"], Sa = ["d", "onMouseenter", "onMouseleave", "onClick"], La = {
18
- key: 4,
19
- class: "vue-data-ui-watermark"
20
- }, Pa = ["id"], Oa = ["onClick"], Da = ["innerHTML"], Ra = {
21
- __name: "vue-ui-parallel-coordinate-plot",
22
- props: {
23
- config: {
24
- type: Object,
25
- default() {
26
- return {};
27
- }
28
- },
29
- dataset: {
30
- type: Array,
31
- default() {
32
- return [];
33
- }
34
- }
35
- },
36
- emits: ["selectLegend", "selectDatapoint"],
37
- setup(st, { expose: nt, emit: it }) {
38
- const ut = P(() => import("./Tooltip-oWCO1HKy.js")), rt = P(() => import("./BaseIcon-BmMbm4d0.js")), ct = P(() => import("./vue-ui-accordion-CZ0thhxa.js")), vt = P(() => import("./DataTable-BT7VF2ua.js")), dt = P(() => import("./PenAndPaper-DSvu9dwa.js")), ht = P(() => import("./UserOptions-CGnQt6Fd.js")), pt = P(() => import("./PackageVersion-CTUqGqWV.js")), mt = P(() => import("./BaseDraggableDialog-ymf2sfB8.js")), { vue_ui_parallel_coordinate_plot: yt } = aa(), $ = st, Y = p({
39
- get() {
40
- return !!$.dataset && $.dataset.length;
41
- },
42
- set(t) {
43
- return t;
44
- }
45
- }), fe = d(0), z = d(null), ge = d(null), be = d(null), xe = d(null), ke = d(null), we = d(0), Ce = d(0), Ae = d(0), $e = d(!1), V = d(null), ae = d(null), le = d(null), O = d(ye()), D = d(!1);
46
- function Te(t) {
47
- D.value = t, fe.value += 1;
48
- }
49
- const e = d(ie()), { loading: R, FINAL_DATASET: ft, manualLoading: oe } = oa({
50
- ...St($),
51
- FINAL_CONFIG: e,
52
- prepareConfig: ie,
53
- callback: () => {
54
- Promise.resolve().then(async () => {
55
- await Et(), m.value.showTable = e.value.table.show;
56
- });
57
- },
58
- skeletonDataset: [
59
- {
60
- name: "",
61
- shape: "circle",
62
- color: "transparent",
63
- series: [
64
- {
65
- name: "",
66
- values: [1, 10, 100, 1e3]
67
- }
68
- ]
69
- },
70
- {
71
- name: "",
72
- shape: "circle",
73
- color: "#CACACA",
74
- series: [
75
- {
76
- name: "",
77
- values: [0.2, 3, 50, 800]
78
- }
79
- ]
80
- },
81
- {
82
- name: "",
83
- shape: "circle",
84
- color: "transparent",
85
- series: [
86
- {
87
- name: "",
88
- values: [0, 0, 0, 0]
89
- }
90
- ]
91
- }
92
- ],
93
- skeletonConfig: Ht({
94
- defaultConfig: e.value,
95
- userConfig: {
96
- useCssAnimation: !1,
97
- userOptions: { show: !1 },
98
- table: { show: !1 },
99
- style: {
100
- chart: {
101
- backgroundColor: "#99999930",
102
- legend: {
103
- show: !0,
104
- backgroundColor: "transparent"
105
- },
106
- yAxis: {
107
- stroke: "#6A6A6A",
108
- labels: {
109
- showAxisNames: !1,
110
- axisNames: [],
111
- ticks: {
112
- color: "#6A6A6A"
113
- }
114
- }
115
- }
116
- }
117
- }
118
- }
119
- })
120
- }), { userOptionsVisible: se, setUserOptionsVisibility: ze, keepUserOptionState: Fe } = ia({ config: e.value }), { svgRef: ne } = ua({ config: e.value.style.chart.title });
121
- function ie() {
122
- const t = ot({
123
- userConfig: $.config,
124
- defaultConfig: yt
125
- });
126
- return t.theme ? {
127
- ...ot({
128
- userConfig: ca.vue_ui_parallel_coordinate_plot[t.theme] || $.config,
129
- defaultConfig: t
130
- }),
131
- customPalette: Wt[t.theme] || ee
132
- } : t;
133
- }
134
- Z(() => $.config, (t) => {
135
- R.value || (e.value = ie()), se.value = !e.value.userOptions.showOnChartHover, _e(), we.value += 1, Ae.value += 1, Ce.value += 1, m.value.dataLabels.show = e.value.style.chart.yAxis.labels.datapoints.show, m.value.showTable = e.value.table.show, m.value.showTooltip = e.value.style.chart.tooltip.show;
136
- }, { deep: !0 }), Z(() => $.dataset, (t) => {
137
- Array.isArray(t) && t.length > 0 && (oe.value = !1);
138
- }, { deep: !0 });
139
- const S = qe(null), E = qe(null);
140
- Lt(() => {
141
- $e.value = !0, _e();
142
- });
143
- const Me = p(() => !!e.value.debug);
144
- function _e() {
145
- if (Ke($.dataset) ? (Ze({
146
- componentName: "VueUiParallelCoordinatePlot",
147
- type: "dataset",
148
- debug: Me.value
149
- }), oe.value = !0) : $.dataset.forEach((t, o) => {
150
- Ut({
151
- datasetObject: t,
152
- requiredAttributes: ["name", "series"]
153
- }).forEach((a) => {
154
- Y.value = !1, Ze({
155
- componentName: "VueUiParallelCoordinatePlot",
156
- type: "datasetSerieAttribute",
157
- property: a,
158
- index: o,
159
- debug: Me.value
160
- });
161
- });
162
- }), Ke($.dataset) || (oe.value = e.value.loading), e.value.responsive) {
163
- const t = lt(() => {
164
- const { width: o, height: a } = ta({
165
- chart: z.value,
166
- title: e.value.style.chart.title.text ? ge.value : null,
167
- legend: e.value.style.chart.legend.show ? be.value : null,
168
- source: xe.value,
169
- noTitle: ke.value
170
- });
171
- requestAnimationFrame(() => {
172
- c.value.width = o, c.value.height = a - 12, e.value.responsiveProportionalSizing ? (c.value.plotSize = te({
173
- relator: Math.min(o, a),
174
- adjuster: 600,
175
- source: e.value.style.chart.plots.radius,
176
- threshold: 2,
177
- fallback: 2
178
- }), c.value.ticksFontSize = te({
179
- relator: Math.min(o, a),
180
- adjuster: 600,
181
- source: e.value.style.chart.yAxis.labels.ticks.fontSize,
182
- threshold: 10,
183
- fallback: 10
184
- }), c.value.datapointFontSize = te({
185
- relator: Math.min(o, a),
186
- adjuster: 600,
187
- source: e.value.style.chart.yAxis.labels.datapoints.fontSize,
188
- threshold: 10,
189
- fallback: 10
190
- }), c.value.axisNameFontSize = te({
191
- relator: Math.min(o, a),
192
- adjuster: 600,
193
- source: e.value.style.chart.yAxis.labels.axisNamesFontSize,
194
- threshold: 12,
195
- fallback: 12
196
- })) : (c.value.plotSize = e.value.style.chart.plots.radius, c.value.ticksFontSize = e.value.style.chart.yAxis.labels.ticks.fontSize, c.value.datapointFontSize = e.value.style.chart.yAxis.labels.datapoints.fontSize, c.value.axisNameFontSize = e.value.style.chart.yAxis.labels.axisNamesFontSize);
197
- });
198
- });
199
- S.value && (E.value && S.value.unobserve(E.value), S.value.disconnect()), S.value = new ResizeObserver(t), E.value = z.value.parentNode, S.value.observe(E.value);
200
- }
201
- }
202
- Pt(() => {
203
- S.value && (E.value && S.value.unobserve(E.value), S.value.disconnect());
204
- });
205
- const { isPrinting: Ne, isImaging: Ie, generatePdf: Se, generateImage: Le } = la({
206
- elementId: `pcp_${O.value}`,
207
- fileName: e.value.style.chart.title.text || "vue-ui-parallel-coordinate-plot",
208
- options: e.value.userOptions.print
209
- }), gt = p(() => e.value.userOptions.show && !e.value.style.chart.title.text), c = d({
210
- height: e.value.style.chart.height,
211
- width: e.value.style.chart.width,
212
- plotSize: e.value.style.chart.plots.radius,
213
- // ratio 100
214
- ticksFontSize: e.value.style.chart.yAxis.labels.ticks.fontSize,
215
- // ratio 42.85
216
- datapointFontSize: e.value.style.chart.yAxis.labels.datapoints.fontSize,
217
- axisNameFontSize: e.value.style.chart.yAxis.labels.axisNamesFontSize
218
- }), Pe = p(() => c.value.width), Oe = p(() => c.value.height), G = d(0), bt = lt((t) => {
219
- G.value = t;
220
- }, 100);
221
- Ot((t) => {
222
- const o = le.value;
223
- if (!o) return;
224
- const a = new ResizeObserver((s) => {
225
- bt(s[0].contentRect.height);
226
- });
227
- a.observe(o), t(() => a.disconnect());
228
- });
229
- const h = p(() => {
230
- const { top: t, right: o, bottom: a, left: s } = e.value.style.chart.padding, l = Oe.value, r = Pe.value;
231
- return {
232
- chartHeight: Math.max(1e-3, l),
233
- chartWidth: Math.max(1e-3, r),
234
- height: Math.max(1e-3, l - t - a - G.value - c.value.datapointFontSize * 2),
235
- width: Math.max(1e-3, r - s - o),
236
- top: t + G.value + c.value.datapointFontSize,
237
- left: s,
238
- right: r - o,
239
- bottom: l - a - c.value.datapointFontSize
240
- };
241
- }), xt = p(() => Vt(e.value.customPalette)), m = d({
242
- dataLabels: {
243
- show: e.value.style.chart.yAxis.labels.datapoints.show
244
- },
245
- showTable: e.value.table.show,
246
- showTooltip: e.value.style.chart.tooltip.show
247
- });
248
- Z(e, () => {
249
- m.value = {
250
- dataLabels: {
251
- show: e.value.style.chart.yAxis.labels.datapoints.show
252
- },
253
- showTable: e.value.table.show,
254
- showTooltip: e.value.style.chart.tooltip.show
255
- };
256
- }, { immediate: !0 });
257
- const F = d([]);
258
- function De(t) {
259
- F.value.includes(t) ? F.value = F.value.filter((o) => o !== t) : F.value.push(t);
260
- }
261
- const L = p(() => ft.value.map((t, o) => {
262
- const a = Gt(t.color) || xt.value[o] || ee[o] || ee[o % ee.length];
263
- return {
264
- ...t,
265
- series: t.series.map((s) => ({
266
- ...s,
267
- id: ye(),
268
- color: a
269
- })),
270
- seriesIndex: o,
271
- color: a,
272
- id: ye(),
273
- shape: t.shape || "circle"
274
- };
275
- })), Re = p(() => L.value.map((t) => ({
276
- ...t,
277
- opacity: F.value.includes(t.id) ? 0.5 : 1,
278
- segregate: () => De(t.id),
279
- isSegregated: F.value.includes(t.id),
280
- shape: "circle"
281
- }))), kt = p(() => ({
282
- cy: "pcp-div-legend",
283
- backgroundColor: e.value.style.chart.legend.backgroundColor,
284
- color: e.value.style.chart.legend.color,
285
- fontSize: e.value.style.chart.legend.fontSize,
286
- paddingBottom: 12,
287
- fontWeight: e.value.style.chart.legend.bold ? "bold" : ""
288
- })), Be = p(() => Math.max(
289
- ...L.value.filter((t) => !F.value.includes(t.id)).map((t) => Math.max(...t.series.flatMap((o) => o.values.length)))
290
- )), C = p(() => h.value.width / Be.value), ue = p(() => L.value.filter((t) => !F.value.includes(t.id))), f = p(() => {
291
- let t = [];
292
- for (let o = 0; o < Be.value; o += 1) {
293
- const a = Math.min(...ue.value.flatMap((x) => x.series.map((k) => k.values[o] || 0) || 0)), s = Math.max(...ue.value.flatMap((x) => x.series.map((k) => k.values[o] || 0) || 0)), l = s === a ? a / 4 : a, r = s === a ? s * 2 : s, i = jt(l, r, e.value.style.chart.yAxis.scaleTicks), T = i.ticks.map((x, k) => {
294
- const Nt = i.min < 0 ? x + Math.abs(i.min) : x - Math.abs(i.min), It = i.min < 0 ? i.max + Math.abs(i.min) : i.max - Math.abs(i.min);
295
- return {
296
- y: h.value.bottom - h.value.height * (Nt / It),
297
- x: h.value.left + C.value * o + C.value / 2,
298
- value: x
299
- };
300
- });
301
- t.push({
302
- scale: i,
303
- ticks: T,
304
- name: e.value.style.chart.yAxis.labels.axisNames[o] || `Y-${o + 1}`
305
- });
306
- }
307
- return t;
308
- }), re = p(() => ue.value.map((t, o) => ({
309
- ...t,
310
- series: t.series.map((a, s) => ({
311
- ...a,
312
- datapoints: a.values.map((l, r) => {
313
- const i = f.value[r].scale.min < 0 ? (l || 0) + Math.abs(f.value[r].scale.min) : (l || 0) - Math.abs(f.value[r].scale.min), T = f.value[r].scale.min < 0 ? f.value[r].scale.max + Math.abs(f.value[r].scale.min) : f.value[r].scale.max - Math.abs(f.value[r].scale.min);
314
- return {
315
- name: a.name,
316
- seriesName: t.name,
317
- axisIndex: r,
318
- datapointIndex: s,
319
- seriesIndex: o,
320
- value: l || 0,
321
- x: h.value.left + C.value * r + C.value / 2,
322
- y: h.value.bottom - h.value.height * (i / T),
323
- comment: a.comments && a.comments[r] || ""
324
- };
325
- })
326
- }))
327
- })).map((t) => ({
328
- ...t,
329
- series: t.series.map((o) => {
330
- const a = Xt(o.datapoints), s = Yt(o.datapoints), l = qt(e.value.style.chart.lines.smooth ? `M ${s}` : `M ${a}`);
331
- return {
332
- ...o,
333
- smoothPath: s,
334
- straightPath: a,
335
- pathLength: l
336
- };
337
- })
338
- })));
339
- function Ee({ value: t, index: o, datapoint: a }) {
340
- return tt(
341
- e.value.style.chart.yAxis.labels.formatters[o] || null,
342
- t,
343
- at({
344
- p: e.value.style.chart.yAxis.labels.prefixes[o] || "",
345
- v: t,
346
- s: e.value.style.chart.yAxis.labels.suffixes[o] || "",
347
- r: e.value.style.chart.yAxis.labels.roundings[o] || 0
348
- }),
349
- { datapoint: a, seriesIndex: o }
350
- );
351
- }
352
- const w = d(null), ce = d(null), ve = d(!1), de = d("");
353
- function q({ shape: t, serie: o, S: a }) {
354
- e.value.events.datapointLeave && e.value.events.datapointLeave({ datapoint: { ...o, shape: t }, seriesIndex: a }), w.value = null, ve.value = null;
355
- }
356
- function Q({ shape: t, serieName: o, serie: a, relativeIndex: s, seriesIndex: l, S: r }) {
357
- e.value.events.datapointEnter && e.value.events.datapointEnter({ datapoint: { ...a, shape: t }, seriesIndex: r }), ce.value = { serie: a, relativeIndex: s, seriesIndex: l, series: L.value, scales: f.value }, ve.value = !0, w.value = a.id;
358
- let i = "";
359
- const T = e.value.style.chart.tooltip.customFormat;
360
- et(T) && ea(() => T({
361
- serie: a,
362
- seriesIndex: a.seriesIndex,
363
- series: L.value,
364
- config: e.value,
365
- scales: f.value
366
- })) ? de.value = T({
367
- serie: a,
368
- seriesIndex: a.seriesIndex,
369
- series: L.value,
370
- config: e.value,
371
- scales: f.value
372
- }) : (i += `<div style="width:100%;text-align:center;border-bottom:1px solid ${e.value.style.chart.tooltip.borderColor};padding-bottom:6px;margin-bottom:3px;">${o ? o + " - " : ""}${a.name}</div>`, f.value.map((x) => x.name).forEach((x, k) => {
373
- i += `
374
- <div class="vue-ui-tooltip-item" style="text-align:left">
375
- <span>${x}: </span>
376
- <span>
377
- ${tt(
378
- e.value.style.chart.yAxis.labels.formatters[k] || null,
379
- a.datapoints[k].value,
380
- at({
381
- p: e.value.style.chart.yAxis.labels.prefixes[k] || "",
382
- v: a.datapoints[k].value,
383
- s: e.value.style.chart.yAxis.labels.suffixes[k] || "",
384
- r: e.value.style.chart.yAxis.labels.roundings[k] || ""
385
- }),
386
- { datapoint: a.datapoints[k], seriesIndex: k }
387
- )}
388
- </span>
389
- </div>
390
- `, e.value.style.chart.comments.showInTooltip && a.datapoints[k].comment && (i += `<div class="vue-data-ui-tooltip-comment" style="background:${a.color}20; padding: 6px; margin-bottom: 6px; border-left: 1px solid ${a.color}">${a.datapoints[k].comment}</div>`);
391
- }), de.value = `<div>${i}</div>`);
392
- }
393
- function wt() {
394
- return L.value;
395
- }
396
- const H = p(() => {
397
- const t = [e.value.table.columnNames.series].concat([e.value.table.columnNames.item]).concat(f.value.map((l) => l.name)), o = re.value.flatMap((l, r) => l.series.map((i) => [l.name].concat([i.name]).concat(i.values))), a = {
398
- th: {
399
- backgroundColor: e.value.table.th.backgroundColor,
400
- color: e.value.table.th.color,
401
- outline: e.value.table.th.outline
402
- },
403
- td: {
404
- backgroundColor: e.value.table.td.backgroundColor,
405
- color: e.value.table.td.color,
406
- outline: e.value.table.td.outline
407
- },
408
- breakpoint: e.value.table.responsiveBreakpoint
409
- }, s = [e.value.table.columnNames.series].concat([e.value.table.columnNames.item]).concat(f.value.map((l) => l.name));
410
- return {
411
- body: o,
412
- head: t,
413
- config: a,
414
- colNames: s
415
- };
416
- }), He = p(() => re.value.length === 0 ? { head: [], body: [], config: {}, columnNames: [] } : {
417
- head: H.value.head,
418
- body: H.value.body
419
- });
420
- function he(t = null) {
421
- const o = [[e.value.style.chart.title.text], [e.value.style.chart.title.subtitle.text], [""]], a = He.value.head, s = He.value.body, l = o.concat([a]).concat(s), r = Kt(l);
422
- t ? t(r) : Zt({ csvContent: r, title: e.value.style.chart.title.text || "vue-ui-parallel-coordinate-plot" });
423
- }
424
- const We = it;
425
- function J({ serie: t, shape: o, S: a }) {
426
- e.value.events.datapointClick && e.value.events.datapointClick({ datapoint: { ...t, shape: o }, seriesIndex: a }), We("selectDatapoint", t);
427
- }
428
- function Ue(t) {
429
- We("selectLegend", {
430
- ...t,
431
- isSegregated: !t.isSegregated,
432
- opacity: t.isSegregated ? 1 : 0.5
433
- });
434
- }
435
- function Ve() {
436
- m.value.showTable = !m.value.showTable;
437
- }
438
- function Ge() {
439
- m.value.dataLabels.show = !m.value.dataLabels.show;
440
- }
441
- function je() {
442
- m.value.showTooltip = !m.value.showTooltip;
443
- }
444
- const K = d(!1);
445
- function pe() {
446
- K.value = !K.value;
447
- }
448
- async function Ct({ scale: t = 2 } = {}) {
449
- if (!z.value) return;
450
- const { width: o, height: a } = z.value.getBoundingClientRect(), s = o / a, { imageUri: l, base64: r } = await pa({ domElement: z.value, base64: !0, img: !0, scale: t });
451
- return {
452
- imageUri: l,
453
- base64: r,
454
- title: e.value.style.chart.title.text,
455
- width: o,
456
- height: a,
457
- aspectRatio: s
458
- };
459
- }
460
- const At = d({ start: 0, end: 1 }), $t = p(() => f.value.map((t) => t.name));
461
- ra({
462
- timeLabelsEls: le,
463
- timeLabels: $t,
464
- slicer: At,
465
- configRef: e,
466
- rotationPath: ["style", "chart", "yAxis", "labels", "axisNamesRotation"],
467
- autoRotatePath: ["style", "chart", "yAxis", "labels", "axisNamesAutoRotate", "enable"],
468
- isAutoSize: !1,
469
- width: Pe,
470
- height: Oe,
471
- targetClass: ".vue-ui-parallel-coordinate-plot-x-label",
472
- rotation: e.value.style.chart.yAxis.labels.axisNamesAutoRotate.angle
473
- });
474
- const j = p(() => {
475
- const t = e.value.table.useDialog && !e.value.table.show, o = m.value.showTable;
476
- return {
477
- component: t ? mt : ct,
478
- title: `${e.value.style.chart.title.text}${e.value.style.chart.title.subtitle.text ? `: ${e.value.style.chart.title.subtitle.text}` : ""}`,
479
- props: t ? {
480
- backgroundColor: e.value.table.th.backgroundColor,
481
- color: e.value.table.th.color,
482
- headerColor: e.value.table.th.color,
483
- headerBg: e.value.table.th.backgroundColor,
484
- isFullscreen: D.value,
485
- fullscreenParent: z.value,
486
- forcedWidth: Math.min(800, window.innerWidth * 0.8)
487
- } : {
488
- hideDetails: !0,
489
- config: {
490
- open: o,
491
- maxHeight: 1e4,
492
- body: {
493
- backgroundColor: e.value.style.chart.backgroundColor,
494
- color: e.value.style.chart.color
495
- },
496
- head: {
497
- backgroundColor: e.value.style.chart.backgroundColor,
498
- color: e.value.style.chart.color
499
- }
500
- }
501
- }
502
- };
503
- });
504
- Z(() => m.value.showTable, (t) => {
505
- e.value.table.show || (t && e.value.table.useDialog && V.value ? V.value.open() : "close" in V.value && V.value.close());
506
- });
507
- function Xe() {
508
- m.value.showTable = !1, ae.value && ae.value.setTableIconState(!1);
509
- }
510
- const Tt = p(() => e.value.style.chart.backgroundColor), zt = p(() => e.value.style.chart.legend), Ft = p(() => e.value.style.chart.title), { exportSvg: Mt, getSvg: _t } = na({
511
- svg: ne,
512
- title: Ft,
513
- legend: zt,
514
- legendItems: Re,
515
- backgroundColor: Tt
516
- });
517
- async function Ye({ isCb: t }) {
518
- if (t) {
519
- const { blob: o, url: a, text: s, dataUrl: l } = await _t();
520
- e.value.userOptions.callbacks.svg({ blob: o, url: a, text: s, dataUrl: l });
521
- } else
522
- Mt();
523
- }
524
- return nt({
525
- getData: wt,
526
- getImage: Ct,
527
- generateCsv: he,
528
- generatePdf: Se,
529
- generateImage: Le,
530
- generateSvg: Ye,
531
- toggleTable: Ve,
532
- toggleLabels: Ge,
533
- toggleTooltip: je,
534
- toggleAnnotator: pe,
535
- toggleFullscreen: Te
536
- }), (t, o) => (n(), u("div", {
537
- ref_key: "pcpChart",
538
- ref: z,
539
- class: X(`vue-data-ui-component vue-ui-pcp ${D.value ? "vue-data-ui-wrapper-fullscreen" : ""} ${e.value.useCssAnimation ? "" : "vue-ui-dna"}`),
540
- style: M(`font-family:${e.value.style.fontFamily};width:100%; text-align:center;background:${e.value.style.chart.backgroundColor};${e.value.responsive ? "height:100%" : ""}`),
541
- id: `pcp_${O.value}`,
542
- onMouseenter: o[2] || (o[2] = () => v(ze)(!0)),
543
- onMouseleave: o[3] || (o[3] = () => v(ze)(!1))
544
- }, [
545
- e.value.userOptions.buttons.annotator ? (n(), _(v(dt), {
546
- key: 0,
547
- svgRef: v(ne),
548
- backgroundColor: e.value.style.chart.backgroundColor,
549
- color: e.value.style.chart.color,
550
- active: K.value,
551
- onClose: pe
552
- }, null, 8, ["svgRef", "backgroundColor", "color", "active"])) : y("", !0),
553
- gt.value ? (n(), u("div", {
554
- key: 1,
555
- ref_key: "noTitle",
556
- ref: ke,
557
- class: "vue-data-ui-no-title-space",
558
- style: "height:36px; width: 100%;background:transparent"
559
- }, null, 512)) : y("", !0),
560
- e.value.style.chart.title.text ? (n(), u("div", {
561
- key: 2,
562
- ref_key: "chartTitle",
563
- ref: ge,
564
- style: "width:100%;background:transparent;padding-bottom:24px"
565
- }, [
566
- (n(), _(va, {
567
- key: `title_${we.value}`,
568
- config: {
569
- title: {
570
- cy: "pcp-div-title",
571
- ...e.value.style.chart.title
572
- },
573
- subtitle: {
574
- cy: "pcp-div-subtitle",
575
- ...e.value.style.chart.title.subtitle
576
- }
577
- }
578
- }, null, 8, ["config"]))
579
- ], 512)) : y("", !0),
580
- N("div", {
581
- id: `legend-top-${O.value}`
582
- }, null, 8, fa),
583
- e.value.userOptions.show && Y.value && (v(Fe) || v(se)) ? (n(), _(v(ht), {
584
- ref_key: "userOptionsRef",
585
- ref: ae,
586
- key: `user_options_${fe.value}`,
587
- backgroundColor: e.value.style.chart.backgroundColor,
588
- color: e.value.style.chart.color,
589
- isPrinting: v(Ne),
590
- isImaging: v(Ie),
591
- uid: O.value,
592
- hasTooltip: e.value.userOptions.buttons.tooltip && e.value.style.chart.tooltip.show,
593
- hasPdf: e.value.userOptions.buttons.pdf,
594
- hasXls: e.value.userOptions.buttons.csv,
595
- hasImg: e.value.userOptions.buttons.img,
596
- hasSvg: e.value.userOptions.buttons.svg,
597
- hasTable: e.value.userOptions.buttons.table,
598
- hasLabel: e.value.userOptions.buttons.labels,
599
- hasFullscreen: e.value.userOptions.buttons.fullscreen,
600
- isFullscreen: D.value,
601
- isTooltip: m.value.showTooltip,
602
- titles: { ...e.value.userOptions.buttonTitles },
603
- chartElement: z.value,
604
- position: e.value.userOptions.position,
605
- hasAnnotator: e.value.userOptions.buttons.annotator,
606
- isAnnotation: K.value,
607
- callbacks: e.value.userOptions.callbacks,
608
- printScale: e.value.userOptions.print.scale,
609
- tableDialog: e.value.table.useDialog,
610
- onToggleFullscreen: Te,
611
- onGeneratePdf: v(Se),
612
- onGenerateCsv: he,
613
- onGenerateImage: v(Le),
614
- onGenerateSvg: Ye,
615
- onToggleTable: Ve,
616
- onToggleLabels: Ge,
617
- onToggleTooltip: je,
618
- onToggleAnnotator: pe,
619
- style: M({
620
- visibility: v(Fe) ? v(se) ? "visible" : "hidden" : "visible"
621
- })
622
- }, Qe({ _: 2 }, [
623
- t.$slots.menuIcon ? {
624
- name: "menuIcon",
625
- fn: g(({ isOpen: a, color: s }) => [
626
- b(t.$slots, "menuIcon", W(U({ isOpen: a, color: s })), void 0, !0)
627
- ]),
628
- key: "0"
629
- } : void 0,
630
- t.$slots.optionPdf ? {
631
- name: "optionPdf",
632
- fn: g(() => [
633
- b(t.$slots, "optionPdf", {}, void 0, !0)
634
- ]),
635
- key: "1"
636
- } : void 0,
637
- t.$slots.optionCsv ? {
638
- name: "optionCsv",
639
- fn: g(() => [
640
- b(t.$slots, "optionCsv", {}, void 0, !0)
641
- ]),
642
- key: "2"
643
- } : void 0,
644
- t.$slots.optionImg ? {
645
- name: "optionImg",
646
- fn: g(() => [
647
- b(t.$slots, "optionImg", {}, void 0, !0)
648
- ]),
649
- key: "3"
650
- } : void 0,
651
- t.$slots.optionSvg ? {
652
- name: "optionSvg",
653
- fn: g(() => [
654
- b(t.$slots, "optionSvg", {}, void 0, !0)
655
- ]),
656
- key: "4"
657
- } : void 0,
658
- t.$slots.optionTable ? {
659
- name: "optionTable",
660
- fn: g(() => [
661
- b(t.$slots, "optionTable", {}, void 0, !0)
662
- ]),
663
- key: "5"
664
- } : void 0,
665
- t.$slots.optionLabels ? {
666
- name: "optionLabels",
667
- fn: g(() => [
668
- b(t.$slots, "optionLabels", {}, void 0, !0)
669
- ]),
670
- key: "6"
671
- } : void 0,
672
- t.$slots.optionFullscreen ? {
673
- name: "optionFullscreen",
674
- fn: g(({ toggleFullscreen: a, isFullscreen: s }) => [
675
- b(t.$slots, "optionFullscreen", W(U({ toggleFullscreen: a, isFullscreen: s })), void 0, !0)
676
- ]),
677
- key: "7"
678
- } : void 0,
679
- t.$slots.optionAnnotator ? {
680
- name: "optionAnnotator",
681
- fn: g(({ toggleAnnotator: a, isAnnotator: s }) => [
682
- b(t.$slots, "optionAnnotator", W(U({ toggleAnnotator: a, isAnnotator: s })), void 0, !0)
683
- ]),
684
- key: "8"
685
- } : void 0
686
- ]), 1032, ["backgroundColor", "color", "isPrinting", "isImaging", "uid", "hasTooltip", "hasPdf", "hasXls", "hasImg", "hasSvg", "hasTable", "hasLabel", "hasFullscreen", "isFullscreen", "isTooltip", "titles", "chartElement", "position", "hasAnnotator", "isAnnotation", "callbacks", "printScale", "tableDialog", "onGeneratePdf", "onGenerateImage", "style"])) : y("", !0),
687
- (n(), u("svg", {
688
- ref_key: "svgRef",
689
- ref: ne,
690
- xmlns: v(Qt),
691
- class: X({ "vue-data-ui-fullscreen--on": D.value, "vue-data-ui-fulscreen--off": !D.value }),
692
- viewBox: `0 0 ${h.value.chartWidth <= 0 ? 10 : h.value.chartWidth} ${h.value.chartHeight <= 0 ? 10 : h.value.chartHeight}`,
693
- style: M(`max-width:100%; overflow: visible; background:transparent;color:${e.value.style.chart.color}`)
694
- }, [
695
- me(v(pt)),
696
- t.$slots["chart-background"] ? (n(), u("foreignObject", {
697
- key: 0,
698
- x: h.value.left,
699
- y: h.value.top,
700
- width: h.value.width,
701
- height: h.value.height,
702
- style: {
703
- pointerEvents: "none"
704
- }
705
- }, [
706
- b(t.$slots, "chart-background", {}, void 0, !0)
707
- ], 8, ba)) : y("", !0),
708
- (n(!0), u(A, null, I(f.value, (a, s) => (n(), u("g", xa, [
709
- N("line", {
710
- x1: h.value.left + C.value * s + C.value / 2,
711
- x2: h.value.left + C.value * s + C.value / 2,
712
- y1: h.value.top,
713
- y2: h.value.bottom,
714
- stroke: e.value.style.chart.yAxis.stroke,
715
- "stroke-width": e.value.style.chart.yAxis.strokeWidth
716
- }, null, 8, ka),
717
- e.value.style.chart.yAxis.labels.ticks.show ? (n(), u(A, { key: 0 }, [
718
- (n(!0), u(A, null, I(a.ticks, (l) => (n(), u("line", {
719
- x1: l.x,
720
- x2: l.x - 10,
721
- y1: l.y,
722
- y2: l.y,
723
- stroke: e.value.style.chart.yAxis.stroke,
724
- "stroke-width": e.value.style.chart.yAxis.strokeWidth,
725
- style: M(`opacity:${w.value && !m.value.showTooltip ? 0.2 : 1}`)
726
- }, null, 12, wa))), 256)),
727
- v(R) ? y("", !0) : (n(), u("g", Ca, [
728
- (n(!0), u(A, null, I(a.ticks, (l) => (n(), u("text", {
729
- x: l.x - 12 + e.value.style.chart.yAxis.labels.ticks.offsetX,
730
- y: l.y + e.value.style.chart.yAxis.labels.ticks.offsetY + c.value.ticksFontSize / 3,
731
- fill: e.value.style.chart.yAxis.labels.ticks.color,
732
- "text-anchor": "end",
733
- "font-size": c.value.ticksFontSize,
734
- "font-weight": e.value.style.chart.yAxis.labels.ticks.bold ? "bold" : "normal",
735
- style: M(`opacity:${w.value && !m.value.showTooltip ? 0.2 : 1}`)
736
- }, B(Ee({ value: l.value, index: s, datapoint: l })), 13, Aa))), 256))
737
- ]))
738
- ], 64)) : y("", !0)
739
- ]))), 256)),
740
- e.value.style.chart.yAxis.labels.showAxisNames ? (n(), u("g", {
741
- key: 1,
742
- ref_key: "xAxisLabels",
743
- ref: le
744
- }, [
745
- (n(!0), u(A, null, I(f.value, (a, s) => (n(), u(A, null, [
746
- String(a.name).includes(`
747
- `) ? (n(), u("text", {
748
- key: 1,
749
- class: "vue-ui-parallel-coordinate-plot-x-label",
750
- fill: e.value.style.chart.yAxis.labels.axisNamesColor,
751
- "font-size": c.value.axisNameFontSize,
752
- "font-weight": e.value.style.chart.yAxis.labels.axisNamesBold ? "bold" : "",
753
- "text-anchor": e.value.style.chart.yAxis.labels.axisNamesRotation === 0 ? "middle" : e.value.style.chart.yAxis.labels.axisNamesRotation < 0 ? "start" : "end",
754
- transform: `translate(${h.value.left + C.value * s + C.value / 2}, ${G.value - c.value.axisNameFontSize}), rotate(${e.value.style.chart.yAxis.labels.axisNamesRotation})`,
755
- innerHTML: v(Jt)({
756
- content: String(a.name),
757
- fontSize: c.value.axisNameFontSize,
758
- fill: e.value.style.chart.yAxis.labels.axisNamesColor,
759
- x: 0,
760
- y: 0
761
- })
762
- }, null, 8, Ta)) : (n(), u("text", {
763
- key: 0,
764
- class: "vue-ui-parallel-coordinate-plot-x-label",
765
- fill: e.value.style.chart.yAxis.labels.axisNamesColor,
766
- "font-size": c.value.axisNameFontSize,
767
- "font-weight": e.value.style.chart.yAxis.labels.axisNamesBold ? "bold" : "",
768
- "text-anchor": e.value.style.chart.yAxis.labels.axisNamesRotation === 0 ? "middle" : e.value.style.chart.yAxis.labels.axisNamesRotation < 0 ? "start" : "end",
769
- transform: `translate(${h.value.left + C.value * s + C.value / 2}, ${G.value - c.value.axisNameFontSize}), rotate(${e.value.style.chart.yAxis.labels.axisNamesRotation})`
770
- }, B(a.name), 9, $a))
771
- ], 64))), 256))
772
- ], 512)) : y("", !0),
773
- (n(!0), u(A, null, I(re.value, (a, s) => (n(), u("g", null, [
774
- (n(!0), u(A, null, I(a.series, (l, r) => (n(), u("g", null, [
775
- e.value.style.chart.plots.show ? (n(), u("g", za, [
776
- (n(!0), u(A, null, I(l.datapoints, (i, T) => (n(), _(ha, {
777
- plot: { x: i.x, y: i.y },
778
- color: a.color,
779
- shape: a.shape,
780
- radius: a.shape === "triangle" ? c.value.plotSize * 1.2 : c.value.plotSize,
781
- stroke: e.value.style.chart.backgroundColor,
782
- strokeWidth: 0.5,
783
- onMouseenter: (x) => Q({
784
- shape: a.shape,
785
- serieName: a.name,
786
- serie: l,
787
- relativeIndex: r,
788
- seriesIndex: l.seriesIndex,
789
- S: s
790
- }),
791
- onMouseleave: (x) => q({ serie: l, shape: a.shape, S: s }),
792
- style: M(`opacity:${w.value ? w.value === l.id ? e.value.style.chart.plots.opacity : 0.2 : e.value.style.chart.plots.opacity}`),
793
- onClick: () => J({ serie: l, shape: a.shape, S: s })
794
- }, null, 8, ["plot", "color", "shape", "radius", "stroke", "onMouseenter", "onMouseleave", "style", "onClick"]))), 256)),
795
- m.value.showTooltip ? y("", !0) : (n(), u(A, { key: 0 }, [
796
- w.value && w.value === l.id && l.datapoints.length ? (n(), u("text", {
797
- key: 0,
798
- x: l.datapoints[0].x - c.value.ticksFontSize,
799
- y: l.datapoints[0].y + c.value.ticksFontSize / 3,
800
- "text-anchor": "end",
801
- "font-size": c.value.ticksFontSize,
802
- fill: a.color,
803
- "font-weight": "bold"
804
- }, B(l.name), 9, Fa)) : y("", !0)
805
- ], 64)),
806
- e.value.style.chart.comments.show ? (n(!0), u(A, { key: 1 }, I(l.datapoints, (i) => (n(), u("g", null, [
807
- i.comment ? (n(), u("foreignObject", {
808
- key: 0,
809
- style: { overflow: "visible" },
810
- height: "12",
811
- width: e.value.style.chart.comments.width,
812
- x: i.x - e.value.style.chart.comments.width / 2 + e.value.style.chart.comments.offsetX,
813
- y: i.y + e.value.style.chart.comments.offsetY + 6
814
- }, [
815
- N("div", _a, [
816
- b(t.$slots, "plot-comment", {
817
- plot: { ...i, color: a.color }
818
- }, void 0, !0)
819
- ])
820
- ], 8, Ma)) : y("", !0)
821
- ]))), 256)) : y("", !0)
822
- ])) : y("", !0),
823
- !v(R) && (m.value.dataLabels.show || w.value && w.value === l.id) ? (n(!0), u(A, { key: 1 }, I(l.datapoints, (i, T) => (n(), u("text", {
824
- x: i.x + 12 + e.value.style.chart.yAxis.labels.datapoints.offsetX,
825
- y: i.y + e.value.style.chart.yAxis.labels.datapoints.offsetY + c.value.datapointFontSize / 3,
826
- fill: e.value.style.chart.yAxis.labels.datapoints.useSerieColor ? a.color : e.value.style.chart.yAxis.labels.datapoints.color,
827
- "text-anchor": "start",
828
- "font-weight": e.value.style.chart.yAxis.labels.datapoints.bold ? "bold" : "normal",
829
- class: X({ "vue-ui-pcp-animated": !1, "vue-ui-pcp-transition": !v(R) }),
830
- "font-size": c.value.datapointFontSize,
831
- onMouseenter: (x) => Q({
832
- shape: a.shape,
833
- serieName: a.name,
834
- serie: l,
835
- relativeIndex: r,
836
- seriesIndex: l.seriesIndex,
837
- S: s
838
- }),
839
- onMouseleave: (x) => q({ serie: l, shape: a.shape, S: s }),
840
- onClick: () => J({ serie: l, shape: a.shape, S: s }),
841
- style: M(`opacity:${w.value ? w.value === l.id ? 1 : 0.2 : 1}`)
842
- }, B(Ee({ value: i.value, index: T, datapoint: i })), 47, Na))), 256)) : y("", !0),
843
- N("path", {
844
- d: `M${e.value.style.chart.lines.smooth ? l.smoothPath : l.straightPath}`,
845
- stroke: a.color,
846
- "stroke-width": e.value.style.chart.lines.strokeWidth,
847
- fill: "none",
848
- class: X({ "vue-ui-pcp-animated vue-data-ui-line-animated": e.value.useCssAnimation, "vue-ui-pcp-transition": !v(R) }),
849
- onMouseenter: (i) => Q({
850
- shape: a.shape,
851
- serieName: a.name,
852
- serie: l,
853
- relativeIndex: r,
854
- seriesIndex: l.seriesIndex,
855
- S: s
856
- }),
857
- onMouseleave: (i) => q({ serie: l, shape: a.shape, S: s }),
858
- onClick: () => J({ serie: l, shape: a.shape, S: s }),
859
- style: M(`opacity:${w.value ? w.value === l.id ? e.value.style.chart.lines.opacity : 0.2 : e.value.style.chart.lines.opacity}; stroke-dasharray:${l.pathLength}; stroke-dashoffset: ${e.value.useCssAnimation ? l.pathLength : 0}`)
860
- }, null, 46, Ia),
861
- m.value.showTooltip ? (n(), u("path", {
862
- key: 2,
863
- d: `M${e.value.style.chart.lines.smooth ? l.smoothPath : l.straightPath}`,
864
- stroke: "transparent",
865
- "stroke-width": 12,
866
- fill: "none",
867
- class: X({ "vue-ui-pcp-animated vue-data-ui-line-animated": e.value.useCssAnimation, "vue-ui-pcp-transition": !v(R) }),
868
- onMouseenter: (i) => Q({
869
- shape: a.shape,
870
- serieName: a.name,
871
- serie: l,
872
- relativeIndex: r,
873
- seriesIndex: l.seriesIndex,
874
- S: s
875
- }),
876
- onMouseleave: (i) => q({ serie: l, shape: a.shape, S: s }),
877
- onClick: () => J({ serie: l, shape: a.shape, S: s }),
878
- style: { opacity: "0" }
879
- }, null, 42, Sa)) : y("", !0)
880
- ]))), 256))
881
- ]))), 256)),
882
- b(t.$slots, "svg", { svg: h.value }, void 0, !0)
883
- ], 14, ga)),
884
- t.$slots.watermark ? (n(), u("div", La, [
885
- b(t.$slots, "watermark", W(U({ isPrinting: v(Ne) || v(Ie) })), void 0, !0)
886
- ])) : y("", !0),
887
- N("div", {
888
- id: `legend-bottom-${O.value}`
889
- }, null, 8, Pa),
890
- $e.value ? (n(), _(Dt, {
891
- key: 5,
892
- to: e.value.style.chart.legend.position === "top" ? `#legend-top-${O.value}` : `#legend-bottom-${O.value}`
893
- }, [
894
- N("div", {
895
- ref_key: "chartLegend",
896
- ref: be
897
- }, [
898
- e.value.style.chart.legend.show && Y.value ? (n(), _(da, {
899
- key: `legend_${Ce.value}`,
900
- legendSet: Re.value,
901
- config: kt.value,
902
- onClickMarker: o[0] || (o[0] = ({ legend: a }) => {
903
- De(a.id), Ue(a);
904
- })
905
- }, {
906
- item: g(({ legend: a, index: s }) => [
907
- N("div", {
908
- onClick: (l) => {
909
- a.segregate(), Ue(a);
910
- },
911
- style: M(`opacity:${F.value.includes(a.id) ? 0.5 : 1}`)
912
- }, B(a.name), 13, Oa)
913
- ]),
914
- _: 1
915
- }, 8, ["legendSet", "config"])) : b(t.$slots, "legend", {
916
- key: 1,
917
- legend: L.value
918
- }, void 0, !0)
919
- ], 512)
920
- ], 8, ["to"])) : y("", !0),
921
- t.$slots.source ? (n(), u("div", {
922
- key: 6,
923
- ref_key: "source",
924
- ref: xe,
925
- dir: "auto"
926
- }, [
927
- b(t.$slots, "source", {}, void 0, !0)
928
- ], 512)) : y("", !0),
929
- me(v(ut), {
930
- show: m.value.showTooltip && ve.value,
931
- backgroundColor: e.value.style.chart.tooltip.backgroundColor,
932
- color: e.value.style.chart.tooltip.color,
933
- fontSize: e.value.style.chart.tooltip.fontSize,
934
- borderRadius: e.value.style.chart.tooltip.borderRadius,
935
- borderColor: e.value.style.chart.tooltip.borderColor,
936
- borderWidth: e.value.style.chart.tooltip.borderWidth,
937
- backgroundOpacity: e.value.style.chart.tooltip.backgroundOpacity,
938
- position: e.value.style.chart.tooltip.position,
939
- offsetY: e.value.style.chart.tooltip.offsetY,
940
- parent: z.value,
941
- content: de.value,
942
- isFullscreen: D.value,
943
- isCustom: v(et)(e.value.style.chart.tooltip.customFormat),
944
- smooth: e.value.style.chart.tooltip.smooth,
945
- backdropFilter: e.value.style.chart.tooltip.backdropFilter,
946
- smoothForce: e.value.style.chart.tooltip.smoothForce,
947
- smoothSnapThreshold: e.value.style.chart.tooltip.smoothSnapThreshold
948
- }, {
949
- "tooltip-before": g(() => [
950
- b(t.$slots, "tooltip-before", W(U({ ...ce.value })), void 0, !0)
951
- ]),
952
- "tooltip-after": g(() => [
953
- b(t.$slots, "tooltip-after", W(U({ ...ce.value })), void 0, !0)
954
- ]),
955
- _: 3
956
- }, 8, ["show", "backgroundColor", "color", "fontSize", "borderRadius", "borderColor", "borderWidth", "backgroundOpacity", "position", "offsetY", "parent", "content", "isFullscreen", "isCustom", "smooth", "backdropFilter", "smoothForce", "smoothSnapThreshold"]),
957
- Y.value && e.value.userOptions.buttons.table ? (n(), _(Rt(j.value.component), Bt({ key: 7 }, j.value.props, {
958
- ref_key: "tableUnit",
959
- ref: V,
960
- onClose: Xe
961
- }), Qe({
962
- content: g(() => [
963
- (n(), _(v(vt), {
964
- key: `table_${Ae.value}`,
965
- colNames: H.value.colNames,
966
- head: H.value.head,
967
- body: H.value.body,
968
- config: H.value.config,
969
- title: e.value.table.useDialog ? "" : j.value.title,
970
- withCloseButton: !e.value.table.useDialog,
971
- onClose: Xe
972
- }, {
973
- th: g(({ th: a }) => [
974
- N("div", { innerHTML: a }, null, 8, Da)
975
- ]),
976
- td: g(({ td: a }) => [
977
- Je(B(a), 1)
978
- ]),
979
- _: 1
980
- }, 8, ["colNames", "head", "body", "config", "title", "withCloseButton"]))
981
- ]),
982
- _: 2
983
- }, [
984
- e.value.table.useDialog ? {
985
- name: "title",
986
- fn: g(() => [
987
- Je(B(j.value.title), 1)
988
- ]),
989
- key: "0"
990
- } : void 0,
991
- e.value.table.useDialog ? {
992
- name: "actions",
993
- fn: g(() => [
994
- N("button", {
995
- tabindex: "0",
996
- class: "vue-ui-user-options-button",
997
- onClick: o[1] || (o[1] = (a) => he(e.value.userOptions.callbacks.csv))
998
- }, [
999
- me(v(rt), {
1000
- name: "excel",
1001
- stroke: j.value.props.color
1002
- }, null, 8, ["stroke"])
1003
- ])
1004
- ]),
1005
- key: "1"
1006
- } : void 0
1007
- ]), 1040)) : y("", !0),
1008
- v(R) ? (n(), _(sa, { key: 8 })) : y("", !0)
1009
- ], 46, ya));
1010
- }
1011
- }, tl = /* @__PURE__ */ ma(Ra, [["__scopeId", "data-v-108a7f28"]]);
1012
- export {
1013
- tl as default
1014
- };