vue-data-ui 3.0.6 → 3.0.8

package/dist/vue-ui-scatter-KH-0eByA.js

@@ -0,0 +1,1288 @@
+import { defineAsyncComponent as de, computed as P, ref as b, toRefs as Gt, watch as Ye, shallowRef as bt, onMounted as qt, onBeforeUnmount as Ht, createElementBlock as i, openBlock as n, unref as r, normalizeStyle as oe, normalizeClass as kt, createBlock as Q, createCommentVNode as f, createElementVNode as p, createVNode as We, createSlots as Zt, withCtx as X, renderSlot as F, normalizeProps as he, guardReactiveProps as fe, Fragment as H, renderList as ee, toDisplayString as R, Teleport as Jt, createTextVNode as Kt, nextTick as Qt } from "vue";
+import { u as el, c as tl, t as ll, a as al, p as ie, b as ol, o as wt, f as Ie, d as sl, g as _t, Y as ul, e as De, a3 as nl, V as il, X as rl, s as Re, Z as vl, k as se, h as j, i as Z, v as yl, w as cl, y as dl, z as hl } from "./index-DuDJlW5i.js";
+import { t as fl, u as gl } from "./useResponsive-DfdjqQps.js";
+import { u as pl, B as ml } from "./useLoading-D7YHNtLX.js";
+import { u as xl } from "./usePrinter-DSx12TjX.js";
+import { u as Mt } from "./useNestedProp-DjAOrUMl.js";
+import { u as bl } from "./useUserOptionState-BIvW1Kz7.js";
+import { u as kl } from "./useChartAccessibility-9icAAmYg.js";
+import wl from "./Legend-ClxfBalA.js";
+import _l from "./Title-CAJPYzZL.js";
+import { _ as $t } from "./Shape-DqeUQm2d.js";
+import Ml from "./img-BWVtVa_R.js";
+import { _ as $l } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const Al = ["id"], Cl = ["id"], Sl = ["xmlns", "viewBox"], Bl = ["width", "height"], Ll = { key: 1 }, zl = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Tl = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Pl = { key: 2 }, Ol = ["id"], Nl = ["stop-color"], El = ["stop-color"], Xl = ["id"], Fl = ["stop-color"], Yl = ["stop-color"], Wl = ["x", "y", "width", "height", "fill", "stroke", "stroke-width", "rx"], Il = ["x", "y", "width", "height", "onMouseenter"], Dl = {
+  key: 2,
+  style: { "pointer-events": "none" }
+}, Rl = ["x", "y", "width", "height", "fill", "fill-opacity"], jl = ["x1", "x2", "y2", "stroke", "stroke-dasharray", "stroke-width"], Vl = ["x1", "x2", "y2", "stroke", "stroke-dasharray", "stroke-width"], Ul = ["x", "y", "height", "width", "fill", "stroke", "stroke-width", "rx"], Gl = ["x", "y", "width", "height", "onMouseenter"], ql = {
+  key: 2,
+  style: { "pointer-events": "none" }
+}, Hl = ["x", "y", "width", "height", "fill", "fill-opacity"], Zl = ["x1", "x2", "y1", "y2", "stroke", "stroke-dasharray", "stroke-width"], Jl = ["x1", "x2", "y1", "y2", "stroke", "stroke-dasharray", "stroke-width"], Kl = {
+  key: 0,
+  style: { "pointer-events": "none" }
+}, Ql = ["d", "stroke", "stroke-width"], ea = ["d", "stroke", "stroke-width"], ta = ["d", "stroke", "stroke-width"], la = ["d", "stroke", "stroke-width"], aa = { key: 3 }, oa = ["points", "fill", "stroke-width", "stroke-dasharray", "stroke"], sa = { key: 0 }, ua = ["cx", "cy", "r", "fill", "stroke", "stroke-width", "onMouseover", "onMouseleave", "onClick"], na = { key: 1 }, ia = {
+  key: 4,
+  style: { "pointer-events": "none !important" }
+}, ra = ["x1", "x2", "y1", "y2", "stroke", "stroke-width", "stroke-dasharray"], va = ["x1", "x2", "y1", "y2", "stroke", "stroke-width", "stroke-dasharray"], ya = ["x", "y", "font-size", "fill", "font-weight", "text-anchor"], ca = ["x", "y", "font-size", "fill", "font-weight"], da = ["cx", "cy", "r", "fill", "stroke", "stroke-width"], ha = ["cx", "cy", "r", "fill", "stroke", "stroke-width"], fa = ["x", "y", "font-size", "fill", "font-weight", "text-anchor"], ga = ["id", "transform", "font-size", "font-weight", "fill"], pa = ["font-size", "fill", "transform"], ma = ["transform", "font-size", "fill"], xa = ["x", "y", "font-size", "fill"], ba = ["x", "y", "font-size", "fill"], ka = ["font-size", "font-weight", "fill", "x", "y"], wa = ["id"], _a = ["x", "y", "width", "height"], Ma = {
+  key: 9,
+  style: { pointerEvents: "none" }
+}, $a = ["x1", "x2", "y1", "y2", "stroke-dasharray", "stroke", "stroke-width", "clip-path"], Aa = ["x", "y", "fill", "font-size", "font-weight"], Ca = {
+  key: 4,
+  class: "vue-data-ui-watermark"
+}, Sa = ["id"], Ba = ["onClick"], La = {
+  key: 0,
+  style: { width: "100%", display: "flex", "align-items": "center", "justify-content": "center" }
+}, za = {
+  viewBox: "0 0 20 20",
+  height: "20",
+  width: "20",
+  style: { overflow: "hidden", background: "transparent" }
+}, Ta = { key: 0 }, Pa = ["innerHTML"], Oa = {
+  __name: "vue-ui-scatter",
+  props: {
+    config: {
+      type: Object,
+      default() {
+        return {};
+      }
+    },
+    dataset: {
+      type: Array,
+      default() {
+        return [];
+      }
+    }
+  },
+  setup(At, { expose: Ct }) {
+    const St = de(() => import("./vue-ui-accordion-DFgru4Vn.js")), Bt = de(() => import("./DataTable-CHGbx-9J.js")), Lt = de(() => import("./PackageVersion-CBLYUwKk.js")), zt = de(() => import("./PenAndPaper-C_FbwLbe.js")), Tt = de(() => import("./Tooltip-CIPq6i73.js")), Pt = de(() => import("./UserOptions-CQTdguCS.js")), { vue_ui_scatter: Ot } = el(), J = At, je = P(() => !!J.dataset && J.dataset.length), O = b(tl()), Nt = b(null), $e = b(!1), Ae = b(""), Ve = b(0), te = b(null), Ue = b(null), Ge = b(null), qe = b(null), He = b(null), Ze = b(0), Je = b(0), Ke = b(0), T = b([]), Qe = b(!1), ge = b(null), pe = b(null), Ce = b(null), Et = b(null), Xt = b(null), Se = b(null), e = b(Te());
+    function Ft(l = 100, u = 0.8, t = {}) {
+      const { meanX: a = 0, sdX: s = 1, meanY: v = 0, sdY: g = 1, seed: L } = t;
+      let z = (L ?? Math.floor(Math.random() * 2 ** 31)) >>> 0;
+      const N = () => (z = z * 1664525 + 1013904223 >>> 0, z / 2 ** 32), Y = () => {
+        let c = 0, C = 0;
+        for (; c === 0; ) c = N();
+        for (; C === 0; ) C = N();
+        return Math.sqrt(-2 * Math.log(c)) * Math.cos(2 * Math.PI * C);
+      }, h = l / 2, _ = Array.from({ length: h }, Y), D = Array.from({ length: h }, Y), M = (c) => c.reduce((C, be) => C + be, 0) / c.length, W = M(_), K = M(D);
+      for (let c = 0; c < h; c += 1)
+        _[c] -= W, D[c] -= K;
+      const $ = (c, C) => c.reduce((be, Me, Fe) => be + Me * C[Fe], 0), x = (c) => $(c, c), y = $(D, _) / x(_), w = D.map((c, C) => c - y * _[C]), I = x(_) / h, G = x(w) / h, ae = Math.sqrt((1 - u * u) * I / G), E = _.map((c, C) => u * c + ae * w[C]), ne = _.concat(_.map((c) => -c)), Xe = E.concat(E.map((c) => -c)), me = (c) => Math.sqrt(x(c) / c.length), ye = (c, C, be) => {
+        const Me = me(c);
+        return c.map((Fe) => be + (Me ? Fe / Me * C : 0));
+      }, ce = ye(ne, s, a), xe = ye(Xe, g, v);
+      for (let c = ce.length - 1; c > 0; c -= 1) {
+        const C = Math.floor(N() * (c + 1));
+        [ce[c], ce[C]] = [ce[C], ce[c]], [xe[c], xe[C]] = [xe[C], xe[c]];
+      }
+      return ce.map((c, C) => ({ x: c, y: xe[C] }));
+    }
+    const { loading: et, FINAL_DATASET: Be, manualLoading: Le } = pl({
+      ...Gt(J),
+      FINAL_CONFIG: e,
+      prepareConfig: Te,
+      skeletonDataset: [
+        {
+          name: "",
+          color: "#999999",
+          values: Ft(100, 0.5, { seed: 42 })
+        }
+      ],
+      skeletonConfig: ll({
+        defaultConfig: e.value,
+        userConfig: {
+          userOptions: { show: !1 },
+          table: { show: !1 },
+          useCssAnimation: !1,
+          style: {
+            backgroundColor: "#99999930",
+            layout: {
+              axis: {
+                stroke: "#6A6A6A"
+              },
+              correlation: {
+                label: { show: !1 }
+              },
+              dataLabels: {
+                xAxis: { show: !1 },
+                yAxis: { show: !1 }
+              },
+              marginalBars: {
+                fill: "#99999960"
+              },
+              padding: { top: 12, right: 12, bottom: 12, left: 12 },
+              plots: {
+                stroke: "#6A6A6A"
+              }
+            },
+            legend: {
+              backgroundColor: "transparent"
+            }
+          }
+        }
+      })
+    }), { userOptionsVisible: ze, setUserOptionsVisibility: tt, keepUserOptionState: lt } = bl({ config: e.value }), { svgRef: at } = kl({ config: e.value.style.title });
+    function Te() {
+      const l = Mt({
+        userConfig: J.config,
+        defaultConfig: Ot
+      });
+      return l.theme ? {
+        ...Mt({
+          userConfig: ol.vue_ui_scatter[l.theme] || J.config,
+          defaultConfig: l
+        }),
+        customPalette: al[l.theme] || ie
+      } : l;
+    }
+    Ye(() => J.config, (l) => {
+      et.value || (e.value = Te()), ze.value = !e.value.userOptions.showOnChartHover, ot(), Ze.value += 1, Je.value += 1, Ke.value += 1, V.value.showTable = e.value.table.show, V.value.showTooltip = e.value.style.tooltip.show;
+    }, { deep: !0 }), Ye(() => J.dataset, (l) => {
+      Array.isArray(l) && l.length > 0 && (Le.value = !1);
+    }, { deep: !0 });
+    const le = bt(null), re = bt(null);
+    qt(() => {
+      Qe.value = !0, ot();
+    });
+    const Yt = P(() => !!e.value.debug);
+    function ot() {
+      if (wt(J.dataset) && (Ie({
+        componentName: "VueUiScatter",
+        type: "dataset",
+        debug: Yt.value
+      }), Le.value = !0), wt(J.dataset) || (Le.value = e.value.loading), e.value.responsive) {
+        const l = fl(() => {
+          const { width: u, height: t } = gl({
+            chart: te.value,
+            title: e.value.style.title.text ? Ue.value : null,
+            legend: e.value.style.legend.show ? Ge.value : null,
+            source: qe.value,
+            noTitle: He.value
+          });
+          requestAnimationFrame(() => {
+            S.value.width = u, S.value.height = t;
+          });
+        });
+        le.value && (re.value && le.value.unobserve(re.value), le.value.disconnect()), le.value = new ResizeObserver(l), re.value = te.value.parentNode, le.value.observe(re.value);
+      }
+    }
+    Ht(() => {
+      le.value && (re.value && le.value.unobserve(re.value), le.value.disconnect());
+    });
+    const { isPrinting: st, isImaging: ut, generatePdf: nt, generateImage: it } = xl({
+      elementId: `vue-ui-scatter_${O.value}`,
+      fileName: e.value.style.title.text || "vue-ui-scatter",
+      options: e.value.userOptions.print
+    }), Wt = P(() => e.value.userOptions.show && !e.value.style.title.text), rt = P(() => sl(e.value.customPalette)), V = b({
+      showTable: e.value.table.show,
+      showTooltip: e.value.style.tooltip.show
+    });
+    Ye(e, () => {
+      V.value = {
+        showTable: e.value.table.show,
+        showTooltip: e.value.style.tooltip.show
+      };
+    }, { immediate: !0 });
+    const S = b({
+      height: e.value.style.layout.height,
+      width: e.value.style.layout.width
+    }), ke = P(() => e.value.style.layout.marginalBars.show ? e.value.style.layout.marginalBars.size + e.value.style.layout.marginalBars.offset : 0), o = P(() => {
+      let l = 0, u = 0;
+      return Ce.value && (l = Ce.value.getBBox().width + 6), Se.value && (u = Se.value.getBBox().height + 6), {
+        top: e.value.style.layout.padding.top + ke.value + e.value.style.layout.dataLabels.yAxis.fontSize * 2,
+        right: S.value.width - e.value.style.layout.padding.right - ke.value - 6,
+        bottom: S.value.height - e.value.style.layout.padding.bottom - u,
+        left: e.value.style.layout.padding.left + l,
+        height: S.value.height - e.value.style.layout.padding.top - e.value.style.layout.padding.bottom - ke.value - u - e.value.style.layout.dataLabels.yAxis.fontSize * 2,
+        width: S.value.width - e.value.style.layout.padding.left - e.value.style.layout.padding.right - ke.value - l - 6
+      };
+    }), A = P(() => {
+      Be.value.forEach((s, v) => {
+        _t({
+          datasetObject: s,
+          requiredAttributes: ["values"]
+        }).forEach((g) => {
+          Ie({
+            componentName: "VueUiScatter",
+            type: "datasetSerieAttribute",
+            property: g,
+            index: v
+          });
+        }), s.values && s.values.forEach((g, L) => {
+          _t({
+            datasetObject: g,
+            requiredAttributes: ["x", "y"]
+          }).forEach((z) => {
+            Ie({
+              componentName: "VueUiScatter",
+              type: "datasetSerieAttribute",
+              property: `values.${z}`,
+              index: `${v} - ${L}`
+            });
+          });
+        });
+      });
+      const l = Math.min(...ue.value.filter((s) => !T.value.includes(s.id)).flatMap((s) => s.values.map((v) => v.x))), u = Math.max(...ue.value.filter((s) => !T.value.includes(s.id)).flatMap((s) => s.values.map((v) => v.x))), t = Math.min(...ue.value.filter((s) => !T.value.includes(s.id)).flatMap((s) => s.values.map((v) => v.y))), a = Math.max(...ue.value.filter((s) => !T.value.includes(s.id)).flatMap((s) => s.values.map((v) => v.y)));
+      return { xMin: l >= 0 ? 0 : l, xMax: u, yMin: t >= 0 ? 0 : t, yMax: a };
+    }), B = P(() => ({
+      x: o.value.left + Math.abs(A.value.xMin) / (A.value.xMax + Math.abs(A.value.xMin)) * o.value.width,
+      y: o.value.bottom - Math.abs(A.value.yMin) / (A.value.yMax + Math.abs(A.value.yMin)) * o.value.height
+    })), ue = P(() => Be.value.map((l, u) => {
+      const t = `cluster_${O.value}_${u}`;
+      return {
+        ...l,
+        values: ul({
+          data: l.values,
+          threshold: e.value.downsample.threshold
+        }),
+        id: t,
+        color: l.color ? l.color : rt.value[u] || ie[u] || ie[u % ie.length],
+        opacity: T.value.includes(t) ? 0.5 : 1,
+        shape: l.shape ?? "circle",
+        segregate: () => ft(t),
+        isSegregated: T.value.includes(t)
+      };
+    })), It = P(() => ({
+      cy: "scatter-div-legend",
+      backgroundColor: e.value.style.legend.backgroundColor,
+      color: e.value.style.legend.color,
+      fontSize: e.value.style.legend.fontSize,
+      paddingBottom: 12,
+      fontWeight: e.value.style.legend.bold ? "bold" : ""
+    })), Pe = P(() => ue.value.map((l, u) => ({
+      ...l,
+      plots: l.values.map((t) => ({
+        x: o.value.left + (t.x + Math.abs(A.value.xMin)) / (A.value.xMax + Math.abs(A.value.xMin)) * o.value.width,
+        y: o.value.bottom - (t.y + Math.abs(A.value.yMin)) / (A.value.yMax + Math.abs(A.value.yMin)) * o.value.height,
+        v: {
+          ...t,
+          name: t.name || ""
+        },
+        clusterName: l.name,
+        color: l.color ? l.color : rt.value[u] || ie[u] || ie[u % ie.length],
+        id: `plot_${O.value}_${Math.random()}`,
+        weight: t.weight ?? e.value.style.layout.plots.radius
+      }))
+    })).filter((l) => !T.value.includes(l.id))), U = P(() => {
+      const u = ({ m: t, b: a, rect: s, verticalX: v = null }) => {
+        const { left: g, right: L, top: z, bottom: N } = s, Y = [], h = (x, y) => {
+          Number.isFinite(x) && Number.isFinite(y) && Y.push({ x, y });
+        }, _ = ({ x, y }) => x >= g - 1e-9 && x <= L + 1e-9 && y >= z - 1e-9 && y <= N + 1e-9;
+        v !== null ? v >= g - 1e-9 && v <= L + 1e-9 && (h(v, z), h(v, N)) : Number.isFinite(t) && (h(g, t * g + a), h(L, t * L + a), Math.abs(t) > 1e-9 ? (h((z - a) / t, z), h((N - a) / t, N)) : a >= z - 1e-9 && a <= N + 1e-9 && (h(g, a), h(L, a)));
+        const D = Y.filter(_), M = [];
+        for (const x of D)
+          M.some((y) => Math.abs(y.x - x.x) < 1e-6 && Math.abs(y.y - x.y) < 1e-6) || M.push(x);
+        if (M.length < 2) return null;
+        let W = M[0], K = M[1], $ = 0;
+        for (let x = 0; x < M.length; x += 1)
+          for (let y = x + 1; y < M.length; y += 1) {
+            const w = M[x].x - M[y].x, I = M[x].y - M[y].y, G = w * w + I * I;
+            G > $ && ($ = G, W = M[x], K = M[y]);
+          }
+        return { x1: W.x, y1: W.y, x2: K.x, y2: K.y };
+      };
+      return Pe.value.map((t) => {
+        const a = t.plots.length, s = t.plots.reduce((y, w) => y + w.x, 0) / a, v = t.plots.reduce((y, w) => y + w.y, 0) / a;
+        let g = 0, L = 0;
+        for (const y of t.plots) {
+          const w = y.x - s, I = y.y - v;
+          g += w * I, L += w * w;
+        }
+        let z, N, Y = null;
+        L < 1e-9 ? (Y = s, z = 1 / 0, N = null) : (z = g / L, N = v - z * s);
+        let h, _;
+        Y !== null ? (h = 1 / 0, _ = null) : (h = z, _ = N);
+        const D = t.plots.every((y) => y.v && typeof y.v.x == "number" && typeof y.v.y == "number");
+        let M = NaN;
+        if (a >= 2) {
+          let y = 0, w = 0;
+          D ? (y = t.plots.reduce((E, ne) => E + ne.v.x, 0) / a, w = t.plots.reduce((E, ne) => E + ne.v.y, 0) / a) : (y = s, w = -v);
+          let I = 0, G = 0, ae = 0;
+          for (const E of t.plots) {
+            const ne = D ? E.v.x : E.x, Xe = D ? E.v.y : -E.y, me = ne - y, ye = Xe - w;
+            I += me * ye, G += me * me, ae += ye * ye;
+          }
+          if (G >= 1e-9 && ae >= 1e-9) {
+            const E = I / Math.sqrt(G * ae);
+            M = Math.max(-1, Math.min(1, E));
+          }
+        }
+        const W = u({ m: h, b: _, rect: o.value, verticalX: Y });
+        if (!W)
+          return {
+            ...t,
+            correlation: null,
+            label: null,
+            plots: t.plots.map((y) => ({
+              ...y,
+              deviation: 0,
+              shape: t.shape,
+              color: De(t.color)
+            }))
+          };
+        const K = (W.x1 + W.x2) / 2, $ = (W.y1 + W.y2) / 2, x = { x: K, y: $ };
+        return {
+          ...t,
+          color: De(t.color),
+          correlation: {
+            ...W,
+            coefficient: M
+          },
+          label: x,
+          plots: t.plots.map((y) => {
+            let w, I;
+            Y !== null ? (w = Y, I = y.y) : Math.abs(h) < 1e-9 ? (w = y.x, I = _) : (w = (y.x + h * y.y - h * _) / (1 + h * h), I = (h * y.x + h * h * y.y + _) / (1 + h * h));
+            const G = y.x - w, ae = y.y - I, E = Math.sqrt(G * G + ae * ae);
+            return {
+              ...y,
+              deviation: E,
+              shape: t.shape,
+              color: De(t.color)
+            };
+          })
+        };
+      });
+    }), vt = P(() => Math.max(...U.value.flatMap((l) => l.plots.map((u) => Math.abs(u.deviation)))));
+    function Dt() {
+      return U.value;
+    }
+    function yt(l, u) {
+      const t = Array.isArray(l) ? l.flatMap(($) => $.plots.map((x) => ({
+        x: x.x,
+        y: x.y
+      }))) : l.plots.map(($) => ({
+        x: $.x,
+        y: $.y
+      }));
+      let a = 1 / 0, s = -1 / 0, v = 1 / 0, g = -1 / 0;
+      t.forEach(({ x: $, y: x }) => {
+        a = Math.min(a, $), s = Math.max(s, $), v = Math.min(v, x), g = Math.max(g, x);
+      });
+      const L = s - a, z = g - v, N = L / u, Y = z / u, h = Array(u).fill(0), _ = Array(u).fill(0);
+      t.forEach(({ x: $, y: x }) => {
+        const y = Math.floor(($ - a) / N), w = Math.floor((x - v) / Y);
+        h[y] || (h[y] = 0), _[w] || (_[w] = 0), h[y] += 1, _[w] += 1;
+      });
+      const D = [], M = [];
+      for (let $ = 0; $ < u; $ += 1)
+        D.push(a + ($ + 0.5) * N), M.push(v + ($ + 0.5) * Y);
+      const W = Math.max(...h), K = Math.max(..._);
+      return { x: h, y: _, avgX: D, avgY: M, maxX: W, maxY: K };
+    }
+    const d = P(() => e.value.style.layout.marginalBars.tranches), k = P(() => yt(Pe.value, d.value)), Rt = P(() => {
+      const l = o.value.top - e.value.style.layout.marginalBars.offset, u = o.value.right + e.value.style.layout.marginalBars.offset;
+      return Pe.value.map((t) => {
+        const a = yt(t, d.value);
+        return {
+          coords: a,
+          dX: il(a.avgX.map((s, v) => ({
+            x: s,
+            y: l - a.x[v] / a.maxX * e.value.style.layout.marginalBars.size
+          }))),
+          dY: nl(a.avgY.map((s, v) => ({
+            y: s,
+            x: u + e.value.style.layout.marginalBars.size * a.y[v] / a.maxY
+          }))),
+          color: t.color,
+          id: t.id
+        };
+      });
+    }), q = b(void 0), m = b(null), Oe = b(null);
+    function ct(l, u) {
+      q.value = l.id, m.value = l;
+      let t = "";
+      e.value.events.datapointEnter && e.value.events.datapointEnter({ datapoint: l, seriesIndex: u }), Oe.value = {
+        datapoint: l,
+        seriesIndex: u,
+        series: U.value,
+        config: e.value
+      };
+      const a = e.value.style.tooltip.customFormat;
+      dl(a) && hl(() => a({
+        datapoint: l,
+        seriesIndex: u,
+        series: U.value,
+        config: e.value
+      })) ? Ae.value = a({
+        datapoint: l,
+        seriesIndex: u,
+        series: U.value,
+        config: e.value
+      }) : (l.clusterName && (t += `<div style="display:flex;gap:3px;align-items:center">${l.clusterName}</div>`), l.v.name && (t += `<div>${l.v.name}</div>`), t += `<div style="text-align:left;margin-top:6px;padding-top:6px;border-top:1px solid ${e.value.style.tooltip.borderColor}">`, t += `<div>${e.value.style.layout.dataLabels.xAxis.name}: <b>${isNaN(l.v.x) ? "-" : se(
+        e.value.style.layout.plots.selectors.labels.x.formatter,
+        l.v.x,
+        Z({
+          p: e.value.style.tooltip.prefix,
+          v: l.v.x,
+          s: e.value.style.tooltip.suffix,
+          r: e.value.style.tooltip.roundingValue
+        }),
+        { datapoint: l, seriesIndex: u }
+      )}</b></div>`, t += `<div>${e.value.style.layout.dataLabels.yAxis.name}: <b>${isNaN(l.v.y) ? "-" : se(
+        e.value.style.layout.plots.selectors.labels.y.formatter,
+        l.v.y,
+        Z({
+          p: e.value.style.tooltip.prefix,
+          v: l.v.y,
+          s: e.value.style.tooltip.suffix,
+          r: e.value.style.tooltip.roundingValue
+        }),
+        { datapoint: l, seriesIndex: u }
+      )}</b></div>`, t += `${e.value.style.layout.plots.deviation.translation}: <b>${Z({
+        v: l.deviation,
+        r: e.value.style.layout.plots.deviation.roundingValue
+      })}</b>`, t += "</div>", Ae.value = `<div>${t}</div>`), $e.value = !0;
+    }
+    function dt(l, u) {
+      e.value.events.datapointLeave && e.value.events.datapointLeave({ datapoint: l, seriesIndex: u }), $e.value = !1, q.value = void 0, m.value = null;
+    }
+    function ht(l, u) {
+      e.value.events.datapointClick && e.value.events.datapointClick({ datapoint: l, seriesIndex: u });
+    }
+    function ft(l) {
+      T.value.includes(l) ? T.value = T.value.filter((u) => u !== l) : T.value.length < Be.value.length - 1 && T.value.push(l);
+    }
+    function gt(l = null) {
+      Qt(() => {
+        const u = ["", e.value.table.translations.correlationCoefficient, e.value.table.translations.nbrPlots, `${e.value.style.layout.dataLabels.xAxis.name} ${e.value.table.translations.average}`, `${e.value.style.layout.dataLabels.yAxis.name} ${e.value.table.translations.average}`], t = U.value.map((v) => [
+          v.name,
+          v.correlation.coefficient,
+          v.plots.length,
+          v.plots.map((g) => g.v.x).reduce((g, L) => g + L, 0) / v.plots.length,
+          v.plots.map((g) => g.v.y).reduce((g, L) => g + L, 0) / v.plots.length
+        ]), a = [[e.value.style.title.text], [e.value.style.title.subtitle.text], [[""], [""], [""]]].concat([u]).concat(t), s = yl(a);
+        l ? l(s) : cl({ csvContent: s, title: e.value.style.title.text || "vue-ui-heatmap" });
+      });
+    }
+    const we = P(() => {
+      const l = [
+        e.value.table.translations.series,
+        e.value.table.translations.correlationCoefficient,
+        e.value.table.translations.nbrPlots,
+        `${e.value.style.layout.dataLabels.xAxis.name} ${e.value.table.translations.average}`,
+        `${e.value.style.layout.dataLabels.yAxis.name} ${e.value.table.translations.average}`
+      ], u = U.value.map((a) => [
+        {
+          shape: a.shape,
+          content: a.name,
+          color: a.color
+        },
+        Number((a.correlation.coefficient ?? 0).toFixed(e.value.table.td.roundingValue)).toLocaleString(),
+        a.plots.length.toLocaleString(),
+        Number((a.plots.map((s) => s.v.x ?? 0).reduce((s, v) => s + v, 0) / a.plots.length).toFixed(e.value.table.td.roundingAverage)).toLocaleString(),
+        Number((a.plots.map((s) => s.v.y ?? 0).reduce((s, v) => s + v, 0) / a.plots.length).toFixed(e.value.table.td.roundingAverage)).toLocaleString()
+      ]), t = {
+        th: {
+          backgroundColor: e.value.table.th.backgroundColor,
+          color: e.value.table.th.color,
+          outline: e.value.table.th.outline
+        },
+        td: {
+          backgroundColor: e.value.table.td.backgroundColor,
+          color: e.value.table.td.color,
+          outline: e.value.table.td.outline
+        },
+        breakpoint: e.value.table.responsiveBreakpoint
+      };
+      return { head: l, body: u, config: t, colNames: l };
+    }), ve = b(!1);
+    function pt(l) {
+      ve.value = l, Ve.value += 1;
+    }
+    function mt() {
+      V.value.showTable = !V.value.showTable;
+    }
+    function xt() {
+      V.value.showTooltip = !V.value.showTooltip;
+    }
+    const _e = b(!1);
+    function Ne() {
+      _e.value = !_e.value;
+    }
+    async function jt({ scale: l = 2 } = {}) {
+      if (!te.value) return;
+      const { width: u, height: t } = te.value.getBoundingClientRect(), a = u / t, { imageUri: s, base64: v } = await Ml({ domElement: te.value, base64: !0, img: !0, scale: l });
+      return {
+        imageUri: s,
+        base64: v,
+        title: e.value.style.title.text,
+        width: u,
+        height: t,
+        aspectRatio: a
+      };
+    }
+    function Vt(l) {
+      ge.value = l, e.value.style.layout.marginalBars.highlighter.highlightBothAxes && (pe.value = k.value.y.length - 2 - l);
+    }
+    function Ut(l) {
+      pe.value = l, e.value.style.layout.marginalBars.highlighter.highlightBothAxes && (ge.value = l);
+    }
+    function Ee() {
+      ge.value = null, pe.value = null;
+    }
+    return Ct({
+      getData: Dt,
+      getImage: jt,
+      generatePdf: nt,
+      generateCsv: gt,
+      generateImage: it,
+      toggleTable: mt,
+      toggleTooltip: xt,
+      toggleAnnotator: Ne,
+      toggleFullscreen: pt
+    }), (l, u) => (n(), i("div", {
+      class: kt(`vue-ui-scatter ${ve.value ? "vue-data-ui-wrapper-fullscreen" : ""} ${e.value.useCssAnimation ? "" : "vue-ui-dna"}`),
+      ref_key: "scatterChart",
+      ref: te,
+      id: `vue-ui-scatter_${O.value}`,
+      style: oe(`font-family:${e.value.style.fontFamily};width:100%; text-align:center;background:${e.value.style.backgroundColor};${e.value.responsive ? "height: 100%" : ""}`),
+      onMouseenter: u[4] || (u[4] = () => r(tt)(!0)),
+      onMouseleave: u[5] || (u[5] = () => r(tt)(!1))
+    }, [
+      e.value.userOptions.buttons.annotator ? (n(), Q(r(zt), {
+        key: 0,
+        svgRef: r(at),
+        backgroundColor: e.value.style.backgroundColor,
+        color: e.value.style.color,
+        active: _e.value,
+        onClose: Ne
+      }, null, 8, ["svgRef", "backgroundColor", "color", "active"])) : f("", !0),
+      Wt.value ? (n(), i("div", {
+        key: 1,
+        ref_key: "noTitle",
+        ref: He,
+        class: "vue-data-ui-no-title-space",
+        style: "height:36px; width: 100%;background:transparent"
+      }, null, 512)) : f("", !0),
+      e.value.style.title.text ? (n(), i("div", {
+        key: 2,
+        ref_key: "chartTitle",
+        ref: Ue,
+        style: "width:100%;background:transparent"
+      }, [
+        (n(), Q(_l, {
+          key: `title_${Ze.value}`,
+          config: {
+            title: {
+              cy: "scatter-div-title",
+              ...e.value.style.title
+            },
+            subtitle: {
+              cy: "scatter-div-subtitle",
+              ...e.value.style.title.subtitle
+            }
+          }
+        }, null, 8, ["config"]))
+      ], 512)) : f("", !0),
+      p("div", {
+        id: `legend-top-${O.value}`
+      }, null, 8, Cl),
+      e.value.userOptions.show && je.value && (r(lt) || r(ze)) ? (n(), Q(r(Pt), {
+        ref_key: "details",
+        ref: Nt,
+        key: `user_options_${Ve.value}`,
+        backgroundColor: e.value.style.backgroundColor,
+        color: e.value.style.color,
+        isImaging: r(ut),
+        isPrinting: r(st),
+        uid: O.value,
+        hasTooltip: e.value.userOptions.buttons.tooltip && e.value.style.tooltip.show,
+        hasPdf: e.value.userOptions.buttons.pdf,
+        hasImg: e.value.userOptions.buttons.img,
+        hasXls: e.value.userOptions.buttons.csv,
+        hasTable: e.value.userOptions.buttons.table,
+        hasFullscreen: e.value.userOptions.buttons.fullscreen,
+        isTooltip: V.value.showTooltip,
+        isFullscreen: ve.value,
+        titles: { ...e.value.userOptions.buttonTitles },
+        chartElement: te.value,
+        position: e.value.userOptions.position,
+        hasAnnotator: e.value.userOptions.buttons.annotator,
+        isAnnotation: _e.value,
+        callbacks: e.value.userOptions.callbacks,
+        printScale: e.value.userOptions.print.scale,
+        onToggleFullscreen: pt,
+        onGeneratePdf: r(nt),
+        onGenerateCsv: gt,
+        onGenerateImage: r(it),
+        onToggleTable: mt,
+        onToggleTooltip: xt,
+        onToggleAnnotator: Ne,
+        style: oe({
+          visibility: r(lt) ? r(ze) ? "visible" : "hidden" : "visible"
+        })
+      }, Zt({ _: 2 }, [
+        l.$slots.menuIcon ? {
+          name: "menuIcon",
+          fn: X(({ isOpen: t, color: a }) => [
+            F(l.$slots, "menuIcon", he(fe({ isOpen: t, color: a })), void 0, !0)
+          ]),
+          key: "0"
+        } : void 0,
+        l.$slots.optionTooltip ? {
+          name: "optionTooltip",
+          fn: X(() => [
+            F(l.$slots, "optionTooltip", {}, void 0, !0)
+          ]),
+          key: "1"
+        } : void 0,
+        l.$slots.optionPdf ? {
+          name: "optionPdf",
+          fn: X(() => [
+            F(l.$slots, "optionPdf", {}, void 0, !0)
+          ]),
+          key: "2"
+        } : void 0,
+        l.$slots.optionCsv ? {
+          name: "optionCsv",
+          fn: X(() => [
+            F(l.$slots, "optionCsv", {}, void 0, !0)
+          ]),
+          key: "3"
+        } : void 0,
+        l.$slots.optionImg ? {
+          name: "optionImg",
+          fn: X(() => [
+            F(l.$slots, "optionImg", {}, void 0, !0)
+          ]),
+          key: "4"
+        } : void 0,
+        l.$slots.optionTable ? {
+          name: "optionTable",
+          fn: X(() => [
+            F(l.$slots, "optionTable", {}, void 0, !0)
+          ]),
+          key: "5"
+        } : void 0,
+        l.$slots.optionFullscreen ? {
+          name: "optionFullscreen",
+          fn: X(({ toggleFullscreen: t, isFullscreen: a }) => [
+            F(l.$slots, "optionFullscreen", he(fe({ toggleFullscreen: t, isFullscreen: a })), void 0, !0)
+          ]),
+          key: "6"
+        } : void 0,
+        l.$slots.optionAnnotator ? {
+          name: "optionAnnotator",
+          fn: X(({ toggleAnnotator: t, isAnnotator: a }) => [
+            F(l.$slots, "optionAnnotator", he(fe({ toggleAnnotator: t, isAnnotator: a })), void 0, !0)
+          ]),
+          key: "7"
+        } : void 0
+      ]), 1032, ["backgroundColor", "color", "isImaging", "isPrinting", "uid", "hasTooltip", "hasPdf", "hasImg", "hasXls", "hasTable", "hasFullscreen", "isTooltip", "isFullscreen", "titles", "chartElement", "position", "hasAnnotator", "isAnnotation", "callbacks", "printScale", "onGeneratePdf", "onGenerateImage", "style"])) : f("", !0),
+      (n(), i("svg", {
+        ref_key: "svgRef",
+        ref: at,
+        xmlns: r(rl),
+        class: kt({ "vue-data-ui-fullscreen--on": ve.value, "vue-data-ui-fulscreen--off": !ve.value, animated: e.value.useCssAnimation }),
+        viewBox: `0 0 ${S.value.width <= 0 ? 10 : S.value.width} ${S.value.height <= 0 ? 10 : S.value.height}`,
+        style: oe(`max-width:100%;overflow:visible;background:transparent;color:${e.value.style.color}`),
+        onMouseleave: Ee
+      }, [
+        We(r(Lt)),
+        l.$slots["chart-background"] ? (n(), i("foreignObject", {
+          key: 0,
+          x: 0,
+          y: 0,
+          width: S.value.width <= 0 ? 10 : S.value.width,
+          height: S.value.height <= 0 ? 10 : S.value.height,
+          style: {
+            pointerEvents: "none"
+          }
+        }, [
+          F(l.$slots, "chart-background", {}, void 0, !0)
+        ], 8, Bl)) : f("", !0),
+        e.value.style.layout.axis.show ? (n(), i("g", Ll, [
+          p("line", {
+            x1: B.value.x,
+            x2: B.value.x,
+            y1: o.value.top,
+            y2: o.value.bottom,
+            stroke: e.value.style.layout.axis.stroke,
+            "stroke-width": e.value.style.layout.axis.strokeWidth,
+            "stroke-linecap": "round"
+          }, null, 8, zl),
+          p("line", {
+            x1: o.value.left,
+            x2: o.value.right,
+            y1: B.value.y,
+            y2: B.value.y,
+            stroke: e.value.style.layout.axis.stroke,
+            "stroke-width": e.value.style.layout.axis.strokeWidth,
+            "stroke-linecap": "round"
+          }, null, 8, Tl)
+        ])) : f("", !0),
+        e.value.style.layout.marginalBars.show ? (n(), i("g", Pl, [
+          p("defs", null, [
+            p("linearGradient", {
+              id: `marginal_x_${O.value}`,
+              x1: "0%",
+              y1: "0%",
+              x2: "0%",
+              y2: "100%"
+            }, [
+              p("stop", {
+                offset: "0%",
+                "stop-color": e.value.style.layout.marginalBars.fill
+              }, null, 8, Nl),
+              p("stop", {
+                offset: "100%",
+                "stop-color": e.value.style.backgroundColor
+              }, null, 8, El)
+            ], 8, Ol),
+            p("linearGradient", {
+              id: `marginal_y_${O.value}`,
+              x1: "0%",
+              x2: "100%",
+              y1: "0%",
+              y2: "0%"
+            }, [
+              p("stop", {
+                offset: "0%",
+                "stop-color": e.value.style.backgroundColor
+              }, null, 8, Fl),
+              p("stop", {
+                offset: "100%",
+                "stop-color": e.value.style.layout.marginalBars.fill
+              }, null, 8, Yl)
+            ], 8, Xl)
+          ]),
+          (n(!0), i(H, null, ee(k.value.x, (t, a) => (n(), i("g", null, [
+            t && k.value.avgX[a] ? (n(), i("rect", {
+              key: 0,
+              x: k.value.avgX[a] - o.value.width / d.value / 2,
+              y: o.value.top - e.value.style.layout.marginalBars.offset - t / k.value.maxX * e.value.style.layout.marginalBars.size,
+              width: o.value.width / d.value <= 0 ? 1e-4 : o.value.width / d.value,
+              height: t / k.value.maxX * e.value.style.layout.marginalBars.size <= 0 ? 1e-4 : t / k.value.maxX * e.value.style.layout.marginalBars.size,
+              fill: e.value.style.layout.marginalBars.useGradient ? `url(#marginal_x_${O.value})` : e.value.style.layout.marginalBars.fill,
+              style: oe([`opacity:${e.value.style.layout.marginalBars.opacity}`, { "pointer-events": "none" }]),
+              stroke: e.value.style.backgroundColor,
+              "stroke-width": e.value.style.layout.marginalBars.strokeWidth,
+              rx: e.value.style.layout.marginalBars.borderRadius
+            }, null, 12, Wl)) : f("", !0),
+            k.value.avgX[a] ? (n(), i("rect", {
+              key: 1,
+              x: k.value.avgX[a] - o.value.width / d.value / 2,
+              y: o.value.top - e.value.style.layout.marginalBars.offset - e.value.style.layout.marginalBars.size,
+              width: o.value.width / d.value <= 0 ? 1e-4 : o.value.width / d.value,
+              height: Math.max(0.1, e.value.style.layout.marginalBars.size),
+              fill: "transparent",
+              onMouseenter: (s) => Vt(a),
+              onMouseleave: u[0] || (u[0] = (s) => Ee())
+            }, null, 40, Il)) : f("", !0),
+            k.value.avgX[a] && ge.value != null && ge.value === a ? (n(), i("g", Dl, [
+              p("rect", {
+                x: k.value.avgX[a] - o.value.width / d.value / 2,
+                y: o.value.top,
+                width: o.value.width / d.value <= 0 ? 1e-4 : o.value.width / d.value,
+                height: o.value.height,
+                fill: e.value.style.layout.marginalBars.highlighter.color,
+                "fill-opacity": e.value.style.layout.marginalBars.highlighter.opacity
+              }, null, 8, Rl),
+              p("line", {
+                x1: k.value.avgX[a] - o.value.width / d.value / 2,
+                x2: k.value.avgX[a] - o.value.width / d.value / 2,
+                y1: 0,
+                y2: o.value.top + o.value.height,
+                stroke: e.value.style.layout.marginalBars.highlighter.stroke,
+                "stroke-dasharray": e.value.style.layout.marginalBars.highlighter.strokeDasharray,
+                "stroke-width": e.value.style.layout.marginalBars.highlighter.strokeWidth,
+                style: { transition: "none !important", animation: "none !important" }
+              }, null, 8, jl),
+              p("line", {
+                x1: k.value.avgX[a] - o.value.width / d.value / 2 + (o.value.width / d.value <= 0 ? 1e-4 : o.value.width / d.value),
+                x2: k.value.avgX[a] - o.value.width / d.value / 2 + (o.value.width / d.value <= 0 ? 1e-4 : o.value.width / d.value),
+                y1: 0,
+                y2: o.value.top + o.value.height,
+                stroke: e.value.style.layout.marginalBars.highlighter.stroke,
+                "stroke-dasharray": e.value.style.layout.marginalBars.highlighter.strokeDasharray,
+                "stroke-width": e.value.style.layout.marginalBars.highlighter.strokeWidth,
+                style: { transition: "none !important", animation: "none !important" }
+              }, null, 8, Vl)
+            ])) : f("", !0)
+          ]))), 256)),
+          (n(!0), i(H, null, ee(k.value.y, (t, a) => (n(), i("g", null, [
+            t && k.value.avgY[a] ? (n(), i("rect", {
+              key: 0,
+              x: o.value.right + e.value.style.layout.marginalBars.offset,
+              y: k.value.avgY[a] - o.value.height / d.value / 2,
+              height: o.value.height / d.value <= 0 ? 1e-4 : o.value.height / d.value,
+              width: t / k.value.maxY * e.value.style.layout.marginalBars.size <= 0 ? 1e-4 : t / k.value.maxY * e.value.style.layout.marginalBars.size,
+              fill: e.value.style.layout.marginalBars.useGradient ? `url(#marginal_y_${O.value})` : e.value.style.layout.marginalBars.fill,
+              style: oe([`opacity:${e.value.style.layout.marginalBars.opacity}`, { "pointer-events": "none" }]),
+              stroke: e.value.style.backgroundColor,
+              "stroke-width": e.value.style.layout.marginalBars.strokeWidth,
+              rx: e.value.style.layout.marginalBars.borderRadius
+            }, null, 12, Ul)) : f("", !0),
+            k.value.avgY[a] ? (n(), i("rect", {
+              key: 1,
+              x: o.value.right + e.value.style.layout.marginalBars.offset,
+              y: k.value.avgY[a] - o.value.height / d.value / 2,
+              width: Math.max(0.1, e.value.style.layout.marginalBars.size),
+              height: o.value.height / d.value <= 0 ? 1e-4 : o.value.height / d.value,
+              fill: "transparent",
+              onMouseenter: (s) => Ut(a),
+              onMouseleave: u[1] || (u[1] = (s) => Ee())
+            }, null, 40, Gl)) : f("", !0),
+            k.value.avgY[a] && pe.value != null && pe.value === a ? (n(), i("g", ql, [
+              p("rect", {
+                x: o.value.left,
+                y: k.value.avgY[a] - o.value.height / d.value / 2,
+                width: o.value.width,
+                height: o.value.height / d.value <= 0 ? 1e-4 : o.value.height / d.value,
+                fill: e.value.style.layout.marginalBars.highlighter.color,
+                "fill-opacity": e.value.style.layout.marginalBars.highlighter.opacity
+              }, null, 8, Hl),
+              p("line", {
+                x1: o.value.left,
+                x2: S.value.width,
+                y1: k.value.avgY[a] - o.value.height / d.value / 2,
+                y2: k.value.avgY[a] - o.value.height / d.value / 2,
+                stroke: e.value.style.layout.marginalBars.highlighter.stroke,
+                "stroke-dasharray": e.value.style.layout.marginalBars.highlighter.strokeDasharray,
+                "stroke-width": e.value.style.layout.marginalBars.highlighter.strokeWidth,
+                style: { transition: "none !important", animation: "none !important" }
+              }, null, 8, Zl),
+              p("line", {
+                x1: o.value.left,
+                x2: S.value.width,
+                y1: k.value.avgY[a] - o.value.height / d.value / 2 + (o.value.height / d.value <= 0 ? 1e-4 : o.value.height / d.value),
+                y2: k.value.avgY[a] - o.value.height / d.value / 2 + (o.value.height / d.value <= 0 ? 1e-4 : o.value.height / d.value),
+                stroke: e.value.style.layout.marginalBars.highlighter.stroke,
+                "stroke-dasharray": e.value.style.layout.marginalBars.highlighter.strokeDasharray,
+                "stroke-width": e.value.style.layout.marginalBars.highlighter.strokeWidth,
+                style: { transition: "none !important", animation: "none !important" }
+              }, null, 8, Jl)
+            ])) : f("", !0)
+          ]))), 256)),
+          e.value.style.layout.marginalBars.showLines ? (n(), i("g", Kl, [
+            (n(!0), i(H, null, ee(Rt.value, (t) => (n(), i(H, null, [
+              T.value.includes(t.id) ? f("", !0) : (n(), i("path", {
+                key: 0,
+                d: `M ${t.dX}`,
+                stroke: e.value.style.backgroundColor,
+                "stroke-width": e.value.style.layout.marginalBars.linesStrokeWidth + 1,
+                "stroke-linecap": "round",
+                "stroke-linejoin": "round",
+                fill: "none"
+              }, null, 8, Ql)),
+              T.value.includes(t.id) ? f("", !0) : (n(), i("path", {
+                key: 1,
+                d: `M ${t.dX}`,
+                stroke: t.color,
+                "stroke-width": e.value.style.layout.marginalBars.linesStrokeWidth,
+                "stroke-linecap": "round",
+                "stroke-linejoin": "round",
+                fill: "none"
+              }, null, 8, ea)),
+              T.value.includes(t.id) ? f("", !0) : (n(), i("path", {
+                key: 2,
+                d: `M ${t.dY}`,
+                stroke: e.value.style.backgroundColor,
+                "stroke-width": e.value.style.layout.marginalBars.linesStrokeWidth + 1,
+                "stroke-linecap": "round",
+                "stroke-linejoin": "round",
+                fill: "none"
+              }, null, 8, ta)),
+              T.value.includes(t.id) ? f("", !0) : (n(), i("path", {
+                key: 3,
+                d: `M ${t.dY}`,
+                stroke: t.color,
+                "stroke-width": e.value.style.layout.marginalBars.linesStrokeWidth,
+                "stroke-linecap": "round",
+                "stroke-linejoin": "round",
+                fill: "none"
+              }, null, 8, la))
+            ], 64))), 256))
+          ])) : f("", !0)
+        ])) : f("", !0),
+        e.value.style.layout.plots.giftWrap.show ? (n(), i("g", aa, [
+          (n(!0), i(H, null, ee(U.value, (t, a) => (n(), i("g", null, [
+            t.plots.length > 2 ? (n(), i("polygon", {
+              key: 0,
+              points: r(vl)({ series: t.plots }),
+              fill: r(Re)(t.color, e.value.style.layout.plots.giftWrap.fillOpacity * 100),
+              "stroke-width": e.value.style.layout.plots.giftWrap.strokeWidth,
+              "stroke-dasharray": e.value.style.layout.plots.giftWrap.strokeDasharray,
+              stroke: t.color,
+              "stroke-linejoin": "round",
+              "stroke-linecap": "round"
+            }, null, 8, oa)) : f("", !0)
+          ]))), 256))
+        ])) : f("", !0),
+        (n(!0), i(H, null, ee(U.value, (t, a) => (n(), i("g", null, [
+          !t.shape || t.shape === "circle" ? (n(), i("g", sa, [
+            (n(!0), i(H, null, ee(t.plots, (s, v) => (n(), i("circle", {
+              cx: s.x,
+              cy: s.y,
+              r: q.value && q.value === s.id ? s.weight * 2 : s.weight,
+              fill: r(Re)(t.color, e.value.style.layout.plots.opacity * 100),
+              stroke: e.value.style.layout.plots.stroke,
+              "stroke-width": e.value.style.layout.plots.strokeWidth,
+              style: oe(`opacity:${q.value && q.value === s.id ? 1 : e.value.style.layout.plots.significance.useDistanceOpacity ? 1 - Math.abs(s.deviation) / vt.value : e.value.style.layout.plots.significance.show && Math.abs(s.deviation) > e.value.style.layout.plots.significance.deviationThreshold ? e.value.style.layout.plots.significance.opacity : 1}`),
+              onMouseover: (g) => ct(s, a),
+              onMouseleave: (g) => dt(s, a),
+              onClick: (g) => ht(s, a)
+            }, null, 44, ua))), 256))
+          ])) : (n(), i("g", na, [
+            (n(!0), i(H, null, ee(t.plots, (s, v) => (n(), Q($t, {
+              plot: { x: s.x, y: s.y },
+              radius: q.value && q.value === s.id ? s.weight * 2 : s.weight,
+              shape: t.shape,
+              color: r(Re)(t.color, e.value.style.layout.plots.opacity * 100),
+              stroke: e.value.style.layout.plots.stroke,
+              strokeWidth: e.value.style.layout.plots.strokeWidth,
+              style: oe(`opacity:${q.value && q.value === s.id ? 1 : e.value.style.layout.plots.significance.useDistanceOpacity ? 1 - Math.abs(s.deviation) / vt.value : e.value.style.layout.plots.significance.show && Math.abs(s.deviation) > e.value.style.layout.plots.significance.deviationThreshold ? e.value.style.layout.plots.significance.opacity : 1}`),
+              onMouseover: (g) => ct(s, a),
+              onMouseleave: (g) => dt(s, a),
+              onClick: (g) => ht(s, a)
+            }, null, 8, ["plot", "radius", "shape", "color", "stroke", "strokeWidth", "style", "onMouseover", "onMouseleave", "onClick"]))), 256))
+          ]))
+        ]))), 256)),
+        m.value && e.value.style.layout.plots.selectors.show ? (n(), i("g", ia, [
+          p("line", {
+            x1: B.value.x,
+            x2: m.value.x,
+            y1: m.value.y,
+            y2: m.value.y,
+            stroke: e.value.style.layout.plots.selectors.stroke,
+            "stroke-width": e.value.style.layout.plots.selectors.strokeWidth,
+            "stroke-dasharray": e.value.style.layout.plots.selectors.strokeDasharray,
+            "stroke-linecap": "round",
+            class: "line-pointer"
+          }, null, 8, ra),
+          p("line", {
+            x1: m.value.x,
+            x2: m.value.x,
+            y1: B.value.y,
+            y2: m.value.y,
+            stroke: e.value.style.layout.plots.selectors.stroke,
+            "stroke-width": e.value.style.layout.plots.selectors.strokeWidth,
+            "stroke-dasharray": e.value.style.layout.plots.selectors.strokeDasharray,
+            "stroke-linecap": "round",
+            class: "line-pointer"
+          }, null, 8, va),
+          p("text", {
+            x: B.value.x + (m.value.x > B.value.x ? -6 : 6),
+            y: m.value.y + e.value.style.layout.plots.selectors.labels.fontSize / 3,
+            "font-size": e.value.style.layout.plots.selectors.labels.fontSize,
+            fill: e.value.style.layout.plots.selectors.labels.color,
+            "font-weight": e.value.style.layout.plots.selectors.labels.bold ? "bold" : "normal",
+            "text-anchor": m.value.x > B.value.x ? "end" : "start"
+          }, R(r(se)(
+            e.value.style.layout.plots.selectors.labels.y.formatter,
+            r(j)(m.value.v.y),
+            r(Z)({
+              p: e.value.style.layout.plots.selectors.labels.prefix,
+              v: r(j)(m.value.v.y),
+              s: e.value.style.layout.plots.selectors.labels.suffix,
+              r: e.value.style.layout.plots.selectors.labels.rounding
+            }),
+            { datapoint: m.value }
+          )), 9, ya),
+          p("text", {
+            x: m.value.x,
+            y: B.value.y + (m.value.y > B.value.y ? -6 : e.value.style.layout.plots.selectors.labels.fontSize + 6),
+            "font-size": e.value.style.layout.plots.selectors.labels.fontSize,
+            fill: e.value.style.layout.plots.selectors.labels.color,
+            "font-weight": e.value.style.layout.plots.selectors.labels.bold ? "bold" : "normal",
+            "text-anchor": "middle"
+          }, R(r(se)(
+            e.value.style.layout.plots.selectors.labels.y.formatter,
+            r(j)(m.value.v.x),
+            r(Z)({
+              p: e.value.style.layout.plots.selectors.labels.prefix,
+              v: r(j)(m.value.v.x),
+              s: e.value.style.layout.plots.selectors.labels.suffix,
+              r: e.value.style.layout.plots.selectors.labels.rounding
+            }),
+            { datapoint: m.value }
+          )), 9, ca),
+          p("circle", {
+            cx: B.value.x,
+            cy: m.value.y,
+            r: e.value.style.layout.plots.selectors.markers.radius,
+            fill: e.value.style.layout.plots.selectors.markers.fill,
+            stroke: e.value.style.layout.plots.selectors.markers.stroke,
+            "stroke-width": e.value.style.layout.plots.selectors.markers.strokeWidth,
+            class: "line-pointer"
+          }, null, 8, da),
+          p("circle", {
+            cx: m.value.x,
+            cy: B.value.y,
+            r: e.value.style.layout.plots.selectors.markers.radius,
+            fill: e.value.style.layout.plots.selectors.markers.fill,
+            stroke: e.value.style.layout.plots.selectors.markers.stroke,
+            "stroke-width": e.value.style.layout.plots.selectors.markers.strokeWidth,
+            class: "line-pointer"
+          }, null, 8, ha),
+          e.value.style.layout.plots.selectors.labels.showName ? (n(), i("text", {
+            key: 0,
+            x: m.value.x,
+            y: m.value.y + (m.value.y < B.value.y ? -e.value.style.layout.plots.selectors.labels.fontSize / 2 : e.value.style.layout.plots.selectors.labels.fontSize),
+            "font-size": e.value.style.layout.plots.selectors.labels.fontSize,
+            fill: e.value.style.layout.plots.selectors.labels.color,
+            "font-weight": e.value.style.layout.plots.selectors.labels.bold ? "bold" : "normal",
+            "text-anchor": m.value.x < o.value.left + 100 ? "start" : m.value.x > o.value.right - 100 ? "end" : m.value.x > B.value.x ? "start" : "end"
+          }, R(m.value.v.name), 9, fa)) : f("", !0)
+        ])) : f("", !0),
+        e.value.style.layout.dataLabels.xAxis.show ? (n(), i("g", {
+          key: 5,
+          ref_key: "xAxisLabelLeft",
+          ref: Ce
+        }, [
+          p("text", {
+            id: `vue-ui-scatter-xAxis-label-${O.value}`,
+            transform: `translate(${e.value.style.layout.dataLabels.xAxis.fontSize}, ${o.value.top + o.value.height / 2}), rotate(-90)`,
+            "text-anchor": "middle",
+            "font-size": e.value.style.layout.dataLabels.xAxis.fontSize,
+            "font-weight": e.value.style.layout.dataLabels.xAxis.bold ? "bold" : "normal",
+            fill: e.value.style.layout.dataLabels.xAxis.color
+          }, R(e.value.style.layout.dataLabels.xAxis.name), 9, ga),
+          p("text", {
+            "text-anchor": "middle",
+            "font-size": e.value.style.layout.dataLabels.xAxis.fontSize,
+            fill: e.value.style.layout.dataLabels.xAxis.color,
+            transform: `translate(${e.value.style.layout.dataLabels.xAxis.name ? e.value.style.layout.dataLabels.xAxis.fontSize * 3 : 0}, ${B.value.y + e.value.style.layout.dataLabels.xAxis.fontSize / 3}), rotate(-90)`
+          }, R(r(se)(
+            e.value.style.layout.plots.selectors.labels.x.formatter,
+            r(j)(A.value.xMin),
+            r(Z)({
+              p: e.value.style.layout.plots.selectors.labels.prefix,
+              v: r(j)(A.value.xMin),
+              s: e.value.style.layout.plots.selectors.labels.suffix,
+              r: e.value.style.layout.dataLabels.xAxis.rounding
+            })
+          )), 9, pa)
+        ], 512)) : f("", !0),
+        e.value.style.layout.dataLabels.xAxis.show ? (n(), i("text", {
+          key: 6,
+          ref_key: "xAxisLabelRight",
+          ref: Et,
+          "text-anchor": "middle",
+          transform: `translate(${o.value.right + e.value.style.layout.padding.right + 6}, ${B.value.y + e.value.style.layout.dataLabels.xAxis.fontSize / 3}), rotate(-90)`,
+          "font-size": e.value.style.layout.dataLabels.xAxis.fontSize,
+          fill: e.value.style.layout.dataLabels.xAxis.color
+        }, R(r(se)(
+          e.value.style.layout.plots.selectors.labels.x.formatter,
+          r(j)(A.value.xMax),
+          r(Z)({
+            p: e.value.style.layout.plots.selectors.labels.prefix,
+            v: r(j)(A.value.xMax),
+            s: e.value.style.layout.plots.selectors.labels.suffix,
+            r: e.value.style.layout.dataLabels.xAxis.rounding
+          })
+        )), 9, ma)) : f("", !0),
+        e.value.style.layout.dataLabels.yAxis.show ? (n(), i("text", {
+          key: 7,
+          ref_key: "yAxisLabelTop",
+          ref: Xt,
+          x: B.value.x,
+          y: o.value.top - e.value.style.layout.dataLabels.yAxis.fontSize,
+          "text-anchor": "middle",
+          "font-size": e.value.style.layout.dataLabels.yAxis.fontSize,
+          fill: e.value.style.layout.dataLabels.yAxis.color
+        }, R(r(se)(
+          e.value.style.layout.plots.selectors.labels.y.formatter,
+          r(j)(A.value.yMax),
+          r(Z)({
+            p: e.value.style.layout.plots.selectors.labels.prefix,
+            v: r(j)(A.value.yMax),
+            s: e.value.style.layout.plots.selectors.labels.suffix,
+            r: e.value.style.layout.dataLabels.yAxis.rounding
+          })
+        )), 9, xa)) : f("", !0),
+        e.value.style.layout.dataLabels.yAxis.show ? (n(), i("g", {
+          key: 8,
+          ref_key: "yAxisLabelBottom",
+          ref: Se
+        }, [
+          p("text", {
+            x: B.value.x,
+            y: S.value.height - e.value.style.layout.dataLabels.yAxis.fontSize * 2,
+            "text-anchor": "middle",
+            "font-size": e.value.style.layout.dataLabels.yAxis.fontSize,
+            fill: e.value.style.layout.dataLabels.yAxis.color
+          }, R(r(se)(
+            e.value.style.layout.plots.selectors.labels.y.formatter,
+            r(j)(A.value.yMin),
+            r(Z)({
+              p: e.value.style.layout.plots.selectors.labels.prefix,
+              v: r(j)(A.value.yMin),
+              s: e.value.style.layout.plots.selectors.labels.suffix,
+              r: e.value.style.layout.dataLabels.yAxis.rounding
+            })
+          )), 9, ba),
+          p("text", {
+            "text-anchor": "middle",
+            "font-size": e.value.style.layout.dataLabels.yAxis.fontSize,
+            "font-weight": e.value.style.layout.dataLabels.yAxis.bold ? "bold" : "normal",
+            fill: e.value.style.layout.dataLabels.yAxis.color,
+            x: o.value.left + o.value.width / 2,
+            y: S.value.height
+          }, R(e.value.style.layout.dataLabels.yAxis.name), 9, ka)
+        ], 512)) : f("", !0),
+        p("clipPath", {
+          id: `clip_path_${O.value}`
+        }, [
+          p("rect", {
+            x: o.value.left,
+            y: o.value.top,
+            width: o.value.width <= 0 ? 1e-4 : o.value.width,
+            height: o.value.height <= 0 ? 1e-4 : o.value.height
+          }, null, 8, _a)
+        ], 8, wa),
+        e.value.style.layout.correlation.show ? (n(), i("g", Ma, [
+          (n(!0), i(H, null, ee(U.value, (t, a) => (n(), i("line", {
+            x1: t.correlation.x1,
+            x2: t.correlation.x2,
+            y1: t.correlation.y1,
+            y2: t.correlation.y2,
+            "stroke-dasharray": e.value.style.layout.correlation.strokeDasharray,
+            stroke: t.color,
+            "stroke-width": e.value.style.layout.correlation.strokeWidth,
+            "clip-path": `url(#clip_path_${O.value})`
+          }, null, 8, $a))), 256)),
+          (n(!0), i(H, null, ee(U.value, (t, a) => (n(), i("g", null, [
+            e.value.style.layout.correlation.label.show ? (n(), i("text", {
+              key: 0,
+              x: t.correlation.x2,
+              y: t.correlation.y2,
+              fill: e.value.style.layout.correlation.label.useSerieColor ? t.color : e.value.style.layout.correlation.label.color,
+              "text-anchor": "end",
+              "font-size": e.value.style.layout.correlation.label.fontSize,
+              "font-weight": e.value.style.layout.correlation.label.bold ? "bold" : "normal"
+            }, R(r(Z)({
+              v: r(j)(t.correlation.coefficient),
+              r: e.value.style.layout.correlation.label.roundingValue
+            })), 9, Aa)) : f("", !0)
+          ]))), 256))
+        ])) : f("", !0),
+        F(l.$slots, "svg", { svg: S.value }, void 0, !0)
+      ], 46, Sl)),
+      l.$slots.watermark ? (n(), i("div", Ca, [
+        F(l.$slots, "watermark", he(fe({ isPrinting: r(st) || r(ut) })), void 0, !0)
+      ])) : f("", !0),
+      p("div", {
+        id: `legend-bottom-${O.value}`
+      }, null, 8, Sa),
+      Qe.value ? (n(), Q(Jt, {
+        key: 5,
+        to: e.value.style.legend.position === "top" ? `#legend-top-${O.value}` : `#legend-bottom-${O.value}`
+      }, [
+        p("div", {
+          ref_key: "chartLegend",
+          ref: Ge
+        }, [
+          e.value.style.legend.show ? (n(), Q(wl, {
+            key: `legend_${Ke.value}`,
+            legendSet: ue.value,
+            config: It.value,
+            onClickMarker: u[2] || (u[2] = ({ legend: t }) => ft(t.id))
+          }, {
+            item: X(({ legend: t }) => [
+              p("div", {
+                onClick: (a) => t.segregate(),
+                style: oe(`opacity:${T.value.includes(t.id) ? 0.5 : 1}`)
+              }, R(t.name), 13, Ba)
+            ]),
+            _: 1
+          }, 8, ["legendSet", "config"])) : F(l.$slots, "legend", {
+            key: 1,
+            legend: ue.value
+          }, void 0, !0)
+        ], 512)
+      ], 8, ["to"])) : f("", !0),
+      l.$slots.source ? (n(), i("div", {
+        key: 6,
+        ref_key: "source",
+        ref: qe,
+        dir: "auto"
+      }, [
+        F(l.$slots, "source", {}, void 0, !0)
+      ], 512)) : f("", !0),
+      We(r(Tt), {
+        show: V.value.showTooltip && $e.value,
+        backgroundColor: e.value.style.tooltip.backgroundColor,
+        color: e.value.style.tooltip.color,
+        borderRadius: e.value.style.tooltip.borderRadius,
+        borderColor: e.value.style.tooltip.borderColor,
+        borderWidth: e.value.style.tooltip.borderWidth,
+        fontSize: e.value.style.tooltip.fontSize,
+        backgroundOpacity: e.value.style.tooltip.backgroundOpacity,
+        position: e.value.style.tooltip.position,
+        offsetY: e.value.style.tooltip.offsetY,
+        parent: te.value,
+        content: Ae.value,
+        isFullscreen: ve.value,
+        isCustom: e.value.style.tooltip.customFormat && typeof e.value.style.tooltip.customFormat == "function",
+        smooth: e.value.style.tooltip.smooth,
+        backdropFilter: e.value.style.tooltip.backdropFilter
+      }, {
+        "tooltip-before": X(() => [
+          F(l.$slots, "tooltip-before", he(fe({ ...Oe.value })), void 0, !0)
+        ]),
+        "tooltip-after": X(() => [
+          F(l.$slots, "tooltip-after", he(fe({ ...Oe.value })), void 0, !0)
+        ]),
+        default: X(() => [
+          e.value.style.tooltip.showShape ? (n(), i("div", La, [
+            (n(), i("svg", za, [
+              We($t, {
+                shape: m.value.shape,
+                color: m.value.color,
+                plot: { x: 10, y: 10 },
+                radius: 7
+              }, null, 8, ["shape", "color"])
+            ]))
+          ])) : f("", !0)
+        ]),
+        _: 3
+      }, 8, ["show", "backgroundColor", "color", "borderRadius", "borderColor", "borderWidth", "fontSize", "backgroundOpacity", "position", "offsetY", "parent", "content", "isFullscreen", "isCustom", "smooth", "backdropFilter"]),
+      je.value ? (n(), Q(r(St), {
+        key: 7,
+        hideDetails: "",
+        config: {
+          open: V.value.showTable,
+          maxHeight: 1e4,
+          body: {
+            backgroundColor: e.value.style.backgroundColor,
+            color: e.value.style.color
+          },
+          head: {
+            backgroundColor: e.value.style.backgroundColor,
+            color: e.value.style.color
+          }
+        }
+      }, {
+        content: X(() => [
+          (n(), Q(r(Bt), {
+            key: `table_${Je.value}`,
+            colNames: we.value.colNames,
+            head: we.value.head,
+            body: we.value.body,
+            config: we.value.config,
+            title: `${e.value.style.title.text}${e.value.style.title.subtitle.text ? ` : ${e.value.style.title.subtitle.text}` : ""}`,
+            onClose: u[3] || (u[3] = (t) => V.value.showTable = !1)
+          }, {
+            th: X(({ th: t }) => [
+              Kt(R(t), 1)
+            ]),
+            td: X(({ td: t }) => [
+              t.shape ? (n(), i("div", Ta, [
+                p("span", null, R(t.content), 1)
+              ])) : (n(), i("div", {
+                key: 1,
+                innerHTML: t
+              }, null, 8, Pa))
+            ]),
+            _: 1
+          }, 8, ["colNames", "head", "body", "config", "title"]))
+        ]),
+        _: 1
+      }, 8, ["config"])) : f("", !0),
+      r(et) ? (n(), Q(ml, { key: 8 })) : f("", !0)
+    ], 46, Al));
+  }
+}, qa = /* @__PURE__ */ $l(Oa, [["__scopeId", "data-v-4a8dad75"]]);
+export {
+  qa as default
+};