evui 3.5.0 → 3.5.2

package/dist/components/chart/plugins/plugins.legend.js

@@ -1,665 +0,0 @@
-import w from "../helpers/helpers.util.js";
-const O = {
-  /**
-   * Create legend DOM
-   *
-   * @returns {undefined}
-   */
-  createLegendLayout() {
-    var e, o;
-    this.legendDOM = document.createElement("div"), this.legendDOM.className = "ev-chart-legend", this.legendBoxDOM = document.createElement("div"), this.legendBoxDOM.className = "ev-chart-legend-box", (o = (e = this.options) == null ? void 0 : e.legend) != null && o.allowResize && (this.resizeDOM = document.createElement("div"), this.resizeDOM.className = "ev-chart-resize-bar", this.ghostDOM = document.createElement("div"), this.ghostDOM.className = "ev-chart-resize-ghost", this.wrapperDOM.appendChild(this.resizeDOM)), this.useTable ? (this.legendTableDOM = document.createElement("table"), this.legendTableDOM.className = "ev-chart-legend--table", this.setLegendColumnHeader(), this.legendBoxDOM.appendChild(this.legendTableDOM), this.legendDOM.style.overflow = "auto") : (this.legendBoxDOM.style.overflowX = "hidden", this.legendBoxDOM.style.overflowY = "auto", this.legendBoxDOM.style.height = "100%"), this.legendDOM.appendChild(this.legendBoxDOM), this.wrapperDOM.appendChild(this.legendDOM), this.options.legend.virtualScroll && !this.useTable && (this.legendTopSpacer = document.createElement("div"), this.legendTopSpacer.className = "ev-chart-legend--top-spacer", this.legendTopSpacer.style.clear = "both", this.legendTopSpacer.style.opacity = 0, this.legendBottomSpacer = document.createElement("div"), this.legendBottomSpacer.className = "ev-chart-legend--bottom-spacer", this.legendBottomSpacer.style.clear = "both", this.legendBottomSpacer.style.opacity = 0, this.legendBoxDOM.appendChild(this.legendTopSpacer), this.legendBoxDOM.appendChild(this.legendBottomSpacer), this.updateVisibleRowCountFrameId = requestAnimationFrame(() => {
-      this.updateVisibleRowCount();
-    }));
-  },
-  /**
-   * Create and append Table Header DOM
-   * Only chartOption > legend > table > use : true
-   *
-   * @returns {undefined}
-   */
-  setLegendColumnHeader() {
-    var n;
-    const e = (n = this.options.legend) == null ? void 0 : n.table, o = e.columns;
-    ["color", ...Object.keys(o)].forEach((d) => {
-      var s, h;
-      const t = document.createElement("th");
-      if (t.className = "ev-chart-legend--table__column-name", (s = o[d]) != null && s.use || d === "color" || d === "name") {
-        const i = o[d], r = (i == null ? void 0 : i.title) ?? "";
-        t.textContent = r, t.setAttribute("title", r), t.dataset.type = r, w.setDOMStyle(t, (h = e == null ? void 0 : e.style) == null ? void 0 : h.header), this.legendTableDOM.append(t);
-      }
-    });
-  },
-  /**
-   * Initialize legend
-   * If there was no initialization, create DOM and set default layout.
-   * It not, there will already be set layout, so add a legend for each series with group
-   *
-   * @returns {undefined}
-   */
-  initLegend() {
-    var e, o;
-    this.isHeatMapType = this.options.type === "heatMap", this.useTable = !!((o = (e = this.options.legend) == null ? void 0 : e.table) != null && o.use) && this.options.type !== "heatmap" && this.options.type !== "scatter", this.legendItemHeight = 18, this.isInitLegend || this.createLegendLayout(), this.isHeatMapType ? (this.initEventForColorLegend(), this.addColorLegendList()) : (this.initEvent(), this.addLegendList()), this.initResizeEvent(), this.isInitLegend = !0, this.isLegendMove = !1;
-  },
-  /**
-   * Calculate and update the number of rows and items per row that are visible
-   * within the legend container based on its dimensions and the layout of the legend.
-   * If the legend is positioned on the right or left, only one item per row is shown.
-   * Otherwise, the number of items per row is determined by dividing the container width
-   * by the item width.
-   *
-   * @returns {undefined}
-   */
-  updateVisibleRowCount() {
-    const e = this.options.legend.position === "right" || this.options.legend.position === "left", o = this.legendBoxDOM.clientHeight, l = this.legendBoxDOM.clientWidth, n = Math.max(this.options.legend.width - 8, 1), d = Object.values(this.seriesList).filter(
-      (t) => t.showLegend !== !1
-    ).length;
-    this.itemsPerRow = e ? 1 : Math.floor(l / n), this.totalRowCount = Math.ceil(d / this.itemsPerRow), this.visibleRowCount = o > this.legendItemHeight ? Math.round(o / this.legendItemHeight) + 1 : this.totalRowCount;
-  },
-  /**
-   * Calculate and set the start and end row indexes for visible items within the
-   * scrollable legend area. Determines the row range that should be displayed based
-   * on the current scroll position and the height of each legend item.
-   *
-   * @returns {undefined}
-   */
-  updateStartEndRowIndex() {
-    var o;
-    const e = Math.max(Math.floor(((o = this.legendBoxDOM) == null ? void 0 : o.scrollTop) / this.legendItemHeight), 0);
-    this.startRowIndex = Math.min(e, Math.max(this.totalRowCount - this.visibleRowCount, 0)), this.endRowIndex = this.startRowIndex + this.visibleRowCount + 1;
-  },
-  /**
-   * Render only the visible legend items in the legend container based on the
-   * calculated start and end row indexes. Removes existing legend items,
-   * adjusts spacer heights to enable smooth scrolling, and adds only the items
-   * within the visible range.
-   *
-   * @returns {undefined}
-   */
-  renderVisibleLegends() {
-    this.updateStartEndRowIndex();
-    const e = this.legendBoxDOM.querySelectorAll(".ev-chart-legend-container");
-    if (e && e.length)
-      for (const i of e)
-        i.remove();
-    const o = this.totalRowCount * this.legendItemHeight, l = this.startRowIndex * this.legendItemHeight, n = Math.max(
-      o - this.visibleRowCount * this.legendItemHeight - l,
-      0
-    );
-    this.legendTopSpacer.style.height = `${l}px`, this.legendBottomSpacer.style.height = `${n}px`;
-    const d = this.startRowIndex * this.itemsPerRow, t = this.endRowIndex * this.itemsPerRow, s = this.data.groups.at(0);
-    let h = [];
-    if (s ? h = s.filter((i) => this.seriesList[i].showLegend).map((i) => [i, this.seriesList[i]]) : h = Object.entries(this.seriesList).filter(([, i]) => i.showLegend), h && h.length)
-      for (let i = d; i < t && i < h.length; i++) {
-        const [, r] = h[i];
-        this.addLegend(r);
-      }
-  },
-  /**
-   * Add legend with group information to align each series properly.
-   * Especially if a chart is stacked,
-   * legends have to align with series ordering as we can see in chart.
-   *
-   * @returns {undefined}
-   */
-  addLegendList() {
-    const { groups: e } = this.data, { seriesList: o } = this;
-    this.options.legend.virtualScroll && !this.useTable ? this.renderVisibleLegendsFrameId = requestAnimationFrame(() => {
-      this.renderVisibleLegends();
-    }) : (this.addLegendForGroups(e, o, this.useTable), this.addStandaloneLegends(o, this.useTable));
-  },
-  /**
-   * Adds legends for each group in `groups` array, iterating through each series within the group.
-   * Only adds series with `showLegend` set to `true`.
-   *
-   * @param {Array} groups - Array of groups containing series identifiers.
-   * @param {Object} seriesList - Object containing all series, keyed by series ID.
-   * @param {boolean} useTable - Determines whether to add legends with additional values.
-   * @returns {undefined}
-   */
-  addLegendForGroups(e, o, l) {
-    e == null || e.forEach((n) => {
-      n == null || n.forEach((d) => {
-        const t = o[d];
-        t && t.showLegend && this.addLegendBasedOnType(t, l);
-      });
-    });
-  },
-  /**
-   * Adds legends for series that are not part of any group. Iterates through each series
-   * in `seriesList` and only adds those that are not assigned to any group (based on `isExistGrp`)
-   * and have `showLegend` set to `true`.
-   *
-   * @param {Object} seriesList - Object containing all series, keyed by series ID.
-   * @param {boolean} useTable - Determines whether to add legends with additional values.
-   * @returns {undefined}
-   */
-  addStandaloneLegends(e, o) {
-    Object.values(e).forEach((l) => {
-      !l.isExistGrp && l.showLegend && this.addLegendBasedOnType(l, o);
-    });
-  },
-  /**
-   * Adds a legend item for a specific series, determining whether to include additional
-   * values based on the `useTable` parameter. Calls `addLegendWithValues` if `useTable` is true,
-   * otherwise calls `addLegend`.
-   *
-   * @param {Object} series - Series object containing data to display in the legend.
-   * @param {boolean} useTable - Determines whether to add legends with additional values.
-   * @returns {undefined}
-   */
-  addLegendBasedOnType(e, o) {
-    o ? this.addLegendWithValues(e) : this.addLegend(e);
-  },
-  /**
-   * Add Legend with Color Information
-   * Only Heatmap chart
-   *
-   * @returns {undefined}
-   */
-  addColorLegendList() {
-    const e = this.seriesList;
-    Object.values(e).forEach((o) => {
-      if (!o.isExistGrp && o.showLegend) {
-        const { colorState: l, valueOpt: n } = o, { min: d, max: t, interval: s, existError: h, decimalPoint: i } = n, r = l.length, a = h ? r - 2 : r - 1;
-        for (let c = 0; c < r; c++) {
-          const { id: f, color: u, label: v = "" } = l[c], g = d + s * c;
-          let y = g + s;
-          c < a ? y -= 0.1 ** i : y = t + 0.1 ** i;
-          let p = v;
-          if (!p)
-            if (p = `${g.toFixed(i)} - ${y.toFixed(i)}`, d === void 0 || t === void 0)
-              if (c === 0)
-                p = "0";
-              else
-                break;
-            else {
-              if (g > t)
-                break;
-              s <= 1 && i === 0 && (p = g);
-            }
-          this.addLegend({
-            cId: f,
-            color: u,
-            name: p,
-            show: !0
-          });
-        }
-      }
-    });
-  },
-  /**
-   * Get Container DOM by Event Object
-   * @param e Event
-   *
-   * @returns {Element}
-   */
-  getContainerDOM(e) {
-    let o = null;
-    const l = e.target.dataset.type;
-    return l === "container" ? o = e.target : ["name", "color", "min", "max", "avg", "total", "last"].includes(l) && (o = e.target.parentElement, o != null && o.series || (o = o.parentElement)), o;
-  },
-  /**
-   * Initialize legend event
-   *
-   * @returns {undefined}
-   */
-  initEvent() {
-    if (this.isInitLegend)
-      return;
-    const e = {
-      container: `ev-chart-legend${this.useTable ? "--table__row" : "-container"}`,
-      color: `ev-chart-legend${this.useTable ? "--table__color" : "-color"}`,
-      name: `ev-chart-legend${this.useTable ? "--table__name" : "-name"}`,
-      value: `ev-chart-legend${this.useTable ? "--table__value" : "-value"}`
-    }, o = (t, s) => {
-      const h = t == null ? void 0 : t.getElementsByClassName(e.color)[0], i = t == null ? void 0 : t.getElementsByClassName(e.name)[0], r = t == null ? void 0 : t.getElementsByClassName(e.value), a = t == null ? void 0 : t.series;
-      if (h.style.backgroundColor = s, h.style.borderColor = s, i.style.color = s, r && r.length)
-        for (const c of r)
-          c.style.color = s;
-      a.show = !1, t.dataset.inactive = !0;
-    }, l = (t, s) => {
-      var f, u;
-      let h;
-      const i = t == null ? void 0 : t.getElementsByClassName(e.color)[0], r = t == null ? void 0 : t.getElementsByClassName(e.name)[0], a = t == null ? void 0 : t.getElementsByClassName(e.value), c = t == null ? void 0 : t.series;
-      if (typeof c.color != "string" ? h = c.color[c.color.length - 1][1] : h = c.color, c.type === "line" && c.fill ? (i.style.height = "8px", i.style.backgroundColor = w.rgbaAdjustHalfOpacity(h), i.style.border = `1px solid ${h}`) : i.style.backgroundColor = h, r.style.color = s, a && a.length)
-        for (const v of a) {
-          const g = (u = (f = this.options.legend.table) == null ? void 0 : f.columns[v.dataset.type]) == null ? void 0 : u.style;
-          v.style.color = g != null && g.color ? g.color : s;
-        }
-      c.show = !0, t.dataset.inactive = !1;
-    }, n = () => {
-      (this.data.groups.at(0) ? this.data.groups.at(0).slice().reverse().filter((s) => this.seriesList[s].showLegend).map((s) => [s, this.seriesList[s]]) : Object.entries(this.seriesList).filter(([, s]) => s.showLegend)).forEach(([, s]) => {
-        s.show = !1;
-      });
-    }, d = () => {
-      (this.data.groups.at(0) ? this.data.groups.at(0).slice().reverse().filter((s) => this.seriesList[s].showLegend).map((s) => [s, this.seriesList[s]]) : Object.entries(this.seriesList).filter(([, s]) => s.showLegend)).forEach(([, s]) => {
-        s.show = !0;
-      });
-    };
-    this.onLegendBoxClick = (t) => {
-      var y;
-      const { legend: s } = this.options;
-      if (s != null && s.stopClickEvt)
-        return;
-      const { chartIdx: h } = this.data, i = this.getContainerDOM(t);
-      if (!i)
-        return;
-      const r = i == null ? void 0 : i.getElementsByClassName(e.color)[0], a = i == null ? void 0 : i.getElementsByClassName(e.name)[0], c = (i == null ? void 0 : i.dataset.inactive) === "false";
-      if (!r || !a)
-        return;
-      if (s.clickMode === "active") {
-        const p = Array.from(
-          this.legendBoxDOM.getElementsByClassName(e.container)
-        );
-        p.every((x) => x.dataset.inactive === "false") ? (p.forEach((x) => {
-          o(x, s.inactive);
-        }), n(), l(i, s.color), this.seriesInfo.count = 1) : c ? (o(i, s.inactive), this.seriesInfo.count--) : c || (l(i, s.color), this.seriesInfo.count++), p.every((x) => x.dataset.inactive === "true") && (p.forEach((x) => {
-          l(x, s.color);
-        }), d(), this.seriesInfo.count = p.length);
-      }
-      if (s.clickMode !== "active") {
-        if (c && this.seriesInfo.count === 1)
-          return;
-        c ? (o(i, s.inactive), this.seriesInfo.count--) : (l(i, s.color), this.seriesInfo.count++);
-      }
-      if (this.brushSeries) {
-        const p = [...this.brushSeries.list];
-        p[h] = this.seriesList, this.brushSeries.list = p, this.brushSeries.chartIdx = h;
-      }
-      ((y = this.options.eventBehavior) == null ? void 0 : y.legendClick) !== "emitOnly" && this.update({
-        updateSeries: !1,
-        updateSelTip: { update: !0, keepDomain: !0 }
-      });
-      const u = Object.values(this.seriesList).filter((p) => p.show).map((p) => p.sId), v = u.length === Object.values(this.seriesList).length, g = {
-        e: t,
-        data: {
-          seriesIds: v ? [] : u,
-          isActiveAll: v
-        }
-      };
-      typeof this.listeners["click-legend"] == "function" && this.listeners["click-legend"](g);
-    }, this.onLegendBoxLeave = () => {
-      this.legendHover = null, this.update({
-        updateSeries: !1,
-        updateSelTip: { update: !1, keepDomain: !1 },
-        hitInfo: {
-          legend: null
-        },
-        lightUpdate: !0
-      });
-    }, this.onLegendBoxOver = (t) => {
-      var r;
-      const s = this.getContainerDOM(t);
-      if (!s) {
-        this.onLegendBoxLeave();
-        return;
-      }
-      const i = { sId: (r = s == null ? void 0 : s.series) == null ? void 0 : r.sId, type: this.options.type };
-      this.legendHover = i, this.update({
-        updateSeries: !1,
-        updateSelTip: { update: !1, keepDomain: !1 },
-        hitInfo: {
-          legend: i
-        },
-        lightUpdate: !0
-      });
-    }, this.legendBoxDOM.addEventListener("click", this.onLegendBoxClick), this.legendBoxDOM.addEventListener("mouseover", this.onLegendBoxOver), this.legendBoxDOM.addEventListener("mouseleave", this.onLegendBoxLeave), this.options.legend.virtualScroll && !this.useTable && (this.legendBoxDOM.addEventListener("resize", this.updateVisibleRowCount), this.legendBoxDOM.addEventListener("scroll", this.renderVisibleLegends.bind(this))), this.initResizeEvent();
-  },
-  /**
-   * Init Event on Color Legend
-   * Only Heatmap
-   */
-  initEventForColorLegend() {
-    if (this.isInitLegend)
-      return;
-    const e = {
-      container: `ev-chart-legend${this.useTable ? "--table__row" : "-container"}`,
-      color: `ev-chart-legend${this.useTable ? "--table__color" : "-color"}`,
-      name: `ev-chart-legend${this.useTable ? "--table__name" : "-name"}`
-    }, o = (t, s) => {
-      var f;
-      const h = t == null ? void 0 : t.getElementsByClassName(e.color)[0], i = t == null ? void 0 : t.getElementsByClassName(e.name)[0], r = Object.values(this.seriesList)[0], a = (f = t == null ? void 0 : t.series) == null ? void 0 : f.cId;
-      h.style.backgroundColor = s, h.style.borderColor = s, i.style.color = s;
-      const c = r.colorState.findIndex((u) => u.id === a);
-      c > -1 && (r.colorState[c].show = !1), t.dataset.inactive = !0;
-    }, l = (t, s) => {
-      var f, u;
-      const h = t == null ? void 0 : t.getElementsByClassName(e.color)[0], i = t == null ? void 0 : t.getElementsByClassName(e.name)[0], r = Object.values(this.seriesList)[0], a = (f = t == null ? void 0 : t.series) == null ? void 0 : f.cId;
-      h.style.backgroundColor = (u = t == null ? void 0 : t.series) == null ? void 0 : u.color, i.style.color = s;
-      const c = r.colorState.findIndex((v) => v.id === a);
-      c > -1 && (r.colorState[c].show = !0), t.dataset.inactive = !1;
-    }, n = () => {
-      Object.values(this.seriesList)[0].colorState.forEach((s) => {
-        s.show = !1;
-      });
-    }, d = () => {
-      Object.values(this.seriesList)[0].colorState.forEach((s) => {
-        s.show = !0;
-      });
-    };
-    this.onLegendBoxClick = (t) => {
-      var p;
-      const s = this.options.legend;
-      if (s != null && s.stopClickEvt)
-        return;
-      const h = Object.values(this.seriesList)[0], i = this.getContainerDOM(t);
-      if (!i)
-        return;
-      const r = i == null ? void 0 : i.getElementsByClassName(e.color)[0], a = i == null ? void 0 : i.getElementsByClassName(e.name)[0], c = (i == null ? void 0 : i.dataset.inactive) === "false", f = h.colorState.filter((m) => m.show).length;
-      if (!r || !a)
-        return;
-      if (s.clickMode === "active") {
-        const m = Array.from(
-          this.legendBoxDOM.getElementsByClassName(e.container)
-        );
-        m.every((b) => b.dataset.inactive === "false") ? (m.forEach((b) => {
-          o(b, s.inactive);
-        }), n(), l(i, s.color)) : c ? o(i, s.inactive) : c || l(i, s.color), m.every((b) => b.dataset.inactive === "true") && (m.forEach((b) => {
-          l(b, s.color);
-        }), d());
-      }
-      if (s.clickMode !== "active") {
-        if (c && f === 1)
-          return;
-        c ? o(i, s.inactive) : l(i, s.color);
-      }
-      ((p = this.options.eventBehavior) == null ? void 0 : p.legendClick) !== "emitOnly" && this.update({
-        updateSeries: !1,
-        updateSelTip: { update: !0, keepDomain: !0 }
-      });
-      const u = h.colorState.filter((m) => m.show), v = u.map((m) => +m.id.split("#")[1]), g = h.colorState.length === u.length, y = {
-        e: t,
-        data: {
-          seriesIndices: g ? [] : v,
-          isActiveAll: g
-        }
-      };
-      typeof this.listeners["click-legend"] == "function" && this.listeners["click-legend"](y);
-    }, this.onLegendBoxLeave = () => {
-      this.legendHover = null, Object.values(this.seriesList)[0].colorState.forEach((s) => {
-        s.state = "normal";
-      }), this.update({
-        updateSeries: !1,
-        updateSelTip: { update: !1, keepDomain: !1 },
-        lightUpdate: !0
-      });
-    }, this.onLegendBoxOver = (t) => {
-      var a, c;
-      const s = (a = Object.values(this.seriesList)) == null ? void 0 : a[0], h = this.getContainerDOM(t);
-      if (!h) {
-        this.onLegendBoxLeave();
-        return;
-      }
-      const i = (c = h == null ? void 0 : h.series) == null ? void 0 : c.cId, r = { sId: i, type: this.options.type };
-      this.legendHover = r, s.colorState.forEach((f) => {
-        f.state = f.id === i ? "highlight" : "downplay";
-      }), this.update({
-        updateSeries: !1,
-        updateSelTip: { update: !1, keepDomain: !1 },
-        hitInfo: {
-          legend: r
-        },
-        lightUpdate: !0
-      });
-    }, this.legendBoxDOM.addEventListener("click", this.onLegendBoxClick), this.legendBoxDOM.addEventListener("mouseover", this.onLegendBoxOver), this.legendBoxDOM.addEventListener("mouseleave", this.onLegendBoxLeave), this.initResizeEvent();
-  },
-  initResizeEvent() {
-    this.onResizeMouseDown = (e) => {
-      e.stopPropagation(), e.preventDefault();
-      const o = this.options, l = o.legend.position, n = o.title.show ? o.title.height : 0, d = this.ghostDOM;
-      this.resizeDOM.style.display = "none", this.wrapperDOM.appendChild(d), l === "left" || l === "right" ? (d.style.top = `${n}px`, d.style.left = this.resizeDOM.style.left, d.style.right = this.resizeDOM.style.right, d.style.height = this.resizeDOM.style.height) : (d.classList.add("horizontal"), l === "top" ? d.style.top = this.resizeDOM.style.top : l === "bottom" && (d.style.bottom = this.resizeDOM.style.bottom)), this.wrapperDOM.addEventListener("mousemove", this.mouseMove, !1), this.wrapperDOM.addEventListener("mouseup", this.mouseUp, !1);
-    }, this.resizeDOM && (this.resizeDOM.addEventListener("mousedown", this.onResizeMouseDown), this.mouseMove = this.onMouseMove.bind(this), this.mouseUp = this.onMouseUp.bind(this));
-  },
-  /**
-   * To update legend, reset all process.
-   *
-   * @returns {undefined}
-   */
-  updateLegend() {
-    this.resetLegend(), this.isHeatMapType ? this.addColorLegendList() : this.addLegendList();
-  },
-  /**
-   * To update value text on legend table
-   * Only chartOption > legend > table > use : true
-   *
-   * @returns {undefined}
-   */
-  updateLegendTableValues() {
-    var n, d, t, s, h;
-    const e = (t = (d = (n = this.options) == null ? void 0 : n.legend) == null ? void 0 : d.table) == null ? void 0 : t.columns, o = this.getAggregations(), l = (s = this.legendBoxDOM) == null ? void 0 : s.getElementsByClassName("ev-chart-legend--table__row");
-    if (l && l.length)
-      for (const i of l) {
-        const r = i == null ? void 0 : i.getElementsByClassName("ev-chart-legend--table__value");
-        if (r && r.length)
-          for (const a of r) {
-            const c = a.dataset.type;
-            if (c !== "name") {
-              const f = i.series.sId, u = (h = o == null ? void 0 : o[f]) == null ? void 0 : h[c];
-              a.textContent = this.getFormattedValue(e[c], u);
-            }
-          }
-      }
-  },
-  /**
-   * Force Update Legend. Remove and Create
-   *
-   * @returns {undefined}
-   */
-  forceUpdateLegend() {
-    this.destroyLegend(), this.initLegend();
-  },
-  /**
-   * To update legend, remove all of legendBoxDOM's children
-   * (except spacers when virtualScroll is enabled)
-   *
-   * @returns {undefined}
-   */
-  resetLegend() {
-    var o, l;
-    const e = this.legendBoxDOM;
-    if (e) {
-      if (this.useTable) {
-        const n = this.legendTableDOM;
-        for (; n.hasChildNodes(); )
-          n.removeChild(n.firstChild);
-        this.setLegendColumnHeader();
-      } else if (this.options.legend.virtualScroll)
-        ((l = (o = this.legendDOM) == null ? void 0 : o.style) == null ? void 0 : l.display) === "none" ? this.legendNeedsUpdate = !0 : (this.updateVisibleRowCount(), this.renderVisibleLegends());
-      else
-        for (; e.hasChildNodes(); )
-          e.removeChild(e.firstChild);
-      this.seriesInfo.count = 0;
-    }
-  },
-  /**
-   * To update legend, remove all of legendBoxDOM's children
-   *
-   * @returns {undefined}
-   */
-  destroyLegend() {
-    const e = this.legendDOM;
-    this.renderVisibleLegendsFrameId != null && (cancelAnimationFrame(this.renderVisibleLegendsFrameId), this.renderVisibleLegendsFrameId = null), this.updateVisibleRowCountFrameId != null && (cancelAnimationFrame(this.updateVisibleRowCountFrameId), this.updateVisibleRowCountFrameId = null), e && (e.remove(), this.legendDOM = null, this.legendBoxDOM = null, this.resizeDOM = null, this.isInitLegend = !1, this.seriesInfo.count = 0);
-  },
-  /**
-   * Create DOM for each series
-   *
-   * @returns {undefined}
-   */
-  /**
-   * 새로운 범례 아이템을 생성하고 범례 영역에 추가
-   * @param {Object} series - 시리즈 정보 객체
-   */
-  addLegend(e) {
-    const o = this.options.legend, l = document.createElement("div"), n = document.createElement("span"), d = document.createElement("div");
-    l.className = "ev-chart-legend-container", l.dataset.inactive = !e.show, l.series = e, n.className = "ev-chart-legend-color", e.type === "line" && e.point && !e.fill && (n.className += " ev-chart-legend-color--point-line"), d.className = "ev-chart-legend-name";
-    let t;
-    e.show ? typeof e.color != "string" ? t = e.color[e.color.length - 1][1] : t = e.color : t = o.inactive, e.type === "line" && e.fill ? (n.style.height = "8px", n.style.backgroundColor = e.show ? w.rgbaAdjustHalfOpacity(t) : o.inactive, n.style.border = `1px solid ${t}`) : n.style.backgroundColor = t, n.dataset.type = "color", d.style.color = o.color, d.textContent = e.name, d.setAttribute("title", e.name), d.dataset.type = "name", l.appendChild(n), l.appendChild(d), o.position === "top" || o.position === "bottom" ? (l.style.width = `${o.width - 8}px`, l.style.margin = "0 4px") : l.style.width = "100%", l.style.height = `${this.legendItemHeight}px`, l.style.display = "inline-block", l.style.overflow = "hidden", l.dataset.type = "container", this.legendBoxDOM.insertBefore(l, this.legendBottomSpacer), e.show && this.seriesInfo.count++;
-  },
-  /**
-   * Add Legend Items With aggregation Values
-   * Only chartOption > legend > table > use : true
-   * @param series
-   */
-  addLegendWithValues(e) {
-    var a, c, f, u, v;
-    const o = this.options.legend, l = (a = o == null ? void 0 : o.table) == null ? void 0 : a.columns, n = (c = this.getAggregations()) == null ? void 0 : c[e == null ? void 0 : e.sId];
-    if (!n || !l)
-      return;
-    const d = document.createElement("tr");
-    d.className = "ev-chart-legend--table__row", d.dataset.inactive = !e.show, w.setDOMStyle(d, (u = (f = o.table) == null ? void 0 : f.style) == null ? void 0 : u.row), d.series = e, d.dataset.type = "container";
-    const t = document.createElement("td");
-    t.className = "ev-chart-legend--table__color-wrapper", t.dataset.type = "color";
-    const s = document.createElement("div");
-    s.className = "ev-chart-legend--table__color", s.dataset.type = "color";
-    let h;
-    switch (e.show ? typeof e.color != "string" ? h = e.color[e.color.length - 1][1] : h = e.color : h = o.inactive, e.type) {
-      case "line": {
-        e.fill ? (s.style.backgroundColor = w.rgbaAdjustHalfOpacity(h), s.style.border = `1px solid ${h}`) : (e.point && (s.className += " ev-chart-legend--table__color--point-line"), s.className += " ev-chart-legend--table__color--line", s.style.backgroundColor = h);
-        break;
-      }
-      case "bar":
-      case "pie":
-      default: {
-        s.style.height = "10px", s.style.backgroundColor = h;
-        break;
-      }
-    }
-    e.type === "line" && e.fill ? (s.style.height = "8px", s.style.backgroundColor = e.show ? w.rgbaAdjustHalfOpacity(h) : o.inactive, s.style.border = `1px solid ${h}`) : s.style.backgroundColor = h, t.appendChild(s), d.appendChild(t);
-    const i = document.createElement("td");
-    i.className = "ev-chart-legend--table__name", i.style.color = e.show ? o.color : o.inactive, i.textContent = e.name, i.setAttribute("title", e.name), i.dataset.type = "name", w.setDOMStyle(i, (v = l == null ? void 0 : l.name) == null ? void 0 : v.style), e.show || (i.style.color = o.inactive), d.appendChild(i);
-    const r = Object.keys(l);
-    r == null || r.forEach((g) => {
-      var y;
-      if (g !== "name" && l[g].use) {
-        const p = this.getFormattedValue(l[g], n[g]), m = document.createElement("td");
-        m.className = "ev-chart-legend--table__value", m.style.color = e.show ? o.color : o.inactive, m.textContent = p, m.dataset.type = g.toString(), w.setDOMStyle(m, (y = l[g]) == null ? void 0 : y.style), e.show || (m.style.color = o.inactive), d.appendChild(m);
-      }
-    }), this.legendTableDOM.appendChild(d), e.show && this.seriesInfo.count++;
-  },
-  /**
-   * Set legend components position by option
-   *
-   * @returns {undefined}
-   */
-  setLegendPosition() {
-    var v, g, y, p, m, L, x, b, C;
-    const e = this.options, o = (v = e == null ? void 0 : e.legend) == null ? void 0 : v.position, l = (g = this.wrapperDOM) == null ? void 0 : g.style, n = (y = this.legendDOM) == null ? void 0 : y.style, d = (p = this.legendBoxDOM) == null ? void 0 : p.style, t = (m = this.resizeDOM) == null ? void 0 : m.style;
-    let s, h;
-    const i = (L = e == null ? void 0 : e.title) != null && L.show ? (x = e == null ? void 0 : e.title) == null ? void 0 : x.height : 0, r = i + ((b = e == null ? void 0 : e.legend) == null ? void 0 : b.height), { top: a = 0, bottom: c = 0, left: f = 0, right: u = 0 } = ((C = e == null ? void 0 : e.legend) == null ? void 0 : C.padding) ?? {};
-    if (!(!l || !n))
-      switch (d.padding = `${a}px ${u}px ${c}px ${f}px`, o) {
-        case "top":
-          l.padding = `${r}px 0 0 0`, s = this.chartDOM.getBoundingClientRect(), h = parseInt(n.paddingTop) + parseInt(n.paddingBottom), d.width = "100%", d.height = `${e.legend.height - h}px`, n.top = `${i}px`, n.right = "", n.bottom = "", n.left = "", n.width = `${s.width}px`, n.height = `${e.legend.height + (t ? 4 : 0)}px`, t && (t.top = `${r}px`, t.right = "", t.bottom = "", t.left = "", t.width = `${s.width}px`, t.height = "4px", t.cursor = "row-resize");
-          break;
-        case "right":
-          l.padding = `${i}px ${e.legend.width}px 0 0`, s = this.chartDOM.getBoundingClientRect(), d.width = `${e.legend.width - 10}px`, d.maxHeight = `${s.height}px`, n.paddingLeft = "10px", n.top = `${i}px`, n.right = "0px", n.bottom = "", n.left = "", n.width = `${e.legend.width}px`, n.height = `${s.height}px`, t && (t.top = `${i}px`, t.right = `${e.legend.width}px`, t.bottom = "", t.left = "", t.width = "4px", t.height = `${s.height}px`, t.cursor = "col-resize");
-          break;
-        case "bottom":
-          l.padding = `${i}px 0 ${e.legend.height}px 0`, s = this.chartDOM.getBoundingClientRect(), h = parseInt(n.paddingTop) + parseInt(n.paddingBottom), d.width = "100%", d.height = `${e.legend.height - h}px`, n.top = "", n.right = "", n.bottom = "0px", n.left = "0px", n.width = `${s.width}px`, n.height = `${e.legend.height + (t ? 4 : 0)}px`, t && (t.top = "", t.right = "", t.bottom = `${e.legend.height}px`, t.left = "", t.width = `${s.width}px`, t.height = "4px", t.cursor = "row-resize");
-          break;
-        case "left":
-          l.padding = `${i}px 0 0 ${e.legend.width}px`, s = this.chartDOM.getBoundingClientRect(), d.width = `${e.legend.width}px`, d.maxHeight = `${s.height}px`, d.display = "absolute", d.bottom = "0px", n.top = `${i}px`, n.right = "", n.bottom = "", n.left = "0px", n.width = `${e.legend.width}px`, n.height = `${s.height}px`, t && (t.top = `${i}px`, t.right = "", t.bottom = "", t.left = `${e.legend.width}px`, t.width = "4px", t.height = `${s.height}px`, t.cursor = "col-resize");
-          break;
-      }
-  },
-  /**
-   * Update legend components size
-   *
-   * @returns {undefined}
-   */
-  updateLegendContainerSize() {
-    var l;
-    if (!this.options || !this.legendBoxDOM)
-      return;
-    const e = (l = this.options) == null ? void 0 : l.legend, o = this.legendBoxDOM.getElementsByClassName("ev-chart-legend-container");
-    if (o)
-      for (let n = 0; n < o.length; n++)
-        e.position === "top" || e.position === "bottom" ? (o[n].style.width = `${e.width - 8}px`, o[n].style.margin = "0 4px") : o[n].style.width = "100%";
-  },
-  /**
-   * When user moves resizeDOM, this function will change css
-   *
-   * @returns {undefined}
-   */
-  onMouseMove(e) {
-    e.stopPropagation(), e.preventDefault();
-    const o = this.wrapperDOM.getBoundingClientRect(), l = this.wrapperDOM.offsetWidth, n = this.wrapperDOM.offsetHeight, d = this.options.title.show ? this.options.title.height : 0, t = this.options.legend.position, s = 150, h = 70, i = 120, r = 20;
-    let a;
-    switch (t) {
-      case "left":
-        a = e.clientX - o.left, a < i ? a = i : a > l - s && (a = l - s), this.ghostDOM.style.left = `${a}px`;
-        break;
-      case "right":
-        a = e.clientX - o.left, a < s ? a = s : a > l - i && (a = l - i), this.ghostDOM.style.left = `${a}px`;
-        break;
-      case "top":
-        a = e.clientY - o.top, a < r + d ? a = r + d : a > n - h && (a = n - h), this.ghostDOM.style.top = `${a}px`;
-        break;
-      case "bottom":
-        a = e.clientY - o.top, a < h + d ? a = h + d : a > n - r && (a = n - r), this.ghostDOM.style.bottom = `${this.wrapperDOM.offsetHeight - a}px`;
-        break;
-    }
-    this.isLegendMove = !0;
-  },
-  /**
-   * callback for mouseup on ghostDOM, this function will change legend and chart size.
-   *
-   * @returns {undefined}
-   */
-  onMouseUp(e) {
-    e.stopPropagation(), e.preventDefault(), this.wrapperDOM.removeEventListener("mousemove", this.mouseMove, !1), this.wrapperDOM.removeEventListener("mouseup", this.mouseUp, !1);
-    const o = this.options, l = o.legend.position, n = this.resizeDOM.style, d = this.legendDOM.style, t = this.legendBoxDOM.style, s = this.ghostDOM.style, h = this.wrapperDOM.style, i = o.title.show ? o.title.height : 0, r = +this.legendDOM.style.paddingLeft.replace("px", "");
-    let a;
-    if (this.isLegendMove)
-      switch (l) {
-        case "top":
-          n.top = s.top, a = +s.top.replace("px", ""), d.height = `${a - i}px`, t.height = `${a - i - 4}px`, o.legend.height = a - i - 4, h.padding = `${a}px 0 0 0`;
-          break;
-        case "right":
-          n.left = s.left, a = +s.left.replace("px", ""), d.width = `${this.wrapperDOM.offsetWidth - a - 4}px`, t.width = `${this.wrapperDOM.offsetWidth - a - 4 - r}px`, o.legend.width = this.wrapperDOM.offsetWidth - a - 4, h.padding = `${i}px ${this.wrapperDOM.offsetWidth - a}px 0 0`;
-          break;
-        case "bottom":
-          n.bottom = s.bottom, a = this.wrapperDOM.offsetHeight - +s.bottom.replace("px", ""), d.height = `${this.wrapperDOM.offsetHeight - a}px`, t.height = `${a - i - 4}px`, o.legend.height = this.wrapperDOM.offsetHeight - a, h.padding = `${i}px 0 ${this.wrapperDOM.offsetHeight - a}px 0`;
-          break;
-        case "left":
-          n.left = s.left, a = +s.left.replace("px", ""), d.width = `${a}px`, t.width = `${a}px`, o.legend.width = a, h.padding = `${i}px 0 0 ${a - 4}px`;
-          break;
-      }
-    n.display = "block", this.ghostDOM.remove(), this.isLegendMove && (this.render(), this.isLegendMove = !1);
-  },
-  /**
-   * Show legend components by manipulating css
-   *
-   * @returns {undefined}
-   */
-  showLegend() {
-    this.resizeDOM && (this.resizeDOM.style.display = "block"), this.legendDOM && (this.legendDOM.style.display = "block"), this.legendNeedsUpdate && this.options.legend.virtualScroll && !this.useTable && (this.legendNeedsUpdate = !1, this.updateVisibleRowCount(), this.renderVisibleLegends());
-  },
-  /**
-   * Hide legend components by manipulating css
-   *
-   * @returns {undefined}
-   */
-  hideLegend() {
-    var t, s, h, i, r;
-    const e = this.options, o = (t = this.wrapperDOM) == null ? void 0 : t.style, l = (s = this.resizeDOM) == null ? void 0 : s.style, n = (h = this.legendDOM) == null ? void 0 : h.style, d = (i = e == null ? void 0 : e.title) != null && i.show ? (r = e == null ? void 0 : e.title) == null ? void 0 : r.height : 0;
-    !n || !o || (l && (l.display = "none"), n.display = "none", n.width = "0", n.height = "0", o.padding = `${d}px 0 0 0`);
-  },
-  /**
-   * Get formatted value by formatter function
-   * Only chartOption > legend > table > use : true
-   * @param formatter
-   * @param decimalPoint
-   * @param value
-   * @returns {string}
-   */
-  getFormattedValue({ formatter: e, decimalPoint: o }, l) {
-    if (l == null)
-      return "Null";
-    let n;
-    return e && (n = e(+l)), (!e || typeof n != "string") && (n = w.labelSignFormat(+l, o)), n;
-  }
-};
-export {
-  O as default
-};