vue-data-ui 3.0.0-next.0 → 3.0.0-next.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +108 -67
- package/dist/{Arrow-CzFtSJ1v.js → Arrow-Dck2Ea5K.js} +1 -1
- package/dist/{BaseDraggableDialog-0S5xhs2P.js → BaseDraggableDialog-CatHZ1ns.js} +2 -2
- package/dist/{BaseIcon-DoDjTdD5.js → BaseIcon-BmZ4MREl.js} +1 -1
- package/dist/{ColorPicker-BGRchgqQ.js → ColorPicker-C1MXyD9Q.js} +2 -2
- package/dist/{DataTable-BBbOgI-a.js → DataTable-CgL0Rz0x.js} +2 -2
- package/dist/{Legend-Q4bOb-Nf.js → Legend-CYbP3Kfg.js} +12 -11
- package/dist/{NonSvgPenAndPaper-DNKRvsBB.js → NonSvgPenAndPaper-CcbcJm_U.js} +3 -3
- package/dist/{PackageVersion-D0VPY8-5.js → PackageVersion-CAkNkiIG.js} +1 -1
- package/dist/{PenAndPaper-DhBJsnob.js → PenAndPaper-Cx1-5zdD.js} +32 -32
- package/dist/{Shape-DbsLJ-SE.js → Shape-DBXkGxKt.js} +1 -1
- package/dist/{Slicer-DZEFp2GU.js → Slicer-nrMi5hzj.js} +2 -2
- package/dist/{SparkTooltip-CoOJR62O.js → SparkTooltip-fNzL4pIU.js} +1 -1
- package/dist/{Title-D29apS4l.js → Title-pVYRzQXY.js} +1 -1
- package/dist/Tooltip-NwATo4ZJ.js +157 -0
- package/dist/{UserOptions-Bdit7AWO.js → UserOptions-DAsRxxrf.js} +137 -129
- package/dist/{dom-to-png-BdPIrHOF.js → dom-to-png-BF_4H_6u.js} +1 -1
- package/dist/img-ku4zevVD.js +33 -0
- package/dist/{index-DMqAxz7R.js → index-BzfnuLnw.js} +1199 -1135
- package/dist/pdf-CguiIsUc.js +58 -0
- package/dist/style.css +1 -1
- package/dist/types/vue-data-ui.d.cts +1051 -217
- package/dist/types/vue-data-ui.d.ts +1051 -217
- package/dist/useLoading-Bt5Doa8m.js +28 -0
- package/dist/{useNestedProp-YgN3FV_8.js → useNestedProp-DorElw91.js} +1 -1
- package/dist/{usePrinter-COkTjv6C.js → usePrinter-C9qkgv0r.js} +2 -2
- package/dist/vue-data-ui-DQef_oFO.js +314 -0
- package/dist/vue-data-ui.js +13 -13
- package/dist/{vue-ui-3d-bar-Ojgjl20n.js → vue-ui-3d-bar-DPSamIA-.js} +261 -245
- package/dist/{vue-ui-accordion-P6eFHGQp.js → vue-ui-accordion-DgZK-qDz.js} +3 -3
- package/dist/{vue-ui-age-pyramid-IcMpAhiw.js → vue-ui-age-pyramid-DVeGKvf9.js} +233 -217
- package/dist/{vue-ui-annotator-Bk7d86-x.js → vue-ui-annotator-6ikkK-FK.js} +2 -2
- package/dist/{vue-ui-bullet-DCvWbCPk.js → vue-ui-bullet-Bg4hfFk2.js} +172 -156
- package/dist/{vue-ui-candlestick-DCf-88Yv.js → vue-ui-candlestick-Bi59FGXn.js} +271 -254
- package/dist/{vue-ui-carousel-table-DEsl0XUh.js → vue-ui-carousel-table-DitKhrFT.js} +17 -16
- package/dist/{vue-ui-chestnut-Cg10-3wu.js → vue-ui-chestnut-D8wGAZod.js} +419 -403
- package/dist/{vue-ui-chord-BWYzR6vf.js → vue-ui-chord-C-uTVCDP.js} +256 -240
- package/dist/{vue-ui-circle-pack-CO2Ra2-5.js → vue-ui-circle-pack-CPy6xcxv.js} +230 -214
- package/dist/{vue-ui-cursor-BbYHJDbV.js → vue-ui-cursor-Dd7vUd0q.js} +2 -2
- package/dist/{vue-ui-dashboard-DkCnNuse.js → vue-ui-dashboard-CKurbu8M.js} +62 -62
- package/dist/{vue-ui-digits-DRsphHt2.js → vue-ui-digits-DfdZI11G.js} +2 -2
- package/dist/{vue-ui-donut-evolution-B5F2-0bh.js → vue-ui-donut-evolution-CKbLO8yR.js} +370 -357
- package/dist/vue-ui-donut-tECBFvud.js +1532 -0
- package/dist/{vue-ui-dumbbell-DqqSxoSh.js → vue-ui-dumbbell-DI5Lj3r_.js} +216 -200
- package/dist/{vue-ui-flow-CTIcUJgV.js → vue-ui-flow-CjU48s9z.js} +217 -201
- package/dist/{vue-ui-funnel-k7KD7Xoc.js → vue-ui-funnel-DM_5vHZ4.js} +213 -197
- package/dist/{vue-ui-galaxy-C9EHaP4I.js → vue-ui-galaxy-ocvZgZJx.js} +215 -202
- package/dist/{vue-ui-gauge-CBiM_1-n.js → vue-ui-gauge-DajNoY-D.js} +220 -204
- package/dist/{vue-ui-gizmo-CAc7b2oK.js → vue-ui-gizmo-DTnzeQbm.js} +3 -3
- package/dist/{vue-ui-heatmap-B3ubrP2v.js → vue-ui-heatmap-CfBS8jQe.js} +244 -224
- package/dist/{vue-ui-history-plot-XCqccO3b.js → vue-ui-history-plot-BuOPWQoP.js} +268 -252
- package/dist/{vue-ui-kpi-DTGMDjaZ.js → vue-ui-kpi-DLGHOIRj.js} +3 -3
- package/dist/{vue-ui-mini-loader-Cn_7nvVq.js → vue-ui-mini-loader-CHAHi4c9.js} +2 -2
- package/dist/{vue-ui-molecule-BugMXFAK.js → vue-ui-molecule-R5-oDFeW.js} +204 -188
- package/dist/{vue-ui-mood-radar-Cv4dHZPL.js → vue-ui-mood-radar-Ddf2gaES.js} +206 -190
- package/dist/vue-ui-nested-donuts-CksklV83.js +1177 -0
- package/dist/{vue-ui-onion-Bha2hRAb.js → vue-ui-onion-D2n4zUkV.js} +196 -180
- package/dist/{vue-ui-parallel-coordinate-plot-DWJ2DWx4.js → vue-ui-parallel-coordinate-plot-CNWQqlxf.js} +194 -178
- package/dist/{vue-ui-quadrant-BKHZoTml.js → vue-ui-quadrant-CxNj2FEx.js} +321 -305
- package/dist/{vue-ui-quick-chart-D_k3lbU8.js → vue-ui-quick-chart-Bm_VmhJR.js} +347 -331
- package/dist/{vue-ui-radar-Co4EOjSk.js → vue-ui-radar-DSYMQJ6K.js} +193 -177
- package/dist/{vue-ui-rating-dtNN0EdX.js → vue-ui-rating-BiQpwXnc.js} +2 -2
- package/dist/{vue-ui-relation-circle-CR4UpQzM.js → vue-ui-relation-circle-Cdxe78Bm.js} +188 -172
- package/dist/{vue-ui-ridgeline-BKX97EnR.js → vue-ui-ridgeline-DpeM2hRi.js} +212 -196
- package/dist/{vue-ui-rings-EPTwyt6D.js → vue-ui-rings-BenmQHKv.js} +223 -210
- package/dist/{vue-ui-scatter-BlxzblSR.js → vue-ui-scatter-mDMY1H6U.js} +288 -273
- package/dist/{vue-ui-skeleton-CjN2ZdgT.js → vue-ui-skeleton-Ch_XkFuP.js} +3 -3
- package/dist/{vue-ui-smiley-DdF_ErYG.js → vue-ui-smiley-DTig5lTU.js} +2 -2
- package/dist/{vue-ui-spark-trend-RdOlCuT9.js → vue-ui-spark-trend-BkDsp8E0.js} +3 -3
- package/dist/{vue-ui-sparkbar-DWufRGcN.js → vue-ui-sparkbar-CgqoyBOm.js} +3 -3
- package/dist/{vue-ui-sparkgauge-IP1O3qyT.js → vue-ui-sparkgauge-B4jR_Y62.js} +3 -3
- package/dist/{vue-ui-sparkhistogram-Cnv9xZ8H.js → vue-ui-sparkhistogram-DfxjglLy.js} +4 -4
- package/dist/{vue-ui-sparkline-CYgeD5V3.js → vue-ui-sparkline-M3QR8xJE.js} +3 -3
- package/dist/{vue-ui-sparkstackbar-BCwoK9xd.js → vue-ui-sparkstackbar-B2Ls-Mb8.js} +3 -3
- package/dist/{vue-ui-stackbar-CqFIvfrK.js → vue-ui-stackbar-DIHkn6__.js} +497 -474
- package/dist/{vue-ui-strip-plot-Dq-kDRai.js → vue-ui-strip-plot-B_ZLbu2D.js} +241 -225
- package/dist/{vue-ui-table-vaIdQnPl.js → vue-ui-table-BhymhDOh.js} +3 -3
- package/dist/{vue-ui-table-heatmap-U_Td0cdh.js → vue-ui-table-heatmap-DokRh4dS.js} +26 -25
- package/dist/{vue-ui-table-sparkline-DkOaHx5L.js → vue-ui-table-sparkline-DxBZGKZJ.js} +8 -7
- package/dist/{vue-ui-thermometer-CzckBZgs.js → vue-ui-thermometer-e2L6IdF-.js} +170 -154
- package/dist/{vue-ui-timer-DSdUshUs.js → vue-ui-timer-BG2EwK3o.js} +5 -5
- package/dist/vue-ui-tiremarks-nzQH7woJ.js +358 -0
- package/dist/vue-ui-treemap-CZxyi6fl.js +965 -0
- package/dist/{vue-ui-vertical-bar-Dd4sYeAC.js → vue-ui-vertical-bar-DahdX1Sn.js} +382 -360
- package/dist/{vue-ui-waffle-DusUVY6y.js → vue-ui-waffle-D399D4UE.js} +234 -221
- package/dist/vue-ui-wheel-DtcwtHzJ.js +352 -0
- package/dist/{vue-ui-word-cloud-_7uYjJ5A.js → vue-ui-word-cloud-CTDceQsf.js} +249 -233
- package/dist/{vue-ui-world-COIyBHII.js → vue-ui-world-BjNSbqMZ.js} +239 -223
- package/dist/vue-ui-xy-BkTP-JpK.js +2958 -0
- package/dist/{vue-ui-xy-canvas-CuYRyub2.js → vue-ui-xy-canvas-BKAowbe0.js} +447 -431
- package/package.json +2 -2
- package/dist/Tooltip-hVZUY_s5.js +0 -149
- package/dist/img-BeMVTwmF.js +0 -20
- package/dist/pdf-DPxOdzfi.js +0 -51
- package/dist/useMouse-AicQS8Vf.js +0 -13
- package/dist/vue-data-ui-nceqWRts.js +0 -301
- package/dist/vue-ui-donut-DSE7ubVv.js +0 -1315
- package/dist/vue-ui-nested-donuts-CYe0Are_.js +0 -1154
- package/dist/vue-ui-tiremarks-B2WWklqG.js +0 -342
- package/dist/vue-ui-treemap-D1dgDhjG.js +0 -952
- package/dist/vue-ui-wheel-ClsKBh52.js +0 -336
- package/dist/vue-ui-xy-C_OUyzTC.js +0 -3135
|
@@ -1,16 +1,17 @@
|
|
|
1
|
-
import { defineAsyncComponent as
|
|
2
|
-
import { u as
|
|
3
|
-
import { t as
|
|
4
|
-
import { u as
|
|
5
|
-
import { u as
|
|
6
|
-
import { u as
|
|
7
|
-
import { u as
|
|
8
|
-
import
|
|
9
|
-
import
|
|
10
|
-
|
|
1
|
+
import { defineAsyncComponent as $, computed as x, ref as d, watch as Be, shallowRef as ge, onMounted as Ee, onBeforeUnmount as Ue, createElementBlock as r, openBlock as u, unref as i, normalizeStyle as Y, normalizeClass as pe, createBlock as F, createCommentVNode as y, renderSlot as h, createVNode as be, createSlots as De, withCtx as f, normalizeProps as M, guardReactiveProps as P, createElementVNode as v, Fragment as R, renderList as B, toDisplayString as C, createTextVNode as xe, nextTick as Ge } from "vue";
|
|
2
|
+
import { u as Ve, c as We, a as Xe, o as je, e as He, v as c, X as Ye, s as q, w as me, i as T, f as A, q as qe, r as Je, x as Ke, y as Qe } from "./index-BzfnuLnw.js";
|
|
3
|
+
import { t as Ze, u as et } from "./useResponsive-DfdjqQps.js";
|
|
4
|
+
import { u as we } from "./useNestedProp-DorElw91.js";
|
|
5
|
+
import { u as tt } from "./usePrinter-C9qkgv0r.js";
|
|
6
|
+
import { u as lt } from "./useUserOptionState-BIvW1Kz7.js";
|
|
7
|
+
import { u as at } from "./useChartAccessibility-9icAAmYg.js";
|
|
8
|
+
import ot from "./Title-pVYRzQXY.js";
|
|
9
|
+
import st from "./img-ku4zevVD.js";
|
|
10
|
+
import { _ as it } from "./_plugin-vue_export-helper-CHgC5LLL.js";
|
|
11
|
+
const ut = ["id"], rt = ["xmlns", "viewBox"], nt = ["x", "y", "width", "height"], vt = ["id"], dt = ["stop-color"], yt = ["stop-color"], ht = ["id"], ct = ["stop-color"], ft = ["stop-color"], gt = ["x", "y", "width", "height", "fill", "rx"], pt = ["x", "y", "width", "height", "fill", "rx"], bt = ["x", "y", "width", "height", "fill", "rx"], xt = ["x", "y", "width", "height", "fill", "rx"], mt = { key: 0 }, wt = ["x", "y", "fill", "font-size", "font-weight"], kt = ["x", "y", "fill", "font-size", "font-weight"], _t = { key: 1 }, Ct = ["x", "y", "font-size", "fill", "font-weight"], $t = { key: 2 }, Tt = { key: 0 }, At = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Lt = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], St = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], zt = ["x", "y", "font-size", "fill", "font-weight"], Ot = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], It = ["x", "y", "font-size", "fill", "font-weight"], Ft = ["x", "y", "font-size", "fill", "font-weight"], Mt = ["x", "y", "width", "height", "fill", "onMouseover"], Pt = {
|
|
11
12
|
key: 5,
|
|
12
13
|
class: "vue-data-ui-watermark"
|
|
13
|
-
},
|
|
14
|
+
}, Rt = {
|
|
14
15
|
__name: "vue-ui-age-pyramid",
|
|
15
16
|
props: {
|
|
16
17
|
config: {
|
|
@@ -26,38 +27,38 @@ const st = ["id"], it = ["xmlns", "viewBox"], ut = ["x", "y", "width", "height"]
|
|
|
26
27
|
}
|
|
27
28
|
}
|
|
28
29
|
},
|
|
29
|
-
setup(J, { expose:
|
|
30
|
-
const
|
|
30
|
+
setup(J, { expose: ke }) {
|
|
31
|
+
const _e = $(() => import("./vue-ui-accordion-DgZK-qDz.js")), Ce = $(() => import("./DataTable-CgL0Rz0x.js")), $e = $(() => import("./PackageVersion-CAkNkiIG.js")), Te = $(() => import("./PenAndPaper-Cx1-5zdD.js")), Ae = $(() => import("./vue-ui-skeleton-Ch_XkFuP.js")), Le = $(() => import("./Tooltip-NwATo4ZJ.js")), Se = $(() => import("./UserOptions-DAsRxxrf.js")), { vue_ui_age_pyramid: ze } = Ve(), g = J, E = x(() => !!g.dataset && g.dataset.length), w = d(We()), Oe = d(null), V = d(!1), W = d(""), U = d(null), K = d(0), k = d(null), Q = d(null), Z = d(null), ee = d(null), te = d(0), le = d(0), e = x({
|
|
31
32
|
get: () => ie(),
|
|
32
33
|
set: (t) => t
|
|
33
|
-
}), { userOptionsVisible: X, setUserOptionsVisibility: ae, keepUserOptionState: oe } =
|
|
34
|
+
}), { userOptionsVisible: X, setUserOptionsVisibility: ae, keepUserOptionState: oe } = lt({ config: e.value }), { svgRef: se } = at({ config: e.value.style.title });
|
|
34
35
|
function ie() {
|
|
35
|
-
const t =
|
|
36
|
+
const t = we({
|
|
36
37
|
userConfig: g.config,
|
|
37
|
-
defaultConfig:
|
|
38
|
+
defaultConfig: ze
|
|
38
39
|
});
|
|
39
40
|
return t.theme ? {
|
|
40
|
-
...
|
|
41
|
-
userConfig:
|
|
41
|
+
...we({
|
|
42
|
+
userConfig: Xe.vue_ui_age_pyramid[t.theme] || g.config,
|
|
42
43
|
defaultConfig: t
|
|
43
44
|
})
|
|
44
45
|
} : t;
|
|
45
46
|
}
|
|
46
|
-
|
|
47
|
-
e.value = ie(), X.value = !e.value.userOptions.showOnChartHover, ue(), te.value += 1, le.value += 1,
|
|
47
|
+
Be(() => g.config, (t) => {
|
|
48
|
+
e.value = ie(), X.value = !e.value.userOptions.showOnChartHover, ue(), te.value += 1, le.value += 1, m.value.showTable = e.value.table.show, m.value.showTooltip = e.value.style.tooltip.show;
|
|
48
49
|
}, { deep: !0 });
|
|
49
|
-
const
|
|
50
|
-
|
|
50
|
+
const _ = ge(null), L = ge(null);
|
|
51
|
+
Ee(() => {
|
|
51
52
|
ue();
|
|
52
53
|
});
|
|
53
54
|
function ue() {
|
|
54
|
-
if (
|
|
55
|
+
if (je(g.dataset) && He({
|
|
55
56
|
componentName: "VueUiAgePyramid",
|
|
56
57
|
type: "dataset"
|
|
57
58
|
}), e.value.responsive) {
|
|
58
|
-
const t =
|
|
59
|
-
const { width: s, height: l } =
|
|
60
|
-
chart:
|
|
59
|
+
const t = Ze(() => {
|
|
60
|
+
const { width: s, height: l } = et({
|
|
61
|
+
chart: k.value,
|
|
61
62
|
title: e.value.style.title.text ? Q.value : null,
|
|
62
63
|
source: Z.value,
|
|
63
64
|
noTitle: ee.value
|
|
@@ -66,23 +67,23 @@ const st = ["id"], it = ["xmlns", "viewBox"], ut = ["x", "y", "width", "height"]
|
|
|
66
67
|
p.value.width = s, p.value.height = l;
|
|
67
68
|
});
|
|
68
69
|
});
|
|
69
|
-
|
|
70
|
+
_.value && (L.value && _.value.unobserve(L.value), _.value.disconnect()), _.value = new ResizeObserver(t), L.value = k.value.parentNode, _.value.observe(L.value);
|
|
70
71
|
}
|
|
71
72
|
}
|
|
72
|
-
|
|
73
|
-
|
|
73
|
+
Ue(() => {
|
|
74
|
+
_.value && (L.value && _.value.unobserve(L.value), _.value.disconnect());
|
|
74
75
|
});
|
|
75
|
-
const { isPrinting: re, isImaging: ne, generatePdf:
|
|
76
|
-
elementId: `vue-ui-age-pyramid_${
|
|
76
|
+
const { isPrinting: re, isImaging: ne, generatePdf: ve, generateImage: de } = tt({
|
|
77
|
+
elementId: `vue-ui-age-pyramid_${w.value}`,
|
|
77
78
|
fileName: e.value.style.title.text || "vue-ui-age-pyramid",
|
|
78
79
|
options: e.value.userOptions.print
|
|
79
|
-
}),
|
|
80
|
+
}), Ie = x(() => e.value.userOptions.show && !e.value.style.title.text), m = d({
|
|
80
81
|
showTable: e.value.table.show,
|
|
81
82
|
showTooltip: e.value.style.tooltip.show
|
|
82
|
-
}), p =
|
|
83
|
+
}), p = d({
|
|
83
84
|
height: e.value.style.height,
|
|
84
85
|
width: e.value.style.width
|
|
85
|
-
}), o =
|
|
86
|
+
}), o = x(() => {
|
|
86
87
|
const t = p.value.width - e.value.style.layout.padding.right - e.value.style.layout.padding.left, s = e.value.style.layout.padding.left, l = p.value.width - e.value.style.layout.padding.right;
|
|
87
88
|
return {
|
|
88
89
|
top: e.value.style.layout.padding.top,
|
|
@@ -101,16 +102,16 @@ const st = ["id"], it = ["xmlns", "viewBox"], ut = ["x", "y", "width", "height"]
|
|
|
101
102
|
left: s + t / 2 + e.value.style.layout.centerSlit.width
|
|
102
103
|
}
|
|
103
104
|
};
|
|
104
|
-
}),
|
|
105
|
-
const t =
|
|
105
|
+
}), Fe = x(() => g.dataset.map((t) => e.value.style.layout.dataLabels.yAxis.display === "age" ? t[1] : t[0])), S = x(() => {
|
|
106
|
+
const t = Me(N.value / 5), s = [], l = [];
|
|
106
107
|
for (let a = 0; a <= 5; a += 1) {
|
|
107
|
-
const
|
|
108
|
+
const n = t * a, b = t * (a - 5);
|
|
108
109
|
s.push({
|
|
109
|
-
value:
|
|
110
|
-
x: o.value.left + o.value.width / 2 + e.value.style.layout.centerSlit.width +
|
|
110
|
+
value: n,
|
|
111
|
+
x: o.value.left + o.value.width / 2 + e.value.style.layout.centerSlit.width + n / N.value * o.value.leftChart.width
|
|
111
112
|
}), l.push({
|
|
112
|
-
value: Math.abs(
|
|
113
|
-
x: o.value.left + o.value.width / 2 +
|
|
113
|
+
value: Math.abs(b),
|
|
114
|
+
x: o.value.left + o.value.width / 2 + b / N.value * o.value.leftChart.width - e.value.style.layout.centerSlit.width
|
|
114
115
|
});
|
|
115
116
|
}
|
|
116
117
|
return {
|
|
@@ -118,25 +119,25 @@ const st = ["id"], it = ["xmlns", "viewBox"], ut = ["x", "y", "width", "height"]
|
|
|
118
119
|
left: l
|
|
119
120
|
};
|
|
120
121
|
});
|
|
121
|
-
function
|
|
122
|
+
function Me(t) {
|
|
122
123
|
if (t === 0) return 0;
|
|
123
124
|
const l = 10 ** Math.floor(Math.log10(Math.abs(t)));
|
|
124
125
|
let a;
|
|
125
126
|
return t < 0, a = Math.round(t / l) * l, a;
|
|
126
127
|
}
|
|
127
|
-
const
|
|
128
|
+
const N = x(() => Math.max(...g.dataset.flatMap((t) => t.slice(-2).map((s) => c(s))))), z = x(() => g.dataset.length), Pe = x(() => g.dataset.map((t) => ({
|
|
128
129
|
segment: t[0],
|
|
129
130
|
age: t[1],
|
|
130
131
|
left: {
|
|
131
132
|
value: t[2],
|
|
132
|
-
proportionToMax: t[2] /
|
|
133
|
+
proportionToMax: t[2] / N.value
|
|
133
134
|
},
|
|
134
135
|
right: {
|
|
135
136
|
value: t[3],
|
|
136
|
-
proportionToMax: t[3] /
|
|
137
|
+
proportionToMax: t[3] / N.value
|
|
137
138
|
}
|
|
138
|
-
}))),
|
|
139
|
-
const l = o.value.top + o.value.height /
|
|
139
|
+
}))), O = x(() => Pe.value.map((t, s) => {
|
|
140
|
+
const l = o.value.top + o.value.height / z.value * s, a = o.value.height / z.value - e.value.style.layout.bars.gap;
|
|
140
141
|
return {
|
|
141
142
|
segment: t.segment,
|
|
142
143
|
age: t.age,
|
|
@@ -157,16 +158,16 @@ const st = ["id"], it = ["xmlns", "viewBox"], ut = ["x", "y", "width", "height"]
|
|
|
157
158
|
height: a
|
|
158
159
|
}
|
|
159
160
|
};
|
|
160
|
-
})), j =
|
|
161
|
-
function
|
|
162
|
-
|
|
161
|
+
})), j = d(null);
|
|
162
|
+
function Re(t, s) {
|
|
163
|
+
U.value = t, j.value = {
|
|
163
164
|
datapoint: s,
|
|
164
165
|
seriesIndex: t,
|
|
165
|
-
series:
|
|
166
|
+
series: O.value,
|
|
166
167
|
config: e.value
|
|
167
168
|
};
|
|
168
169
|
const l = e.value.style.tooltip.customFormat;
|
|
169
|
-
if (
|
|
170
|
+
if (Ke(l) && Qe(() => l({
|
|
170
171
|
seriesIndex: t,
|
|
171
172
|
datapoint: {
|
|
172
173
|
segment: s[0],
|
|
@@ -174,7 +175,7 @@ const st = ["id"], it = ["xmlns", "viewBox"], ut = ["x", "y", "width", "height"]
|
|
|
174
175
|
left: s[2],
|
|
175
176
|
right: s[3]
|
|
176
177
|
},
|
|
177
|
-
series:
|
|
178
|
+
series: O.value,
|
|
178
179
|
config: e.value
|
|
179
180
|
})))
|
|
180
181
|
W.value = l({
|
|
@@ -185,31 +186,31 @@ const st = ["id"], it = ["xmlns", "viewBox"], ut = ["x", "y", "width", "height"]
|
|
|
185
186
|
left: s[2],
|
|
186
187
|
right: s[3]
|
|
187
188
|
},
|
|
188
|
-
series:
|
|
189
|
+
series: O.value,
|
|
189
190
|
config: e.value
|
|
190
191
|
});
|
|
191
192
|
else {
|
|
192
193
|
let a = "";
|
|
193
|
-
const
|
|
194
|
-
a += `<div><b>${
|
|
194
|
+
const n = O.value[t];
|
|
195
|
+
a += `<div><b>${n.segment}</b></div>`, a += `<div>${e.value.translations.age}: ${T(
|
|
195
196
|
e.value.style.layout.dataLabels.yAxis.formatter,
|
|
196
|
-
c(
|
|
197
|
-
|
|
197
|
+
c(n.age),
|
|
198
|
+
A({ v: c(n.age) }),
|
|
198
199
|
{ datapoint: s, seriesIndex: t }
|
|
199
|
-
)}</div>`, a += `<div style="margin-top:6px;padding-top:6px;border-top:1px solid ${e.value.style.tooltip.borderColor}">`, a += '<div style="display:flex; flex-direction:row;gap:12px">', a += `<div style="display:flex;flex-direction:column;align-items:center;justify-content:center"><svg viewBox="0 0 12 12" height="12" width="12"><rect stroke="none" x="0" y="0" height="12" width="12" rx="2" fill="${e.value.style.layout.bars.gradient.underlayer}"/><rect stroke="none" x="0" y="0" height="12" width="12" rx="2" fill="${e.value.style.layout.bars.gradient.show ? `url(#age_pyramid_left_${
|
|
200
|
+
)}</div>`, a += `<div style="margin-top:6px;padding-top:6px;border-top:1px solid ${e.value.style.tooltip.borderColor}">`, a += '<div style="display:flex; flex-direction:row;gap:12px">', a += `<div style="display:flex;flex-direction:column;align-items:center;justify-content:center"><svg viewBox="0 0 12 12" height="12" width="12"><rect stroke="none" x="0" y="0" height="12" width="12" rx="2" fill="${e.value.style.layout.bars.gradient.underlayer}"/><rect stroke="none" x="0" y="0" height="12" width="12" rx="2" fill="${e.value.style.layout.bars.gradient.show ? `url(#age_pyramid_left_${w.value})` : e.value.style.layout.bars.left.color}"/></svg><div>${e.value.translations.female}</div><div><b>${T(
|
|
200
201
|
e.value.style.layout.dataLabels.xAxis.formatter,
|
|
201
|
-
c(
|
|
202
|
-
|
|
202
|
+
c(n.left.value),
|
|
203
|
+
A({ v: c(n.left.value) }),
|
|
203
204
|
{ datapoint: s, seriesIndex: t }
|
|
204
|
-
)}</b></div></div>`, a += `<div style="display:flex;flex-direction:column;align-items:center;justify-content:center"><svg viewBox="0 0 12 12" height="12" width="12"><rect stroke="none" x="0" y="0" height="12" width="12" rx="2" fill="${e.value.style.layout.bars.gradient.underlayer}"/><rect stroke="none" x="0" y="0" height="12" width="12" rx="2" fill="${e.value.style.layout.bars.gradient.show ? `url(#age_pyramid_right_${
|
|
205
|
+
)}</b></div></div>`, a += `<div style="display:flex;flex-direction:column;align-items:center;justify-content:center"><svg viewBox="0 0 12 12" height="12" width="12"><rect stroke="none" x="0" y="0" height="12" width="12" rx="2" fill="${e.value.style.layout.bars.gradient.underlayer}"/><rect stroke="none" x="0" y="0" height="12" width="12" rx="2" fill="${e.value.style.layout.bars.gradient.show ? `url(#age_pyramid_right_${w.value})` : e.value.style.layout.bars.right.color}"/></svg><div>${e.value.translations.male}</div><div><b>${T(
|
|
205
206
|
e.value.style.layout.dataLabels.xAxis.formatter,
|
|
206
|
-
c(
|
|
207
|
-
|
|
207
|
+
c(n.right.value),
|
|
208
|
+
A({ v: c(n.right.value) }),
|
|
208
209
|
{ datapoint: s, seriesIndex: t }
|
|
209
|
-
)}</b></div></div>`, a += "</div>", a += `<div style="margin-top:6px;padding-top:6px;border-top:1px solid ${e.value.style.tooltip.borderColor}"><div>${e.value.translations.total}</div><div><b>${
|
|
210
|
+
)}</b></div></div>`, a += "</div>", a += `<div style="margin-top:6px;padding-top:6px;border-top:1px solid ${e.value.style.tooltip.borderColor}"><div>${e.value.translations.total}</div><div><b>${T(
|
|
210
211
|
e.value.style.layout.dataLabels.xAxis.formatter,
|
|
211
|
-
c(
|
|
212
|
-
|
|
212
|
+
c(n.right.value) + c(n.left.value),
|
|
213
|
+
A({ v: c(n.right.value) + c(n.left.value) }),
|
|
213
214
|
{ datapoint: s, seriesIndex: t }
|
|
214
215
|
)}</b></div></div>`, a += "</div>", W.value = `<div>${a}</div>`;
|
|
215
216
|
}
|
|
@@ -217,17 +218,17 @@ const st = ["id"], it = ["xmlns", "viewBox"], ut = ["x", "y", "width", "height"]
|
|
|
217
218
|
}
|
|
218
219
|
function ye(t = null) {
|
|
219
220
|
Ge(() => {
|
|
220
|
-
const s = [e.value.translations.year, e.value.translations.age, e.value.translations.female, e.value.translations.male, e.value.translations.total], l = g.dataset.map((
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
]), a = [[e.value.style.title.text], [e.value.style.title.subtitle.text], [[""], [""], [""]]].concat([s]).concat(l),
|
|
227
|
-
t ? t(
|
|
221
|
+
const s = [e.value.translations.year, e.value.translations.age, e.value.translations.female, e.value.translations.male, e.value.translations.total], l = g.dataset.map((b) => [
|
|
222
|
+
b[0],
|
|
223
|
+
b[1],
|
|
224
|
+
b[2],
|
|
225
|
+
b[3],
|
|
226
|
+
b[2] + b[3]
|
|
227
|
+
]), a = [[e.value.style.title.text], [e.value.style.title.subtitle.text], [[""], [""], [""]]].concat([s]).concat(l), n = qe(a);
|
|
228
|
+
t ? t(n) : Je({ csvContent: n, title: e.value.style.title.text || "vue-ui-heatmap" });
|
|
228
229
|
});
|
|
229
230
|
}
|
|
230
|
-
const
|
|
231
|
+
const D = x(() => {
|
|
231
232
|
const t = [
|
|
232
233
|
e.value.translations.year,
|
|
233
234
|
e.value.translations.age,
|
|
@@ -254,45 +255,59 @@ const st = ["id"], it = ["xmlns", "viewBox"], ut = ["x", "y", "width", "height"]
|
|
|
254
255
|
breakpoint: e.value.table.responsiveBreakpoint
|
|
255
256
|
};
|
|
256
257
|
return { head: t, body: s, config: l, colNames: t };
|
|
257
|
-
}),
|
|
258
|
-
function
|
|
259
|
-
|
|
260
|
-
}
|
|
261
|
-
function he() {
|
|
262
|
-
x.value.showTable = !x.value.showTable;
|
|
258
|
+
}), I = d(!1);
|
|
259
|
+
function he(t) {
|
|
260
|
+
I.value = t, K.value += 1;
|
|
263
261
|
}
|
|
264
262
|
function ce() {
|
|
265
|
-
|
|
263
|
+
m.value.showTable = !m.value.showTable;
|
|
264
|
+
}
|
|
265
|
+
function fe() {
|
|
266
|
+
m.value.showTooltip = !m.value.showTooltip;
|
|
266
267
|
}
|
|
267
|
-
const
|
|
268
|
+
const G = d(!1);
|
|
268
269
|
function H() {
|
|
269
|
-
|
|
270
|
+
G.value = !G.value;
|
|
271
|
+
}
|
|
272
|
+
async function Ne({ scale: t = 2 } = {}) {
|
|
273
|
+
if (!k.value) return;
|
|
274
|
+
const { width: s, height: l } = k.value.getBoundingClientRect(), a = s / l, { imageUri: n, base64: b } = await st({ domElement: k.value, base64: !0, img: !0, scale: t });
|
|
275
|
+
return {
|
|
276
|
+
imageUri: n,
|
|
277
|
+
base64: b,
|
|
278
|
+
title: e.value.style.title.text,
|
|
279
|
+
width: s,
|
|
280
|
+
height: l,
|
|
281
|
+
aspectRatio: a
|
|
282
|
+
};
|
|
270
283
|
}
|
|
271
|
-
return
|
|
272
|
-
|
|
284
|
+
return ke({
|
|
285
|
+
getImage: Ne,
|
|
286
|
+
generatePdf: ve,
|
|
273
287
|
generateCsv: ye,
|
|
274
|
-
generateImage:
|
|
275
|
-
toggleTable:
|
|
276
|
-
toggleTooltip:
|
|
277
|
-
toggleAnnotator: H
|
|
288
|
+
generateImage: de,
|
|
289
|
+
toggleTable: ce,
|
|
290
|
+
toggleTooltip: fe,
|
|
291
|
+
toggleAnnotator: H,
|
|
292
|
+
toggleFullscreen: he
|
|
278
293
|
}), (t, s) => (u(), r("div", {
|
|
279
|
-
class:
|
|
294
|
+
class: pe(`vue-ui-age-pyramid ${I.value ? "vue-data-ui-wrapper-fullscreen" : ""}`),
|
|
280
295
|
ref_key: "agePyramid",
|
|
281
|
-
ref:
|
|
282
|
-
id: `vue-ui-age-pyramid_${
|
|
296
|
+
ref: k,
|
|
297
|
+
id: `vue-ui-age-pyramid_${w.value}`,
|
|
283
298
|
style: Y(`font-family:${e.value.style.fontFamily};width:100%; text-align:center;background:${e.value.style.backgroundColor};${e.value.responsive ? "height:100%" : ""}`),
|
|
284
299
|
onMouseenter: s[2] || (s[2] = () => i(ae)(!0)),
|
|
285
300
|
onMouseleave: s[3] || (s[3] = () => i(ae)(!1))
|
|
286
301
|
}, [
|
|
287
|
-
e.value.userOptions.buttons.annotator ? (u(),
|
|
302
|
+
e.value.userOptions.buttons.annotator ? (u(), F(i(Te), {
|
|
288
303
|
key: 0,
|
|
289
304
|
svgRef: i(se),
|
|
290
305
|
backgroundColor: e.value.style.backgroundColor,
|
|
291
306
|
color: e.value.style.color,
|
|
292
|
-
active:
|
|
307
|
+
active: G.value,
|
|
293
308
|
onClose: H
|
|
294
309
|
}, null, 8, ["svgRef", "backgroundColor", "color", "active"])) : y("", !0),
|
|
295
|
-
|
|
310
|
+
Ie.value ? (u(), r("div", {
|
|
296
311
|
key: 1,
|
|
297
312
|
ref_key: "noTitle",
|
|
298
313
|
ref: ee,
|
|
@@ -305,7 +320,7 @@ const st = ["id"], it = ["xmlns", "viewBox"], ut = ["x", "y", "width", "height"]
|
|
|
305
320
|
ref: Q,
|
|
306
321
|
style: "width:100%;background:transparent"
|
|
307
322
|
}, [
|
|
308
|
-
(u(),
|
|
323
|
+
(u(), F(ot, {
|
|
309
324
|
key: `title_${te.value}`,
|
|
310
325
|
config: {
|
|
311
326
|
title: {
|
|
@@ -319,44 +334,45 @@ const st = ["id"], it = ["xmlns", "viewBox"], ut = ["x", "y", "width", "height"]
|
|
|
319
334
|
}
|
|
320
335
|
}, null, 8, ["config"]))
|
|
321
336
|
], 512)) : y("", !0),
|
|
322
|
-
e.value.userOptions.show &&
|
|
337
|
+
e.value.userOptions.show && E.value && (i(oe) || i(X)) ? (u(), F(i(Se), {
|
|
323
338
|
ref_key: "details",
|
|
324
|
-
ref:
|
|
339
|
+
ref: Oe,
|
|
325
340
|
key: `user_options_${K.value}`,
|
|
326
341
|
backgroundColor: e.value.style.backgroundColor,
|
|
327
342
|
color: e.value.style.color,
|
|
328
343
|
isImaging: i(ne),
|
|
329
344
|
isPrinting: i(re),
|
|
330
|
-
uid:
|
|
345
|
+
uid: w.value,
|
|
331
346
|
hasTooltip: e.value.userOptions.buttons.tooltip && e.value.style.tooltip.show,
|
|
332
347
|
hasPdf: e.value.userOptions.buttons.pdf,
|
|
333
348
|
hasXls: e.value.userOptions.buttons.csv,
|
|
334
349
|
hasImg: e.value.userOptions.buttons.img,
|
|
335
350
|
hasTable: e.value.userOptions.buttons.table,
|
|
336
351
|
hasFullscreen: e.value.userOptions.buttons.fullscreen,
|
|
337
|
-
isFullscreen:
|
|
338
|
-
isTooltip:
|
|
352
|
+
isFullscreen: I.value,
|
|
353
|
+
isTooltip: m.value.showTooltip,
|
|
339
354
|
titles: { ...e.value.userOptions.buttonTitles },
|
|
340
|
-
chartElement:
|
|
355
|
+
chartElement: k.value,
|
|
341
356
|
position: e.value.userOptions.position,
|
|
342
357
|
hasAnnotator: e.value.userOptions.buttons.annotator,
|
|
343
|
-
isAnnotation:
|
|
358
|
+
isAnnotation: G.value,
|
|
344
359
|
callbacks: e.value.userOptions.callbacks,
|
|
345
|
-
|
|
346
|
-
|
|
360
|
+
printScale: e.value.userOptions.print.scale,
|
|
361
|
+
onToggleFullscreen: he,
|
|
362
|
+
onGeneratePdf: i(ve),
|
|
347
363
|
onGenerateCsv: ye,
|
|
348
|
-
onGenerateImage: i(
|
|
349
|
-
onToggleTable:
|
|
350
|
-
onToggleTooltip:
|
|
364
|
+
onGenerateImage: i(de),
|
|
365
|
+
onToggleTable: ce,
|
|
366
|
+
onToggleTooltip: fe,
|
|
351
367
|
onToggleAnnotator: H,
|
|
352
368
|
style: Y({
|
|
353
369
|
visibility: i(oe) ? i(X) ? "visible" : "hidden" : "visible"
|
|
354
370
|
})
|
|
355
|
-
},
|
|
371
|
+
}, De({ _: 2 }, [
|
|
356
372
|
t.$slots.menuIcon ? {
|
|
357
373
|
name: "menuIcon",
|
|
358
374
|
fn: f(({ isOpen: l, color: a }) => [
|
|
359
|
-
h(t.$slots, "menuIcon",
|
|
375
|
+
h(t.$slots, "menuIcon", M(P({ isOpen: l, color: a })), void 0, !0)
|
|
360
376
|
]),
|
|
361
377
|
key: "0"
|
|
362
378
|
} : void 0,
|
|
@@ -398,28 +414,28 @@ const st = ["id"], it = ["xmlns", "viewBox"], ut = ["x", "y", "width", "height"]
|
|
|
398
414
|
t.$slots.optionFullscreen ? {
|
|
399
415
|
name: "optionFullscreen",
|
|
400
416
|
fn: f(({ toggleFullscreen: l, isFullscreen: a }) => [
|
|
401
|
-
h(t.$slots, "optionFullscreen",
|
|
417
|
+
h(t.$slots, "optionFullscreen", M(P({ toggleFullscreen: l, isFullscreen: a })), void 0, !0)
|
|
402
418
|
]),
|
|
403
419
|
key: "6"
|
|
404
420
|
} : void 0,
|
|
405
421
|
t.$slots.optionAnnotator ? {
|
|
406
422
|
name: "optionAnnotator",
|
|
407
423
|
fn: f(({ toggleAnnotator: l, isAnnotator: a }) => [
|
|
408
|
-
h(t.$slots, "optionAnnotator",
|
|
424
|
+
h(t.$slots, "optionAnnotator", M(P({ toggleAnnotator: l, isAnnotator: a })), void 0, !0)
|
|
409
425
|
]),
|
|
410
426
|
key: "7"
|
|
411
427
|
} : void 0
|
|
412
|
-
]), 1032, ["backgroundColor", "color", "isImaging", "isPrinting", "uid", "hasTooltip", "hasPdf", "hasXls", "hasImg", "hasTable", "hasFullscreen", "isFullscreen", "isTooltip", "titles", "chartElement", "position", "hasAnnotator", "isAnnotation", "callbacks", "onGeneratePdf", "onGenerateImage", "style"])) : y("", !0),
|
|
413
|
-
|
|
428
|
+
]), 1032, ["backgroundColor", "color", "isImaging", "isPrinting", "uid", "hasTooltip", "hasPdf", "hasXls", "hasImg", "hasTable", "hasFullscreen", "isFullscreen", "isTooltip", "titles", "chartElement", "position", "hasAnnotator", "isAnnotation", "callbacks", "printScale", "onGeneratePdf", "onGenerateImage", "style"])) : y("", !0),
|
|
429
|
+
E.value ? (u(), r("svg", {
|
|
414
430
|
key: 4,
|
|
415
431
|
ref_key: "svgRef",
|
|
416
432
|
ref: se,
|
|
417
|
-
xmlns: i(
|
|
418
|
-
class:
|
|
433
|
+
xmlns: i(Ye),
|
|
434
|
+
class: pe({ "vue-data-ui-fullscreen--on": I.value, "vue-data-ui-fulscreen--off": !I.value }),
|
|
419
435
|
viewBox: `0 0 ${p.value.width <= 0 ? 10 : p.value.width} ${p.value.height <= 0 ? 10 : p.value.height}`,
|
|
420
436
|
style: Y(`max-width:100%;overflow:visible;background:transparent;color:${e.value.style.color}`)
|
|
421
437
|
}, [
|
|
422
|
-
|
|
438
|
+
be(i($e)),
|
|
423
439
|
t.$slots["chart-background"] ? (u(), r("foreignObject", {
|
|
424
440
|
key: 0,
|
|
425
441
|
x: o.value.left,
|
|
@@ -431,134 +447,134 @@ const st = ["id"], it = ["xmlns", "viewBox"], ut = ["x", "y", "width", "height"]
|
|
|
431
447
|
}
|
|
432
448
|
}, [
|
|
433
449
|
h(t.$slots, "chart-background", {}, void 0, !0)
|
|
434
|
-
], 8,
|
|
435
|
-
|
|
436
|
-
|
|
437
|
-
id: `age_pyramid_left_${
|
|
450
|
+
], 8, nt)) : y("", !0),
|
|
451
|
+
v("defs", null, [
|
|
452
|
+
v("linearGradient", {
|
|
453
|
+
id: `age_pyramid_left_${w.value}`,
|
|
438
454
|
x1: "0%",
|
|
439
455
|
y1: "0%",
|
|
440
456
|
x2: "100%",
|
|
441
457
|
y2: "0%"
|
|
442
458
|
}, [
|
|
443
|
-
|
|
459
|
+
v("stop", {
|
|
444
460
|
offset: "0%",
|
|
445
461
|
"stop-color": e.value.style.layout.bars.left.color
|
|
446
|
-
}, null, 8,
|
|
447
|
-
|
|
462
|
+
}, null, 8, dt),
|
|
463
|
+
v("stop", {
|
|
448
464
|
offset: "100%",
|
|
449
|
-
"stop-color": i(q)(i(
|
|
450
|
-
}, null, 8,
|
|
451
|
-
], 8,
|
|
452
|
-
|
|
453
|
-
id: `age_pyramid_right_${
|
|
465
|
+
"stop-color": i(q)(i(me)(e.value.style.layout.bars.left.color, e.value.style.layout.bars.gradient.shiftHue), 100 - e.value.style.layout.bars.gradient.intensity)
|
|
466
|
+
}, null, 8, yt)
|
|
467
|
+
], 8, vt),
|
|
468
|
+
v("linearGradient", {
|
|
469
|
+
id: `age_pyramid_right_${w.value}`,
|
|
454
470
|
x1: "0%",
|
|
455
471
|
y1: "0%",
|
|
456
472
|
x2: "100%",
|
|
457
473
|
y2: "0%"
|
|
458
474
|
}, [
|
|
459
|
-
|
|
475
|
+
v("stop", {
|
|
460
476
|
offset: "0%",
|
|
461
|
-
"stop-color": i(q)(i(
|
|
462
|
-
}, null, 8,
|
|
463
|
-
|
|
477
|
+
"stop-color": i(q)(i(me)(e.value.style.layout.bars.right.color, e.value.style.layout.bars.gradient.shiftHue), 100 - e.value.style.layout.bars.gradient.intensity)
|
|
478
|
+
}, null, 8, ct),
|
|
479
|
+
v("stop", {
|
|
464
480
|
offset: "100%",
|
|
465
481
|
"stop-color": e.value.style.layout.bars.right.color
|
|
466
|
-
}, null, 8,
|
|
467
|
-
], 8,
|
|
482
|
+
}, null, 8, ft)
|
|
483
|
+
], 8, ht)
|
|
468
484
|
]),
|
|
469
|
-
(u(!0), r(
|
|
470
|
-
|
|
485
|
+
(u(!0), r(R, null, B(O.value, (l, a) => (u(), r("g", null, [
|
|
486
|
+
v("rect", {
|
|
471
487
|
x: l.left.x,
|
|
472
488
|
y: l.left.y,
|
|
473
489
|
width: i(c)(l.left.width <= 0 ? 1e-4 : l.left.width),
|
|
474
490
|
height: l.left.height <= 0 ? 1e-4 : l.left.height,
|
|
475
491
|
fill: e.value.style.layout.bars.gradient.underlayer,
|
|
476
492
|
rx: e.value.style.layout.bars.borderRadius
|
|
477
|
-
}, null, 8,
|
|
478
|
-
|
|
493
|
+
}, null, 8, gt),
|
|
494
|
+
v("rect", {
|
|
479
495
|
x: l.left.x,
|
|
480
496
|
y: l.left.y,
|
|
481
497
|
width: l.left.width <= 0 ? 1e-4 : l.left.width,
|
|
482
498
|
height: l.left.height <= 0 ? 1e-4 : l.left.height,
|
|
483
|
-
fill: e.value.style.layout.bars.gradient.show ? `url(#age_pyramid_left_${
|
|
499
|
+
fill: e.value.style.layout.bars.gradient.show ? `url(#age_pyramid_left_${w.value})` : l.left.color,
|
|
484
500
|
rx: e.value.style.layout.bars.borderRadius
|
|
485
|
-
}, null, 8,
|
|
486
|
-
|
|
501
|
+
}, null, 8, pt),
|
|
502
|
+
v("rect", {
|
|
487
503
|
x: l.right.x,
|
|
488
504
|
y: l.right.y,
|
|
489
505
|
width: l.right.width <= 0 ? 1e-4 : l.right.width,
|
|
490
506
|
height: l.right.height <= 0 ? 1e-4 : l.right.height,
|
|
491
507
|
fill: e.value.style.layout.bars.gradient.underlayer,
|
|
492
508
|
rx: e.value.style.layout.bars.borderRadius
|
|
493
|
-
}, null, 8,
|
|
494
|
-
|
|
509
|
+
}, null, 8, bt),
|
|
510
|
+
v("rect", {
|
|
495
511
|
x: l.right.x,
|
|
496
512
|
y: l.right.y,
|
|
497
513
|
width: l.right.width <= 0 ? 1e-4 : l.right.width,
|
|
498
514
|
height: l.right.height <= 0 ? 1e-4 : l.right.height,
|
|
499
|
-
fill: e.value.style.layout.bars.gradient.show ? `url(#age_pyramid_right_${
|
|
515
|
+
fill: e.value.style.layout.bars.gradient.show ? `url(#age_pyramid_right_${w.value})` : l.right.color,
|
|
500
516
|
rx: e.value.style.layout.bars.borderRadius
|
|
501
|
-
}, null, 8,
|
|
517
|
+
}, null, 8, xt)
|
|
502
518
|
]))), 256)),
|
|
503
|
-
|
|
504
|
-
e.value.style.layout.dataLabels.sideTitles.show ? (u(), r("g",
|
|
505
|
-
|
|
519
|
+
v("g", null, [
|
|
520
|
+
e.value.style.layout.dataLabels.sideTitles.show ? (u(), r("g", mt, [
|
|
521
|
+
v("text", {
|
|
506
522
|
x: o.value.left,
|
|
507
523
|
y: o.value.top + e.value.style.layout.dataLabels.sideTitles.offsetY,
|
|
508
524
|
fill: e.value.style.layout.dataLabels.sideTitles.useSideColor ? e.value.style.layout.bars.left.color : e.value.style.layout.dataLabels.sideTitles.color,
|
|
509
525
|
"font-size": e.value.style.layout.dataLabels.sideTitles.fontSize,
|
|
510
526
|
"text-anchor": "start",
|
|
511
527
|
"font-weight": e.value.style.layout.dataLabels.sideTitles.bold ? "bold" : "normal"
|
|
512
|
-
},
|
|
513
|
-
|
|
528
|
+
}, C(e.value.translations.female), 9, wt),
|
|
529
|
+
v("text", {
|
|
514
530
|
x: o.value.right,
|
|
515
531
|
y: o.value.top + e.value.style.layout.dataLabels.sideTitles.offsetY,
|
|
516
532
|
fill: e.value.style.layout.dataLabels.sideTitles.useSideColor ? e.value.style.layout.bars.right.color : e.value.style.layout.dataLabels.sideTitles.color,
|
|
517
533
|
"font-size": e.value.style.layout.dataLabels.sideTitles.fontSize,
|
|
518
534
|
"text-anchor": "end",
|
|
519
535
|
"font-weight": e.value.style.layout.dataLabels.sideTitles.bold ? "bold" : "normal"
|
|
520
|
-
},
|
|
536
|
+
}, C(e.value.translations.male), 9, kt)
|
|
521
537
|
])) : y("", !0),
|
|
522
|
-
e.value.style.layout.dataLabels.yAxis.show ? (u(), r("g",
|
|
523
|
-
(u(!0), r(
|
|
538
|
+
e.value.style.layout.dataLabels.yAxis.show ? (u(), r("g", _t, [
|
|
539
|
+
(u(!0), r(R, null, B(Fe.value, (l, a) => (u(), r(R, null, [
|
|
524
540
|
a % e.value.style.layout.dataLabels.yAxis.showEvery === 0 ? (u(), r("text", {
|
|
525
541
|
key: 0,
|
|
526
542
|
x: o.value.centerX,
|
|
527
|
-
y: o.value.top + o.value.height /
|
|
543
|
+
y: o.value.top + o.value.height / z.value * a + e.value.style.layout.dataLabels.yAxis.fontSize / 3,
|
|
528
544
|
"text-anchor": "middle",
|
|
529
545
|
"font-size": e.value.style.layout.dataLabels.yAxis.fontSize,
|
|
530
546
|
fill: e.value.style.layout.dataLabels.yAxis.color,
|
|
531
547
|
"font-weight": e.value.style.layout.dataLabels.yAxis.bold ? "bold" : "normal"
|
|
532
|
-
},
|
|
548
|
+
}, C(i(T)(
|
|
533
549
|
e.value.style.layout.dataLabels.yAxis.formatter,
|
|
534
550
|
l,
|
|
535
|
-
i(
|
|
551
|
+
i(A)({ v: l }),
|
|
536
552
|
{ datapoint: l, seriesIndex: a }
|
|
537
|
-
)), 9,
|
|
553
|
+
)), 9, Ct)) : y("", !0)
|
|
538
554
|
], 64))), 256))
|
|
539
555
|
])) : y("", !0),
|
|
540
|
-
e.value.style.layout.dataLabels.xAxis.show ? (u(), r("g",
|
|
541
|
-
e.value.style.layout.grid.show ? (u(), r("g",
|
|
542
|
-
|
|
543
|
-
x1:
|
|
544
|
-
x2:
|
|
556
|
+
e.value.style.layout.dataLabels.xAxis.show ? (u(), r("g", $t, [
|
|
557
|
+
e.value.style.layout.grid.show ? (u(), r("g", Tt, [
|
|
558
|
+
v("line", {
|
|
559
|
+
x1: S.value.right[0].x,
|
|
560
|
+
x2: S.value.right.at(-1).x,
|
|
545
561
|
y1: o.value.bottom + e.value.style.layout.dataLabels.xAxis.fontSize / 2,
|
|
546
562
|
y2: o.value.bottom + e.value.style.layout.dataLabels.xAxis.fontSize / 2,
|
|
547
563
|
stroke: e.value.style.layout.grid.stroke,
|
|
548
564
|
"stroke-width": e.value.style.layout.grid.strokeWidth,
|
|
549
565
|
"stroke-linecap": "round"
|
|
550
|
-
}, null, 8,
|
|
551
|
-
|
|
552
|
-
x1:
|
|
553
|
-
x2:
|
|
566
|
+
}, null, 8, At),
|
|
567
|
+
v("line", {
|
|
568
|
+
x1: S.value.left[0].x,
|
|
569
|
+
x2: S.value.left.at(-1).x,
|
|
554
570
|
y1: o.value.bottom + e.value.style.layout.dataLabels.xAxis.fontSize / 2,
|
|
555
571
|
y2: o.value.bottom + e.value.style.layout.dataLabels.xAxis.fontSize / 2,
|
|
556
572
|
stroke: e.value.style.layout.grid.stroke,
|
|
557
573
|
"stroke-width": e.value.style.layout.grid.strokeWidth,
|
|
558
574
|
"stroke-linecap": "round"
|
|
559
|
-
}, null, 8,
|
|
575
|
+
}, null, 8, Lt)
|
|
560
576
|
])) : y("", !0),
|
|
561
|
-
(u(!0), r(
|
|
577
|
+
(u(!0), r(R, null, B(S.value.right, (l, a) => (u(), r("g", null, [
|
|
562
578
|
e.value.style.layout.grid.show ? (u(), r("line", {
|
|
563
579
|
key: 0,
|
|
564
580
|
x1: l.x,
|
|
@@ -568,24 +584,24 @@ const st = ["id"], it = ["xmlns", "viewBox"], ut = ["x", "y", "width", "height"]
|
|
|
568
584
|
stroke: e.value.style.layout.grid.stroke,
|
|
569
585
|
"stroke-width": e.value.style.layout.grid.strokeWidth,
|
|
570
586
|
"stroke-linecap": "round"
|
|
571
|
-
}, null, 8,
|
|
572
|
-
|
|
587
|
+
}, null, 8, St)) : y("", !0),
|
|
588
|
+
v("text", {
|
|
573
589
|
x: l.x,
|
|
574
590
|
y: o.value.bottom + e.value.style.layout.dataLabels.xAxis.fontSize * 2,
|
|
575
591
|
"font-size": e.value.style.layout.dataLabels.xAxis.fontSize,
|
|
576
592
|
fill: e.value.style.layout.dataLabels.xAxis.color,
|
|
577
593
|
"text-anchor": "middle",
|
|
578
594
|
"font-weight": e.value.style.layout.dataLabels.xAxis.bold ? "bold" : "normal"
|
|
579
|
-
},
|
|
595
|
+
}, C(i(T)(
|
|
580
596
|
e.value.style.layout.dataLabels.xAxis.formatter,
|
|
581
597
|
l.value / e.value.style.layout.dataLabels.xAxis.scale,
|
|
582
|
-
i(
|
|
598
|
+
i(A)({
|
|
583
599
|
v: l.value / e.value.style.layout.dataLabels.xAxis.scale
|
|
584
600
|
}),
|
|
585
601
|
{ datapoint: l, seriesIndex: a }
|
|
586
|
-
)), 9,
|
|
602
|
+
)), 9, zt)
|
|
587
603
|
]))), 256)),
|
|
588
|
-
(u(!0), r(
|
|
604
|
+
(u(!0), r(R, null, B(S.value.left, (l, a) => (u(), r("g", null, [
|
|
589
605
|
e.value.style.layout.grid.show ? (u(), r("line", {
|
|
590
606
|
key: 0,
|
|
591
607
|
x1: l.x,
|
|
@@ -595,52 +611,52 @@ const st = ["id"], it = ["xmlns", "viewBox"], ut = ["x", "y", "width", "height"]
|
|
|
595
611
|
stroke: e.value.style.layout.grid.stroke,
|
|
596
612
|
"stroke-width": e.value.style.layout.grid.strokeWidth,
|
|
597
613
|
"stroke-linecap": "round"
|
|
598
|
-
}, null, 8,
|
|
599
|
-
|
|
614
|
+
}, null, 8, Ot)) : y("", !0),
|
|
615
|
+
v("text", {
|
|
600
616
|
x: l.x,
|
|
601
617
|
y: o.value.bottom + e.value.style.layout.dataLabels.xAxis.fontSize * 2,
|
|
602
618
|
"font-size": e.value.style.layout.dataLabels.xAxis.fontSize,
|
|
603
619
|
fill: e.value.style.layout.dataLabels.xAxis.color,
|
|
604
620
|
"text-anchor": "middle",
|
|
605
621
|
"font-weight": e.value.style.layout.dataLabels.xAxis.bold ? "bold" : "normal"
|
|
606
|
-
},
|
|
622
|
+
}, C(i(T)(
|
|
607
623
|
e.value.style.layout.dataLabels.xAxis.formatter,
|
|
608
624
|
l.value / e.value.style.layout.dataLabels.xAxis.scale,
|
|
609
|
-
i(
|
|
625
|
+
i(A)({
|
|
610
626
|
v: l.value / e.value.style.layout.dataLabels.xAxis.scale
|
|
611
627
|
}),
|
|
612
628
|
{ datapoint: l, seriesIndex: a }
|
|
613
|
-
)), 9,
|
|
629
|
+
)), 9, It)
|
|
614
630
|
]))), 256)),
|
|
615
|
-
|
|
631
|
+
v("text", {
|
|
616
632
|
x: o.value.right,
|
|
617
633
|
y: p.value.height,
|
|
618
634
|
"text-anchor": "end",
|
|
619
635
|
"font-size": e.value.style.layout.dataLabels.xAxis.fontSize,
|
|
620
636
|
fill: e.value.style.layout.dataLabels.xAxis.color,
|
|
621
637
|
"font-weight": e.value.style.layout.dataLabels.xAxis.bold ? "bold" : "normal"
|
|
622
|
-
},
|
|
638
|
+
}, C(e.value.style.layout.dataLabels.xAxis.translation), 9, Ft)
|
|
623
639
|
])) : y("", !0)
|
|
624
640
|
]),
|
|
625
|
-
(u(!0), r(
|
|
626
|
-
|
|
641
|
+
(u(!0), r(R, null, B(J.dataset, (l, a) => (u(), r("g", null, [
|
|
642
|
+
v("rect", {
|
|
627
643
|
x: o.value.left,
|
|
628
|
-
y: o.value.top + o.value.height /
|
|
644
|
+
y: o.value.top + o.value.height / z.value * a - e.value.style.layout.bars.gap / 2,
|
|
629
645
|
width: o.value.width <= 0 ? 1e-4 : o.value.width,
|
|
630
|
-
height: o.value.height /
|
|
631
|
-
fill:
|
|
632
|
-
onMouseover: (
|
|
633
|
-
onMouseleave: s[0] || (s[0] = (
|
|
634
|
-
|
|
646
|
+
height: o.value.height / z.value <= 0 ? 1e-4 : o.value.height / z.value,
|
|
647
|
+
fill: U.value !== null && U.value === a ? i(q)(e.value.style.highlighter.color, e.value.style.highlighter.opacity) : "transparent",
|
|
648
|
+
onMouseover: (n) => Re(a, l),
|
|
649
|
+
onMouseleave: s[0] || (s[0] = (n) => {
|
|
650
|
+
U.value = null, V.value = !1;
|
|
635
651
|
})
|
|
636
|
-
}, null, 40,
|
|
652
|
+
}, null, 40, Mt)
|
|
637
653
|
]))), 256)),
|
|
638
654
|
h(t.$slots, "svg", { svg: p.value }, void 0, !0)
|
|
639
|
-
], 14,
|
|
640
|
-
t.$slots.watermark ? (u(), r("div",
|
|
641
|
-
h(t.$slots, "watermark",
|
|
655
|
+
], 14, rt)) : y("", !0),
|
|
656
|
+
t.$slots.watermark ? (u(), r("div", Pt, [
|
|
657
|
+
h(t.$slots, "watermark", M(P({ isPrinting: i(re) || i(ne) })), void 0, !0)
|
|
642
658
|
])) : y("", !0),
|
|
643
|
-
|
|
659
|
+
E.value ? y("", !0) : (u(), F(i(Ae), {
|
|
644
660
|
key: 6,
|
|
645
661
|
config: {
|
|
646
662
|
type: "pyramid",
|
|
@@ -652,7 +668,7 @@ const st = ["id"], it = ["xmlns", "viewBox"], ut = ["x", "y", "width", "height"]
|
|
|
652
668
|
}
|
|
653
669
|
}
|
|
654
670
|
}, null, 8, ["config"])),
|
|
655
|
-
h(t.$slots, "legend", { legend:
|
|
671
|
+
h(t.$slots, "legend", { legend: O.value }, void 0, !0),
|
|
656
672
|
t.$slots.source ? (u(), r("div", {
|
|
657
673
|
key: 7,
|
|
658
674
|
ref_key: "source",
|
|
@@ -661,8 +677,8 @@ const st = ["id"], it = ["xmlns", "viewBox"], ut = ["x", "y", "width", "height"]
|
|
|
661
677
|
}, [
|
|
662
678
|
h(t.$slots, "source", {}, void 0, !0)
|
|
663
679
|
], 512)) : y("", !0),
|
|
664
|
-
|
|
665
|
-
show:
|
|
680
|
+
be(i(Le), {
|
|
681
|
+
show: m.value.showTooltip && V.value,
|
|
666
682
|
backgroundColor: e.value.style.tooltip.backgroundColor,
|
|
667
683
|
color: e.value.style.tooltip.color,
|
|
668
684
|
borderRadius: e.value.style.tooltip.borderRadius,
|
|
@@ -672,24 +688,24 @@ const st = ["id"], it = ["xmlns", "viewBox"], ut = ["x", "y", "width", "height"]
|
|
|
672
688
|
backgroundOpacity: e.value.style.tooltip.backgroundOpacity,
|
|
673
689
|
position: e.value.style.tooltip.position,
|
|
674
690
|
offsetY: e.value.style.tooltip.offsetY,
|
|
675
|
-
parent:
|
|
691
|
+
parent: k.value,
|
|
676
692
|
content: W.value,
|
|
677
|
-
isFullscreen:
|
|
693
|
+
isFullscreen: I.value,
|
|
678
694
|
isCustom: e.value.style.tooltip.customFormat && typeof e.value.style.tooltip.customFormat == "function"
|
|
679
695
|
}, {
|
|
680
696
|
"tooltip-before": f(() => [
|
|
681
|
-
h(t.$slots, "tooltip-before",
|
|
697
|
+
h(t.$slots, "tooltip-before", M(P({ ...j.value })), void 0, !0)
|
|
682
698
|
]),
|
|
683
699
|
"tooltip-after": f(() => [
|
|
684
|
-
h(t.$slots, "tooltip-after",
|
|
700
|
+
h(t.$slots, "tooltip-after", M(P({ ...j.value })), void 0, !0)
|
|
685
701
|
]),
|
|
686
702
|
_: 3
|
|
687
703
|
}, 8, ["show", "backgroundColor", "color", "borderRadius", "borderColor", "borderWidth", "fontSize", "backgroundOpacity", "position", "offsetY", "parent", "content", "isFullscreen", "isCustom"]),
|
|
688
|
-
|
|
704
|
+
E.value ? (u(), F(i(_e), {
|
|
689
705
|
key: 8,
|
|
690
706
|
hideDetails: "",
|
|
691
707
|
config: {
|
|
692
|
-
open:
|
|
708
|
+
open: m.value.showTable,
|
|
693
709
|
maxHeight: 1e4,
|
|
694
710
|
body: {
|
|
695
711
|
backgroundColor: e.value.style.backgroundColor,
|
|
@@ -702,29 +718,29 @@ const st = ["id"], it = ["xmlns", "viewBox"], ut = ["x", "y", "width", "height"]
|
|
|
702
718
|
}
|
|
703
719
|
}, {
|
|
704
720
|
content: f(() => [
|
|
705
|
-
(u(),
|
|
721
|
+
(u(), F(i(Ce), {
|
|
706
722
|
key: `table_${le.value}`,
|
|
707
|
-
colNames:
|
|
708
|
-
head:
|
|
709
|
-
body:
|
|
710
|
-
config:
|
|
723
|
+
colNames: D.value.colNames,
|
|
724
|
+
head: D.value.head,
|
|
725
|
+
body: D.value.body,
|
|
726
|
+
config: D.value.config,
|
|
711
727
|
title: `${e.value.style.title.text}${e.value.style.title.subtitle.text ? ` : ${e.value.style.title.subtitle.text}` : ""}`,
|
|
712
|
-
onClose: s[1] || (s[1] = (l) =>
|
|
728
|
+
onClose: s[1] || (s[1] = (l) => m.value.showTable = !1)
|
|
713
729
|
}, {
|
|
714
730
|
th: f(({ th: l }) => [
|
|
715
|
-
|
|
731
|
+
xe(C(l), 1)
|
|
716
732
|
]),
|
|
717
733
|
td: f(({ td: l }) => [
|
|
718
|
-
|
|
734
|
+
xe(C(l), 1)
|
|
719
735
|
]),
|
|
720
736
|
_: 1
|
|
721
737
|
}, 8, ["colNames", "head", "body", "config", "title"]))
|
|
722
738
|
]),
|
|
723
739
|
_: 1
|
|
724
740
|
}, 8, ["config"])) : y("", !0)
|
|
725
|
-
], 46,
|
|
741
|
+
], 46, ut));
|
|
726
742
|
}
|
|
727
|
-
},
|
|
743
|
+
}, Ht = /* @__PURE__ */ it(Rt, [["__scopeId", "data-v-fb8f7a5f"]]);
|
|
728
744
|
export {
|
|
729
|
-
|
|
745
|
+
Ht as default
|
|
730
746
|
};
|