mixdashboards 1.0.32 → 1.0.39

package/dist/install-hfre7yvV.js

@@ -0,0 +1,727 @@
+import { u as E } from "./installCanvasRenderer-CLT2hquJ.js";
+import { a as K, e as w, p as ue, n as pe, R as j, _ as H, f as ie, h as I, m as ge, j as F, k as he, l as ae, o as ve, M as de, q as fe, s as ye, t as me, C as xe, G as oe, u as Se, g as X, v as Ce, x as Y, y as be, Z as $, z as Ge, A as Q, B as M, c as _e, D as De, b as Ie, E as A, F as Pe, H as Le, I as Re, J as Ae, K as we, L as Oe, N as Te, O as ke, P as Be, r as ze, Q as We } from "./echarts-BVht3HHb.js";
+function Xe(n, r, e) {
+  var t = r.getBoxLayoutParams(), i = r.get("padding"), a = {
+    width: e.getWidth(),
+    height: e.getHeight()
+  }, o = K(t, a, i);
+  w(r.get("orient"), n, r.get("itemGap"), o.width, o.height), ue(n, t, a, i);
+}
+function Fe(n, r) {
+  var e = pe(r.get("padding")), t = r.getItemStyle(["color", "opacity"]);
+  return t.fill = r.get("backgroundColor"), n = new j({
+    shape: {
+      x: n.x - e[3],
+      y: n.y - e[0],
+      width: n.width + e[1] + e[3],
+      height: n.height + e[0] + e[2],
+      r: r.get("borderRadius")
+    },
+    style: t,
+    silent: !0,
+    z2: -1
+  }), n;
+}
+var He = function(n, r) {
+  if (r === "all")
+    return {
+      type: "all",
+      title: n.getLocaleModel().get(["legend", "selector", "all"])
+    };
+  if (r === "inverse")
+    return {
+      type: "inverse",
+      title: n.getLocaleModel().get(["legend", "selector", "inverse"])
+    };
+}, U = (
+  /** @class */
+  (function(n) {
+    H(r, n);
+    function r() {
+      var e = n !== null && n.apply(this, arguments) || this;
+      return e.type = r.type, e.layoutMode = {
+        type: "box",
+        // legend.width/height are maxWidth/maxHeight actually,
+        // whereas real width/height is calculated by its content.
+        // (Setting {left: 10, right: 10} does not make sense).
+        // So consider the case:
+        // `setOption({legend: {left: 10});`
+        // then `setOption({legend: {right: 10});`
+        // The previous `left` should be cleared by setting `ignoreSize`.
+        ignoreSize: !0
+      }, e;
+    }
+    return r.prototype.init = function(e, t, i) {
+      this.mergeDefaultAndTheme(e, i), e.selected = e.selected || {}, this._updateSelector(e);
+    }, r.prototype.mergeOption = function(e, t) {
+      n.prototype.mergeOption.call(this, e, t), this._updateSelector(e);
+    }, r.prototype._updateSelector = function(e) {
+      var t = e.selector, i = this.ecModel;
+      t === !0 && (t = e.selector = ["all", "inverse"]), ie(t) && I(t, function(a, o) {
+        F(a) && (a = {
+          type: a
+        }), t[o] = ge(a, He(i, a.type));
+      });
+    }, r.prototype.optionUpdated = function() {
+      this._updateData(this.ecModel);
+      var e = this._data;
+      if (e[0] && this.get("selectedMode") === "single") {
+        for (var t = !1, i = 0; i < e.length; i++) {
+          var a = e[i].get("name");
+          if (this.isSelected(a)) {
+            this.select(a), t = !0;
+            break;
+          }
+        }
+        !t && this.select(e[0].get("name"));
+      }
+    }, r.prototype._updateData = function(e) {
+      var t = [], i = [];
+      e.eachRawSeries(function(s) {
+        var l = s.name;
+        i.push(l);
+        var u;
+        if (s.legendVisualProvider) {
+          var d = s.legendVisualProvider, p = d.getAllNames();
+          e.isSeriesFiltered(s) || (i = i.concat(p)), p.length ? t = t.concat(p) : u = !0;
+        } else
+          u = !0;
+        u && he(s) && t.push(s.name);
+      }), this._availableNames = i;
+      var a = this.get("data") || t, o = ae(), v = ve(a, function(s) {
+        return (F(s) || fe(s)) && (s = {
+          name: s
+        }), o.get(s.name) ? null : (o.set(s.name, !0), new de(s, this, this.ecModel));
+      }, this);
+      this._data = ye(v, function(s) {
+        return !!s;
+      });
+    }, r.prototype.getData = function() {
+      return this._data;
+    }, r.prototype.select = function(e) {
+      var t = this.option.selected, i = this.get("selectedMode");
+      if (i === "single") {
+        var a = this._data;
+        I(a, function(o) {
+          t[o.get("name")] = !1;
+        });
+      }
+      t[e] = !0;
+    }, r.prototype.unSelect = function(e) {
+      this.get("selectedMode") !== "single" && (this.option.selected[e] = !1);
+    }, r.prototype.toggleSelected = function(e) {
+      var t = this.option.selected;
+      t.hasOwnProperty(e) || (t[e] = !0), this[t[e] ? "unSelect" : "select"](e);
+    }, r.prototype.allSelect = function() {
+      var e = this._data, t = this.option.selected;
+      I(e, function(i) {
+        t[i.get("name", !0)] = !0;
+      });
+    }, r.prototype.inverseSelect = function() {
+      var e = this._data, t = this.option.selected;
+      I(e, function(i) {
+        var a = i.get("name", !0);
+        t.hasOwnProperty(a) || (t[a] = !0), t[a] = !t[a];
+      });
+    }, r.prototype.isSelected = function(e) {
+      var t = this.option.selected;
+      return !(t.hasOwnProperty(e) && !t[e]) && me(this._availableNames, e) >= 0;
+    }, r.prototype.getOrient = function() {
+      return this.get("orient") === "vertical" ? {
+        index: 1,
+        name: "vertical"
+      } : {
+        index: 0,
+        name: "horizontal"
+      };
+    }, r.type = "legend.plain", r.dependencies = ["series"], r.defaultOption = {
+      // zlevel: 0,
+      z: 4,
+      show: !0,
+      orient: "horizontal",
+      left: "center",
+      // right: 'center',
+      top: 0,
+      // bottom: null,
+      align: "auto",
+      backgroundColor: "rgba(0,0,0,0)",
+      borderColor: "#ccc",
+      borderRadius: 0,
+      borderWidth: 0,
+      padding: 5,
+      itemGap: 10,
+      itemWidth: 25,
+      itemHeight: 14,
+      symbolRotate: "inherit",
+      symbolKeepAspect: !0,
+      inactiveColor: "#ccc",
+      inactiveBorderColor: "#ccc",
+      inactiveBorderWidth: "auto",
+      itemStyle: {
+        color: "inherit",
+        opacity: "inherit",
+        borderColor: "inherit",
+        borderWidth: "auto",
+        borderCap: "inherit",
+        borderJoin: "inherit",
+        borderDashOffset: "inherit",
+        borderMiterLimit: "inherit"
+      },
+      lineStyle: {
+        width: "auto",
+        color: "inherit",
+        inactiveColor: "#ccc",
+        inactiveWidth: 2,
+        opacity: "inherit",
+        type: "inherit",
+        cap: "inherit",
+        join: "inherit",
+        dashOffset: "inherit",
+        miterLimit: "inherit"
+      },
+      textStyle: {
+        color: "#333"
+      },
+      selectedMode: !0,
+      selector: !1,
+      selectorLabel: {
+        show: !0,
+        borderRadius: 10,
+        padding: [3, 5, 3, 5],
+        fontSize: 12,
+        fontFamily: "sans-serif",
+        color: "#666",
+        borderWidth: 1,
+        borderColor: "#666"
+      },
+      emphasis: {
+        selectorLabel: {
+          show: !0,
+          color: "#eee",
+          backgroundColor: "#666"
+        }
+      },
+      selectorPosition: "auto",
+      selectorItemGap: 7,
+      selectorButtonGap: 10,
+      tooltip: {
+        show: !1
+      }
+    }, r;
+  })(xe)
+), R = A, q = I, W = oe, le = (
+  /** @class */
+  (function(n) {
+    H(r, n);
+    function r() {
+      var e = n !== null && n.apply(this, arguments) || this;
+      return e.type = r.type, e.newlineDisabled = !1, e;
+    }
+    return r.prototype.init = function() {
+      this.group.add(this._contentGroup = new W()), this.group.add(this._selectorGroup = new W()), this._isFirstRender = !0;
+    }, r.prototype.getContentGroup = function() {
+      return this._contentGroup;
+    }, r.prototype.getSelectorGroup = function() {
+      return this._selectorGroup;
+    }, r.prototype.render = function(e, t, i) {
+      var a = this._isFirstRender;
+      if (this._isFirstRender = !1, this.resetInner(), !!e.get("show", !0)) {
+        var o = e.get("align"), v = e.get("orient");
+        (!o || o === "auto") && (o = e.get("left") === "right" && v === "vertical" ? "right" : "left");
+        var s = e.get("selector", !0), l = e.get("selectorPosition", !0);
+        s && (!l || l === "auto") && (l = v === "horizontal" ? "end" : "start"), this.renderInner(o, e, t, i, s, v, l);
+        var u = e.getBoxLayoutParams(), d = {
+          width: i.getWidth(),
+          height: i.getHeight()
+        }, p = e.get("padding"), g = K(u, d, p), h = this.layoutInner(e, o, g, a, s, l), c = K(Se({
+          width: h.width,
+          height: h.height
+        }, u), d, p);
+        this.group.x = c.x - h.x, this.group.y = c.y - h.y, this.group.markRedraw(), this.group.add(this._backgroundEl = Fe(h, e));
+      }
+    }, r.prototype.resetInner = function() {
+      this.getContentGroup().removeAll(), this._backgroundEl && this.group.remove(this._backgroundEl), this.getSelectorGroup().removeAll();
+    }, r.prototype.renderInner = function(e, t, i, a, o, v, s) {
+      var l = this.getContentGroup(), u = ae(), d = t.get("selectedMode"), p = [];
+      i.eachRawSeries(function(g) {
+        !g.get("legendHoverLink") && p.push(g.id);
+      }), q(t.getData(), function(g, h) {
+        var c = g.get("name");
+        if (!this.newlineDisabled && (c === "" || c === `
+`)) {
+          var m = new W();
+          m.newline = !0, l.add(m);
+          return;
+        }
+        var f = i.getSeriesByName(c)[0];
+        if (!u.get(c)) {
+          if (f) {
+            var y = f.getData(), x = y.getVisual("legendLineStyle") || {}, _ = y.getVisual("legendIcon"), S = y.getVisual("style"), b = this._createItem(f, c, h, g, t, e, x, S, _, d, a);
+            b.on("click", R(ee, c, null, a, p)).on("mouseover", R(J, f.name, null, a, p)).on("mouseout", R(Z, f.name, null, a, p)), i.ssr && b.eachChild(function(C) {
+              var G = X(C);
+              G.seriesIndex = f.seriesIndex, G.dataIndex = h, G.ssrType = "legend";
+            }), u.set(c, !0);
+          } else
+            i.eachRawSeries(function(C) {
+              if (!u.get(c) && C.legendVisualProvider) {
+                var G = C.legendVisualProvider;
+                if (!G.containName(c))
+                  return;
+                var B = G.indexOfName(c), D = G.getItemVisual(B, "style"), O = G.getItemVisual(B, "legendIcon"), P = Ce(D.fill);
+                P && P[3] === 0 && (P[3] = 0.2, D = Y(Y({}, D), {
+                  fill: be(P, "rgba")
+                }));
+                var L = this._createItem(C, c, h, g, t, e, {}, D, O, d, a);
+                L.on("click", R(ee, null, c, a, p)).on("mouseover", R(J, null, c, a, p)).on("mouseout", R(Z, null, c, a, p)), i.ssr && L.eachChild(function(z) {
+                  var T = X(z);
+                  T.seriesIndex = C.seriesIndex, T.dataIndex = h, T.ssrType = "legend";
+                }), u.set(c, !0);
+              }
+            }, this);
+          process.env.NODE_ENV !== "production" && (u.get(c) || console.warn(c + " series not exists. Legend data should be same with series name or data name."));
+        }
+      }, this), o && this._createSelector(o, t, a, v, s);
+    }, r.prototype._createSelector = function(e, t, i, a, o) {
+      var v = this.getSelectorGroup();
+      q(e, function(l) {
+        var u = l.type, d = new $({
+          style: {
+            x: 0,
+            y: 0,
+            align: "center",
+            verticalAlign: "middle"
+          },
+          onclick: function() {
+            i.dispatchAction({
+              type: u === "all" ? "legendAllSelect" : "legendInverseSelect",
+              legendId: t.id
+            });
+          }
+        });
+        v.add(d);
+        var p = t.getModel("selectorLabel"), g = t.getModel(["emphasis", "selectorLabel"]);
+        Ge(d, {
+          normal: p,
+          emphasis: g
+        }, {
+          defaultText: l.title
+        }), Q(d);
+      });
+    }, r.prototype._createItem = function(e, t, i, a, o, v, s, l, u, d, p) {
+      var g = e.visualDrawType, h = o.get("itemWidth"), c = o.get("itemHeight"), m = o.isSelected(t), f = a.get("symbolRotate"), y = a.get("symbolKeepAspect"), x = a.get("icon");
+      u = x || u || "roundRect";
+      var _ = Ne(u, a, s, l, g, m, p), S = new W(), b = a.getModel("textStyle");
+      if (M(e.getLegendIcon) && (!x || x === "inherit"))
+        S.add(e.getLegendIcon({
+          itemWidth: h,
+          itemHeight: c,
+          icon: u,
+          iconRotate: f,
+          itemStyle: _.itemStyle,
+          lineStyle: _.lineStyle,
+          symbolKeepAspect: y
+        }));
+      else {
+        var C = x === "inherit" && e.getData().getVisual("symbol") ? f === "inherit" ? e.getData().getVisual("symbolRotate") : f : 0;
+        S.add(Ve({
+          itemWidth: h,
+          itemHeight: c,
+          icon: u,
+          iconRotate: C,
+          itemStyle: _.itemStyle,
+          symbolKeepAspect: y
+        }));
+      }
+      var G = v === "left" ? h + 5 : -5, B = v, D = o.get("formatter"), O = t;
+      F(D) && D ? O = D.replace("{name}", t != null ? t : "") : M(D) && (O = D(t));
+      var P = m ? b.getTextColor() : a.get("inactiveColor");
+      S.add(new $({
+        style: _e(b, {
+          text: O,
+          x: G,
+          y: c / 2,
+          fill: P,
+          align: B,
+          verticalAlign: "middle"
+        }, {
+          inheritColor: P
+        })
+      }));
+      var L = new j({
+        shape: S.getBoundingRect(),
+        style: {
+          // Cannot use 'invisible' because SVG SSR will miss the node
+          fill: "transparent"
+        }
+      }), z = a.getModel("tooltip");
+      return z.get("show") && De({
+        el: L,
+        componentModel: o,
+        itemName: t,
+        itemTooltipOption: z.option
+      }), S.add(L), S.eachChild(function(T) {
+        T.silent = !0;
+      }), L.silent = !d, this.getContentGroup().add(S), Q(S), S.__legendDataIndex = i, S;
+    }, r.prototype.layoutInner = function(e, t, i, a, o, v) {
+      var s = this.getContentGroup(), l = this.getSelectorGroup();
+      w(e.get("orient"), s, e.get("itemGap"), i.width, i.height);
+      var u = s.getBoundingRect(), d = [-u.x, -u.y];
+      if (l.markRedraw(), s.markRedraw(), o) {
+        w(
+          // Buttons in selectorGroup always layout horizontally
+          "horizontal",
+          l,
+          e.get("selectorItemGap", !0)
+        );
+        var p = l.getBoundingRect(), g = [-p.x, -p.y], h = e.get("selectorButtonGap", !0), c = e.getOrient().index, m = c === 0 ? "width" : "height", f = c === 0 ? "height" : "width", y = c === 0 ? "y" : "x";
+        v === "end" ? g[c] += u[m] + h : d[c] += p[m] + h, g[1 - c] += u[f] / 2 - p[f] / 2, l.x = g[0], l.y = g[1], s.x = d[0], s.y = d[1];
+        var x = {
+          x: 0,
+          y: 0
+        };
+        return x[m] = u[m] + h + p[m], x[f] = Math.max(u[f], p[f]), x[y] = Math.min(0, p[y] + g[1 - c]), x;
+      } else
+        return s.x = d[0], s.y = d[1], this.group.getBoundingRect();
+    }, r.prototype.remove = function() {
+      this.getContentGroup().removeAll(), this._isFirstRender = !0;
+    }, r.type = "legend.plain", r;
+  })(Ie)
+);
+function Ne(n, r, e, t, i, a, o) {
+  function v(m, f) {
+    m.lineWidth === "auto" && (m.lineWidth = f.lineWidth > 0 ? 2 : 0), q(m, function(y, x) {
+      m[x] === "inherit" && (m[x] = f[x]);
+    });
+  }
+  var s = r.getModel("itemStyle"), l = s.getItemStyle(), u = n.lastIndexOf("empty", 0) === 0 ? "fill" : "stroke", d = s.getShallow("decal");
+  l.decal = !d || d === "inherit" ? t.decal : Pe(d, o), l.fill === "inherit" && (l.fill = t[i]), l.stroke === "inherit" && (l.stroke = t[u]), l.opacity === "inherit" && (l.opacity = (i === "fill" ? t : e).opacity), v(l, t);
+  var p = r.getModel("lineStyle"), g = p.getLineStyle();
+  if (v(g, e), l.fill === "auto" && (l.fill = t.fill), l.stroke === "auto" && (l.stroke = t.fill), g.stroke === "auto" && (g.stroke = t.fill), !a) {
+    var h = r.get("inactiveBorderWidth"), c = l[u];
+    l.lineWidth = h === "auto" ? t.lineWidth > 0 && c ? 2 : 0 : l.lineWidth, l.fill = r.get("inactiveColor"), l.stroke = r.get("inactiveBorderColor"), g.stroke = p.get("inactiveColor"), g.lineWidth = p.get("inactiveWidth");
+  }
+  return {
+    itemStyle: l,
+    lineStyle: g
+  };
+}
+function Ve(n) {
+  var r = n.icon || "roundRect", e = Le(r, 0, 0, n.itemWidth, n.itemHeight, n.itemStyle.fill, n.symbolKeepAspect);
+  return e.setStyle(n.itemStyle), e.rotation = (n.iconRotate || 0) * Math.PI / 180, e.setOrigin([n.itemWidth / 2, n.itemHeight / 2]), r.indexOf("empty") > -1 && (e.style.stroke = e.style.fill, e.style.fill = "#fff", e.style.lineWidth = 2), e;
+}
+function ee(n, r, e, t) {
+  Z(n, r, e, t), e.dispatchAction({
+    type: "legendToggleSelect",
+    name: n != null ? n : r
+  }), J(n, r, e, t);
+}
+function se(n) {
+  for (var r = n.getZr().storage.getDisplayList(), e, t = 0, i = r.length; t < i && !(e = r[t].states.emphasis); )
+    t++;
+  return e && e.hoverLayer;
+}
+function J(n, r, e, t) {
+  se(e) || e.dispatchAction({
+    type: "highlight",
+    seriesName: n,
+    name: r,
+    excludeSeriesId: t
+  });
+}
+function Z(n, r, e, t) {
+  se(e) || e.dispatchAction({
+    type: "downplay",
+    seriesName: n,
+    name: r,
+    excludeSeriesId: t
+  });
+}
+function Ee(n) {
+  var r = n.findComponents({
+    mainType: "legend"
+  });
+  r && r.length && n.filterSeries(function(e) {
+    for (var t = 0; t < r.length; t++)
+      if (!r[t].isSelected(e.name))
+        return !1;
+    return !0;
+  });
+}
+function k(n, r, e) {
+  var t = n === "allSelect" || n === "inverseSelect", i = {}, a = [];
+  e.eachComponent({
+    mainType: "legend",
+    query: r
+  }, function(v) {
+    t ? v[n]() : v[n](r.name), te(v, i), a.push(v.componentIndex);
+  });
+  var o = {};
+  return e.eachComponent("legend", function(v) {
+    I(i, function(s, l) {
+      v[s ? "select" : "unSelect"](l);
+    }), te(v, o);
+  }), t ? {
+    selected: o,
+    // return legendIndex array to tell the developers which legends are allSelect / inverseSelect
+    legendIndex: a
+  } : {
+    name: r.name,
+    selected: o
+  };
+}
+function te(n, r) {
+  var e = r || {};
+  return I(n.getData(), function(t) {
+    var i = t.get("name");
+    if (!(i === `
+` || i === "")) {
+      var a = n.isSelected(i);
+      Re(e, i) ? e[i] = e[i] && a : e[i] = a;
+    }
+  }), e;
+}
+function Ke(n) {
+  n.registerAction("legendToggleSelect", "legendselectchanged", A(k, "toggleSelected")), n.registerAction("legendAllSelect", "legendselectall", A(k, "allSelect")), n.registerAction("legendInverseSelect", "legendinverseselect", A(k, "inverseSelect")), n.registerAction("legendSelect", "legendselected", A(k, "select")), n.registerAction("legendUnSelect", "legendunselected", A(k, "unSelect"));
+}
+function ce(n) {
+  n.registerComponentModel(U), n.registerComponentView(le), n.registerProcessor(n.PRIORITY.PROCESSOR.SERIES_FILTER, Ee), n.registerSubTypeDefaulter("legend", function() {
+    return "plain";
+  }), Ke(n);
+}
+var $e = (
+  /** @class */
+  (function(n) {
+    H(r, n);
+    function r() {
+      var e = n !== null && n.apply(this, arguments) || this;
+      return e.type = r.type, e;
+    }
+    return r.prototype.setScrollDataIndex = function(e) {
+      this.option.scrollDataIndex = e;
+    }, r.prototype.init = function(e, t, i) {
+      var a = Ae(e);
+      n.prototype.init.call(this, e, t, i), re(this, e, a);
+    }, r.prototype.mergeOption = function(e, t) {
+      n.prototype.mergeOption.call(this, e, t), re(this, this.option, e);
+    }, r.type = "legend.scroll", r.defaultOption = we(U.defaultOption, {
+      scrollDataIndex: 0,
+      pageButtonItemGap: 5,
+      pageButtonGap: null,
+      pageButtonPosition: "end",
+      pageFormatter: "{current}/{total}",
+      pageIcons: {
+        horizontal: ["M0,0L12,-10L12,10z", "M0,0L-12,-10L-12,10z"],
+        vertical: ["M0,0L20,0L10,-20z", "M0,0L20,0L10,20z"]
+      },
+      pageIconColor: "#2f4554",
+      pageIconInactiveColor: "#aaa",
+      pageIconSize: 15,
+      pageTextStyle: {
+        color: "#333"
+      },
+      animationDurationUpdate: 800
+    }), r;
+  })(U)
+);
+function re(n, r, e) {
+  var t = n.getOrient(), i = [1, 1];
+  i[t.index] = 0, Oe(r, e, {
+    type: "box",
+    ignoreSize: !!i
+  });
+}
+var ne = oe, N = ["width", "height"], V = ["x", "y"], Ue = (
+  /** @class */
+  (function(n) {
+    H(r, n);
+    function r() {
+      var e = n !== null && n.apply(this, arguments) || this;
+      return e.type = r.type, e.newlineDisabled = !0, e._currentIndex = 0, e;
+    }
+    return r.prototype.init = function() {
+      n.prototype.init.call(this), this.group.add(this._containerGroup = new ne()), this._containerGroup.add(this.getContentGroup()), this.group.add(this._controllerGroup = new ne());
+    }, r.prototype.resetInner = function() {
+      n.prototype.resetInner.call(this), this._controllerGroup.removeAll(), this._containerGroup.removeClipPath(), this._containerGroup.__rectSize = null;
+    }, r.prototype.renderInner = function(e, t, i, a, o, v, s) {
+      var l = this;
+      n.prototype.renderInner.call(this, e, t, i, a, o, v, s);
+      var u = this._controllerGroup, d = t.get("pageIconSize", !0), p = ie(d) ? d : [d, d];
+      h("pagePrev", 0);
+      var g = t.getModel("pageTextStyle");
+      u.add(new $({
+        name: "pageText",
+        style: {
+          // Placeholder to calculate a proper layout.
+          text: "xx/xx",
+          fill: g.getTextColor(),
+          font: g.getFont(),
+          verticalAlign: "middle",
+          align: "center"
+        },
+        silent: !0
+      })), h("pageNext", 1);
+      function h(c, m) {
+        var f = c + "DataIndex", y = Te(t.get("pageIcons", !0)[t.getOrient().name][m], {
+          // Buttons will be created in each render, so we do not need
+          // to worry about avoiding using legendModel kept in scope.
+          onclick: ke(l._pageGo, l, f, t, a)
+        }, {
+          x: -p[0] / 2,
+          y: -p[1] / 2,
+          width: p[0],
+          height: p[1]
+        });
+        y.name = c, u.add(y);
+      }
+    }, r.prototype.layoutInner = function(e, t, i, a, o, v) {
+      var s = this.getSelectorGroup(), l = e.getOrient().index, u = N[l], d = V[l], p = N[1 - l], g = V[1 - l];
+      o && w(
+        // Buttons in selectorGroup always layout horizontally
+        "horizontal",
+        s,
+        e.get("selectorItemGap", !0)
+      );
+      var h = e.get("selectorButtonGap", !0), c = s.getBoundingRect(), m = [-c.x, -c.y], f = Be(i);
+      o && (f[u] = i[u] - c[u] - h);
+      var y = this._layoutContentAndController(e, a, f, l, u, p, g, d);
+      if (o) {
+        if (v === "end")
+          m[l] += y[u] + h;
+        else {
+          var x = c[u] + h;
+          m[l] -= x, y[d] -= x;
+        }
+        y[u] += c[u] + h, m[1 - l] += y[g] + y[p] / 2 - c[p] / 2, y[p] = Math.max(y[p], c[p]), y[g] = Math.min(y[g], c[g] + m[1 - l]), s.x = m[0], s.y = m[1], s.markRedraw();
+      }
+      return y;
+    }, r.prototype._layoutContentAndController = function(e, t, i, a, o, v, s, l) {
+      var u = this.getContentGroup(), d = this._containerGroup, p = this._controllerGroup;
+      w(e.get("orient"), u, e.get("itemGap"), a ? i.width : null, a ? null : i.height), w(
+        // Buttons in controller are layout always horizontally.
+        "horizontal",
+        p,
+        e.get("pageButtonItemGap", !0)
+      );
+      var g = u.getBoundingRect(), h = p.getBoundingRect(), c = this._showController = g[o] > i[o], m = [-g.x, -g.y];
+      t || (m[a] = u[l]);
+      var f = [0, 0], y = [-h.x, -h.y], x = ze(e.get("pageButtonGap", !0), e.get("itemGap", !0));
+      if (c) {
+        var _ = e.get("pageButtonPosition", !0);
+        _ === "end" ? y[a] += i[o] - h[o] : f[a] += h[o] + x;
+      }
+      y[1 - a] += g[v] / 2 - h[v] / 2, u.setPosition(m), d.setPosition(f), p.setPosition(y);
+      var S = {
+        x: 0,
+        y: 0
+      };
+      if (S[o] = c ? i[o] : g[o], S[v] = Math.max(g[v], h[v]), S[s] = Math.min(0, h[s] + y[1 - a]), d.__rectSize = i[o], c) {
+        var b = {
+          x: 0,
+          y: 0
+        };
+        b[o] = Math.max(i[o] - h[o] - x, 0), b[v] = S[v], d.setClipPath(new j({
+          shape: b
+        })), d.__rectSize = b[o];
+      } else
+        p.eachChild(function(G) {
+          G.attr({
+            invisible: !0,
+            silent: !0
+          });
+        });
+      var C = this._getPageInfo(e);
+      return C.pageIndex != null && We(
+        u,
+        {
+          x: C.contentPosition[0],
+          y: C.contentPosition[1]
+        },
+        // When switch from "show controller" to "not show controller", view should be
+        // updated immediately without animation, otherwise causes weird effect.
+        c ? e : null
+      ), this._updatePageInfoView(e, C), S;
+    }, r.prototype._pageGo = function(e, t, i) {
+      var a = this._getPageInfo(t)[e];
+      a != null && i.dispatchAction({
+        type: "legendScroll",
+        scrollDataIndex: a,
+        legendId: t.id
+      });
+    }, r.prototype._updatePageInfoView = function(e, t) {
+      var i = this._controllerGroup;
+      I(["pagePrev", "pageNext"], function(u) {
+        var d = u + "DataIndex", p = t[d] != null, g = i.childOfName(u);
+        g && (g.setStyle("fill", p ? e.get("pageIconColor", !0) : e.get("pageIconInactiveColor", !0)), g.cursor = p ? "pointer" : "default");
+      });
+      var a = i.childOfName("pageText"), o = e.get("pageFormatter"), v = t.pageIndex, s = v != null ? v + 1 : 0, l = t.pageCount;
+      a && o && a.setStyle("text", F(o) ? o.replace("{current}", s == null ? "" : s + "").replace("{total}", l == null ? "" : l + "") : o({
+        current: s,
+        total: l
+      }));
+    }, r.prototype._getPageInfo = function(e) {
+      var t = e.get("scrollDataIndex", !0), i = this.getContentGroup(), a = this._containerGroup.__rectSize, o = e.getOrient().index, v = N[o], s = V[o], l = this._findTargetItemIndex(t), u = i.children(), d = u[l], p = u.length, g = p ? 1 : 0, h = {
+        contentPosition: [i.x, i.y],
+        pageCount: g,
+        pageIndex: g - 1,
+        pagePrevDataIndex: null,
+        pageNextDataIndex: null
+      };
+      if (!d)
+        return h;
+      var c = _(d);
+      h.contentPosition[o] = -c.s;
+      for (var m = l + 1, f = c, y = c, x = null; m <= p; ++m)
+        x = _(u[m]), // Half of the last item is out of the window.
+        (!x && y.e > f.s + a || x && !S(x, f.s)) && (y.i > f.i ? f = y : f = x, f && (h.pageNextDataIndex == null && (h.pageNextDataIndex = f.i), ++h.pageCount)), y = x;
+      for (var m = l - 1, f = c, y = c, x = null; m >= -1; --m)
+        x = _(u[m]), // If the the end item does not intersect with the window started
+        // from the current item, a page can be settled.
+        (!x || !S(y, x.s)) && f.i < y.i && (y = f, h.pagePrevDataIndex == null && (h.pagePrevDataIndex = f.i), ++h.pageCount, ++h.pageIndex), f = x;
+      return h;
+      function _(b) {
+        if (b) {
+          var C = b.getBoundingRect(), G = C[s] + b[s];
+          return {
+            s: G,
+            e: G + C[v],
+            i: b.__legendDataIndex
+          };
+        }
+      }
+      function S(b, C) {
+        return b.e >= C && b.s <= C + a;
+      }
+    }, r.prototype._findTargetItemIndex = function(e) {
+      if (!this._showController)
+        return 0;
+      var t, i = this.getContentGroup(), a;
+      return i.eachChild(function(o, v) {
+        var s = o.__legendDataIndex;
+        a == null && s != null && (a = v), s === e && (t = v);
+      }), t != null ? t : a;
+    }, r.type = "legend.scroll", r;
+  })(le)
+);
+function qe(n) {
+  n.registerAction("legendScroll", "legendscroll", function(r, e) {
+    var t = r.scrollDataIndex;
+    t != null && e.eachComponent({
+      mainType: "legend",
+      subType: "scroll",
+      query: r
+    }, function(i) {
+      i.setScrollDataIndex(t);
+    });
+  });
+}
+function Je(n) {
+  E(ce), n.registerComponentModel($e), n.registerComponentView(Ue), qe(n);
+}
+function Ye(n) {
+  E(ce), E(Je);
+}
+export {
+  Ye as i,
+  Xe as l,
+  Fe as m
+};