vue-data-ui 3.4.8 → 3.5.0
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.
- package/README.md +88 -37
- package/dist/{PackageVersion-D-auaEEJ.js → PackageVersion-Cyx_s25h.js} +1 -1
- package/dist/components/vue-ui-3d-bar.js +1 -1
- package/dist/components/vue-ui-age-pyramid.js +1 -1
- package/dist/components/vue-ui-bullet.js +1 -1
- package/dist/components/vue-ui-candlestick.js +1 -1
- package/dist/components/vue-ui-carousel-table.js +1 -1
- package/dist/components/vue-ui-chestnut.js +1 -1
- package/dist/components/vue-ui-chord.js +1 -1
- package/dist/components/vue-ui-circle-pack.js +1 -1
- package/dist/components/vue-ui-dashboard.js +1 -1
- package/dist/components/vue-ui-donut-evolution.js +1 -1
- package/dist/components/vue-ui-donut.js +1 -1
- package/dist/components/vue-ui-dumbbell.js +1 -1
- package/dist/components/vue-ui-flow.js +1 -1
- package/dist/components/vue-ui-funnel.js +1 -1
- package/dist/components/vue-ui-galaxy.js +1 -1
- package/dist/components/vue-ui-gauge.js +1 -1
- package/dist/components/vue-ui-gizmo.js +1 -1
- package/dist/components/vue-ui-heatmap.js +1 -1
- package/dist/components/vue-ui-history-plot.js +1 -1
- package/dist/components/vue-ui-horizontal-bar.js +1 -1
- package/dist/components/vue-ui-molecule.js +1 -1
- package/dist/components/vue-ui-mood-radar.js +1 -1
- package/dist/components/vue-ui-nested-donuts.js +1 -1
- package/dist/components/vue-ui-onion.js +1 -1
- package/dist/components/vue-ui-parallel-coordinate-plot.js +1 -1
- package/dist/components/vue-ui-quadrant.js +1 -1
- package/dist/components/vue-ui-quick-chart.js +1 -1
- package/dist/components/vue-ui-radar.js +1 -1
- package/dist/components/vue-ui-relation-circle.js +1 -1
- package/dist/components/vue-ui-ridgeline.js +1 -1
- package/dist/components/vue-ui-rings.js +1 -1
- package/dist/components/vue-ui-scatter.js +1 -1
- package/dist/components/vue-ui-skeleton.js +1 -1
- package/dist/components/vue-ui-spark-trend.js +1 -1
- package/dist/components/vue-ui-sparkbar.js +1 -1
- package/dist/components/vue-ui-sparkgauge.js +1 -1
- package/dist/components/vue-ui-sparkhistogram.js +1 -1
- package/dist/components/vue-ui-sparkline.js +1 -1
- package/dist/components/vue-ui-sparkstackbar.js +1 -1
- package/dist/components/vue-ui-stackbar.js +1 -1
- package/dist/components/vue-ui-strip-plot.js +1 -1
- package/dist/components/vue-ui-table-sparkline.js +1 -1
- package/dist/components/vue-ui-table.js +1 -1
- package/dist/components/vue-ui-thermometer.js +1 -1
- package/dist/components/vue-ui-timer.js +1 -1
- package/dist/components/vue-ui-tiremarks.js +1 -1
- package/dist/components/vue-ui-treemap.js +1 -1
- package/dist/components/vue-ui-vertical-bar.js +1 -1
- package/dist/components/vue-ui-waffle.js +1 -1
- package/dist/components/vue-ui-wheel.js +1 -1
- package/dist/components/vue-ui-word-cloud.js +1 -1
- package/dist/components/vue-ui-world.js +1 -1
- package/dist/components/vue-ui-xy-canvas.js +1 -1
- package/dist/components/vue-ui-xy.js +1 -1
- package/dist/style.css +1 -1
- package/dist/{vue-data-ui-CzqHcPqG.js → vue-data-ui-DxgRqCAo.js} +104 -98
- package/dist/vue-data-ui.js +54 -54
- package/dist/{vue-ui-3d-bar-CwXiD8zD.js → vue-ui-3d-bar-DmNJp8SY.js} +1 -1
- package/dist/{vue-ui-age-pyramid-DlEPlWmV.js → vue-ui-age-pyramid-CPAP3sNY.js} +1 -1
- package/dist/{vue-ui-bullet-DtzpeIu4.js → vue-ui-bullet-Ce6uvCQJ.js} +1 -1
- package/dist/{vue-ui-candlestick-DzoiyaeB.js → vue-ui-candlestick-DewevWV_.js} +1 -1
- package/dist/{vue-ui-carousel-table-BqRERrjs.js → vue-ui-carousel-table-Dv1CDfE5.js} +1 -1
- package/dist/{vue-ui-chestnut-CzBGckif.js → vue-ui-chestnut-D9sdFZ4E.js} +1 -1
- package/dist/{vue-ui-chord-B4waG93A.js → vue-ui-chord-BG4dxKNA.js} +1 -1
- package/dist/{vue-ui-circle-pack-DiTw_p5r.js → vue-ui-circle-pack-Be74QB_0.js} +1 -1
- package/dist/{vue-ui-dashboard-Bt-MUKqy.js → vue-ui-dashboard-C4BLwHey.js} +54 -54
- package/dist/{vue-ui-donut-Bc492JeS.js → vue-ui-donut-BRGFcgxS.js} +542 -526
- package/dist/{vue-ui-donut-evolution-D6TaZK2x.js → vue-ui-donut-evolution-DJ0C-7jH.js} +364 -348
- package/dist/{vue-ui-dumbbell-BlZr68Sq.js → vue-ui-dumbbell-iQJ0BUhm.js} +1 -1
- package/dist/{vue-ui-flow-ByEP18dA.js → vue-ui-flow-CTYFoib3.js} +1 -1
- package/dist/{vue-ui-funnel-BU7d_U6T.js → vue-ui-funnel-CG55Xcdy.js} +1 -1
- package/dist/{vue-ui-galaxy-CpVrxaTr.js → vue-ui-galaxy-BQrxjKZJ.js} +221 -205
- package/dist/{vue-ui-gauge-B9Z4EXoj.js → vue-ui-gauge-Tc-0NI0Y.js} +1 -1
- package/dist/{vue-ui-gizmo-T1paJEJ3.js → vue-ui-gizmo-P8h-gnLd.js} +1 -1
- package/dist/{vue-ui-heatmap-Uw83eEMz.js → vue-ui-heatmap-BZimPzsL.js} +1 -1
- package/dist/{vue-ui-history-plot-C93VwVCY.js → vue-ui-history-plot-BVzbuqYY.js} +383 -367
- package/dist/{vue-ui-molecule-CFMWwXFN.js → vue-ui-molecule-BALqwB8c.js} +1 -1
- package/dist/{vue-ui-mood-radar-FkVaaOVG.js → vue-ui-mood-radar-QJ5nlZby.js} +1 -1
- package/dist/{vue-ui-nested-donuts-Cyi98NXq.js → vue-ui-nested-donuts-CmUabkkQ.js} +404 -384
- package/dist/{vue-ui-onion-BCENNhsY.js → vue-ui-onion-DAOCf3f8.js} +331 -309
- package/dist/{vue-ui-parallel-coordinate-plot-Dca9wkD0.js → vue-ui-parallel-coordinate-plot-D8jTuFjq.js} +378 -361
- package/dist/{vue-ui-quadrant-CEtFEZT3.js → vue-ui-quadrant-CO52mSRY.js} +428 -411
- package/dist/{vue-ui-quick-chart-bqcp6BIl.js → vue-ui-quick-chart-DEaVSldE.js} +1 -1
- package/dist/{vue-ui-radar-lgRCmyNP.js → vue-ui-radar-C5V4hhbW.js} +393 -374
- package/dist/{vue-ui-relation-circle-cRRrbaIT.js → vue-ui-relation-circle-CbMM0Jka.js} +1 -1
- package/dist/{vue-ui-ridgeline-CaeFJq9a.js → vue-ui-ridgeline-CXCIRDq6.js} +454 -438
- package/dist/{vue-ui-rings-DbsYfGjx.js → vue-ui-rings-BpUcyqo7.js} +285 -263
- package/dist/{vue-ui-scatter-DcMnoNrY.js → vue-ui-scatter--Dxe-hfO.js} +629 -613
- package/dist/{vue-ui-skeleton-b5fdgyHv.js → vue-ui-skeleton-BWq-VDzg.js} +1 -1
- package/dist/{vue-ui-spark-trend-DrQ26BzL.js → vue-ui-spark-trend-T4J_YOa_.js} +1 -1
- package/dist/{vue-ui-sparkbar-BlvXLcfO.js → vue-ui-sparkbar-DnKP55Vu.js} +1 -1
- package/dist/{vue-ui-sparkgauge-CQmNePxu.js → vue-ui-sparkgauge-BDQLP-zi.js} +1 -1
- package/dist/{vue-ui-sparkhistogram-CJatqy8x.js → vue-ui-sparkhistogram-Dm7QXrA-.js} +1 -1
- package/dist/{vue-ui-sparkline-5m7hFiMq.js → vue-ui-sparkline-tXGDLHRy.js} +1 -1
- package/dist/vue-ui-sparkstackbar-M53Nt07M.js +441 -0
- package/dist/{vue-ui-stackbar-WrexTg8_.js → vue-ui-stackbar-CkBOjryQ.js} +438 -421
- package/dist/{vue-ui-strip-plot-DqX7yya9.js → vue-ui-strip-plot-BX9i3wMn.js} +1 -1
- package/dist/{vue-ui-table-BhrP9BCp.js → vue-ui-table-7r02N9R9.js} +2 -2
- package/dist/{vue-ui-table-sparkline-BECa8n5_.js → vue-ui-table-sparkline-DZaAh10E.js} +1 -1
- package/dist/{vue-ui-thermometer-BxBGrsSR.js → vue-ui-thermometer-CFPt3MOv.js} +1 -1
- package/dist/{vue-ui-timer-BbHY5Ed5.js → vue-ui-timer-Ds-MJoW2.js} +1 -1
- package/dist/{vue-ui-tiremarks-DzL3Sc1f.js → vue-ui-tiremarks-2eIQ6vxu.js} +1 -1
- package/dist/{vue-ui-treemap-DoHoS5NK.js → vue-ui-treemap-BEvl8hiw.js} +500 -484
- package/dist/{vue-ui-vertical-bar-D0N5btU-.js → vue-ui-vertical-bar-D8dtM8sw.js} +350 -334
- package/dist/{vue-ui-waffle-CTt7dxCY.js → vue-ui-waffle-B3q-2SCR.js} +302 -286
- package/dist/{vue-ui-wheel--TIPvQ9I.js → vue-ui-wheel-BpirIgAG.js} +1 -1
- package/dist/{vue-ui-word-cloud-D5pZq4Jq.js → vue-ui-word-cloud-ChT7uLbN.js} +1 -1
- package/dist/{vue-ui-world-BERHgePa.js → vue-ui-world-CdP4g_3_.js} +1 -1
- package/dist/{vue-ui-xy-BI5stV8f.js → vue-ui-xy-B68qQ-gX.js} +1089 -1073
- package/dist/{vue-ui-xy-canvas-DXnLFwW3.js → vue-ui-xy-canvas-DDngEA1s.js} +338 -322
- package/package.json +1 -1
- package/dist/vue-ui-sparkstackbar-Z5g6L2Hj.js +0 -424
|
@@ -1,23 +1,23 @@
|
|
|
1
|
-
import { defineAsyncComponent as
|
|
2
|
-
import { c as ye, t as
|
|
3
|
-
import { t as
|
|
4
|
-
import { u as
|
|
5
|
-
import { u as
|
|
6
|
-
import { u as
|
|
7
|
-
import { u as
|
|
8
|
-
import { u as
|
|
9
|
-
import { u as
|
|
10
|
-
import { u as
|
|
11
|
-
import { t as
|
|
12
|
-
import
|
|
13
|
-
import
|
|
14
|
-
import { _ as
|
|
15
|
-
import
|
|
16
|
-
import { _ as
|
|
17
|
-
const
|
|
1
|
+
import { defineAsyncComponent as L, computed as p, ref as d, toRefs as Ot, watch as ee, shallowRef as Qe, onMounted as Dt, onBeforeUnmount as Rt, watchEffect as Bt, createElementBlock as u, openBlock as n, unref as v, normalizeStyle as _, normalizeClass as X, createBlock as N, createCommentVNode as f, createElementVNode as S, createVNode as fe, createSlots as Je, withCtx as g, renderSlot as b, normalizeProps as U, guardReactiveProps as W, Fragment as A, renderList as I, toDisplayString as B, Teleport as Et, resolveDynamicComponent as Ht, mergeProps as Ut, createTextVNode as Ke, nextTick as Wt } from "vue";
|
|
2
|
+
import { c as ye, t as Vt, b as Gt, p as te, o as Ze, f as et, g as jt, e as Xt, h as Yt, m as qt, B as Qt, z as Jt, a9 as Kt, X as Zt, M as ea, G as tt, R as ae, P as ta, Q as aa, a as at, d as lt, H as la } from "./lib-C_mNZmhD.js";
|
|
3
|
+
import { t as ot, u as oa } from "./useResponsive-DfdjqQps.js";
|
|
4
|
+
import { u as sa, a as st } from "./useNestedProp-BjZe1Y85.js";
|
|
5
|
+
import { u as na } from "./usePrinter-DTzqpYKF.js";
|
|
6
|
+
import { u as ia, B as ua } from "./BaseScanner-BgWxam9d.js";
|
|
7
|
+
import { u as ra } from "./useSvgExport-DrjCWun4.js";
|
|
8
|
+
import { u as ca } from "./useUserOptionState-BIvW1Kz7.js";
|
|
9
|
+
import { u as va } from "./useChartAccessibility-9icAAmYg.js";
|
|
10
|
+
import { u as da } from "./useTimeLabelCollider-CIsgDrl9.js";
|
|
11
|
+
import { t as ha } from "./themes-AUNCOb2G.js";
|
|
12
|
+
import pa from "./Title-l36lOBMx.js";
|
|
13
|
+
import ma from "./Legend-G6GMcdAc.js";
|
|
14
|
+
import { _ as fa } from "./Shape-CNXKB8O0.js";
|
|
15
|
+
import ya from "./img-BecE5qXd.js";
|
|
16
|
+
import { _ as ga } from "./_plugin-vue_export-helper-CHgC5LLL.js";
|
|
17
|
+
const ba = ["id"], xa = ["id"], ka = ["xmlns", "viewBox"], wa = ["x", "y", "width", "height"], Ca = { style: { "pointer-events": "none" } }, Aa = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], $a = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Ta = { key: 0 }, za = ["x", "y", "fill", "font-size", "font-weight"], Fa = ["fill", "font-size", "font-weight", "text-anchor", "transform"], Ma = ["fill", "font-size", "font-weight", "text-anchor", "transform", "innerHTML"], _a = { key: 0 }, Na = ["x", "y", "font-size", "fill"], Sa = ["width", "x", "y"], Ia = { style: { width: "100%" } }, Pa = ["x", "y", "fill", "font-weight", "font-size", "onMouseenter", "onMouseleave", "onClick"], La = ["d", "stroke", "stroke-width", "onMouseenter", "onMouseleave", "onClick"], Oa = ["d", "onMouseenter", "onMouseleave", "onClick"], Da = {
|
|
18
18
|
key: 4,
|
|
19
19
|
class: "vue-data-ui-watermark"
|
|
20
|
-
},
|
|
20
|
+
}, Ra = ["id"], Ba = ["onClick"], Ea = ["innerHTML"], Ha = {
|
|
21
21
|
__name: "vue-ui-parallel-coordinate-plot",
|
|
22
22
|
props: {
|
|
23
23
|
config: {
|
|
@@ -34,25 +34,25 @@ const ya = ["id"], fa = ["id"], ga = ["xmlns", "viewBox"], ba = ["x", "y", "widt
|
|
|
34
34
|
}
|
|
35
35
|
},
|
|
36
36
|
emits: ["selectLegend", "selectDatapoint"],
|
|
37
|
-
setup(
|
|
38
|
-
const
|
|
37
|
+
setup(nt, { expose: it, emit: ut }) {
|
|
38
|
+
const rt = L(() => import("./Tooltip-oWCO1HKy.js")), ct = L(() => import("./BaseIcon-BmMbm4d0.js")), vt = L(() => import("./vue-ui-accordion-CZ0thhxa.js")), dt = L(() => import("./DataTable-BT7VF2ua.js")), ht = L(() => import("./PenAndPaper-DSvu9dwa.js")), pt = L(() => import("./UserOptions-CGnQt6Fd.js")), mt = L(() => import("./PackageVersion-Cyx_s25h.js")), ft = L(() => import("./BaseDraggableDialog-ymf2sfB8.js")), { vue_ui_parallel_coordinate_plot: yt } = sa(), T = nt, Y = p({
|
|
39
39
|
get() {
|
|
40
|
-
return
|
|
40
|
+
return !!T.dataset && T.dataset.length;
|
|
41
41
|
},
|
|
42
42
|
set(t) {
|
|
43
43
|
return t;
|
|
44
44
|
}
|
|
45
|
-
}),
|
|
46
|
-
function
|
|
47
|
-
D.value = t,
|
|
45
|
+
}), ge = d(0), M = d(null), be = d(null), xe = d(null), ke = d(null), we = d(null), Ce = d(0), Ae = d(0), $e = d(0), Te = d(!1), V = d(null), le = d(null), oe = d(null), O = d(ye()), D = d(!1);
|
|
46
|
+
function ze(t) {
|
|
47
|
+
D.value = t, ge.value += 1;
|
|
48
48
|
}
|
|
49
|
-
const e = d(
|
|
50
|
-
...
|
|
49
|
+
const e = d(ue()), { loading: R, FINAL_DATASET: gt, manualLoading: se } = ia({
|
|
50
|
+
...Ot(T),
|
|
51
51
|
FINAL_CONFIG: e,
|
|
52
|
-
prepareConfig:
|
|
52
|
+
prepareConfig: ue,
|
|
53
53
|
callback: () => {
|
|
54
54
|
Promise.resolve().then(async () => {
|
|
55
|
-
await
|
|
55
|
+
await Wt(), m.value.showTable = e.value.table.show;
|
|
56
56
|
});
|
|
57
57
|
},
|
|
58
58
|
skeletonDataset: [
|
|
@@ -90,7 +90,7 @@ const ya = ["id"], fa = ["id"], ga = ["xmlns", "viewBox"], ba = ["x", "y", "widt
|
|
|
90
90
|
]
|
|
91
91
|
}
|
|
92
92
|
],
|
|
93
|
-
skeletonConfig:
|
|
93
|
+
skeletonConfig: Vt({
|
|
94
94
|
defaultConfig: e.value,
|
|
95
95
|
userConfig: {
|
|
96
96
|
useCssAnimation: !1,
|
|
@@ -117,78 +117,78 @@ const ya = ["id"], fa = ["id"], ga = ["xmlns", "viewBox"], ba = ["x", "y", "widt
|
|
|
117
117
|
}
|
|
118
118
|
}
|
|
119
119
|
})
|
|
120
|
-
}), { userOptionsVisible:
|
|
121
|
-
function
|
|
122
|
-
const t =
|
|
123
|
-
userConfig:
|
|
120
|
+
}), { userOptionsVisible: ne, setUserOptionsVisibility: Fe, keepUserOptionState: Me } = ca({ config: e.value }), { svgRef: ie } = va({ config: e.value.style.chart.title });
|
|
121
|
+
function ue() {
|
|
122
|
+
const t = st({
|
|
123
|
+
userConfig: T.config,
|
|
124
124
|
defaultConfig: yt
|
|
125
125
|
});
|
|
126
126
|
return t.theme ? {
|
|
127
|
-
...
|
|
128
|
-
userConfig:
|
|
127
|
+
...st({
|
|
128
|
+
userConfig: ha.vue_ui_parallel_coordinate_plot[t.theme] || T.config,
|
|
129
129
|
defaultConfig: t
|
|
130
130
|
}),
|
|
131
|
-
customPalette:
|
|
131
|
+
customPalette: Gt[t.theme] || te
|
|
132
132
|
} : t;
|
|
133
133
|
}
|
|
134
|
-
|
|
135
|
-
R.value || (e.value =
|
|
136
|
-
}, { deep: !0 }),
|
|
137
|
-
Array.isArray(t) && t.length > 0 && (
|
|
134
|
+
ee(() => T.config, (t) => {
|
|
135
|
+
R.value || (e.value = ue()), ne.value = !e.value.userOptions.showOnChartHover, Ne(), Ce.value += 1, $e.value += 1, Ae.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 }), ee(() => T.dataset, (t) => {
|
|
137
|
+
Array.isArray(t) && t.length > 0 && (se.value = !1);
|
|
138
138
|
}, { deep: !0 });
|
|
139
|
-
const
|
|
140
|
-
|
|
141
|
-
|
|
139
|
+
const P = Qe(null), E = Qe(null);
|
|
140
|
+
Dt(() => {
|
|
141
|
+
Te.value = !0, Ne();
|
|
142
142
|
});
|
|
143
|
-
const
|
|
144
|
-
function
|
|
145
|
-
if (
|
|
143
|
+
const _e = p(() => !!e.value.debug);
|
|
144
|
+
function Ne() {
|
|
145
|
+
if (Ze(T.dataset) ? (et({
|
|
146
146
|
componentName: "VueUiParallelCoordinatePlot",
|
|
147
147
|
type: "dataset",
|
|
148
|
-
debug:
|
|
149
|
-
}),
|
|
150
|
-
|
|
148
|
+
debug: _e.value
|
|
149
|
+
}), se.value = !0) : T.dataset.forEach((t, l) => {
|
|
150
|
+
jt({
|
|
151
151
|
datasetObject: t,
|
|
152
152
|
requiredAttributes: ["name", "series"]
|
|
153
153
|
}).forEach((a) => {
|
|
154
|
-
Y.value = !1,
|
|
154
|
+
Y.value = !1, et({
|
|
155
155
|
componentName: "VueUiParallelCoordinatePlot",
|
|
156
156
|
type: "datasetSerieAttribute",
|
|
157
157
|
property: a,
|
|
158
|
-
index:
|
|
159
|
-
debug:
|
|
158
|
+
index: l,
|
|
159
|
+
debug: _e.value
|
|
160
160
|
});
|
|
161
161
|
});
|
|
162
|
-
}),
|
|
163
|
-
const t =
|
|
164
|
-
const { width:
|
|
165
|
-
chart:
|
|
166
|
-
title: e.value.style.chart.title.text ?
|
|
167
|
-
legend: e.value.style.chart.legend.show ?
|
|
168
|
-
source:
|
|
169
|
-
noTitle:
|
|
162
|
+
}), Ze(T.dataset) || (se.value = e.value.loading), e.value.responsive) {
|
|
163
|
+
const t = ot(() => {
|
|
164
|
+
const { width: l, height: a } = oa({
|
|
165
|
+
chart: M.value,
|
|
166
|
+
title: e.value.style.chart.title.text ? be.value : null,
|
|
167
|
+
legend: e.value.style.chart.legend.show ? xe.value : null,
|
|
168
|
+
source: ke.value,
|
|
169
|
+
noTitle: we.value
|
|
170
170
|
});
|
|
171
171
|
requestAnimationFrame(() => {
|
|
172
|
-
c.value.width =
|
|
173
|
-
relator: Math.min(
|
|
172
|
+
c.value.width = l, c.value.height = a - 12, e.value.responsiveProportionalSizing ? (c.value.plotSize = ae({
|
|
173
|
+
relator: Math.min(l, a),
|
|
174
174
|
adjuster: 600,
|
|
175
175
|
source: e.value.style.chart.plots.radius,
|
|
176
176
|
threshold: 2,
|
|
177
177
|
fallback: 2
|
|
178
|
-
}), c.value.ticksFontSize =
|
|
179
|
-
relator: Math.min(
|
|
178
|
+
}), c.value.ticksFontSize = ae({
|
|
179
|
+
relator: Math.min(l, a),
|
|
180
180
|
adjuster: 600,
|
|
181
181
|
source: e.value.style.chart.yAxis.labels.ticks.fontSize,
|
|
182
182
|
threshold: 10,
|
|
183
183
|
fallback: 10
|
|
184
|
-
}), c.value.datapointFontSize =
|
|
185
|
-
relator: Math.min(
|
|
184
|
+
}), c.value.datapointFontSize = ae({
|
|
185
|
+
relator: Math.min(l, a),
|
|
186
186
|
adjuster: 600,
|
|
187
187
|
source: e.value.style.chart.yAxis.labels.datapoints.fontSize,
|
|
188
188
|
threshold: 10,
|
|
189
189
|
fallback: 10
|
|
190
|
-
}), c.value.axisNameFontSize =
|
|
191
|
-
relator: Math.min(
|
|
190
|
+
}), c.value.axisNameFontSize = ae({
|
|
191
|
+
relator: Math.min(l, a),
|
|
192
192
|
adjuster: 600,
|
|
193
193
|
source: e.value.style.chart.yAxis.labels.axisNamesFontSize,
|
|
194
194
|
threshold: 12,
|
|
@@ -196,17 +196,17 @@ const ya = ["id"], fa = ["id"], ga = ["xmlns", "viewBox"], ba = ["x", "y", "widt
|
|
|
196
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
197
|
});
|
|
198
198
|
});
|
|
199
|
-
|
|
199
|
+
P.value && (E.value && P.value.unobserve(E.value), P.value.disconnect()), P.value = new ResizeObserver(t), E.value = M.value.parentNode, P.value.observe(E.value);
|
|
200
200
|
}
|
|
201
201
|
}
|
|
202
|
-
|
|
203
|
-
|
|
202
|
+
Rt(() => {
|
|
203
|
+
P.value && (E.value && P.value.unobserve(E.value), P.value.disconnect());
|
|
204
204
|
});
|
|
205
|
-
const { isPrinting:
|
|
205
|
+
const { isPrinting: Se, isImaging: Ie, generatePdf: Pe, generateImage: Le } = na({
|
|
206
206
|
elementId: `pcp_${O.value}`,
|
|
207
207
|
fileName: e.value.style.chart.title.text || "vue-ui-parallel-coordinate-plot",
|
|
208
208
|
options: e.value.userOptions.print
|
|
209
|
-
}),
|
|
209
|
+
}), bt = p(() => e.value.userOptions.show && !e.value.style.chart.title.text), c = d({
|
|
210
210
|
height: e.value.style.chart.height,
|
|
211
211
|
width: e.value.style.chart.width,
|
|
212
212
|
plotSize: e.value.style.chart.plots.radius,
|
|
@@ -215,37 +215,37 @@ const ya = ["id"], fa = ["id"], ga = ["xmlns", "viewBox"], ba = ["x", "y", "widt
|
|
|
215
215
|
// ratio 42.85
|
|
216
216
|
datapointFontSize: e.value.style.chart.yAxis.labels.datapoints.fontSize,
|
|
217
217
|
axisNameFontSize: e.value.style.chart.yAxis.labels.axisNamesFontSize
|
|
218
|
-
}),
|
|
218
|
+
}), Oe = p(() => c.value.width), De = p(() => c.value.height), G = d(0), xt = ot((t) => {
|
|
219
219
|
G.value = t;
|
|
220
220
|
}, 100);
|
|
221
|
-
|
|
222
|
-
const
|
|
223
|
-
if (!
|
|
221
|
+
Bt((t) => {
|
|
222
|
+
const l = oe.value;
|
|
223
|
+
if (!l) return;
|
|
224
224
|
const a = new ResizeObserver((s) => {
|
|
225
|
-
|
|
225
|
+
xt(s[0].contentRect.height);
|
|
226
226
|
});
|
|
227
|
-
a.observe(
|
|
227
|
+
a.observe(l), t(() => a.disconnect());
|
|
228
228
|
});
|
|
229
229
|
const h = p(() => {
|
|
230
|
-
const { top: t, right:
|
|
230
|
+
const { top: t, right: l, bottom: a, left: s } = e.value.style.chart.padding, o = De.value, r = Oe.value;
|
|
231
231
|
return {
|
|
232
|
-
chartHeight: Math.max(1e-3,
|
|
232
|
+
chartHeight: Math.max(1e-3, o),
|
|
233
233
|
chartWidth: Math.max(1e-3, r),
|
|
234
|
-
height: Math.max(1e-3,
|
|
235
|
-
width: Math.max(1e-3, r - s -
|
|
234
|
+
height: Math.max(1e-3, o - t - a - G.value - c.value.datapointFontSize * 2),
|
|
235
|
+
width: Math.max(1e-3, r - s - l),
|
|
236
236
|
top: t + G.value + c.value.datapointFontSize,
|
|
237
237
|
left: s,
|
|
238
|
-
right: r -
|
|
239
|
-
bottom:
|
|
238
|
+
right: r - l,
|
|
239
|
+
bottom: o - a - c.value.datapointFontSize
|
|
240
240
|
};
|
|
241
|
-
}),
|
|
241
|
+
}), kt = p(() => Xt(e.value.customPalette)), m = d({
|
|
242
242
|
dataLabels: {
|
|
243
243
|
show: e.value.style.chart.yAxis.labels.datapoints.show
|
|
244
244
|
},
|
|
245
245
|
showTable: e.value.table.show,
|
|
246
246
|
showTooltip: e.value.style.chart.tooltip.show
|
|
247
247
|
});
|
|
248
|
-
|
|
248
|
+
ee(e, () => {
|
|
249
249
|
m.value = {
|
|
250
250
|
dataLabels: {
|
|
251
251
|
show: e.value.style.chart.yAxis.labels.datapoints.show
|
|
@@ -254,12 +254,12 @@ const ya = ["id"], fa = ["id"], ga = ["xmlns", "viewBox"], ba = ["x", "y", "widt
|
|
|
254
254
|
showTooltip: e.value.style.chart.tooltip.show
|
|
255
255
|
};
|
|
256
256
|
}, { immediate: !0 });
|
|
257
|
-
const
|
|
258
|
-
function
|
|
259
|
-
|
|
257
|
+
const $ = d([]);
|
|
258
|
+
function q(t) {
|
|
259
|
+
$.value.includes(t) ? $.value = $.value.filter((l) => l !== t) : $.value.push(t);
|
|
260
260
|
}
|
|
261
|
-
const
|
|
262
|
-
const a =
|
|
261
|
+
const z = p(() => gt.value.map((t, l) => {
|
|
262
|
+
const a = Yt(t.color) || kt.value[l] || te[l] || te[l % te.length];
|
|
263
263
|
return {
|
|
264
264
|
...t,
|
|
265
265
|
series: t.series.map((s) => ({
|
|
@@ -267,117 +267,132 @@ const ya = ["id"], fa = ["id"], ga = ["xmlns", "viewBox"], ba = ["x", "y", "widt
|
|
|
267
267
|
id: ye(),
|
|
268
268
|
color: a
|
|
269
269
|
})),
|
|
270
|
-
seriesIndex:
|
|
270
|
+
seriesIndex: l,
|
|
271
271
|
color: a,
|
|
272
272
|
id: ye(),
|
|
273
273
|
shape: t.shape || "circle"
|
|
274
274
|
};
|
|
275
|
-
}))
|
|
275
|
+
}));
|
|
276
|
+
function Re(t) {
|
|
277
|
+
if (!z.value.length)
|
|
278
|
+
return e.value.debug && console.warn("VueUiParallelCoordinatePlot - There are no series to show."), null;
|
|
279
|
+
const l = z.value.find((a) => a.name === t);
|
|
280
|
+
return l || (e.value.debug && console.warn(`VueUiParallelCoordinatePlot - Series name not found "${t}"`), null);
|
|
281
|
+
}
|
|
282
|
+
function wt(t) {
|
|
283
|
+
const l = Re(t);
|
|
284
|
+
l !== null && $.value.includes(l.id) && q(l.id);
|
|
285
|
+
}
|
|
286
|
+
function Ct(t) {
|
|
287
|
+
const l = Re(t);
|
|
288
|
+
l !== null && ($.value.includes(l.id) || q(l.id));
|
|
289
|
+
}
|
|
290
|
+
const Be = p(() => z.value.map((t) => ({
|
|
276
291
|
...t,
|
|
277
|
-
opacity:
|
|
278
|
-
segregate: () =>
|
|
279
|
-
isSegregated:
|
|
292
|
+
opacity: $.value.includes(t.id) ? 0.5 : 1,
|
|
293
|
+
segregate: () => q(t.id),
|
|
294
|
+
isSegregated: $.value.includes(t.id),
|
|
280
295
|
shape: "circle"
|
|
281
|
-
}))),
|
|
296
|
+
}))), At = p(() => ({
|
|
282
297
|
cy: "pcp-div-legend",
|
|
283
298
|
backgroundColor: e.value.style.chart.legend.backgroundColor,
|
|
284
299
|
color: e.value.style.chart.legend.color,
|
|
285
300
|
fontSize: e.value.style.chart.legend.fontSize,
|
|
286
301
|
paddingBottom: 12,
|
|
287
302
|
fontWeight: e.value.style.chart.legend.bold ? "bold" : ""
|
|
288
|
-
})),
|
|
289
|
-
...
|
|
290
|
-
)), C = p(() => h.value.width /
|
|
303
|
+
})), Ee = p(() => Math.max(
|
|
304
|
+
...z.value.filter((t) => !$.value.includes(t.id)).map((t) => Math.max(...t.series.flatMap((l) => l.values.length)))
|
|
305
|
+
)), C = p(() => h.value.width / Ee.value), re = p(() => z.value.filter((t) => !$.value.includes(t.id))), y = p(() => {
|
|
291
306
|
let t = [];
|
|
292
|
-
for (let
|
|
293
|
-
const a = Math.min(...
|
|
294
|
-
const
|
|
307
|
+
for (let l = 0; l < Ee.value; l += 1) {
|
|
308
|
+
const a = Math.min(...re.value.flatMap((x) => x.series.map((k) => k.values[l] || 0) || 0)), s = Math.max(...re.value.flatMap((x) => x.series.map((k) => k.values[l] || 0) || 0)), o = s === a ? a / 4 : a, r = s === a ? s * 2 : s, i = qt(o, r, e.value.style.chart.yAxis.scaleTicks), F = i.ticks.map((x, k) => {
|
|
309
|
+
const Pt = i.min < 0 ? x + Math.abs(i.min) : x - Math.abs(i.min), Lt = i.min < 0 ? i.max + Math.abs(i.min) : i.max - Math.abs(i.min);
|
|
295
310
|
return {
|
|
296
|
-
y: h.value.bottom - h.value.height * (
|
|
297
|
-
x: h.value.left + C.value *
|
|
311
|
+
y: h.value.bottom - h.value.height * (Pt / Lt),
|
|
312
|
+
x: h.value.left + C.value * l + C.value / 2,
|
|
298
313
|
value: x
|
|
299
314
|
};
|
|
300
315
|
});
|
|
301
316
|
t.push({
|
|
302
317
|
scale: i,
|
|
303
|
-
ticks:
|
|
304
|
-
name: e.value.style.chart.yAxis.labels.axisNames[
|
|
318
|
+
ticks: F,
|
|
319
|
+
name: e.value.style.chart.yAxis.labels.axisNames[l] || `Y-${l + 1}`
|
|
305
320
|
});
|
|
306
321
|
}
|
|
307
322
|
return t;
|
|
308
|
-
}),
|
|
323
|
+
}), ce = p(() => re.value.map((t, l) => ({
|
|
309
324
|
...t,
|
|
310
325
|
series: t.series.map((a, s) => ({
|
|
311
326
|
...a,
|
|
312
|
-
datapoints: a.values.map((
|
|
313
|
-
const i =
|
|
327
|
+
datapoints: a.values.map((o, r) => {
|
|
328
|
+
const i = y.value[r].scale.min < 0 ? (o || 0) + Math.abs(y.value[r].scale.min) : (o || 0) - Math.abs(y.value[r].scale.min), F = y.value[r].scale.min < 0 ? y.value[r].scale.max + Math.abs(y.value[r].scale.min) : y.value[r].scale.max - Math.abs(y.value[r].scale.min);
|
|
314
329
|
return {
|
|
315
330
|
name: a.name,
|
|
316
331
|
seriesName: t.name,
|
|
317
332
|
axisIndex: r,
|
|
318
333
|
datapointIndex: s,
|
|
319
|
-
seriesIndex:
|
|
320
|
-
value:
|
|
334
|
+
seriesIndex: l,
|
|
335
|
+
value: o || 0,
|
|
321
336
|
x: h.value.left + C.value * r + C.value / 2,
|
|
322
|
-
y: h.value.bottom - h.value.height * (i /
|
|
337
|
+
y: h.value.bottom - h.value.height * (i / F),
|
|
323
338
|
comment: a.comments && a.comments[r] || ""
|
|
324
339
|
};
|
|
325
340
|
})
|
|
326
341
|
}))
|
|
327
342
|
})).map((t) => ({
|
|
328
343
|
...t,
|
|
329
|
-
series: t.series.map((
|
|
330
|
-
const a =
|
|
344
|
+
series: t.series.map((l) => {
|
|
345
|
+
const a = Qt(l.datapoints), s = Jt(l.datapoints), o = Kt(e.value.style.chart.lines.smooth ? `M ${s}` : `M ${a}`);
|
|
331
346
|
return {
|
|
332
|
-
...
|
|
347
|
+
...l,
|
|
333
348
|
smoothPath: s,
|
|
334
349
|
straightPath: a,
|
|
335
|
-
pathLength:
|
|
350
|
+
pathLength: o
|
|
336
351
|
};
|
|
337
352
|
})
|
|
338
353
|
})));
|
|
339
|
-
function
|
|
340
|
-
return
|
|
341
|
-
e.value.style.chart.yAxis.labels.formatters[
|
|
354
|
+
function He({ value: t, index: l, datapoint: a }) {
|
|
355
|
+
return at(
|
|
356
|
+
e.value.style.chart.yAxis.labels.formatters[l] || null,
|
|
342
357
|
t,
|
|
343
|
-
|
|
344
|
-
p: e.value.style.chart.yAxis.labels.prefixes[
|
|
358
|
+
lt({
|
|
359
|
+
p: e.value.style.chart.yAxis.labels.prefixes[l] || "",
|
|
345
360
|
v: t,
|
|
346
|
-
s: e.value.style.chart.yAxis.labels.suffixes[
|
|
347
|
-
r: e.value.style.chart.yAxis.labels.roundings[
|
|
361
|
+
s: e.value.style.chart.yAxis.labels.suffixes[l] || "",
|
|
362
|
+
r: e.value.style.chart.yAxis.labels.roundings[l] || 0
|
|
348
363
|
}),
|
|
349
|
-
{ datapoint: a, seriesIndex:
|
|
364
|
+
{ datapoint: a, seriesIndex: l }
|
|
350
365
|
);
|
|
351
366
|
}
|
|
352
|
-
const w = d(null),
|
|
353
|
-
function
|
|
354
|
-
e.value.events.datapointLeave && e.value.events.datapointLeave({ datapoint: { ...
|
|
367
|
+
const w = d(null), ve = d(null), de = d(!1), he = d("");
|
|
368
|
+
function Q({ shape: t, serie: l, S: a }) {
|
|
369
|
+
e.value.events.datapointLeave && e.value.events.datapointLeave({ datapoint: { ...l, shape: t }, seriesIndex: a }), w.value = null, de.value = null;
|
|
355
370
|
}
|
|
356
|
-
function
|
|
357
|
-
e.value.events.datapointEnter && e.value.events.datapointEnter({ datapoint: { ...a, shape: t }, seriesIndex: r }),
|
|
371
|
+
function J({ shape: t, serieName: l, serie: a, relativeIndex: s, seriesIndex: o, S: r }) {
|
|
372
|
+
e.value.events.datapointEnter && e.value.events.datapointEnter({ datapoint: { ...a, shape: t }, seriesIndex: r }), ve.value = { serie: a, relativeIndex: s, seriesIndex: o, series: z.value, scales: y.value }, de.value = !0, w.value = a.id;
|
|
358
373
|
let i = "";
|
|
359
|
-
const
|
|
360
|
-
|
|
374
|
+
const F = e.value.style.chart.tooltip.customFormat;
|
|
375
|
+
tt(F) && la(() => F({
|
|
361
376
|
serie: a,
|
|
362
377
|
seriesIndex: a.seriesIndex,
|
|
363
|
-
series:
|
|
378
|
+
series: z.value,
|
|
364
379
|
config: e.value,
|
|
365
|
-
scales:
|
|
366
|
-
})) ?
|
|
380
|
+
scales: y.value
|
|
381
|
+
})) ? he.value = F({
|
|
367
382
|
serie: a,
|
|
368
383
|
seriesIndex: a.seriesIndex,
|
|
369
|
-
series:
|
|
384
|
+
series: z.value,
|
|
370
385
|
config: e.value,
|
|
371
|
-
scales:
|
|
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;">${
|
|
386
|
+
scales: y.value
|
|
387
|
+
}) : (i += `<div style="width:100%;text-align:center;border-bottom:1px solid ${e.value.style.chart.tooltip.borderColor};padding-bottom:6px;margin-bottom:3px;">${l ? l + " - " : ""}${a.name}</div>`, y.value.map((x) => x.name).forEach((x, k) => {
|
|
373
388
|
i += `
|
|
374
389
|
<div class="vue-ui-tooltip-item" style="text-align:left">
|
|
375
390
|
<span>${x}: </span>
|
|
376
391
|
<span>
|
|
377
|
-
${
|
|
392
|
+
${at(
|
|
378
393
|
e.value.style.chart.yAxis.labels.formatters[k] || null,
|
|
379
394
|
a.datapoints[k].value,
|
|
380
|
-
|
|
395
|
+
lt({
|
|
381
396
|
p: e.value.style.chart.yAxis.labels.prefixes[k] || "",
|
|
382
397
|
v: a.datapoints[k].value,
|
|
383
398
|
s: e.value.style.chart.yAxis.labels.suffixes[k] || "",
|
|
@@ -388,13 +403,13 @@ const ya = ["id"], fa = ["id"], ga = ["xmlns", "viewBox"], ba = ["x", "y", "widt
|
|
|
388
403
|
</span>
|
|
389
404
|
</div>
|
|
390
405
|
`, 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
|
-
}),
|
|
406
|
+
}), he.value = `<div>${i}</div>`);
|
|
392
407
|
}
|
|
393
|
-
function
|
|
394
|
-
return
|
|
408
|
+
function $t() {
|
|
409
|
+
return z.value;
|
|
395
410
|
}
|
|
396
411
|
const H = p(() => {
|
|
397
|
-
const t = [e.value.table.columnNames.series].concat([e.value.table.columnNames.item]).concat(
|
|
412
|
+
const t = [e.value.table.columnNames.series].concat([e.value.table.columnNames.item]).concat(y.value.map((o) => o.name)), l = ce.value.flatMap((o, r) => o.series.map((i) => [o.name].concat([i.name]).concat(i.values))), a = {
|
|
398
413
|
th: {
|
|
399
414
|
backgroundColor: e.value.table.th.backgroundColor,
|
|
400
415
|
color: e.value.table.th.color,
|
|
@@ -406,75 +421,75 @@ const ya = ["id"], fa = ["id"], ga = ["xmlns", "viewBox"], ba = ["x", "y", "widt
|
|
|
406
421
|
outline: e.value.table.td.outline
|
|
407
422
|
},
|
|
408
423
|
breakpoint: e.value.table.responsiveBreakpoint
|
|
409
|
-
}, s = [e.value.table.columnNames.series].concat([e.value.table.columnNames.item]).concat(
|
|
424
|
+
}, s = [e.value.table.columnNames.series].concat([e.value.table.columnNames.item]).concat(y.value.map((o) => o.name));
|
|
410
425
|
return {
|
|
411
|
-
body:
|
|
426
|
+
body: l,
|
|
412
427
|
head: t,
|
|
413
428
|
config: a,
|
|
414
429
|
colNames: s
|
|
415
430
|
};
|
|
416
|
-
}),
|
|
431
|
+
}), Ue = p(() => ce.value.length === 0 ? { head: [], body: [], config: {}, columnNames: [] } : {
|
|
417
432
|
head: H.value.head,
|
|
418
433
|
body: H.value.body
|
|
419
434
|
});
|
|
420
|
-
function
|
|
421
|
-
const
|
|
422
|
-
t ? t(r) :
|
|
435
|
+
function pe(t = null) {
|
|
436
|
+
const l = [[e.value.style.chart.title.text], [e.value.style.chart.title.subtitle.text], [""]], a = Ue.value.head, s = Ue.value.body, o = l.concat([a]).concat(s), r = ta(o);
|
|
437
|
+
t ? t(r) : aa({ csvContent: r, title: e.value.style.chart.title.text || "vue-ui-parallel-coordinate-plot" });
|
|
423
438
|
}
|
|
424
|
-
const We =
|
|
425
|
-
function
|
|
426
|
-
e.value.events.datapointClick && e.value.events.datapointClick({ datapoint: { ...t, shape:
|
|
439
|
+
const We = ut;
|
|
440
|
+
function K({ serie: t, shape: l, S: a }) {
|
|
441
|
+
e.value.events.datapointClick && e.value.events.datapointClick({ datapoint: { ...t, shape: l }, seriesIndex: a }), We("selectDatapoint", t);
|
|
427
442
|
}
|
|
428
|
-
function
|
|
443
|
+
function Ve(t) {
|
|
429
444
|
We("selectLegend", {
|
|
430
445
|
...t,
|
|
431
446
|
isSegregated: !t.isSegregated,
|
|
432
447
|
opacity: t.isSegregated ? 1 : 0.5
|
|
433
448
|
});
|
|
434
449
|
}
|
|
435
|
-
function
|
|
450
|
+
function Ge() {
|
|
436
451
|
m.value.showTable = !m.value.showTable;
|
|
437
452
|
}
|
|
438
|
-
function
|
|
453
|
+
function je() {
|
|
439
454
|
m.value.dataLabels.show = !m.value.dataLabels.show;
|
|
440
455
|
}
|
|
441
|
-
function
|
|
456
|
+
function Xe() {
|
|
442
457
|
m.value.showTooltip = !m.value.showTooltip;
|
|
443
458
|
}
|
|
444
|
-
const
|
|
445
|
-
function
|
|
446
|
-
|
|
459
|
+
const Z = d(!1);
|
|
460
|
+
function me() {
|
|
461
|
+
Z.value = !Z.value;
|
|
447
462
|
}
|
|
448
|
-
async function
|
|
449
|
-
if (!
|
|
450
|
-
const { width:
|
|
463
|
+
async function Tt({ scale: t = 2 } = {}) {
|
|
464
|
+
if (!M.value) return;
|
|
465
|
+
const { width: l, height: a } = M.value.getBoundingClientRect(), s = l / a, { imageUri: o, base64: r } = await ya({ domElement: M.value, base64: !0, img: !0, scale: t });
|
|
451
466
|
return {
|
|
452
|
-
imageUri:
|
|
467
|
+
imageUri: o,
|
|
453
468
|
base64: r,
|
|
454
469
|
title: e.value.style.chart.title.text,
|
|
455
|
-
width:
|
|
470
|
+
width: l,
|
|
456
471
|
height: a,
|
|
457
472
|
aspectRatio: s
|
|
458
473
|
};
|
|
459
474
|
}
|
|
460
|
-
const
|
|
461
|
-
|
|
462
|
-
timeLabelsEls:
|
|
463
|
-
timeLabels:
|
|
464
|
-
slicer:
|
|
475
|
+
const zt = d({ start: 0, end: 1 }), Ft = p(() => y.value.map((t) => t.name));
|
|
476
|
+
da({
|
|
477
|
+
timeLabelsEls: oe,
|
|
478
|
+
timeLabels: Ft,
|
|
479
|
+
slicer: zt,
|
|
465
480
|
configRef: e,
|
|
466
481
|
rotationPath: ["style", "chart", "yAxis", "labels", "axisNamesRotation"],
|
|
467
482
|
autoRotatePath: ["style", "chart", "yAxis", "labels", "axisNamesAutoRotate", "enable"],
|
|
468
483
|
isAutoSize: !1,
|
|
469
|
-
width:
|
|
470
|
-
height:
|
|
484
|
+
width: Oe,
|
|
485
|
+
height: De,
|
|
471
486
|
targetClass: ".vue-ui-parallel-coordinate-plot-x-label",
|
|
472
487
|
rotation: e.value.style.chart.yAxis.labels.axisNamesAutoRotate.angle
|
|
473
488
|
});
|
|
474
489
|
const j = p(() => {
|
|
475
|
-
const t = e.value.table.useDialog && !e.value.table.show,
|
|
490
|
+
const t = e.value.table.useDialog && !e.value.table.show, l = m.value.showTable;
|
|
476
491
|
return {
|
|
477
|
-
component: t ?
|
|
492
|
+
component: t ? ft : vt,
|
|
478
493
|
title: `${e.value.style.chart.title.text}${e.value.style.chart.title.subtitle.text ? `: ${e.value.style.chart.title.subtitle.text}` : ""}`,
|
|
479
494
|
props: t ? {
|
|
480
495
|
backgroundColor: e.value.table.th.backgroundColor,
|
|
@@ -482,12 +497,12 @@ const ya = ["id"], fa = ["id"], ga = ["xmlns", "viewBox"], ba = ["x", "y", "widt
|
|
|
482
497
|
headerColor: e.value.table.th.color,
|
|
483
498
|
headerBg: e.value.table.th.backgroundColor,
|
|
484
499
|
isFullscreen: D.value,
|
|
485
|
-
fullscreenParent:
|
|
500
|
+
fullscreenParent: M.value,
|
|
486
501
|
forcedWidth: Math.min(800, window.innerWidth * 0.8)
|
|
487
502
|
} : {
|
|
488
503
|
hideDetails: !0,
|
|
489
504
|
config: {
|
|
490
|
-
open:
|
|
505
|
+
open: l,
|
|
491
506
|
maxHeight: 1e4,
|
|
492
507
|
body: {
|
|
493
508
|
backgroundColor: e.value.style.chart.backgroundColor,
|
|
@@ -501,70 +516,72 @@ const ya = ["id"], fa = ["id"], ga = ["xmlns", "viewBox"], ba = ["x", "y", "widt
|
|
|
501
516
|
}
|
|
502
517
|
};
|
|
503
518
|
});
|
|
504
|
-
|
|
519
|
+
ee(() => m.value.showTable, (t) => {
|
|
505
520
|
e.value.table.show || (t && e.value.table.useDialog && V.value ? V.value.open() : "close" in V.value && V.value.close());
|
|
506
521
|
});
|
|
507
|
-
function
|
|
508
|
-
m.value.showTable = !1,
|
|
522
|
+
function Ye() {
|
|
523
|
+
m.value.showTable = !1, le.value && le.value.setTableIconState(!1);
|
|
509
524
|
}
|
|
510
|
-
const
|
|
511
|
-
svg:
|
|
512
|
-
title:
|
|
513
|
-
legend:
|
|
514
|
-
legendItems:
|
|
515
|
-
backgroundColor:
|
|
525
|
+
const Mt = p(() => e.value.style.chart.backgroundColor), _t = p(() => e.value.style.chart.legend), Nt = p(() => e.value.style.chart.title), { exportSvg: St, getSvg: It } = ra({
|
|
526
|
+
svg: ie,
|
|
527
|
+
title: Nt,
|
|
528
|
+
legend: _t,
|
|
529
|
+
legendItems: Be,
|
|
530
|
+
backgroundColor: Mt
|
|
516
531
|
});
|
|
517
|
-
async function
|
|
532
|
+
async function qe({ isCb: t }) {
|
|
518
533
|
if (t) {
|
|
519
|
-
const { blob:
|
|
520
|
-
e.value.userOptions.callbacks.svg({ blob:
|
|
534
|
+
const { blob: l, url: a, text: s, dataUrl: o } = await It();
|
|
535
|
+
e.value.userOptions.callbacks.svg({ blob: l, url: a, text: s, dataUrl: o });
|
|
521
536
|
} else
|
|
522
|
-
|
|
537
|
+
St();
|
|
523
538
|
}
|
|
524
|
-
return
|
|
525
|
-
getData:
|
|
526
|
-
getImage:
|
|
527
|
-
generateCsv:
|
|
528
|
-
generatePdf:
|
|
539
|
+
return it({
|
|
540
|
+
getData: $t,
|
|
541
|
+
getImage: Tt,
|
|
542
|
+
generateCsv: pe,
|
|
543
|
+
generatePdf: Pe,
|
|
529
544
|
generateImage: Le,
|
|
530
|
-
generateSvg:
|
|
531
|
-
|
|
532
|
-
|
|
533
|
-
|
|
534
|
-
|
|
535
|
-
|
|
536
|
-
|
|
545
|
+
generateSvg: qe,
|
|
546
|
+
hideSeries: Ct,
|
|
547
|
+
showSeries: wt,
|
|
548
|
+
toggleTable: Ge,
|
|
549
|
+
toggleLabels: je,
|
|
550
|
+
toggleTooltip: Xe,
|
|
551
|
+
toggleAnnotator: me,
|
|
552
|
+
toggleFullscreen: ze
|
|
553
|
+
}), (t, l) => (n(), u("div", {
|
|
537
554
|
ref_key: "pcpChart",
|
|
538
|
-
ref:
|
|
555
|
+
ref: M,
|
|
539
556
|
class: X(`vue-data-ui-component vue-ui-pcp ${D.value ? "vue-data-ui-wrapper-fullscreen" : ""} ${e.value.useCssAnimation ? "" : "vue-ui-dna"}`),
|
|
540
|
-
style:
|
|
557
|
+
style: _(`font-family:${e.value.style.fontFamily};width:100%; text-align:center;background:${e.value.style.chart.backgroundColor};${e.value.responsive ? "height:100%" : ""}`),
|
|
541
558
|
id: `pcp_${O.value}`,
|
|
542
|
-
onMouseenter:
|
|
543
|
-
onMouseleave:
|
|
559
|
+
onMouseenter: l[2] || (l[2] = () => v(Fe)(!0)),
|
|
560
|
+
onMouseleave: l[3] || (l[3] = () => v(Fe)(!1))
|
|
544
561
|
}, [
|
|
545
|
-
e.value.userOptions.buttons.annotator ? (n(),
|
|
562
|
+
e.value.userOptions.buttons.annotator ? (n(), N(v(ht), {
|
|
546
563
|
key: 0,
|
|
547
|
-
svgRef: v(
|
|
564
|
+
svgRef: v(ie),
|
|
548
565
|
backgroundColor: e.value.style.chart.backgroundColor,
|
|
549
566
|
color: e.value.style.chart.color,
|
|
550
|
-
active:
|
|
551
|
-
onClose:
|
|
552
|
-
}, null, 8, ["svgRef", "backgroundColor", "color", "active"])) :
|
|
553
|
-
|
|
567
|
+
active: Z.value,
|
|
568
|
+
onClose: me
|
|
569
|
+
}, null, 8, ["svgRef", "backgroundColor", "color", "active"])) : f("", !0),
|
|
570
|
+
bt.value ? (n(), u("div", {
|
|
554
571
|
key: 1,
|
|
555
572
|
ref_key: "noTitle",
|
|
556
|
-
ref:
|
|
573
|
+
ref: we,
|
|
557
574
|
class: "vue-data-ui-no-title-space",
|
|
558
575
|
style: "height:36px; width: 100%;background:transparent"
|
|
559
|
-
}, null, 512)) :
|
|
576
|
+
}, null, 512)) : f("", !0),
|
|
560
577
|
e.value.style.chart.title.text ? (n(), u("div", {
|
|
561
578
|
key: 2,
|
|
562
579
|
ref_key: "chartTitle",
|
|
563
|
-
ref:
|
|
580
|
+
ref: be,
|
|
564
581
|
style: "width:100%;background:transparent;padding-bottom:24px"
|
|
565
582
|
}, [
|
|
566
|
-
(n(),
|
|
567
|
-
key: `title_${
|
|
583
|
+
(n(), N(pa, {
|
|
584
|
+
key: `title_${Ce.value}`,
|
|
568
585
|
config: {
|
|
569
586
|
title: {
|
|
570
587
|
cy: "pcp-div-title",
|
|
@@ -576,17 +593,17 @@ const ya = ["id"], fa = ["id"], ga = ["xmlns", "viewBox"], ba = ["x", "y", "widt
|
|
|
576
593
|
}
|
|
577
594
|
}
|
|
578
595
|
}, null, 8, ["config"]))
|
|
579
|
-
], 512)) :
|
|
580
|
-
|
|
596
|
+
], 512)) : f("", !0),
|
|
597
|
+
S("div", {
|
|
581
598
|
id: `legend-top-${O.value}`
|
|
582
|
-
}, null, 8,
|
|
583
|
-
e.value.userOptions.show && Y.value && (v(
|
|
599
|
+
}, null, 8, xa),
|
|
600
|
+
e.value.userOptions.show && Y.value && (v(Me) || v(ne)) ? (n(), N(v(pt), {
|
|
584
601
|
ref_key: "userOptionsRef",
|
|
585
|
-
ref:
|
|
586
|
-
key: `user_options_${
|
|
602
|
+
ref: le,
|
|
603
|
+
key: `user_options_${ge.value}`,
|
|
587
604
|
backgroundColor: e.value.style.chart.backgroundColor,
|
|
588
605
|
color: e.value.style.chart.color,
|
|
589
|
-
isPrinting: v(
|
|
606
|
+
isPrinting: v(Se),
|
|
590
607
|
isImaging: v(Ie),
|
|
591
608
|
uid: O.value,
|
|
592
609
|
hasTooltip: e.value.userOptions.buttons.tooltip && e.value.style.chart.tooltip.show,
|
|
@@ -600,30 +617,30 @@ const ya = ["id"], fa = ["id"], ga = ["xmlns", "viewBox"], ba = ["x", "y", "widt
|
|
|
600
617
|
isFullscreen: D.value,
|
|
601
618
|
isTooltip: m.value.showTooltip,
|
|
602
619
|
titles: { ...e.value.userOptions.buttonTitles },
|
|
603
|
-
chartElement:
|
|
620
|
+
chartElement: M.value,
|
|
604
621
|
position: e.value.userOptions.position,
|
|
605
622
|
hasAnnotator: e.value.userOptions.buttons.annotator,
|
|
606
|
-
isAnnotation:
|
|
623
|
+
isAnnotation: Z.value,
|
|
607
624
|
callbacks: e.value.userOptions.callbacks,
|
|
608
625
|
printScale: e.value.userOptions.print.scale,
|
|
609
626
|
tableDialog: e.value.table.useDialog,
|
|
610
|
-
onToggleFullscreen:
|
|
611
|
-
onGeneratePdf: v(
|
|
612
|
-
onGenerateCsv:
|
|
627
|
+
onToggleFullscreen: ze,
|
|
628
|
+
onGeneratePdf: v(Pe),
|
|
629
|
+
onGenerateCsv: pe,
|
|
613
630
|
onGenerateImage: v(Le),
|
|
614
|
-
onGenerateSvg:
|
|
615
|
-
onToggleTable:
|
|
616
|
-
onToggleLabels:
|
|
617
|
-
onToggleTooltip:
|
|
618
|
-
onToggleAnnotator:
|
|
619
|
-
style:
|
|
620
|
-
visibility: v(
|
|
631
|
+
onGenerateSvg: qe,
|
|
632
|
+
onToggleTable: Ge,
|
|
633
|
+
onToggleLabels: je,
|
|
634
|
+
onToggleTooltip: Xe,
|
|
635
|
+
onToggleAnnotator: me,
|
|
636
|
+
style: _({
|
|
637
|
+
visibility: v(Me) ? v(ne) ? "visible" : "hidden" : "visible"
|
|
621
638
|
})
|
|
622
|
-
},
|
|
639
|
+
}, Je({ _: 2 }, [
|
|
623
640
|
t.$slots.menuIcon ? {
|
|
624
641
|
name: "menuIcon",
|
|
625
642
|
fn: g(({ isOpen: a, color: s }) => [
|
|
626
|
-
b(t.$slots, "menuIcon", W(
|
|
643
|
+
b(t.$slots, "menuIcon", U(W({ isOpen: a, color: s })), void 0, !0)
|
|
627
644
|
]),
|
|
628
645
|
key: "0"
|
|
629
646
|
} : void 0,
|
|
@@ -672,27 +689,27 @@ const ya = ["id"], fa = ["id"], ga = ["xmlns", "viewBox"], ba = ["x", "y", "widt
|
|
|
672
689
|
t.$slots.optionFullscreen ? {
|
|
673
690
|
name: "optionFullscreen",
|
|
674
691
|
fn: g(({ toggleFullscreen: a, isFullscreen: s }) => [
|
|
675
|
-
b(t.$slots, "optionFullscreen", W(
|
|
692
|
+
b(t.$slots, "optionFullscreen", U(W({ toggleFullscreen: a, isFullscreen: s })), void 0, !0)
|
|
676
693
|
]),
|
|
677
694
|
key: "7"
|
|
678
695
|
} : void 0,
|
|
679
696
|
t.$slots.optionAnnotator ? {
|
|
680
697
|
name: "optionAnnotator",
|
|
681
698
|
fn: g(({ toggleAnnotator: a, isAnnotator: s }) => [
|
|
682
|
-
b(t.$slots, "optionAnnotator", W(
|
|
699
|
+
b(t.$slots, "optionAnnotator", U(W({ toggleAnnotator: a, isAnnotator: s })), void 0, !0)
|
|
683
700
|
]),
|
|
684
701
|
key: "8"
|
|
685
702
|
} : 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"])) :
|
|
703
|
+
]), 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"])) : f("", !0),
|
|
687
704
|
(n(), u("svg", {
|
|
688
705
|
ref_key: "svgRef",
|
|
689
|
-
ref:
|
|
690
|
-
xmlns: v(
|
|
706
|
+
ref: ie,
|
|
707
|
+
xmlns: v(Zt),
|
|
691
708
|
class: X({ "vue-data-ui-fullscreen--on": D.value, "vue-data-ui-fulscreen--off": !D.value }),
|
|
692
709
|
viewBox: `0 0 ${h.value.chartWidth <= 0 ? 10 : h.value.chartWidth} ${h.value.chartHeight <= 0 ? 10 : h.value.chartHeight}`,
|
|
693
|
-
style:
|
|
710
|
+
style: _(`max-width:100%; overflow: visible; background:transparent;color:${e.value.style.chart.color}`)
|
|
694
711
|
}, [
|
|
695
|
-
|
|
712
|
+
fe(v(mt)),
|
|
696
713
|
t.$slots["chart-background"] ? (n(), u("foreignObject", {
|
|
697
714
|
key: 0,
|
|
698
715
|
x: h.value.left,
|
|
@@ -704,45 +721,45 @@ const ya = ["id"], fa = ["id"], ga = ["xmlns", "viewBox"], ba = ["x", "y", "widt
|
|
|
704
721
|
}
|
|
705
722
|
}, [
|
|
706
723
|
b(t.$slots, "chart-background", {}, void 0, !0)
|
|
707
|
-
], 8,
|
|
708
|
-
(n(!0), u(A, null, I(
|
|
709
|
-
|
|
724
|
+
], 8, wa)) : f("", !0),
|
|
725
|
+
(n(!0), u(A, null, I(y.value, (a, s) => (n(), u("g", Ca, [
|
|
726
|
+
S("line", {
|
|
710
727
|
x1: h.value.left + C.value * s + C.value / 2,
|
|
711
728
|
x2: h.value.left + C.value * s + C.value / 2,
|
|
712
729
|
y1: h.value.top,
|
|
713
730
|
y2: h.value.bottom,
|
|
714
731
|
stroke: e.value.style.chart.yAxis.stroke,
|
|
715
732
|
"stroke-width": e.value.style.chart.yAxis.strokeWidth
|
|
716
|
-
}, null, 8,
|
|
733
|
+
}, null, 8, Aa),
|
|
717
734
|
e.value.style.chart.yAxis.labels.ticks.show ? (n(), u(A, { key: 0 }, [
|
|
718
|
-
(n(!0), u(A, null, I(a.ticks, (
|
|
719
|
-
x1:
|
|
720
|
-
x2:
|
|
721
|
-
y1:
|
|
722
|
-
y2:
|
|
735
|
+
(n(!0), u(A, null, I(a.ticks, (o) => (n(), u("line", {
|
|
736
|
+
x1: o.x,
|
|
737
|
+
x2: o.x - 10,
|
|
738
|
+
y1: o.y,
|
|
739
|
+
y2: o.y,
|
|
723
740
|
stroke: e.value.style.chart.yAxis.stroke,
|
|
724
741
|
"stroke-width": e.value.style.chart.yAxis.strokeWidth,
|
|
725
|
-
style:
|
|
726
|
-
}, null, 12,
|
|
727
|
-
v(R) ?
|
|
728
|
-
(n(!0), u(A, null, I(a.ticks, (
|
|
729
|
-
x:
|
|
730
|
-
y:
|
|
742
|
+
style: _(`opacity:${w.value && !m.value.showTooltip ? 0.2 : 1}`)
|
|
743
|
+
}, null, 12, $a))), 256)),
|
|
744
|
+
v(R) ? f("", !0) : (n(), u("g", Ta, [
|
|
745
|
+
(n(!0), u(A, null, I(a.ticks, (o) => (n(), u("text", {
|
|
746
|
+
x: o.x - 12 + e.value.style.chart.yAxis.labels.ticks.offsetX,
|
|
747
|
+
y: o.y + e.value.style.chart.yAxis.labels.ticks.offsetY + c.value.ticksFontSize / 3,
|
|
731
748
|
fill: e.value.style.chart.yAxis.labels.ticks.color,
|
|
732
749
|
"text-anchor": "end",
|
|
733
750
|
"font-size": c.value.ticksFontSize,
|
|
734
751
|
"font-weight": e.value.style.chart.yAxis.labels.ticks.bold ? "bold" : "normal",
|
|
735
|
-
style:
|
|
736
|
-
}, B(
|
|
752
|
+
style: _(`opacity:${w.value && !m.value.showTooltip ? 0.2 : 1}`)
|
|
753
|
+
}, B(He({ value: o.value, index: s, datapoint: o })), 13, za))), 256))
|
|
737
754
|
]))
|
|
738
|
-
], 64)) :
|
|
755
|
+
], 64)) : f("", !0)
|
|
739
756
|
]))), 256)),
|
|
740
757
|
e.value.style.chart.yAxis.labels.showAxisNames ? (n(), u("g", {
|
|
741
758
|
key: 1,
|
|
742
759
|
ref_key: "xAxisLabels",
|
|
743
|
-
ref:
|
|
760
|
+
ref: oe
|
|
744
761
|
}, [
|
|
745
|
-
(n(!0), u(A, null, I(
|
|
762
|
+
(n(!0), u(A, null, I(y.value, (a, s) => (n(), u(A, null, [
|
|
746
763
|
String(a.name).includes(`
|
|
747
764
|
`) ? (n(), u("text", {
|
|
748
765
|
key: 1,
|
|
@@ -752,14 +769,14 @@ const ya = ["id"], fa = ["id"], ga = ["xmlns", "viewBox"], ba = ["x", "y", "widt
|
|
|
752
769
|
"font-weight": e.value.style.chart.yAxis.labels.axisNamesBold ? "bold" : "",
|
|
753
770
|
"text-anchor": e.value.style.chart.yAxis.labels.axisNamesRotation === 0 ? "middle" : e.value.style.chart.yAxis.labels.axisNamesRotation < 0 ? "start" : "end",
|
|
754
771
|
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(
|
|
772
|
+
innerHTML: v(ea)({
|
|
756
773
|
content: String(a.name),
|
|
757
774
|
fontSize: c.value.axisNameFontSize,
|
|
758
775
|
fill: e.value.style.chart.yAxis.labels.axisNamesColor,
|
|
759
776
|
x: 0,
|
|
760
777
|
y: 0
|
|
761
778
|
})
|
|
762
|
-
}, null, 8,
|
|
779
|
+
}, null, 8, Ma)) : (n(), u("text", {
|
|
763
780
|
key: 0,
|
|
764
781
|
class: "vue-ui-parallel-coordinate-plot-x-label",
|
|
765
782
|
fill: e.value.style.chart.yAxis.labels.axisNamesColor,
|
|
@@ -767,43 +784,43 @@ const ya = ["id"], fa = ["id"], ga = ["xmlns", "viewBox"], ba = ["x", "y", "widt
|
|
|
767
784
|
"font-weight": e.value.style.chart.yAxis.labels.axisNamesBold ? "bold" : "",
|
|
768
785
|
"text-anchor": e.value.style.chart.yAxis.labels.axisNamesRotation === 0 ? "middle" : e.value.style.chart.yAxis.labels.axisNamesRotation < 0 ? "start" : "end",
|
|
769
786
|
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,
|
|
787
|
+
}, B(a.name), 9, Fa))
|
|
771
788
|
], 64))), 256))
|
|
772
|
-
], 512)) :
|
|
773
|
-
(n(!0), u(A, null, I(
|
|
774
|
-
(n(!0), u(A, null, I(a.series, (
|
|
775
|
-
e.value.style.chart.plots.show ? (n(), u("g",
|
|
776
|
-
(n(!0), u(A, null, I(
|
|
789
|
+
], 512)) : f("", !0),
|
|
790
|
+
(n(!0), u(A, null, I(ce.value, (a, s) => (n(), u("g", null, [
|
|
791
|
+
(n(!0), u(A, null, I(a.series, (o, r) => (n(), u("g", null, [
|
|
792
|
+
e.value.style.chart.plots.show ? (n(), u("g", _a, [
|
|
793
|
+
(n(!0), u(A, null, I(o.datapoints, (i, F) => (n(), N(fa, {
|
|
777
794
|
plot: { x: i.x, y: i.y },
|
|
778
795
|
color: a.color,
|
|
779
796
|
shape: a.shape,
|
|
780
797
|
radius: a.shape === "triangle" ? c.value.plotSize * 1.2 : c.value.plotSize,
|
|
781
798
|
stroke: e.value.style.chart.backgroundColor,
|
|
782
799
|
strokeWidth: 0.5,
|
|
783
|
-
onMouseenter: (x) =>
|
|
800
|
+
onMouseenter: (x) => J({
|
|
784
801
|
shape: a.shape,
|
|
785
802
|
serieName: a.name,
|
|
786
|
-
serie:
|
|
803
|
+
serie: o,
|
|
787
804
|
relativeIndex: r,
|
|
788
|
-
seriesIndex:
|
|
805
|
+
seriesIndex: o.seriesIndex,
|
|
789
806
|
S: s
|
|
790
807
|
}),
|
|
791
|
-
onMouseleave: (x) =>
|
|
792
|
-
style:
|
|
793
|
-
onClick: () =>
|
|
808
|
+
onMouseleave: (x) => Q({ serie: o, shape: a.shape, S: s }),
|
|
809
|
+
style: _(`opacity:${w.value ? w.value === o.id ? e.value.style.chart.plots.opacity : 0.2 : e.value.style.chart.plots.opacity}`),
|
|
810
|
+
onClick: () => K({ serie: o, shape: a.shape, S: s })
|
|
794
811
|
}, null, 8, ["plot", "color", "shape", "radius", "stroke", "onMouseenter", "onMouseleave", "style", "onClick"]))), 256)),
|
|
795
|
-
m.value.showTooltip ?
|
|
796
|
-
w.value && w.value ===
|
|
812
|
+
m.value.showTooltip ? f("", !0) : (n(), u(A, { key: 0 }, [
|
|
813
|
+
w.value && w.value === o.id && o.datapoints.length ? (n(), u("text", {
|
|
797
814
|
key: 0,
|
|
798
|
-
x:
|
|
799
|
-
y:
|
|
815
|
+
x: o.datapoints[0].x - c.value.ticksFontSize,
|
|
816
|
+
y: o.datapoints[0].y + c.value.ticksFontSize / 3,
|
|
800
817
|
"text-anchor": "end",
|
|
801
818
|
"font-size": c.value.ticksFontSize,
|
|
802
819
|
fill: a.color,
|
|
803
820
|
"font-weight": "bold"
|
|
804
|
-
}, B(
|
|
821
|
+
}, B(o.name), 9, Na)) : f("", !0)
|
|
805
822
|
], 64)),
|
|
806
|
-
e.value.style.chart.comments.show ? (n(!0), u(A, { key: 1 }, I(
|
|
823
|
+
e.value.style.chart.comments.show ? (n(!0), u(A, { key: 1 }, I(o.datapoints, (i) => (n(), u("g", null, [
|
|
807
824
|
i.comment ? (n(), u("foreignObject", {
|
|
808
825
|
key: 0,
|
|
809
826
|
style: { overflow: "visible" },
|
|
@@ -812,15 +829,15 @@ const ya = ["id"], fa = ["id"], ga = ["xmlns", "viewBox"], ba = ["x", "y", "widt
|
|
|
812
829
|
x: i.x - e.value.style.chart.comments.width / 2 + e.value.style.chart.comments.offsetX,
|
|
813
830
|
y: i.y + e.value.style.chart.comments.offsetY + 6
|
|
814
831
|
}, [
|
|
815
|
-
|
|
832
|
+
S("div", Ia, [
|
|
816
833
|
b(t.$slots, "plot-comment", {
|
|
817
834
|
plot: { ...i, color: a.color }
|
|
818
835
|
}, void 0, !0)
|
|
819
836
|
])
|
|
820
|
-
], 8,
|
|
821
|
-
]))), 256)) :
|
|
822
|
-
])) :
|
|
823
|
-
!v(R) && (m.value.dataLabels.show || w.value && w.value ===
|
|
837
|
+
], 8, Sa)) : f("", !0)
|
|
838
|
+
]))), 256)) : f("", !0)
|
|
839
|
+
])) : f("", !0),
|
|
840
|
+
!v(R) && (m.value.dataLabels.show || w.value && w.value === o.id) ? (n(!0), u(A, { key: 1 }, I(o.datapoints, (i, F) => (n(), u("text", {
|
|
824
841
|
x: i.x + 12 + e.value.style.chart.yAxis.labels.datapoints.offsetX,
|
|
825
842
|
y: i.y + e.value.style.chart.yAxis.labels.datapoints.offsetY + c.value.datapointFontSize / 3,
|
|
826
843
|
fill: e.value.style.chart.yAxis.labels.datapoints.useSerieColor ? a.color : e.value.style.chart.yAxis.labels.datapoints.color,
|
|
@@ -828,106 +845,106 @@ const ya = ["id"], fa = ["id"], ga = ["xmlns", "viewBox"], ba = ["x", "y", "widt
|
|
|
828
845
|
"font-weight": e.value.style.chart.yAxis.labels.datapoints.bold ? "bold" : "normal",
|
|
829
846
|
class: X({ "vue-ui-pcp-animated": !1, "vue-ui-pcp-transition": !v(R) }),
|
|
830
847
|
"font-size": c.value.datapointFontSize,
|
|
831
|
-
onMouseenter: (x) =>
|
|
848
|
+
onMouseenter: (x) => J({
|
|
832
849
|
shape: a.shape,
|
|
833
850
|
serieName: a.name,
|
|
834
|
-
serie:
|
|
851
|
+
serie: o,
|
|
835
852
|
relativeIndex: r,
|
|
836
|
-
seriesIndex:
|
|
853
|
+
seriesIndex: o.seriesIndex,
|
|
837
854
|
S: s
|
|
838
855
|
}),
|
|
839
|
-
onMouseleave: (x) =>
|
|
840
|
-
onClick: () =>
|
|
841
|
-
style:
|
|
842
|
-
}, B(
|
|
843
|
-
|
|
844
|
-
d: `M${e.value.style.chart.lines.smooth ?
|
|
856
|
+
onMouseleave: (x) => Q({ serie: o, shape: a.shape, S: s }),
|
|
857
|
+
onClick: () => K({ serie: o, shape: a.shape, S: s }),
|
|
858
|
+
style: _(`opacity:${w.value ? w.value === o.id ? 1 : 0.2 : 1}`)
|
|
859
|
+
}, B(He({ value: i.value, index: F, datapoint: i })), 47, Pa))), 256)) : f("", !0),
|
|
860
|
+
S("path", {
|
|
861
|
+
d: `M${e.value.style.chart.lines.smooth ? o.smoothPath : o.straightPath}`,
|
|
845
862
|
stroke: a.color,
|
|
846
863
|
"stroke-width": e.value.style.chart.lines.strokeWidth,
|
|
847
864
|
fill: "none",
|
|
848
865
|
class: X({ "vue-ui-pcp-animated vue-data-ui-line-animated": e.value.useCssAnimation, "vue-ui-pcp-transition": !v(R) }),
|
|
849
|
-
onMouseenter: (i) =>
|
|
866
|
+
onMouseenter: (i) => J({
|
|
850
867
|
shape: a.shape,
|
|
851
868
|
serieName: a.name,
|
|
852
|
-
serie:
|
|
869
|
+
serie: o,
|
|
853
870
|
relativeIndex: r,
|
|
854
|
-
seriesIndex:
|
|
871
|
+
seriesIndex: o.seriesIndex,
|
|
855
872
|
S: s
|
|
856
873
|
}),
|
|
857
|
-
onMouseleave: (i) =>
|
|
858
|
-
onClick: () =>
|
|
859
|
-
style:
|
|
860
|
-
}, null, 46,
|
|
874
|
+
onMouseleave: (i) => Q({ serie: o, shape: a.shape, S: s }),
|
|
875
|
+
onClick: () => K({ serie: o, shape: a.shape, S: s }),
|
|
876
|
+
style: _(`opacity:${w.value ? w.value === o.id ? e.value.style.chart.lines.opacity : 0.2 : e.value.style.chart.lines.opacity}; stroke-dasharray:${o.pathLength}; stroke-dashoffset: ${e.value.useCssAnimation ? o.pathLength : 0}`)
|
|
877
|
+
}, null, 46, La),
|
|
861
878
|
m.value.showTooltip ? (n(), u("path", {
|
|
862
879
|
key: 2,
|
|
863
|
-
d: `M${e.value.style.chart.lines.smooth ?
|
|
880
|
+
d: `M${e.value.style.chart.lines.smooth ? o.smoothPath : o.straightPath}`,
|
|
864
881
|
stroke: "transparent",
|
|
865
882
|
"stroke-width": 12,
|
|
866
883
|
fill: "none",
|
|
867
884
|
class: X({ "vue-ui-pcp-animated vue-data-ui-line-animated": e.value.useCssAnimation, "vue-ui-pcp-transition": !v(R) }),
|
|
868
|
-
onMouseenter: (i) =>
|
|
885
|
+
onMouseenter: (i) => J({
|
|
869
886
|
shape: a.shape,
|
|
870
887
|
serieName: a.name,
|
|
871
|
-
serie:
|
|
888
|
+
serie: o,
|
|
872
889
|
relativeIndex: r,
|
|
873
|
-
seriesIndex:
|
|
890
|
+
seriesIndex: o.seriesIndex,
|
|
874
891
|
S: s
|
|
875
892
|
}),
|
|
876
|
-
onMouseleave: (i) =>
|
|
877
|
-
onClick: () =>
|
|
893
|
+
onMouseleave: (i) => Q({ serie: o, shape: a.shape, S: s }),
|
|
894
|
+
onClick: () => K({ serie: o, shape: a.shape, S: s }),
|
|
878
895
|
style: { opacity: "0" }
|
|
879
|
-
}, null, 42,
|
|
896
|
+
}, null, 42, Oa)) : f("", !0)
|
|
880
897
|
]))), 256))
|
|
881
898
|
]))), 256)),
|
|
882
899
|
b(t.$slots, "svg", { svg: h.value }, void 0, !0)
|
|
883
|
-
], 14,
|
|
884
|
-
t.$slots.watermark ? (n(), u("div",
|
|
885
|
-
b(t.$slots, "watermark", W(
|
|
886
|
-
])) :
|
|
887
|
-
|
|
900
|
+
], 14, ka)),
|
|
901
|
+
t.$slots.watermark ? (n(), u("div", Da, [
|
|
902
|
+
b(t.$slots, "watermark", U(W({ isPrinting: v(Se) || v(Ie) })), void 0, !0)
|
|
903
|
+
])) : f("", !0),
|
|
904
|
+
S("div", {
|
|
888
905
|
id: `legend-bottom-${O.value}`
|
|
889
|
-
}, null, 8,
|
|
890
|
-
|
|
906
|
+
}, null, 8, Ra),
|
|
907
|
+
Te.value ? (n(), N(Et, {
|
|
891
908
|
key: 5,
|
|
892
909
|
to: e.value.style.chart.legend.position === "top" ? `#legend-top-${O.value}` : `#legend-bottom-${O.value}`
|
|
893
910
|
}, [
|
|
894
|
-
|
|
911
|
+
S("div", {
|
|
895
912
|
ref_key: "chartLegend",
|
|
896
|
-
ref:
|
|
913
|
+
ref: xe
|
|
897
914
|
}, [
|
|
898
|
-
e.value.style.chart.legend.show && Y.value ? (n(),
|
|
899
|
-
key: `legend_${
|
|
900
|
-
legendSet:
|
|
901
|
-
config:
|
|
902
|
-
onClickMarker:
|
|
903
|
-
|
|
915
|
+
e.value.style.chart.legend.show && Y.value ? (n(), N(ma, {
|
|
916
|
+
key: `legend_${Ae.value}`,
|
|
917
|
+
legendSet: Be.value,
|
|
918
|
+
config: At.value,
|
|
919
|
+
onClickMarker: l[0] || (l[0] = ({ legend: a }) => {
|
|
920
|
+
q(a.id), Ve(a);
|
|
904
921
|
})
|
|
905
922
|
}, {
|
|
906
923
|
item: g(({ legend: a, index: s }) => [
|
|
907
|
-
|
|
908
|
-
onClick: (
|
|
909
|
-
a.segregate(),
|
|
924
|
+
S("div", {
|
|
925
|
+
onClick: (o) => {
|
|
926
|
+
a.segregate(), Ve(a);
|
|
910
927
|
},
|
|
911
|
-
style:
|
|
912
|
-
}, B(a.name), 13,
|
|
928
|
+
style: _(`opacity:${$.value.includes(a.id) ? 0.5 : 1}`)
|
|
929
|
+
}, B(a.name), 13, Ba)
|
|
913
930
|
]),
|
|
914
931
|
_: 1
|
|
915
932
|
}, 8, ["legendSet", "config"])) : b(t.$slots, "legend", {
|
|
916
933
|
key: 1,
|
|
917
|
-
legend:
|
|
934
|
+
legend: z.value
|
|
918
935
|
}, void 0, !0)
|
|
919
936
|
], 512)
|
|
920
|
-
], 8, ["to"])) :
|
|
937
|
+
], 8, ["to"])) : f("", !0),
|
|
921
938
|
t.$slots.source ? (n(), u("div", {
|
|
922
939
|
key: 6,
|
|
923
940
|
ref_key: "source",
|
|
924
|
-
ref:
|
|
941
|
+
ref: ke,
|
|
925
942
|
dir: "auto"
|
|
926
943
|
}, [
|
|
927
944
|
b(t.$slots, "source", {}, void 0, !0)
|
|
928
|
-
], 512)) :
|
|
929
|
-
|
|
930
|
-
show: m.value.showTooltip &&
|
|
945
|
+
], 512)) : f("", !0),
|
|
946
|
+
fe(v(rt), {
|
|
947
|
+
show: m.value.showTooltip && de.value,
|
|
931
948
|
backgroundColor: e.value.style.chart.tooltip.backgroundColor,
|
|
932
949
|
color: e.value.style.chart.tooltip.color,
|
|
933
950
|
fontSize: e.value.style.chart.tooltip.fontSize,
|
|
@@ -937,44 +954,44 @@ const ya = ["id"], fa = ["id"], ga = ["xmlns", "viewBox"], ba = ["x", "y", "widt
|
|
|
937
954
|
backgroundOpacity: e.value.style.chart.tooltip.backgroundOpacity,
|
|
938
955
|
position: e.value.style.chart.tooltip.position,
|
|
939
956
|
offsetY: e.value.style.chart.tooltip.offsetY,
|
|
940
|
-
parent:
|
|
941
|
-
content:
|
|
957
|
+
parent: M.value,
|
|
958
|
+
content: he.value,
|
|
942
959
|
isFullscreen: D.value,
|
|
943
|
-
isCustom: v(
|
|
960
|
+
isCustom: v(tt)(e.value.style.chart.tooltip.customFormat),
|
|
944
961
|
smooth: e.value.style.chart.tooltip.smooth,
|
|
945
962
|
backdropFilter: e.value.style.chart.tooltip.backdropFilter,
|
|
946
963
|
smoothForce: e.value.style.chart.tooltip.smoothForce,
|
|
947
964
|
smoothSnapThreshold: e.value.style.chart.tooltip.smoothSnapThreshold
|
|
948
965
|
}, {
|
|
949
966
|
"tooltip-before": g(() => [
|
|
950
|
-
b(t.$slots, "tooltip-before", W(
|
|
967
|
+
b(t.$slots, "tooltip-before", U(W({ ...ve.value })), void 0, !0)
|
|
951
968
|
]),
|
|
952
969
|
"tooltip-after": g(() => [
|
|
953
|
-
b(t.$slots, "tooltip-after", W(
|
|
970
|
+
b(t.$slots, "tooltip-after", U(W({ ...ve.value })), void 0, !0)
|
|
954
971
|
]),
|
|
955
972
|
_: 3
|
|
956
973
|
}, 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(),
|
|
974
|
+
Y.value && e.value.userOptions.buttons.table ? (n(), N(Ht(j.value.component), Ut({ key: 7 }, j.value.props, {
|
|
958
975
|
ref_key: "tableUnit",
|
|
959
976
|
ref: V,
|
|
960
|
-
onClose:
|
|
961
|
-
}),
|
|
977
|
+
onClose: Ye
|
|
978
|
+
}), Je({
|
|
962
979
|
content: g(() => [
|
|
963
|
-
(n(),
|
|
964
|
-
key: `table_${
|
|
980
|
+
(n(), N(v(dt), {
|
|
981
|
+
key: `table_${$e.value}`,
|
|
965
982
|
colNames: H.value.colNames,
|
|
966
983
|
head: H.value.head,
|
|
967
984
|
body: H.value.body,
|
|
968
985
|
config: H.value.config,
|
|
969
986
|
title: e.value.table.useDialog ? "" : j.value.title,
|
|
970
987
|
withCloseButton: !e.value.table.useDialog,
|
|
971
|
-
onClose:
|
|
988
|
+
onClose: Ye
|
|
972
989
|
}, {
|
|
973
990
|
th: g(({ th: a }) => [
|
|
974
|
-
|
|
991
|
+
S("div", { innerHTML: a }, null, 8, Ea)
|
|
975
992
|
]),
|
|
976
993
|
td: g(({ td: a }) => [
|
|
977
|
-
|
|
994
|
+
Ke(B(a), 1)
|
|
978
995
|
]),
|
|
979
996
|
_: 1
|
|
980
997
|
}, 8, ["colNames", "head", "body", "config", "title", "withCloseButton"]))
|
|
@@ -984,19 +1001,19 @@ const ya = ["id"], fa = ["id"], ga = ["xmlns", "viewBox"], ba = ["x", "y", "widt
|
|
|
984
1001
|
e.value.table.useDialog ? {
|
|
985
1002
|
name: "title",
|
|
986
1003
|
fn: g(() => [
|
|
987
|
-
|
|
1004
|
+
Ke(B(j.value.title), 1)
|
|
988
1005
|
]),
|
|
989
1006
|
key: "0"
|
|
990
1007
|
} : void 0,
|
|
991
1008
|
e.value.table.useDialog ? {
|
|
992
1009
|
name: "actions",
|
|
993
1010
|
fn: g(() => [
|
|
994
|
-
|
|
1011
|
+
S("button", {
|
|
995
1012
|
tabindex: "0",
|
|
996
1013
|
class: "vue-ui-user-options-button",
|
|
997
|
-
onClick:
|
|
1014
|
+
onClick: l[1] || (l[1] = (a) => pe(e.value.userOptions.callbacks.csv))
|
|
998
1015
|
}, [
|
|
999
|
-
|
|
1016
|
+
fe(v(ct), {
|
|
1000
1017
|
name: "excel",
|
|
1001
1018
|
stroke: j.value.props.color
|
|
1002
1019
|
}, null, 8, ["stroke"])
|
|
@@ -1004,11 +1021,11 @@ const ya = ["id"], fa = ["id"], ga = ["xmlns", "viewBox"], ba = ["x", "y", "widt
|
|
|
1004
1021
|
]),
|
|
1005
1022
|
key: "1"
|
|
1006
1023
|
} : void 0
|
|
1007
|
-
]), 1040)) :
|
|
1008
|
-
v(R) ? (n(),
|
|
1009
|
-
], 46,
|
|
1024
|
+
]), 1040)) : f("", !0),
|
|
1025
|
+
v(R) ? (n(), N(ua, { key: 8 })) : f("", !0)
|
|
1026
|
+
], 46, ba));
|
|
1010
1027
|
}
|
|
1011
|
-
},
|
|
1028
|
+
}, ol = /* @__PURE__ */ ga(Ha, [["__scopeId", "data-v-cb5aaca9"]]);
|
|
1012
1029
|
export {
|
|
1013
|
-
|
|
1030
|
+
ol as default
|
|
1014
1031
|
};
|