@milaboratories/graph-maker 1.1.133 → 1.1.134

package/dist/node_modules/@milaboratories/miplots4/dist/scatterplot-umap/ChartRenderer.js

@@ -1,103 +1,103 @@
-import { j as A } from "../node_modules/react/jsx-runtime.js";
-import { Error as Y } from "../common/Error.js";
-import { DEFAULT_HEIGHT as P, DEFAULT_WIDTH as w, TITLE_LINE_HEIGHT as J, MAX_SHOWN_UNIQUE_VALUES_IN_LABELS as Z, BLACK as W, TITLE_MARGIN as tt } from "../constants.js";
-import { splitTextByWidth as et } from "../discrete/utils/splitTextByWidth.js";
-import { SVGLayer as st } from "./components/SVGLayer.js";
-import { MIN_MARGIN as b, DEFAULT_DOT_AES as O } from "../scatterplot/constants.js";
-import { PADDINGS as H, TITLE_LINE as _, LEGEND_OFFSET as it } from "./constants.js";
-import { createAesGetter as $ } from "../scatterplot/utils/createAesGetter.js";
-import { getTicksAndFormat as at } from "../scatterplot/utils/getTicksAndFormat.js";
-import { getFilteredLabels as I, updateLabelsBBoxes as ot } from "../scatterplot/utils/getVisibleLabels.js";
-import { isContinuousAes as U } from "../types/common.js";
+import { j as E } from "../node_modules/react/jsx-runtime.js";
+import { Error as Q } from "../common/Error.js";
+import { DEFAULT_HEIGHT as A, DEFAULT_WIDTH as w, TITLE_LINE_HEIGHT as Y, MAX_SHOWN_UNIQUE_VALUES_IN_LABELS as J, BLACK as P, TITLE_MARGIN as Z } from "../constants.js";
+import { splitTextByWidth as tt } from "../discrete/utils/splitTextByWidth.js";
+import { SVGLayer as et } from "./components/SVGLayer.js";
+import { MIN_MARGIN as L, DEFAULT_DOT_AES as F } from "../scatterplot/constants.js";
+import { PADDINGS as W, TITLE_LINE as O, LEGEND_OFFSET as st } from "./constants.js";
+import { createAesGetter as M } from "../scatterplot/utils/createAesGetter.js";
+import { getTicksAndFormat as it } from "../scatterplot/utils/getTicksAndFormat.js";
+import { getFilteredLabels as I, updateLabelsBBoxes as at } from "../scatterplot/utils/getVisibleLabels.js";
+import { isContinuousAes as _ } from "../types/common.js";
 import "../types/discrete.js";
 import "../types/scatterplot.js";
 import "../types/heatmap.js";
 import "../types/dendro.js";
 import "../types/histogram.js";
 import "../types/bubble.js";
-import { getContinuousColorScale as lt } from "../utils/getContinuousColorScale.js";
-import { getContinuousLegendTicks as rt } from "../utils/getContinuousLegendTicks.js";
-import { TextMeasurer as nt } from "../utils/TextMeasurer.js";
+import { getContinuousColorScale as ot } from "../utils/getContinuousColorScale.js";
+import { getContinuousLegendTicks as lt } from "../utils/getContinuousLegendTicks.js";
+import { TextMeasurer as rt } from "../utils/TextMeasurer.js";
 import { createRoot as ht } from "../node_modules/react-dom/client.js";
-import dt from "../node_modules/d3-zoom/src/zoom.js";
+import nt from "../node_modules/d3-zoom/src/zoom.js";
 import "../node_modules/d3-zoom/src/transform.js";
-import ct from "../node_modules/@d3fc/d3fc-chart/src/cartesian.js";
+import dt from "../node_modules/@d3fc/d3fc-chart/src/cartesian.js";
 import "../node_modules/@d3fc/d3fc-webgl/src/scale/scaleMapper.js";
-import pt from "../node_modules/@d3fc/d3fc-webgl/src/style/fillColor.js";
+import ct from "../node_modules/@d3fc/d3fc-webgl/src/style/fillColor.js";
 import mt from "../node_modules/@d3fc/d3fc-series/src/webgl/point.js";
