vue-data-ui-hq
Version:
A user-empowering data visualization Vue 3 components library for eloquent data storytelling
1,544 lines • 77.7 kB
JavaScript
import { ref as m, computed as f, openBlock as e, createElementBlock as s, unref as t, normalizeClass as N, normalizeStyle as n, createVNode as a, createElementVNode as o, createCommentVNode as c, Fragment as k, renderList as _, createStaticVNode as A } from "vue";
import { u as F, O as $, X as d, s as u, V as O } from "./index-WrV3SAID.js";
import { u as V } from "./useNestedProp-Cj0kHD7k.js";
import { _ as h } from "./PackageVersion-1NslmM8M.js";
import { _ as X } from "./_plugin-vue_export-helper-CHgC5LLL.js";
const G = ["id"], R = ["xmlns"], T = ["stroke"], Y = ["stroke"], D = ["stroke"], U = ["fill", "stroke"], J = ["fill"], K = ["fill", "stroke"], Q = ["fill"], tt = ["fill", "stroke"], lt = ["fill"], ot = ["fill", "stroke"], et = ["fill"], st = ["fill", "stroke"], rt = ["fill"], it = ["fill", "stroke"], nt = ["fill"], ct = ["xmlns"], dt = ["stroke", "fill"], yt = ["xmlns"], at = ["stroke", "fill"], ht = ["xmlns"], kt = ["fill"], ut = ["fill"], _t = ["fill"], xt = ["fill"], pt = ["xmlns"], gt = ["stroke"], ft = ["fill"], wt = ["stroke", "fill"], mt = ["stroke", "fill"], bt = ["fill"], Mt = ["stroke", "fill"], vt = ["stroke", "fill"], Ct = ["fill"], Lt = ["stroke", "fill"], At = ["stroke", "fill"], $t = ["fill"], Bt = ["stroke", "fill"], Pt = ["stroke", "fill"], Wt = ["fill"], zt = ["stroke", "fill"], jt = ["stroke", "fill"], qt = ["xmlns"], Ht = ["stroke"], Et = ["stroke"], St = ["stroke", "fill"], Zt = ["stroke", "fill"], It = ["stroke", "fill"], Nt = ["stroke", "fill"], Ft = ["stroke", "fill"], Ot = ["stroke", "fill"], Vt = ["stroke", "fill"], Xt = ["stroke", "fill"], Gt = ["stroke", "fill"], Rt = ["stroke", "fill"], Tt = ["stroke", "fill"], Yt = ["stroke", "fill"], Dt = ["stroke", "fill"], Ut = ["stroke", "fill"], Jt = ["stroke", "fill"], Kt = ["stroke", "fill"], Qt = ["stroke", "fill"], tl = ["stroke", "fill"], ll = ["stroke", "fill"], ol = ["stroke", "fill"], el = ["stroke", "fill"], sl = ["stroke", "fill"], rl = ["stroke", "fill"], il = ["xmlns"], nl = ["stroke"], cl = ["xmlns"], dl = ["stroke"], yl = ["xmlns"], al = ["stroke"], hl = ["xmlns"], kl = ["fill"], ul = ["fill"], _l = ["fill"], xl = ["fill"], pl = ["fill"], gl = ["fill"], fl = ["fill"], wl = ["fill"], ml = ["fill"], bl = ["fill"], Ml = ["fill"], vl = ["fill"], Cl = ["xmlns"], Ll = ["stroke"], Al = ["stroke"], $l = ["stroke"], Bl = ["stroke"], Pl = ["stroke"], Wl = ["stroke"], zl = ["xmlns"], jl = ["stroke"], ql = ["stroke"], Hl = ["stroke"], El = ["stroke"], Sl = ["stroke"], Zl = ["stroke"], Il = ["stroke"], Nl = ["stroke"], Fl = ["stroke"], Ol = ["xmlns"], Vl = ["stroke"], Xl = ["xmlns"], Gl = ["stroke"], Rl = ["stroke"], Tl = ["stroke"], Yl = ["stroke"], Dl = ["stroke"], Ul = ["stroke"], Jl = ["stroke"], Kl = ["stroke"], Ql = ["stroke"], to = ["xmlns"], lo = ["x1", "x2", "stroke"], oo = ["xmlns"], eo = ["x", "y", "width", "height", "fill"], so = ["y", "width", "height", "fill"], ro = ["xmlns"], io = ["fill"], no = ["fill"], co = ["fill"], yo = ["xmlns"], ao = ["x1", "x2", "y1", "y2", "stroke"], ho = ["stroke"], ko = ["fill"], uo = ["xmlns"], _o = ["fill"], xo = ["fill"], po = ["x1", "y1", "x2", "y2", "stroke-width", "stroke"], go = ["xmlns"], fo = { key: 0 }, wo = ["stroke", "stroke-width"], mo = ["stroke", "stroke-width"], bo = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Mo = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], vo = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Co = ["x", "y", "height", "width", "fill"], Lo = ["xmlns", "viewBox"], Ao = ["x", "y", "stroke", "fill"], $o = ["xmlns"], Bo = ["d", "stroke"], Po = ["cx", "cy", "r", "fill", "stroke"], Wo = ["cx", "cy", "r", "fill", "stroke"], zo = ["x", "y", "width", "fill"], jo = ["cx", "cy", "fill"], qo = ["cx", "cy", "fill"], Ho = ["stroke"], Eo = ["xmlns"], So = ["stroke", "stroke-width"], Zo = ["stroke", "stroke-width"], Io = ["stroke", "stroke-width"], No = ["fill"], Fo = ["fill"], Oo = ["fill"], Vo = ["fill"], Xo = ["fill"], Go = ["fill"], Ro = ["xmlns"], To = { key: 0 }, Yo = ["stroke", "stroke-width"], Do = ["stroke", "stroke-width"], Uo = ["stroke", "stroke-width"], Jo = { key: 1 }, Ko = ["r", "fill"], Qo = ["r", "fill"], te = ["xmlns"], le = { key: 0 }, oe = ["stroke", "stroke-width"], ee = ["stroke", "stroke-width"], se = ["fill", "rx", "x", "y", "width", "height"], re = ["xmlns"], ie = ["stroke-width", "stroke"], ne = ["stroke-width", "stroke"], ce = ["stroke-width", "stroke"], de = ["xmlns"], ye = ["stroke"], ae = ["stroke"], he = ["stroke"], ke = ["stroke"], ue = ["fill"], _e = ["stroke"], xe = ["xmlns"], pe = ["stroke", "stroke-width"], ge = ["stroke", "stroke-width"], fe = ["fill", "r"], we = ["fill", "r"], me = ["fill", "r"], be = ["fill", "r"], Me = ["fill", "r"], ve = ["fill", "r"], Ce = ["fill", "r"], Le = ["fill", "r"], Ae = ["fill", "r"], $e = ["xmlns"], Be = ["d", "stroke", "stroke-width"], Pe = ["d", "stroke", "stroke-width"], We = ["d", "stroke", "stroke-width"], ze = ["d", "stroke", "stroke-width"], je = ["stroke", "stroke-width"], qe = ["stroke", "stroke-width"], He = ["stroke", "stroke-width"], Ee = ["fill"], Se = ["fill"], Ze = ["xmlns"], Ie = ["x", "y", "fill"], Ne = ["x", "y", "fill"], Fe = ["x", "y", "fill"], Oe = ["xmlns"], Ve = ["fill"], Xe = ["fill"], Ge = ["y1", "y2", "stroke", "stroke-width"], Re = ["x1", "x2", "stroke", "stroke-width"], Te = ["xmlns", "stroke"], Ye = ["fill"], De = ["xmlns", "stroke"], Ue = ["xmlns", "stroke"], Je = ["fill"], Ke = ["xmlns", "stroke"], Qe = ["xmlns", "stroke"], ts = ["fill"], ls = ["xmlns", "stroke"], os = ["xmlns", "stroke"], es = ["fill"], ss = ["xmlns", "stroke"], rs = ["xmlns", "stroke"], is = ["fill"], ns = ["xmlns", "stroke"], cs = ["xmlns"], ds = ["points", "fill", "stroke", "stroke-width"], ys = ["xmlns"], as = { key: 0 }, hs = ["stroke", "stroke-width"], ks = ["y", "width", "fill", "rx"], us = {
__name: "vue-ui-skeleton",
props: {
config: {
type: Object,
default() {
return {};
}
}
},
setup(B) {
const { vue_ui_skeleton: P } = F(), W = B, z = m(`vue-ui-skeleton-${Math.random()}`), l = f(() => V({
userConfig: W.config,
defaultConfig: P
})), j = f(() => l.value.style.animated), y = f(() => l.value.type), q = m([60, 50, 55, 36, 40, 25, 26, 12]), H = f(() => $({
plot: { x: 50, y: 50 },
radius: 40,
sides: 6
}).path), E = f(() => $({
plot: { x: 50, y: 50 },
radius: 30,
sides: 6
}).path), S = f(() => $({
plot: { x: 50, y: 50 },
radius: 20,
sides: 6
}).path), Z = f(() => $({
plot: { x: 50, y: 50 },
radius: 10,
sides: 6
}).path), M = m([
{
root: {
x: 70,
y: 77,
r: 44,
opacity: 100
},
bars: [
{
x: 200,
y: 37,
opacity: 100,
width: 240
},
{
x: 200,
y: 118,
opacity: 100,
width: 180
},
{
x: 200,
y: 253,
opacity: 100,
width: 80
}
]
},
{
root: {
x: 70,
y: 177,
r: 32,
opacity: 70
},
bars: [
{
x: 200,
y: 145,
opacity: 70,
width: 160
},
{
x: 200,
y: 172,
opacity: 70,
width: 140
},
{
x: 200,
y: 199,
opacity: 70,
width: 120
}
]
},
{
root: {
x: 70,
y: 257,
r: 24,
opacity: 40
},
bars: [
{
x: 200,
y: 64,
opacity: 40,
width: 220
},
{
x: 200,
y: 91,
opacity: 40,
width: 200
},
{
x: 200,
y: 226,
opacity: 40,
width: 100
}
]
}
]), p = m([
{
y: 200,
height: 100,
bar: 50
},
{
y: 180,
height: 100,
bar: 40
},
{
y: 150,
height: 100,
bar: 30
},
{
y: 120,
height: 80,
bar: 50
},
{
y: 110,
height: 60,
bar: 30
},
{
y: 80,
height: 80,
bar: 10
},
{
y: 50,
height: 80,
bar: 40
},
{
y: 24,
height: 40,
bar: 24
},
{
y: 44,
height: 20,
bar: 13
},
{
y: 32,
height: 45,
bar: 19
}
]), b = m([
[3, 2.5],
[4, 3.1],
[8, 6],
[9.5, 6.5],
[12, 11],
[16, 15],
[18, 18.2],
[25, 24],
[24, 26],
[32, 32],
[33, 32],
[32, 31],
[38, 37],
[37, 38],
[42, 41],
[40, 41],
[44, 45],
[38, 35],
[31, 32]
]), v = m(
[
{ x: 40, y: 30 },
{ x: 45, y: 28 },
{ x: 50, y: 25 },
{ x: 55, y: 20 },
{ x: 60, y: 27 },
{ x: 65, y: 14 },
{ x: 70, y: 23 },
{ x: 75, y: 16 },
{ x: 80, y: 25 },
{ x: 85, y: 10 },
{ x: 90, y: 18 },
{ x: 95, y: 7 },
{ x: 100, y: 12 },
{ x: 105, y: 10 },
{ x: 110, y: 20 },
{ x: 115, y: 7 },
{ x: 120, y: 14 },
{ x: 125, y: 10 },
{ x: 130, y: 19 },
{ x: 135, y: 3 },
{ x: 140, y: 10 },
{ x: 145, y: 2 },
{ x: 150, y: 1 }
]
);
function C(w, x = 1) {
return {
x: 200 + 160 * Math.cos(29.85 + w * Math.PI / 180) * x,
y: 200 + 160 * Math.sin(29.85 + w * Math.PI / 180) * x
};
}
const I = f(() => {
const w = [];
for (let r = 0; r < 100; r += 1)
w.push({
x1: C(360 / 100 * r).x,
y1: C(360 / 100 * r).y,
x2: C(360 / 100 * r, 0.9).x,
y2: C(360 / 100 * r, 0.9).y,
color: l.value.style.wheel.color
});
return w;
});
return (w, x) => (e(), s("div", {
id: t(z),
class: N({ "vue-ui-skeleton": !0, "vue-ui-skeleton-animated": t(j) }),
style: n(`background:${t(l).style.backgroundColor};color:${t(l).style.color};display:flex;align-items:center;justify-content:center;`)
}, [
t(y) === "historyPlot" ? (e(), s("svg", {
key: 0,
xmlns: t(d),
width: "100%",
viewBox: "0 0 612 512",
style: n(`background:${t(l).style.backgroundColor}`)
}, [
a(h),
o("line", {
x1: "12",
x2: "12",
y1: "12",
y2: "500",
stroke: t(l).style.historyPlot.color,
"stroke-width": "3",
"stroke-linecap": "round"
}, null, 8, T),
o("line", {
x1: "12",
x2: "600",
y1: "500",
y2: "500",
stroke: t(l).style.historyPlot.color,
"stroke-width": "3",
"stroke-linecap": "round"
}, null, 8, Y),
o("path", {
d: "M 80,100 300,200 400,150 560,230 360,420 230,320",
fill: "none",
stroke: t(l).style.historyPlot.color,
"stroke-width": "3"
}, null, 8, D),
o("circle", {
cx: "80",
cy: "100",
r: "24",
fill: t(l).style.historyPlot.color,
stroke: t(l).style.backgroundColor,
"stroke-width": "3"
}, null, 8, U),
o("text", {
x: "80",
y: "108",
fill: t(l).style.backgroundColor,
"font-size": "24",
"text-anchor": "middle"
}, "1", 8, J),
o("circle", {
cx: "300",
cy: "200",
r: "24",
fill: t(l).style.historyPlot.color,
stroke: t(l).style.backgroundColor,
"stroke-width": "3"
}, null, 8, K),
o("text", {
x: "300",
y: "208",
fill: t(l).style.backgroundColor,
"font-size": "24",
"text-anchor": "middle"
}, "2", 8, Q),
o("circle", {
cx: "400",
cy: "150",
r: "24",
fill: t(l).style.historyPlot.color,
stroke: t(l).style.backgroundColor,
"stroke-width": "3"
}, null, 8, tt),
o("text", {
x: "400",
y: "158",
fill: t(l).style.backgroundColor,
"font-size": "24",
"text-anchor": "middle"
}, "3", 8, lt),
o("circle", {
cx: "560",
cy: "230",
r: "24",
fill: t(l).style.historyPlot.color,
stroke: t(l).style.backgroundColor,
"stroke-width": "3"
}, null, 8, ot),
o("text", {
x: "560",
y: "238",
fill: t(l).style.backgroundColor,
"font-size": "24",
"text-anchor": "middle"
}, "4", 8, et),
o("circle", {
cx: "360",
cy: "420",
r: "24",
fill: t(l).style.historyPlot.color,
stroke: t(l).style.backgroundColor,
"stroke-width": "3"
}, null, 8, st),
o("text", {
x: "360",
y: "428",
fill: t(l).style.backgroundColor,
"font-size": "24",
"text-anchor": "middle"
}, "5", 8, rt),
o("circle", {
cx: "230",
cy: "320",
r: "24",
fill: t(l).style.historyPlot.color,
stroke: t(l).style.backgroundColor,
"stroke-width": "3"
}, null, 8, it),
o("text", {
x: "230",
y: "328",
fill: t(l).style.backgroundColor,
"font-size": "24",
"text-anchor": "middle"
}, "6", 8, nt)
], 12, R)) : c("", !0),
t(y) === "flow" ? (e(), s("svg", {
key: 1,
xmlns: t(d),
width: "100%",
viewBox: "0 0 80 60",
style: n(`background:${t(l).style.backgroundColor}`)
}, [
a(h),
o("path", {
d: "M 5 5 L 5 55 M 75 5 L 75 55 M 28 5 L 28 55 M 52 5 L 52 55 M 5 8 L 28 12 L 52 9 L 75 8 L 75 12 L 52 12 L 28 21 L 5 29 Z M 5 34 L 28 35 L 52 24 L 75 21 L 75 27 L 52 30 L 28 44 L 52 39 L 75 41 L 75 47 L 52 45 L 28 52 L 5 52 Z",
stroke: t(l).style.flow.color,
"stroke-width": 0.8,
"stroke-linecap": "round",
"stroke-linejoin": "round",
fill: t(l).style.flow.color
}, null, 8, dt)
], 12, ct)) : c("", !0),
t(y) === "parallelCoordinatePlot" ? (e(), s("svg", {
key: 2,
xmlns: t(d),
width: "100%",
viewBox: "0 0 80 60",
style: n(`background:${t(l).style.backgroundColor}`)
}, [
a(h),
o("path", {
d: "M 5 5 L 5 55 M 75 5 L 75 55 M 28 5 L 28 55 M 52 5 L 52 55 M 5 10 A 1 1 0 0 0 5 12 A 1 1 0 0 0 5 10 M 28 15 A 1 1 0 0 0 28 17 A 1 1 0 0 0 28 15 M 52 8 A 1 1 0 0 0 52 10 A 1 1 0 0 0 52 8 M 75 11 A 1 1 0 0 0 75 13 A 1 1 0 0 0 75 11 M 6 11 L 27 16 M 29 16 L 51 9 M 53 9 L 74 12 M 5 50 A 1 1 0 0 0 5 48 A 1 1 0 0 0 5 50 M 28 39 A 1 1 0 0 0 28 41 A 1 1 0 0 0 28 39 M 52 45 A 1 1 0 0 0 52 47 A 1 1 0 0 0 52 45 M 75 45 A 1 1 0 0 0 75 47 A 1 1 0 0 0 75 45 M 6 49 L 27 40 M 29 40 L 51 46 M 53 46 L 74 46 M 5 25 A 1 1 0 0 0 5 27 A 1 1 0 0 0 5 25 M 28 31 A 1 1 0 0 0 28 33 A 1 1 0 0 0 28 31 M 52 23 A 1 1 0 0 0 52 25 A 1 1 0 0 0 52 23 M 75 21 A 1 1 0 0 0 75 23 A 1 1 0 0 0 75 21 M 6 26 L 27 32 M 29 32 L 51 24 M 53 24 L 74 22",
stroke: t(l).style.parallelCoordinatePlot.color,
"stroke-width": 0.8,
"stroke-linecap": "round",
"stroke-linejoin": "round",
fill: t(l).style.parallelCoordinatePlot.color
}, null, 8, at)
], 12, yt)) : c("", !0),
t(y) === "bullet" ? (e(), s("svg", {
key: 3,
xmlns: t(d),
width: "100%",
viewBox: "0 0 600 96",
style: n(`background:${t(l).style.backgroundColor}`)
}, [
o("rect", {
fill: t(l).style.bullet.color,
x: 24,
y: 12,
width: 300,
height: 72,
style: { opacity: "0.8" }
}, null, 8, kt),
o("rect", {
fill: t(l).style.bullet.color,
x: 324,
y: 12,
width: 150,
height: 72,
style: { opacity: "0.6" }
}, null, 8, ut),
o("rect", {
fill: t(l).style.bullet.color,
x: 474,
y: 12,
width: 102,
height: 72,
style: { opacity: "0.3" }
}, null, 8, _t),
o("rect", {
fill: t(l).style.bullet.color,
x: 24,
y: 36,
width: 490,
height: 24,
style: { opacity: "1" }
}, null, 8, xt)
], 12, ht)) : c("", !0),
t(y) === "dumbbell" ? (e(), s("svg", {
key: 4,
xmlns: t(d),
width: "100%",
viewBox: "0 0 100 55",
style: n(`background:${t(l).style.backgroundColor}`)
}, [
a(h),
o("line", {
x1: "3",
x2: "3",
y1: "3",
y2: "67",
stroke: t(l).style.dumbbell.color,
"stroke-width": 0.5,
"stroke-linecap": "round",
"stroke-linejoin": "round"
}, null, 8, gt),
o("path", {
d: `
M 30,11
C 39,10 39,10
45,11
L 45,9
C 39,10 39,10
30,9 Z
`,
fill: t(l).style.dumbbell.color
}, null, 8, ft),
o("circle", {
cx: "30",
cy: "10",
r: "2",
stroke: t(l).style.backgroundColor,
"stroke-width": 0.3,
fill: t(l).style.dumbbell.color
}, null, 8, wt),
o("circle", {
cx: "46",
cy: "10",
r: "2",
stroke: t(l).style.backgroundColor,
"stroke-width": 0.3,
fill: t(l).style.dumbbell.color
}, null, 8, mt),
o("path", {
d: `
M 10,21
C 23,20 23,20
36,21
L 36,19
C 23,20 23,20
10,19 Z
`,
fill: t(l).style.dumbbell.color
}, null, 8, bt),
o("circle", {
cx: "10",
cy: "20",
r: "2",
stroke: t(l).style.backgroundColor,
"stroke-width": 0.3,
fill: t(l).style.dumbbell.color
}, null, 8, Mt),
o("circle", {
cx: "36",
cy: "20",
r: "2",
stroke: t(l).style.backgroundColor,
"stroke-width": 0.3,
fill: t(l).style.dumbbell.color
}, null, 8, vt),
o("path", {
d: `
M 30,31
C 45,30 45,30
60,31
L 60,29
C 45,30 45,30
30,29 Z
`,
fill: t(l).style.dumbbell.color
}, null, 8, Ct),
o("circle", {
cx: "30",
cy: "30",
r: "2",
stroke: t(l).style.backgroundColor,
"stroke-width": 0.3,
fill: t(l).style.dumbbell.color
}, null, 8, Lt),
o("circle", {
cx: "60",
cy: "30",
r: "2",
stroke: t(l).style.backgroundColor,
"stroke-width": 0.3,
fill: t(l).style.dumbbell.color
}, null, 8, At),
o("path", {
d: `
M 50,41
C 65,40 65,40
80,41
L 80,39
C 65,40 65,40
50,39 Z
`,
fill: t(l).style.dumbbell.color
}, null, 8, $t),
o("circle", {
cx: "50",
cy: "40",
r: "2",
stroke: t(l).style.backgroundColor,
"stroke-width": 0.3,
fill: t(l).style.dumbbell.color
}, null, 8, Bt),
o("circle", {
cx: "80",
cy: "40",
r: "2",
stroke: t(l).style.backgroundColor,
"stroke-width": 0.3,
fill: t(l).style.dumbbell.color
}, null, 8, Pt),
o("path", {
d: `
M 40,51
C 65,50 65,50
90,51
L 90,49
C 65,50 65,50
40,49 Z
`,
fill: t(l).style.dumbbell.color
}, null, 8, Wt),
o("circle", {
cx: "40",
cy: "50",
r: "2",
stroke: t(l).style.backgroundColor,
"stroke-width": 0.3,
fill: t(l).style.dumbbell.color
}, null, 8, zt),
o("circle", {
cx: "90",
cy: "50",
r: "2",
stroke: t(l).style.backgroundColor,
"stroke-width": 0.3,
fill: t(l).style.dumbbell.color
}, null, 8, jt)
], 12, pt)) : c("", !0),
t(y) === "stripPlot" ? (e(), s("svg", {
key: 5,
xmlns: t(d),
width: "100%",
viewBox: "0 0 100 100",
style: n(`background:${t(l).style.backgroundColor}`)
}, [
a(h),
o("line", {
x1: "3",
x2: "3",
y1: "3",
y2: "97",
stroke: t(l).style.stripPlot.color,
"stroke-width": 0.5,
"stroke-linecap": "round",
"stroke-linejoin": "round"
}, null, 8, Ht),
o("line", {
x1: "3",
x2: "97",
y1: "97",
y2: "97",
stroke: t(l).style.stripPlot.color,
"stroke-width": 0.5,
"stroke-linecap": "round",
"stroke-linejoin": "round"
}, null, 8, Et),
o("circle", {
cx: "12",
cy: "8",
r: "4",
stroke: t(l).style.backgroundColor,
"stroke-width": 0.3,
fill: t(l).style.stripPlot.color,
style: { opacity: "0.5" }
}, null, 8, St),
o("circle", {
cx: "12",
cy: "40",
r: "4",
stroke: t(l).style.backgroundColor,
"stroke-width": 0.3,
fill: t(l).style.stripPlot.color,
style: { opacity: "0.5" }
}, null, 8, Zt),
o("circle", {
cx: "12",
cy: "60",
r: "4",
stroke: t(l).style.backgroundColor,
"stroke-width": 0.3,
fill: t(l).style.stripPlot.color,
style: { opacity: "0.5" }
}, null, 8, It),
o("circle", {
cx: "12",
cy: "70",
r: "4",
stroke: t(l).style.backgroundColor,
"stroke-width": 0.3,
fill: t(l).style.stripPlot.color,
style: { opacity: "0.5" }
}, null, 8, Nt),
o("circle", {
cx: "32",
cy: "25",
r: "4",
stroke: t(l).style.backgroundColor,
"stroke-width": 0.3,
fill: t(l).style.stripPlot.color,
style: { opacity: "0.5" }
}, null, 8, Ft),
o("circle", {
cx: "32",
cy: "38",
r: "4",
stroke: t(l).style.backgroundColor,
"stroke-width": 0.3,
fill: t(l).style.stripPlot.color,
style: { opacity: "0.5" }
}, null, 8, Ot),
o("circle", {
cx: "32",
cy: "44",
r: "4",
stroke: t(l).style.backgroundColor,
"stroke-width": 0.3,
fill: t(l).style.stripPlot.color,
style: { opacity: "0.5" }
}, null, 8, Vt),
o("circle", {
cx: "32",
cy: "55",
r: "4",
stroke: t(l).style.backgroundColor,
"stroke-width": 0.3,
fill: t(l).style.stripPlot.color,
style: { opacity: "0.5" }
}, null, 8, Xt),
o("circle", {
cx: "52",
cy: "30",
r: "4",
stroke: t(l).style.backgroundColor,
"stroke-width": 0.3,
fill: t(l).style.stripPlot.color,
style: { opacity: "0.5" }
}, null, 8, Gt),
o("circle", {
cx: "52",
cy: "33",
r: "4",
stroke: t(l).style.backgroundColor,
"stroke-width": 0.3,
fill: t(l).style.stripPlot.color,
style: { opacity: "0.5" }
}, null, 8, Rt),
o("circle", {
cx: "52",
cy: "43",
r: "4",
stroke: t(l).style.backgroundColor,
"stroke-width": 0.3,
fill: t(l).style.stripPlot.color,
style: { opacity: "0.5" }
}, null, 8, Tt),
o("circle", {
cx: "52",
cy: "63",
r: "4",
stroke: t(l).style.backgroundColor,
"stroke-width": 0.3,
fill: t(l).style.stripPlot.color,
style: { opacity: "0.5" }
}, null, 8, Yt),
o("circle", {
cx: "52",
cy: "78",
r: "4",
stroke: t(l).style.backgroundColor,
"stroke-width": 0.3,
fill: t(l).style.stripPlot.color,
style: { opacity: "0.5" }
}, null, 8, Dt),
o("circle", {
cx: "72",
cy: "58",
r: "4",
stroke: t(l).style.backgroundColor,
"stroke-width": 0.3,
fill: t(l).style.stripPlot.color,
style: { opacity: "0.5" }
}, null, 8, Ut),
o("circle", {
cx: "72",
cy: "70",
r: "4",
stroke: t(l).style.backgroundColor,
"stroke-width": 0.3,
fill: t(l).style.stripPlot.color,
style: { opacity: "0.5" }
}, null, 8, Jt),
o("circle", {
cx: "72",
cy: "78",
r: "4",
stroke: t(l).style.backgroundColor,
"stroke-width": 0.3,
fill: t(l).style.stripPlot.color,
style: { opacity: "0.5" }
}, null, 8, Kt),
o("circle", {
cx: "72",
cy: "88",
r: "4",
stroke: t(l).style.backgroundColor,
"stroke-width": 0.3,
fill: t(l).style.stripPlot.color,
style: { opacity: "0.5" }
}, null, 8, Qt),
o("circle", {
cx: "92",
cy: "66",
r: "4",
stroke: t(l).style.backgroundColor,
"stroke-width": 0.3,
fill: t(l).style.stripPlot.color,
style: { opacity: "0.5" }
}, null, 8, tl),
o("circle", {
cx: "92",
cy: "77",
r: "4",
stroke: t(l).style.backgroundColor,
"stroke-width": 0.3,
fill: t(l).style.stripPlot.color,
style: { opacity: "0.5" }
}, null, 8, ll),
o("circle", {
cx: "92",
cy: "85",
r: "4",
stroke: t(l).style.backgroundColor,
"stroke-width": 0.3,
fill: t(l).style.stripPlot.color,
style: { opacity: "0.5" }
}, null, 8, ol),
o("circle", {
cx: "92",
cy: "88",
r: "4",
stroke: t(l).style.backgroundColor,
"stroke-width": 0.3,
fill: t(l).style.stripPlot.color,
style: { opacity: "0.5" }
}, null, 8, el),
o("circle", {
cx: "92",
cy: "90",
r: "4",
stroke: t(l).style.backgroundColor,
"stroke-width": 0.3,
fill: t(l).style.stripPlot.color,
style: { opacity: "0.5" }
}, null, 8, sl),
o("circle", {
cx: "92",
cy: "92",
r: "4",
stroke: t(l).style.backgroundColor,
"stroke-width": 0.3,
fill: t(l).style.stripPlot.color,
style: { opacity: "0.5" }
}, null, 8, rl)
], 12, qt)) : c("", !0),
t(y) === "treemap" ? (e(), s("svg", {
key: 6,
xmlns: t(d),
width: "100%",
viewBox: "0 0 30 21",
style: n(`background:${t(l).style.backgroundColor}`)
}, [
a(h),
o("path", {
fill: "none",
stroke: t(l).style.treemap.color,
"stroke-width": "0.3",
"stroke-linecap": "round",
"stroke-linejoin": "round",
d: "M 1 1 L 29 1 L 29 20 L 1 20 Z M 10 1 L 10 20 M 1 13 L 10 13 M 22 11 L 22 20 M 10 11 L 22 11 M 22 11 L 29 11 M 7 13 L 7 20 M 17 11 L 17 20 M 22 15 L 29 15 M 26 15 L 26 20 M 20 1 L 20 11"
}, null, 8, nl)
], 12, il)) : c("", !0),
t(y) === "galaxy" ? (e(), s("svg", {
key: 7,
xmlns: t(d),
width: "100%",
viewBox: "0.5 0 20 20",
style: n(`background:${t(l).style.backgroundColor}`)
}, [
a(h),
o("path", {
fill: "none",
stroke: t(l).style.galaxy.color,
"stroke-width": "2",
"stroke-linecap": "round",
d: "M 7 11 A 1 1 0 0 0 11 11 M 14 11 A 1 1 0 0 0 7 11 M 3 11 A 1 1 0 0 0 14 11 M 18 11 A 1 1 0 0 0 3 11 M 16.4 16 C 17 15 18 13 18 11"
}, null, 8, dl)
], 12, cl)) : c("", !0),
t(y) === "bar3d" ? (e(), s("svg", {
key: 8,
xmlns: t(d),
width: "100%",
viewBox: "2 0 16 20",
style: n(`background:${t(l).style.backgroundColor}`)
}, [
a(h),
o("path", {
fill: "none",
stroke: t(l).style.bar3d.color,
"stroke-width": "0.2",
d: "M10 1 6 3 6 17 10 19 14 17 14 3 10 1M6 3 10 5 14 3M10 5 10 19",
"stroke-linecap": "round",
"stroke-linejoin": "round"
}, null, 8, al)
], 12, yl)) : c("", !0),
t(y) === "sparkHistogram" ? (e(), s("svg", {
key: 9,
xmlns: t(d),
width: "100%",
viewBox: "0 0 100 20",
style: n(`background:${t(l).style.backgroundColor}`)
}, [
a(h),
o("rect", {
x: "3",
y: "8",
height: "4",
width: "6",
rx: "1.5",
fill: t(l).style.sparkHistogram.color
}, null, 8, kl),
o("rect", {
x: "11",
y: "6",
height: "8",
width: "6",
rx: "2",
fill: t(l).style.sparkHistogram.color
}, null, 8, ul),
o("rect", {
x: "19",
y: "7",
height: "6",
width: "6",
rx: "2",
fill: t(l).style.sparkHistogram.color
}, null, 8, _l),
o("rect", {
x: "27",
y: "6",
height: "8",
width: "6",
rx: "2",
fill: t(l).style.sparkHistogram.color
}, null, 8, xl),
o("rect", {
x: "35",
y: "8",
height: "4",
width: "6",
rx: "1.5",
fill: t(l).style.sparkHistogram.color
}, null, 8, pl),
o("rect", {
x: "43",
y: "7",
height: "6",
width: "6",
rx: "2",
fill: t(l).style.sparkHistogram.color
}, null, 8, gl),
o("rect", {
x: "51",
y: "8.5",
height: "3",
width: "6",
rx: "1.5",
fill: t(l).style.sparkHistogram.color
}, null, 8, fl),
o("rect", {
x: "59",
y: "7",
height: "6",
width: "6",
rx: "2",
fill: t(l).style.sparkHistogram.color
}, null, 8, wl),
o("rect", {
x: "67",
y: "6",
height: "8",
width: "6",
rx: "2",
fill: t(l).style.sparkHistogram.color
}, null, 8, ml),
o("rect", {
x: "75",
y: "7",
height: "6",
width: "6",
rx: "2",
fill: t(l).style.sparkHistogram.color
}, null, 8, bl),
o("rect", {
x: "83",
y: "7",
height: "6",
width: "6",
rx: "2",
fill: t(l).style.sparkHistogram.color
}, null, 8, Ml),
o("rect", {
x: "91",
y: "8",
height: "4",
width: "6",
rx: "1.5",
fill: t(l).style.sparkHistogram.color
}, null, 8, vl)
], 12, hl)) : c("", !0),
t(y) === "sparkbar" ? (e(), s("svg", {
key: 10,
xmlns: t(d),
width: "100%",
viewBox: "0 0 500 200",
style: n(`background:${t(l).style.backgroundColor}`)
}, [
a(h),
o("line", {
x1: "12",
x2: "488",
y1: "50",
y2: "50",
"stroke-width": "16",
"stroke-linecap": "round",
stroke: t(l).style.sparkbar.color,
opacity: "0.5"
}, null, 8, Ll),
o("line", {
x1: "12",
x2: "400",
y1: "50",
y2: "50",
"stroke-width": "16",
"stroke-linecap": "round",
stroke: t(l).style.sparkbar.color,
opacity: "1"
}, null, 8, Al),
o("line", {
x1: "12",
x2: "488",
y1: "100",
y2: "100",
"stroke-width": "16",
"stroke-linecap": "round",
stroke: t(l).style.sparkbar.color,
opacity: "0.5"
}, null, 8, $l),
o("line", {
x1: "12",
x2: "350",
y1: "100",
y2: "100",
"stroke-width": "16",
"stroke-linecap": "round",
stroke: t(l).style.sparkbar.color,
opacity: "1"
}, null, 8, Bl),
o("line", {
x1: "12",
x2: "488",
y1: "150",
y2: "150",
"stroke-width": "16",
"stroke-linecap": "round",
stroke: t(l).style.sparkbar.color,
opacity: "0.5"
}, null, 8, Pl),
o("line", {
x1: "12",
x2: "235",
y1: "150",
y2: "150",
"stroke-width": "16",
"stroke-linecap": "round",
stroke: t(l).style.sparkbar.color,
opacity: "1"
}, null, 8, Wl)
], 12, Cl)) : c("", !0),
t(y) === "sparkStackbar" ? (e(), s("svg", {
key: 11,
xmlns: t(d),
width: "100%",
viewBox: "0 0 500 64",
style: n(`background:${t(l).style.backgroundColor}`)
}, [
a(h),
o("line", {
x1: "12",
x2: "488",
y1: "32",
y2: "32",
"stroke-width": "16",
"stroke-linecap": "round",
stroke: t(l).style.sparkStackbar.color,
opacity: "0.5"
}, null, 8, jl),
o("line", {
x1: "12",
x2: "380",
y1: "32",
y2: "32",
"stroke-width": "16",
"stroke-linecap": "round",
stroke: t(l).style.sparkStackbar.color,
opacity: "0.6"
}, null, 8, ql),
o("line", {
x1: "12",
x2: "200",
y1: "32",
y2: "32",
"stroke-width": "16",
"stroke-linecap": "round",
stroke: t(l).style.sparkStackbar.color,
opacity: "0.8"
}, null, 8, Hl),
o("line", {
x1: "12",
x2: "120",
y1: "32",
y2: "32",
"stroke-width": "16",
"stroke-linecap": "round",
stroke: t(l).style.sparkStackbar.color,
opacity: "1"
}, null, 8, El)
], 12, zl)) : c("", !0),
t(y) === "thermometer" ? (e(), s("svg", {
key: 12,
width: "100%",
viewBox: "0 0 20 20",
style: n(`background:${t(l).style.backgroundColor}`)
}, [
a(h),
o("path", {
fill: "none",
stroke: t(l).style.thermometer.color,
"stroke-width": "0.2",
"stroke-linecap": "round",
d: "M 13 4 A 1 1 0 0 0 7 4 L 7 16 A 1 1 0 0 0 13 16 L 13 4 M 7 15 L 8 15 M 7 12 L 8 12 M 7 9 L 8 9 M 7 6 L 8 6 M 12 15 L 13 15 M 12 12 L 13 12 M 12 9 L 13 9 M 12 6 L 13 6 "
}, null, 8, Sl),
o("path", {
stroke: t(l).style.thermometer.color,
"stroke-width": "1",
style: { opacity: "0.6" },
d: "M 10 17 L 10 12 ",
"stroke-linecap": "round"
}, null, 8, Zl),
o("path", {
"stroke-linecap": "round",
stroke: t(l).style.thermometer.color,
"stroke-width": "1",
opacity: "M 10 17 L 10 9"
}, null, 8, Il),
o("path", {
"stroke-linecap": "round",
stroke: t(l).style.thermometer.color,
"stroke-width": "1",
opacity: "0.3",
d: "M 10 17 L 10 6"
}, null, 8, Nl),
o("path", {
"stroke-linecap": "round",
stroke: t(l).style.thermometer.color,
"stroke-width": "1",
style: { opacity: "0.1" },
d: "M 10 17 L 10 3"
}, null, 8, Fl)
], 4)) : c("", !0),
t(y) === "relationCircle" ? (e(), s("svg", {
key: 13,
xmlns: t(d),
width: "100%",
viewBox: "0 0 20 20",
style: n(`background:${t(l).style.backgroundColor}`)
}, [
a(h),
o("path", {
fill: "none",
stroke: t(l).style.relationCircle.color,
"stroke-width": "0.2",
"stroke-linecap": "round",
d: "M1 10A1 1 0 0019 10 1 1 0 001 10M1 10C7 11 9 13 10 19M10 19C10 11 8 7 6 2M10 19C10 11 12 7 14 2M10 19C11 13 12 11 19 10"
}, null, 8, Vl)
], 12, Ol)) : c("", !0),
t(y) === "molecule" ? (e(), s("svg", {
key: 14,
xmlns: t(d),
width: "100%",
viewBox: "0 0 100 100",
style: n(`background:${t(l).style.backgroundColor}`)
}, [
a(h),
o("circle", {
cx: "50",
cy: "50",
r: "6",
"stroke-width": "2",
fill: "none",
stroke: t(l).style.molecule.color
}, null, 8, Gl),
o("circle", {
cx: "20",
cy: "50",
r: "3",
"stroke-width": "1.6",
fill: "none",
stroke: t(l).style.molecule.color
}, null, 8, Rl),
o("circle", {
cx: "80",
cy: "50",
r: "3",
"stroke-width": "1.6",
fill: "none",
stroke: t(l).style.molecule.color
}, null, 8, Tl),
o("circle", {
cx: "50",
cy: "20",
r: "3",
"stroke-width": "1.6",
fill: "none",
stroke: t(l).style.molecule.color
}, null, 8, Yl),
o("circle", {
cx: "50",
cy: "80",
r: "3",
"stroke-width": "1.6",
fill: "none",
stroke: t(l).style.molecule.color
}, null, 8, Dl),
o("line", {
x1: "50",
x2: "50",
y1: "23",
y2: "45",
"stroke-width": "1",
stroke: t(l).style.molecule.color
}, null, 8, Ul),
o("line", {
x1: "50",
x2: "50",
y1: "77",
y2: "55",
"stroke-width": "1",
stroke: t(l).style.molecule.color
}, null, 8, Jl),
o("line", {
x1: "23",
x2: "45",
y1: "50",
y2: "50",
"stroke-width": "1",
stroke: t(l).style.molecule.color
}, null, 8, Kl),
o("line", {
x1: "77",
x2: "55",
y1: "50",
y2: "50",
"stroke-width": "1",
stroke: t(l).style.molecule.color
}, null, 8, Ql)
], 12, Xl)) : c("", !0),
t(y) === "tiremarks" ? (e(), s("svg", {
key: 15,
xmlns: t(d),
width: "100%",
viewBox: "0 0 312 56",
style: n(`background:${t(l).style.backgroundColor}`)
}, [
a(h),
(e(), s(k, null, _(100, (r) => o("g", null, [
o("line", {
x1: 10 + r * 2.9,
y1: 6,
x2: 10 + r * 2.9,
y2: 50,
stroke: t(l).style.tiremarks.color,
style: n(r > 80 ? "opacity: 0.5" : ""),
"stroke-linecap": "round"
}, null, 12, lo)
])), 64))
], 12, to)) : c("", !0),
t(y) === "pyramid" ? (e(), s("svg", {
key: 16,
xmlns: t(d),
width: "100%",
viewBox: "0 0 105 80",
style: n(`background:${t(l).style.backgroundColor}`)
}, [
a(h),
(e(!0), s(k, null, _(t(b), (r, i) => (e(), s("g", null, [
o("rect", {
x: 50 - r[0],
y: i * (80 / t(b).length),
width: r[0],
height: 80 / t(b).length * 0.95,
fill: t(l).style.pyramid.color
}, null, 8, eo),
o("rect", {
x: 55,
y: i * (80 / t(b).length),
width: r[1],
height: 80 / t(b).length * 0.95,
fill: t(l).style.pyramid.color
}, null, 8, so)
]))), 256))
], 12, oo)) : c("", !0),
t(y) === "rings" ? (e(), s("svg", {
key: 17,
xmlns: t(d),
width: "100%",
viewBox: "0 0 400 400",
style: n(`background:${t(l).style.backgroundColor}`)
}, [
a(h),
o("circle", {
cx: 200,
cy: 200,
r: 180,
fill: t(u)(t(l).style.rings.color, 40)
}, null, 8, io),
o("circle", {
cx: 200,
cy: 250,
r: 130,
fill: t(u)(t(l).style.rings.color, 60)
}, null, 8, no),
o("circle", {
cx: 200,
cy: 290,
r: 90,
fill: t(u)(t(l).style.rings.color, 100)
}, null, 8, co)
], 12, ro)) : c("", !0),
t(y) === "wheel" ? (e(), s("svg", {
key: 18,
xmlns: t(d),
width: "100%",
viewBox: "0 0 400 400",
style: n(`background:${t(l).style.backgroundColor}`)
}, [
a(h),
(e(!0), s(k, null, _(t(I), (r, i) => (e(), s("line", {
x1: r.x1,
x2: r.x2,
y1: r.y1,
y2: r.y2,
stroke: i < 66 ? r.color : t(u)(r.color, 50),
"stroke-width": 5,
"stroke-linecap": "round"
}, null, 8, ao))), 256)),
o("circle", {
cx: 200,
cy: 200,
r: 130,
"stroke-width": 3,
stroke: t(u)(t(l).style.wheel.color, 50),
fill: "none"
}, null, 8, ho),
o("rect", {
fill: t(u)(t(l).style.wheel.color, 50),
rx: 12,
x: 160,
y: 170,
height: 60,
width: 80,
stroke: "none"
}, null, 8, ko)
], 12, yo)) : c("", !0),
t(y) === "sparkline" ? (e(), s("svg", {
key: 19,
xmlns: t(d),
width: "100%",
viewBox: "0 0 150 32",
style: n(`background:${t(l).style.backgroundColor}`)
}, [
a(h),
o("g", null, [
o("rect", {
x: "2",
y: "2",
height: "6",
width: "24",
fill: t(l).style.sparkline.color,
rx: "3"
}, null, 8, _o),
o("rect", {
x: "2",
y: "12",
height: "16",
width: "16",
fill: t(l).style.sparkline.color,
rx: "3"
}, null, 8, xo)
]),
(e(!0), s(k, null, _(t(v), (r, i) => (e(), s("g", null, [
i < t(v).length - 1 ? (e(), s("line", {
key: 0,
x1: r.x,
y1: r.y,
x2: t(v)[i + 1].x,
y2: t(v)[i + 1].y,
"stroke-width": t(l).style.sparkline.strokeWidth,
stroke: t(l).style.sparkline.color,
"stroke-linecap": "round",
"stroke-linejoin": "round"
}, null, 8, po)) : c("", !0)
]))), 256))
], 12, uo)) : c("", !0),
t(y) === "candlesticks" ? (e(), s("svg", {
key: 20,
xmlns: t(d),
width: "100%",
viewBox: "0 0 512 316",
style: n(`background:${t(l).style.backgroundColor}`)
}, [
a(h),
t(l).style.candlesticks.axis.show ? (e(), s("g", fo, [
o("line", {
x1: 2,
x2: 2,
y1: 2,
y2: 314,
stroke: t(l).style.candlesticks.axis.color,
"stroke-width": t(l).style.candlesticks.axis.strokeWidth,
"stroke-linecap": "round"
}, null, 8, wo),
o("line", {
x1: 2,
x2: 510,
y1: 314,
y2: 314,
stroke: t(l).style.candlesticks.axis.color,
"stroke-width": t(l).style.candlesticks.axis.strokeWidth,
"stroke-linecap": "round"
}, null, 8, mo)
])) : c("", !0),
(e(!0), s(k, null, _(t(p), (r, i) => (e(), s("g", null, [
o("line", {
x1: 24 + 464 * i / (t(p).length - 1) - 464 / (t(p).length - 1) / 8,
x2: 24 + 464 * i / (t(p).length - 1) + 464 / (t(p).length - 1) / 8,
y1: r.y,
y2: r.y,
stroke: t(l).style.candlesticks.candle.color,
"stroke-width": t(l).style.candlesticks.candle.strokeWidth,
"stroke-linecap": "round"
}, null, 8, bo),
o("line", {
x1: 24 + 464 * i / (t(p).length - 1) - 464 / (t(p).length - 1) / 8,
x2: 24 + 464 * i / (t(p).length - 1) + 464 / (t(p).length - 1) / 8,
y1: r.y + r.height,
y2: r.y + r.height,
stroke: t(l).style.candlesticks.candle.color,
"stroke-width": t(l).style.candlesticks.candle.strokeWidth,
"stroke-linecap": "round"
}, null, 8, Mo),
o("line", {
x1: 24 + 464 * i / (t(p).length - 1),
x2: 24 + 464 * i / (t(p).length - 1),
y1: r.y,
y2: r.y + r.height,
stroke: t(l).style.candlesticks.candle.color,
"stroke-width": t(l).style.candlesticks.candle.strokeWidth,
"stroke-linecap": "round"
}, null, 8, vo),
o("rect", {
x: 24 + 464 * i / (t(p).length - 1) - 464 / (t(p).length - 1) / 8,
y: r.y + (r.height - r.bar * 1.5),
height: r.bar,
width: 464 / (t(p).length - 1) / 4,
fill: t(l).style.candlesticks.candle.color,
rx: "1"
}, null, 8, Co)
]))), 256))
], 12, go)) : c("", !0),
t(y) === "heatmap" ? (e(), s("svg", {
key: 21,
xmlns: t(d),
width: "100%",
viewBox: `0 0 ${10 * t(l).style.heatmap.cellsX} ${10 * t(l).style.heatmap.cellsY}`,
style: n(`background:${t(l).style.backgroundColor}`)
}, [
a(h),
(e(!0), s(k, null, _(t(l).style.heatmap.cellsY, (r, i) => (e(), s("g", null, [
(e(!0), s(k, null, _(t(l).style.heatmap.cellsX, (L, g) => (e(), s("g", null, [
o("rect", {
x: g * 10,
y: i * 10,
height: 10,
width: 10,
stroke: t(l).style.backgroundColor,
"stroke-width": 1,
fill: t(u)(t(l).style.heatmap.color, Math.round(Math.random() * 100))
}, null, 8, Ao)
]))), 256))
]))), 256))
], 12, Lo)) : c("", !0),
t(y) === "chestnut" ? (e(), s("svg", {
key: 22,
xmlns: t(d),
width: "100%",
viewBox: "0 0 512 316",
style: n(`background:${t(l).style.backgroundColor}`)
}, [
a(h),
(e(!0), s(k, null, _(t(M), (r) => (e(), s("g", null, [
(e(!0), s(k, null, _(r.bars, (i) => (e(), s("g", null, [
(e(), s(k, null, _(22, (L, g) => o("path", {
d: `M
${i.x},${i.y + g}
C${i.x - 20},${i.y + g}
${i.x - 80},${i.y + g}
${r.root.x + r.root.r / 2}, ${r.root.y}
`,
stroke: t(u)(t(l).style.chestnut.color, i.opacity * 0.2),
fill: "none",
"stroke-width": "2",
"shape-rendering": "cirspEdges"
}, null, 8, Bo)), 64))
]))), 256))
]))), 256)),
(e(!0), s(k, null, _(t(M), (r) => (e(), s("circle", {
cx: r.root.x,
cy: r.root.y,
r: r.root.r,
fill: `${t(l).style.backgroundColor}`,
stroke: t(l).backgroundColor,
"stroke-width": 3
}, null, 8, Po))), 256)),
(e(!0), s(k, null, _(t(M), (r) => (e(), s("circle", {
cx: r.root.x,
cy: r.root.y,
r: r.root.r,
fill: t(u)(t(l).style.chestnut.color, r.root.opacity),
stroke: t(l).style.backgroundColor,
"stroke-width": 3
}, null, 8, Wo))), 256)),
(e(!0), s(k, null, _(t(M), (r) => (e(), s("g", null, [
(e(!0), s(k, null, _(r.bars, (i) => (e(), s("rect", {
rx: "2",
x: i.x,
y: i.y,
width: i.width,
height: 22,
fill: t(u)(t(l).style.chestnut.color, i.opacity)
}, null, 8, zo))), 256)),
(e(!0), s(k, null, _(r.bars, (i) => (e(), s("circle", {
cx: i.x + i.width + 32,
cy: i.y + 11,
r: 11,
fill: t(u)(t(l).style.chestnut.color, i.opacity)
}, null, 8, jo))), 256)),
(e(!0), s(k, null, _(r.bars, (i) => (e(), s("circle", {
cx: i.x + i.width + 32,
cy: i.y + 11,
r: 5,
fill: t(l).style.backgroundColor
}, null, 8, qo))), 256))
]))), 256)),
o("line", {
x1: 200,
x2: 200,
y1: 10,
y2: 300,
stroke: t(l).style.backgroundColor,
"stroke-wid