-import ut from "../node_modules/@d3fc/d3fc-series/src/svg/multi.js";
-import gt from "../node_modules/@d3fc/d3fc-series/src/webgl/multi.js";
-import yt from "../node_modules/@d3fc/d3fc-pointer/src/pointer.js";
-import { arrangeLegendParts as vt } from "../utils/arrangeLegendParts.js";
+import pt from "../node_modules/@d3fc/d3fc-series/src/svg/multi.js";
+import ut from "../node_modules/@d3fc/d3fc-series/src/webgl/multi.js";
+import gt from "../node_modules/@d3fc/d3fc-pointer/src/pointer.js";
+import { arrangeLegendParts as yt } from "../utils/arrangeLegendParts.js";
 import C from "../node_modules/d3-scale/src/linear.js";
-import R from "../node_modules/d3-scale/src/log.js";
+import U from "../node_modules/d3-scale/src/log.js";
 import N from "../node_modules/d3-selection/src/select.js";
-import ft from "../node_modules/d3-scale/src/ordinal.js";
+import vt from "../node_modules/d3-scale/src/ordinal.js";
 import St from "../node_modules/d3-scale/src/symlog.js";
-import { sqrt as xt } from "../node_modules/d3-scale/src/pow.js";
+import { sqrt as ft } from "../node_modules/d3-scale/src/pow.js";
 import { rgb as D } from "../node_modules/d3-color/src/color.js";
-import zt from "../node_modules/d3-quadtree/src/quadtree.js";
-import Lt from "../node_modules/d3-polygon/src/contains.js";
-var bt = Object.defineProperty, Ct = (n, t, e) => t in n ? bt(n, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : n[t] = e, o = (n, t, e) => Ct(n, typeof t != "symbol" ? t + "" : t, e);
-function V(n) {
+import xt from "../node_modules/d3-quadtree/src/quadtree.js";
+import zt from "../node_modules/d3-polygon/src/contains.js";
+var Lt = Object.defineProperty, bt = (n, t, e) => t in n ? Lt(n, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : n[t] = e, r = (n, t, e) => bt(n, typeof t != "symbol" ? t + "" : t, e);
+function R(n) {
   return n / 2.35 * (n / 2.35) * 64;
 }
-function F(n, t) {
+function G(n, t) {
   return n + (1 - n) * (1 - t);
 }
-function G(n, t) {
+function $(n, t) {
   return [
-    F(n.r / 255, t),
-    F(n.g / 255, t),
-    F(n.b / 255, t),
+    G(n.r / 255, t),
+    G(n.g / 255, t),
+    G(n.b / 255, t),
     1
   ];
 }
-function M(n, t, e) {
-  return e.length === 0 ? !0 : e.some((i) => i.closed && i.points.length > 2 && Lt(i.points, [n, t]));
+function H(n, t, e) {
+  return e.length === 0 ? !0 : e.some((i) => i.closed && i.points.length > 2 && zt(i.points, [n, t]));
 }
-function k(n, t) {
+function V(n, t) {
   const e = t.find((d) => d.type === "dots"), i = t.find((d) => d.type === "curve");
   return {
-    dotFill: $(n, (e == null ? void 0 : e.aes.dotFill) ?? O.color, "dotFill"),
-    dotSize: $(n, (e == null ? void 0 : e.aes.dotSize) ?? O.size, "dotSize"),
-    lineType: $(n, (i == null ? void 0 : i.aes.lineShape) ?? "solid", "lineShape")
+    dotFill: M(n, (e == null ? void 0 : e.aes.dotFill) ?? F.color, "dotFill"),
+    dotSize: M(n, (e == null ? void 0 : e.aes.dotSize) ?? F.size, "dotSize"),
+    lineType: M(n, (i == null ? void 0 : i.aes.lineShape) ?? "solid", "lineShape")
   };
 }
-class ce {
+class de {
   constructor() {
-    o(this, "reactRoot", null), o(this, "parentNode", null), o(this, "rootNode", null), o(this, "canvasNode", null), o(this, "svgLayerElement", null), o(this, "svgLayerComponent", /* @__PURE__ */ A.jsx(A.Fragment, {})), o(this, "aesGetters", {
+    r(this, "reactRoot", null), r(this, "parentNode", null), r(this, "rootNode", null), r(this, "canvasNode", null), r(this, "svgLayerElement", null), r(this, "svgLayerComponent", /* @__PURE__ */ E.jsx(E.Fragment, {})), r(this, "aesGetters", {
       dotSize: () => 2,
-      dotFill: () => W,
+      dotFill: () => P,
       lineType: () => "solid"
-    }), o(this, "tools", null), o(this, "margins", {
-      top: b,
-      bottom: b,
-      left: b,
-      right: b
-    }), o(this, "chartSizes", {
+    }), r(this, "tools", null), r(this, "margins", {
+      top: L,
+      bottom: L,
+      left: L,
+      right: L
+    }), r(this, "chartSizes", {
       chartWidth: w,
       // width of single chart
-      chartHeight: P,
+      chartHeight: A,
       // height of single chart
       totalWidth: w,
       // width of all charts in charts row, plus left axis, plus legend
-      totalHeight: P
+      totalHeight: A
       // width of all charts in charts height, plus bottom axis, plus top title
-    }), o(this, "scales", {
+    }), r(this, "scales", {
       x: C().domain([0, 10]).range([0, w]),
-      y: C().domain([0, 10]).range([P, 0]),
+      y: C().domain([0, 10]).range([A, 0]),
       xOriginal: C().domain([0, 10]).range([0, w]),
-      yOriginal: C().domain([0, 10]).range([P, 0])
-    }), o(this, "polygons", []), o(this, "onPolygonUpdateOutside", () => {
-    }), o(this, "onTooltipHintSwitch", () => {
-    }), o(this, "onLassoControlsStateUpdate", () => {
-    }), o(this, "zoomTransform", null), o(this, "zoomStateKey", ""), o(this, "selectedDot", null), o(this, "captionsSizes", {
+      yOriginal: C().domain([0, 10]).range([A, 0])
+    }), r(this, "polygons", []), r(this, "onPolygonUpdateOutside", () => {
+    }), r(this, "onTooltipHintSwitch", () => {
+    }), r(this, "onLassoControlsStateUpdate", () => {
+    }), r(this, "zoomTransform", null), r(this, "zoomStateKey", ""), r(this, "selectedDot", null), r(this, "captionsSizes", {
       xAxisCaptionsWidth: 30,
       yAxisCaptionsWidth: 100
-    }), o(this, "mainTitle", []), o(this, "legend", { width: 0, height: 0, items: [] }), o(this, "notCalculatedProps", {}), o(this, "allDots", []), o(this, "allPossibleLabels", []), o(this, "visibleLabels", []), o(this, "onPolygonUpdate", (t) => {
+    }), r(this, "mainTitle", []), r(this, "legend", { width: 0, height: 0, items: [] }), r(this, "notCalculatedProps", {}), r(this, "allDots", []), r(this, "allPossibleLabels", []), r(this, "visibleLabels", []), r(this, "onPolygonUpdate", (t) => {
       this.polygons = t, this.updateByLasso();
-      const e = this.allDots.filter((i) => M(i.x, i.y, this.polygons)).map((i) => i.idx);
+      const e = this.allDots.filter((i) => H(i.x, i.y, this.polygons)).map((i) => i.idx);
       this.onPolygonUpdateOutside(e, t);
     });
   }
@@ -112,55 +112,55 @@ class ce {
     this.parentNode === null && (this.parentNode = t, this.rootNode = document.createElement("div"), this.canvasNode = document.createElement("div"), this.parentNode.appendChild(this.rootNode), this.parentNode.appendChild(this.canvasNode), this.reactRoot = ht(this.rootNode));
   }
   updateChartSizes(t) {
-    this.chartSizes.chartWidth = t.width, this.chartSizes.chartHeight = t.height;
+    (t.width !== this.chartSizes.chartWidth || t.height !== this.chartSizes.chartHeight) && (this.chartSizes.chartWidth = t.width, this.chartSizes.chartHeight = t.height, this.scales.x.range([0, this.chartSizes.chartWidth]), this.scales.y.range([this.chartSizes.chartHeight, 0]));
   }
   updateViewport(t, e, i) {
-    const d = t.scale === "log" ? R() : C();
-    let { minX: r, minY: m, maxX: v, maxY: u } = i;
-    if (t.lowerValue !== void 0 && (r = Math.max(r, t.lowerValue)), t.upperValue !== void 0 && (v = Math.min(v, t.upperValue)), e.lowerValue !== void 0 && (m = Math.max(m, e.lowerValue)), e.upperValue !== void 0 && (u = Math.min(u, e.upperValue)), t.symmetricRange !== void 0) {
-      const l = t.symmetricRange;
-      if (l >= r && l <= v) {
-        const c = Math.max(l - r, v - l);
-        r = l - c, v = l + c;
+    const d = t.scale === "log" ? U() : C();
+    let { minX: h, minY: p, maxX: m, maxY: y } = i;
+    if (t.lowerValue !== void 0 && (h = Math.max(h, t.lowerValue)), t.upperValue !== void 0 && (m = Math.min(m, t.upperValue)), e.lowerValue !== void 0 && (p = Math.max(p, e.lowerValue)), e.upperValue !== void 0 && (y = Math.min(y, e.upperValue)), t.symmetricRange !== void 0) {
+      const a = t.symmetricRange;
+      if (a >= h && a <= m) {
+        const v = Math.max(a - h, m - a);
+        h = a - v, m = a + v;
       }
     }
     if (typeof e.symmetricRange < "u") {
-      const l = e.symmetricRange;
-      if (l >= m && l <= u) {
-        const c = Math.max(l - m, u - l);
-        m = l - c, u = l + c;
+      const a = e.symmetricRange;
+      if (a >= p && a <= y) {
+        const v = Math.max(a - p, y - a);
+        p = a - v, y = a + v;
       }
     }
-    const S = [0, this.chartSizes.chartWidth], x = d.copy().domain([r, v]).range([H.LEFT, this.chartSizes.chartWidth - H.RIGHT]);
-    d.domain([x.invert(0), x.invert(this.chartSizes.chartWidth)]).range(S).nice(), this.scales.x = d, this.scales.xOriginal = d.copy();
-    const p = e.scale === "log" ? R() : C(), a = [this.chartSizes.chartHeight, 0], y = p.copy().domain([m, u]).range([this.chartSizes.chartHeight - H.BOTTOM, H.TOP]);
-    p.domain([y.invert(this.chartSizes.chartHeight), y.invert(0)]).range(a).nice(), this.scales.y = p, this.scales.yOriginal = p.copy();
+    const x = [0, this.chartSizes.chartWidth], z = d.copy().domain([h, m]).range([W.LEFT, this.chartSizes.chartWidth - W.RIGHT]);
+    d.domain([z.invert(0), z.invert(this.chartSizes.chartWidth)]).range(x).nice(), this.scales.x = d, this.scales.xOriginal = d.copy();
+    const c = e.scale === "log" ? U() : C(), o = [this.chartSizes.chartHeight, 0], g = c.copy().domain([p, y]).range([this.chartSizes.chartHeight - W.BOTTOM, W.TOP]);
+    c.domain([g.invert(this.chartSizes.chartHeight), g.invert(0)]).range(o).nice(), this.scales.y = c, this.scales.yOriginal = c.copy();
   }
-  updateCaptionsSize(t) {
-    const e = new nt("600 14px Arial");
-    function i(v) {
-      return Math.max(...v.map((u) => e.getTextWidth(u)));
+  updateCaptionsSize() {
+    const t = new rt("600 14px Arial");
+    function e(p) {
+      return Math.max(...p.map((m) => t.getTextWidth(m)));
     }
-    const { ticks: d, format: r } = at(this.scales.y, t), m = i(d.map(r));
+    const { ticks: i, format: d } = it(this.scales.y, !1), h = e(i.map(d));
     this.captionsSizes = {
       xAxisCaptionsWidth: 20,
-      yAxisCaptionsWidth: m
+      yAxisCaptionsWidth: h
     };
   }
   createMainTitle(t) {
-    this.mainTitle = et(
+    this.mainTitle = tt(
       t.name,
       this.chartSizes.totalWidth - this.margins.left - this.margins.right,
       20
     );
   }
   updateMargins() {
-    const t = J * this.mainTitle.length, e = t > 0 ? t + tt * 2 : 0;
+    const t = Y * this.mainTitle.length, e = t > 0 ? t + Z * 2 : 0;
     this.margins = {
-      top: Math.max(e, b),
-      bottom: b + this.captionsSizes.xAxisCaptionsWidth + _,
-      left: b + this.captionsSizes.yAxisCaptionsWidth + _,
-      right: this.legend.width + b
+      top: Math.max(e, L),
+      bottom: L + this.captionsSizes.xAxisCaptionsWidth + O,
+      left: L + this.captionsSizes.yAxisCaptionsWidth + O,
+      right: this.legend.width + L
     }, this.chartSizes.totalWidth = this.margins.left + this.chartSizes.chartWidth + this.margins.right, this.chartSizes.totalHeight = this.margins.top + Math.max(this.chartSizes.chartHeight, this.legend.height) + this.margins.bottom, N(this.canvasNode).style("width", this.chartSizes.chartWidth + "px").style("height", this.chartSizes.chartHeight + "px").style("top", this.margins.top + "px").style("left", this.margins.left + "px");
   }
   updateLegendSize(t, e, i, d) {
@@ -168,132 +168,130 @@ class ce {
       this.legend = { width: 0, height: 0, items: [] };
       return;
     }
-    const r = [], m = { width: 0, height: 0, left: 0, top: 0 };
-    if (i.forEach((p) => {
-      const a = e[p.value];
-      if (a.usedAes.length === 0 || !a.aesMap)
+    const h = [], p = { width: 0, height: 0, left: 0, top: 0 };
+    if (i.forEach((c) => {
+      const o = e[c.value];
+      if (o.usedAes.length === 0 || !o.aesMap)
         return;
-      if (a.values.length > Z) {
-        console.warn(`Too many values for discrete legend (${a.values.length})`);
+      if (o.values.length > J) {
+        console.warn(`Too many values for discrete legend (${o.values.length})`);
         return;
       }
-      const y = {};
-      a.values.forEach((g) => {
-        y[g] || (y[g] = { ...O }), a.usedAes.forEach((f) => {
-          var z, s;
-          f === "dotFill" && (y[g].color = ((z = a.aesMap[g]) == null ? void 0 : z[f]) ?? W), f === "dotSize" && (y[g].size = ((s = a.aesMap[g]) == null ? void 0 : s[f]) ?? 3);
+      const g = {};
+      o.values.forEach((u) => {
+        g[u] || (g[u] = { ...F }), o.usedAes.forEach((S) => {
+          var s, l;
+          S === "dotFill" && (g[u].color = ((s = o.aesMap[u]) == null ? void 0 : s[S]) ?? P), S === "dotSize" && (g[u].size = ((l = o.aesMap[u]) == null ? void 0 : l[S]) ?? 3);
         });
       });
-      const l = p.label ?? p.value, c = ft().domain(a.values).range(a.values.map((g) => y[g]));
-      r.push({ ...m, id: p.value, type: "dots", title: l, scale: c, values: a.values, labels: a.labels });
-    }), d.forEach((p) => {
-      if (p.type === "dots" && U(p.aes.dotFill)) {
-        const { domain: a, range: y, columnName: l, type: c = "linear" } = p.aes.dotFill, g = l.label ?? l.value, f = lt(y, a, "linear"), z = (c === "log" ? St() : C()).domain(a).range([this.chartSizes.chartHeight, 0]), s = rt(z, a);
-        r.push({ ...m, id: "dotFill", type: "continuous", title: g, scale: f, tickPositionScale: z, values: s });
+      const a = c.label ?? c.value, v = vt().domain(o.values).range(o.values.map((u) => g[u]));
+      h.push({ ...p, id: c.value, type: "dots", title: a, scale: v, values: o.values, labels: o.labels });
+    }), d.forEach((c) => {
+      if (c.type === "dots" && _(c.aes.dotFill)) {
+        const { domain: o, range: g, columnName: a, type: v = "linear" } = c.aes.dotFill, u = a.label ?? a.value, S = ot(g, o, "linear"), s = (v === "log" ? St() : C()).domain(o).range([this.chartSizes.chartHeight, 0]), l = lt(s, o);
+        h.push({ ...p, id: "dotFill", type: "continuous", title: u, scale: S, tickPositionScale: s, values: l });
       }
-      if (p.type === "dots" && U(p.aes.dotSize)) {
-        const { columnName: a, domain: y, range: l } = p.aes.dotSize, c = a.label ?? a.value, g = xt(y, l), f = g.ticks(3), z = g.tickFormat(3), s = f.reduce((h, L) => (h[String(L)] = z(L), h), {});
-        r.push({ ...m, id: a.value, type: "size", title: c, scale: g, values: f, labels: s });
+      if (c.type === "dots" && _(c.aes.dotSize)) {
+        const { columnName: o, domain: g, range: a } = c.aes.dotSize, v = o.label ?? o.value, u = ft(g, a), S = u.ticks(3), s = u.tickFormat(3), l = S.reduce((f, b) => (f[String(b)] = s(b), f), {});
+        h.push({ ...p, id: o.value, type: "size", title: v, scale: u, values: S, labels: l });
       }
-    }), !r.length) {
+    }), !h.length) {
       this.legend = { width: 0, height: 0, items: [] };
       return;
     }
-    const v = vt(r, this.chartSizes.chartHeight), u = v[v.length - 1], S = u.left + u.width + it, x = this.chartSizes.chartHeight;
+    const m = yt(h, this.chartSizes.chartHeight), y = m[m.length - 1], x = y.left + y.width + st, z = this.chartSizes.chartHeight;
     this.legend = {
-      width: S,
-      height: x,
-      items: v
+      width: x,
+      height: z,
+      items: m
     };
   }
-  initSettings(t, e, i, d, r, m, v) {
-    const { xAxis: u, yAxis: S, size: x, title: p, legend: a } = e;
-    this.updateChartSizes(x), this.updateViewport(u, S, i), this.updateCaptionsSize(d.y), this.updateLegendSize(a, r, v, m), this.createMainTitle(p), this.updateMargins(), this.aesGetters = k(r, m);
-    const y = pt().data(t).value((s) => {
-      const h = D(this.aesGetters.dotFill(s.data)), L = !s.dimmed && M(s.x, s.y, this.polygons) ? 1 : 0.4;
-      return G(h, L);
-    }), l = mt().equals((s, h) => s === h).size((s) => V(this.aesGetters.dotSize(s.data))).crossValue((s) => s.x).mainValue((s) => s.y).decorate((s) => y(s)), c = dt().scaleExtent([0.1, 1e3]).filter((s) => s.type === "wheel" || s.metaKey || s.ctrlKey).on("start", () => {
+  initSettings(t, e, i, d, h, p) {
+    const { xAxis: m, yAxis: y, size: x, title: z, legend: c } = e;
+    this.updateChartSizes(x), this.updateViewport(m, y, i), this.updateCaptionsSize(), this.updateLegendSize(c, d, p, h), this.createMainTitle(z), this.updateMargins(), this.aesGetters = V(d, h);
+    const o = ct().data(t).value((s) => {
+      const l = D(this.aesGetters.dotFill(s.data)), f = !s.dimmed && H(s.x, s.y, this.polygons) ? 1 : 0.4;
+      return $(l, f);
+    }), g = mt().equals((s, l) => s === l).size((s) => R(this.aesGetters.dotSize(s.data))).crossValue((s) => s.x).mainValue((s) => s.y).decorate((s) => o(s)), a = nt().scaleExtent([0.1, 1e3]).filter((s) => s.type === "wheel" || s.metaKey || s.ctrlKey).on("start", () => {
       this.selectedDot = null;
     }).on("zoom", (s) => {
-      const h = s.transform, L = h.rescaleX(this.scales.xOriginal), E = h.rescaleY(this.scales.yOriginal);
-      this.scales.x.domain(L.domain()), this.scales.y.domain(E.domain()), this.zoomTransform = h, this.zoomStateKey = `${h.x}_${h.y}_${h.k}`, this.renderSvgLayer(), this.renderWebglLayer();
+      const l = s.transform, f = l.rescaleX(this.scales.xOriginal), b = l.rescaleY(this.scales.yOriginal);
+      this.scales.x.domain(f.domain()), this.scales.y.domain(b.domain()), this.zoomTransform = l, this.zoomStateKey = `${l.x}_${l.y}_${l.k}`, this.renderSvgLayer(), this.renderWebglLayer();
     }).on("end", () => {
       this.allPossibleLabels.forEach((s) => {
         s.x = this.scales.x(s.dot.x), s.y = this.scales.y(s.dot.y);
       }), this.visibleLabels = I(this.allPossibleLabels, this.chartSizes.chartWidth, this.chartSizes.chartHeight), this.renderSvgLayer();
-    }), g = this.createQuadtree(t), f = yt().on("point", ([s]) => {
-      var h, L, E;
+    }), v = this.createQuadtree(t), u = gt().on("point", ([s]) => {
+      var l, f, b;
       let T;
       if (s) {
-        const K = this.scales.x.invert(s.x), q = this.scales.y.invert(s.y), j = this.scales.xOriginal(K), X = this.scales.yOriginal(q), Q = 20 / (((h = this.zoomTransform) == null ? void 0 : h.k) || 1);
-        T = (L = this.tools) == null ? void 0 : L.qt.find(j, X, Q);
+        const B = this.scales.x.invert(s.x), K = this.scales.y.invert(s.y), q = this.scales.xOriginal(B), j = this.scales.yOriginal(K), X = 20 / (((l = this.zoomTransform) == null ? void 0 : l.k) || 1);
+        T = (f = this.tools) == null ? void 0 : f.qt.find(q, j, X);
       }
-      const B = this.selectedDot && !T || !this.selectedDot && T || ((E = this.selectedDot) == null ? void 0 : E.id) !== (T == null ? void 0 : T.id);
-      this.selectedDot = T ?? null, B && this.renderSvgLayer();
-    }), z = ct({
+      const k = this.selectedDot && !T || !this.selectedDot && T || ((b = this.selectedDot) == null ? void 0 : b.id) !== (T == null ? void 0 : T.id);
+      this.selectedDot = T ?? null, k && this.renderSvgLayer();
+    }), S = dt({
       xScale: this.scales.x,
       yScale: this.scales.y
-    }).xAxisHeight(() => "0").yAxisWidth(() => "0").svgPlotArea(ut()).webglPlotArea(
+    }).xAxisHeight(() => "0").yAxisWidth(() => "0").svgPlotArea(pt()).webglPlotArea(
       // only render the point series on the WebGL layer
-      gt().series([l]).mapping((s) => s)
+      ut().series([g]).mapping((s) => s)
     ).decorate((s) => {
-      const h = s.enter();
-      h && !this.svgLayerElement && (h.style("grid-template-columns", "0 auto 1fr auto 0"), h.style("grid-template-rows", "0 auto 1fr auto 0"), this.svgLayerElement = h.select(".svg-plot-area.plot-area svg").node()), h.select(".svg-plot-area.plot-area").attr("class", "svg-plot-area plot-area miplots-scatterplot-plot-area").call(c).call(f);
+      const l = s.enter();
+      l && !this.svgLayerElement && (l.style("grid-template-columns", "0 auto 1fr auto 0"), l.style("grid-template-rows", "0 auto 1fr auto 0"), this.svgLayerElement = l.select(".svg-plot-area.plot-area svg").node()), l.select(".svg-plot-area.plot-area").attr("class", "svg-plot-area plot-area miplots-scatterplot-plot-area").call(a).call(u);
     });
     this.tools = {
-      webglChart: z,
-      zoom: c,
-      qt: g,
-      fillColor: y,
-      pointSeries: l
+      webglChart: S,
+      zoom: a,
+      qt: v,
+      fillColor: o,
+      pointSeries: g
     }, N(this.canvasNode).datum(t).style("position", "absolute").style("width", this.chartSizes.chartWidth + "px").style("height", this.chartSizes.chartHeight + "px").style("top", this.margins.top + "px").style("left", this.margins.left + "px");
   }
   updateAes(t, e) {
-    this.tools !== null && (this.aesGetters = k(t, e), this.tools.fillColor.value((i) => {
-      const d = this.aesGetters.dotFill ?? (() => W), r = D(d(i.data)), m = !i.dimmed && M(i.x, i.y, this.polygons) ? 1 : 0.4;
-      return G(r, m);
+    this.tools !== null && (this.aesGetters = V(t, e), this.tools.fillColor.value((i) => {
+      const d = this.aesGetters.dotFill ?? (() => P), h = D(d(i.data)), p = !i.dimmed && H(i.x, i.y, this.polygons) ? 1 : 0.4;
+      return $(h, p);
     }));
   }
   updatePointSize() {
-    this.tools !== null && (N(this.canvasNode).datum([...this.allDots]), this.tools.pointSeries.size((t) => V(this.aesGetters.dotSize(t.data))));
+    this.tools !== null && (N(this.canvasNode).datum([...this.allDots]), this.tools.pointSeries.size((t) => R(this.aesGetters.dotSize(t.data))));
   }
   updateByLasso() {
     var t;
     this.tools !== null && ((t = this.tools) == null || t.fillColor.value((e) => {
-      const i = this.aesGetters.dotFill ?? (() => W), d = D(i(e.data)), r = !e.dimmed && M(e.x, e.y, this.polygons) ? 1 : 0.4;
-      return G(d, r);
+      const i = this.aesGetters.dotFill ?? (() => P), d = D(i(e.data)), h = !e.dimmed && H(e.x, e.y, this.polygons) ? 1 : 0.4;
+      return $(d, h);
     }), this.renderWebglLayer());
   }
   createQuadtree(t) {
-    return zt().x((e) => this.scales.xOriginal(e.x)).y((e) => this.scales.yOriginal(e.y)).addAll(t);
+    return xt().x((e) => this.scales.xOriginal(e.x)).y((e) => this.scales.yOriginal(e.y)).addAll(t);
   }
   updateData(t) {
     this.tools !== null && (N(this.canvasNode).datum(t), this.tools.fillColor.data(t), this.tools.qt = this.createQuadtree(t));
   }
-  render(t, e, i, d, r, m, v, u, S, x, p, a, y, l) {
+  render(t, e, i, d, h, p, m, y, x, z, c, o, g) {
     if (this.tools === null)
       this.initSettings(
-        r,
+        d,
         e,
+        h,
+        y,
         m,
-        d,
-        S,
-        u,
         x
-      ), this.onPolygonUpdateOutside = a, this.onTooltipHintSwitch = y, this.onLassoControlsStateUpdate = l;
+      ), this.onPolygonUpdateOutside = c, this.onTooltipHintSwitch = o, this.onLassoControlsStateUpdate = g;
     else {
-      const { title: c, legend: g } = e;
-      this.updateLegendSize(g, S, x, u), this.createMainTitle(c), this.updateMargins(), this.updateAes(S, u);
+      const { title: a, legend: v, size: u } = e;
+      this.updateChartSizes(u), this.updateLegendSize(v, y, x, m), this.createMainTitle(a), this.updateMargins(), this.updateAes(y, m);
     }
-    this.allDots = r, this.allPossibleLabels = p, this.allPossibleLabels.forEach((c) => {
-      c.x = this.scales.x(c.dot.x), c.y = this.scales.y(c.dot.y);
+    this.allDots = d, this.allPossibleLabels = z, this.allPossibleLabels.forEach((a) => {
+      a.x = this.scales.x(a.dot.x), a.y = this.scales.y(a.dot.y);
     }), this.visibleLabels = I(this.allPossibleLabels, this.chartSizes.chartWidth, this.chartSizes.chartHeight), this.notCalculatedProps = {
       settingsId: t,
       chartSettings: e,
-      onlyPositive: d,
       keyColumn: i,
-      dotsByGrouping: v,
-      layers: u
+      dotsByGrouping: p,
+      layers: m
     }, this.renderWebglLayer(), this.renderSvgLayer();
   }
   renderWebglLayer() {
@@ -304,11 +302,10 @@ class ce {
     var t;
     this.visibleLabels.forEach((i) => {
       i.x = this.scales.x(i.dot.x), i.y = this.scales.y(i.dot.y);
-    }), ot(this.visibleLabels);
+    }), at(this.visibleLabels);
     const e = {
       settingsId: this.notCalculatedProps.settingsId,
       chartSettings: this.notCalculatedProps.chartSettings,
-      onlyPositive: this.notCalculatedProps.onlyPositive,
       keyColumn: this.notCalculatedProps.keyColumn,
       dotsByGrouping: this.notCalculatedProps.dotsByGrouping,
       layers: this.notCalculatedProps.layers,
@@ -328,14 +325,14 @@ class ce {
       onTooltipHintSwitch: this.onTooltipHintSwitch,
       onLassoControlsStateUpdate: this.onLassoControlsStateUpdate
     };
-    this.svgLayerComponent = /* @__PURE__ */ A.jsx(st, { ...e }), (t = this.reactRoot) == null || t.render(this.svgLayerComponent);
+    this.svgLayerComponent = /* @__PURE__ */ E.jsx(et, { ...e }), (t = this.reactRoot) == null || t.render(this.svgLayerComponent);
   }
   renderError(t) {
     var e;
-    (e = this.reactRoot) == null || e.render(/* @__PURE__ */ A.jsx(Y, { message: t }));
+    (e = this.reactRoot) == null || e.render(/* @__PURE__ */ E.jsx(Q, { message: t }));
   }
 }
 export {
-  ce as default
+  de as default
 };
 //# sourceMappingURL=ChartRenderer.js.map