@visactor/vchart 1.6.0 → 1.6.1

package/build/index.js

@@ -7674,9 +7674,6 @@
       return encoder.scale && (dependencies = isGrammar(encoder.scale) ? [encoder.scale] : array(view.getScaleById(encoder.scale))), dependencies.concat(parseFunctionType(encoder, view));
     }
 
-    function parseXY(val) {
-      return null === val ? 0 : val;
-    }
     function isValidPointsChannel(channels, markType) {
       switch (markType) {
         case "line":
@@ -7710,8 +7707,8 @@
       return items.some(item => isValidPointsChannel(Object.keys(item.nextAttrs), "line")) ? items.map((item, index) => {
         var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
         const attrs = item.nextAttrs,
-          x = parseXY(null !== (_a = attrs.x) && void 0 !== _a ? _a : null === (_b = null == lastPoints ? void 0 : lastPoints[index]) || void 0 === _b ? void 0 : _b.x),
-          y = parseXY(null !== (_c = attrs.y) && void 0 !== _c ? _c : null === (_d = null == lastPoints ? void 0 : lastPoints[index]) || void 0 === _d ? void 0 : _d.y),
+          x = null !== (_a = attrs.x) && void 0 !== _a ? _a : null === (_b = null == lastPoints ? void 0 : lastPoints[index]) || void 0 === _b ? void 0 : _b.x,
+          y = null !== (_c = attrs.y) && void 0 !== _c ? _c : null === (_d = null == lastPoints ? void 0 : lastPoints[index]) || void 0 === _d ? void 0 : _d.y,
           defined = null !== (_e = attrs.defined) && void 0 !== _e ? _e : null === (_f = null == lastPoints ? void 0 : lastPoints[index]) || void 0 === _f ? void 0 : _f.defined,
           point = {
             x: x,
@@ -7719,8 +7716,8 @@
             context: item.key
           };
         if (isArea) {
-          const x1 = parseXY(null !== (_g = attrs.x1) && void 0 !== _g ? _g : null === (_h = null == lastPoints ? void 0 : lastPoints[index]) || void 0 === _h ? void 0 : _h.x1),
-            y1 = parseXY(null !== (_j = attrs.y1) && void 0 !== _j ? _j : null === (_k = null == lastPoints ? void 0 : lastPoints[index]) || void 0 === _k ? void 0 : _k.y1);
+          const x1 = null !== (_g = attrs.x1) && void 0 !== _g ? _g : null === (_h = null == lastPoints ? void 0 : lastPoints[index]) || void 0 === _h ? void 0 : _h.x1,
+            y1 = null !== (_j = attrs.y1) && void 0 !== _j ? _j : null === (_k = null == lastPoints ? void 0 : lastPoints[index]) || void 0 === _k ? void 0 : _k.y1;
           point.x1 = x1, point.y1 = y1;
         }
         return !1 === defined && (point.defined = !1), point;
@@ -7732,10 +7729,10 @@
       return items.forEach((item, index) => {
         var _a, _b, _c, _d;
         const attrs = item.nextAttrs,
-          x = parseXY(null !== (_a = attrs.x) && void 0 !== _a ? _a : null == lastPoints ? void 0 : lastPoints[4 * index]),
-          y = parseXY(null !== (_b = attrs.y) && void 0 !== _b ? _b : null == lastPoints ? void 0 : lastPoints[4 * index + 1]),
-          width = parseXY(null !== (_c = attrs.width) && void 0 !== _c ? _c : null == lastPoints ? void 0 : lastPoints[4 * index + 2]),
-          y1 = parseXY(null !== (_d = attrs.y1) && void 0 !== _d ? _d : null == lastPoints ? void 0 : lastPoints[4 * index + 3]);
+          x = null !== (_a = attrs.x) && void 0 !== _a ? _a : null == lastPoints ? void 0 : lastPoints[4 * index],
+          y = null !== (_b = attrs.y) && void 0 !== _b ? _b : null == lastPoints ? void 0 : lastPoints[4 * index + 1],
+          width = null !== (_c = attrs.width) && void 0 !== _c ? _c : null == lastPoints ? void 0 : lastPoints[4 * index + 2],
+          y1 = null !== (_d = attrs.y1) && void 0 !== _d ? _d : null == lastPoints ? void 0 : lastPoints[4 * index + 3];
         arr[4 * index] = x, arr[4 * index + 1] = y, arr[4 * index + 2] = width, arr[4 * index + 3] = y1 - y;
       }), arr;
     }
@@ -7745,191 +7742,11 @@
       return items.forEach((item, index) => {
         var _a, _b;
         const attrs = item.nextAttrs,
-          x = parseXY(null !== (_a = attrs.x) && void 0 !== _a ? _a : null == lastPoints ? void 0 : lastPoints[2 * index]),
-          y = parseXY(null !== (_b = attrs.y) && void 0 !== _b ? _b : null == lastPoints ? void 0 : lastPoints[2 * index + 1]);
+          x = null !== (_a = attrs.x) && void 0 !== _a ? _a : null == lastPoints ? void 0 : lastPoints[2 * index],
+          y = null !== (_b = attrs.y) && void 0 !== _b ? _b : null == lastPoints ? void 0 : lastPoints[2 * index + 1];
         arr[2 * index] = x, arr[2 * index + 1] = y;
       }), arr;
     }
-
-    const commonAttributes = ["fillOpacity", "x", "y", "dx", "dy"];
-    const transformCommonAttribute = (graphicAttributes, changedKey, nextAttrs) => {
-      var _a;
-      return "fillOpacity" === changedKey ? (graphicAttributes.fillOpacity = null !== (_a = nextAttrs.fillOpacity) && void 0 !== _a ? _a : 1, ["fillOpacity"]) : "x" === changedKey ? (graphicAttributes.x = parseXY(nextAttrs.x), ["x"]) : "y" === changedKey ? (graphicAttributes.y = parseXY(nextAttrs.y), ["y"]) : "dx" === changedKey ? (graphicAttributes.dx = parseXY(nextAttrs.dx), ["dx"]) : "dy" === changedKey ? (graphicAttributes.dy = parseXY(nextAttrs.dy), ["dy"]) : [];
-    };
-
-    function isPointsMarkType(markType) {
-      return [GrammarMarkType.line, GrammarMarkType.area, GrammarMarkType.largeRects, GrammarMarkType.largeSymbols].includes(markType);
-    }
-    function storeOriginAttributes(name, channels, graphicAttributes, nextAttrs, element, markName) {
-      var _a;
-      const prevStoredAttrs = null !== (_a = element.getGraphicAttribute(name, !1, markName)) && void 0 !== _a ? _a : {},
-        storedAttrs = {};
-      return channels.forEach(channel => {
-        var _a;
-        storedAttrs[channel] = null !== (_a = nextAttrs[channel]) && void 0 !== _a ? _a : prevStoredAttrs[channel];
-      }), graphicAttributes[name] = storedAttrs, storedAttrs;
-    }
-    const transformsByType = {
-      [GrammarMarkType.largeRects]: [{
-        channels: ["x", "y", "y1", "x1", "width", "height"],
-        transform: (graphicAttributes, nextAttrs, storedAttrs) => {
-          graphicAttributes.x = 0, graphicAttributes.y = 0;
-        }
-      }],
-      [GrammarMarkType.largeSymbols]: [{
-        channels: ["x", "y", "size"],
-        transform: (graphicAttributes, nextAttrs, storedAttrs) => {
-          graphicAttributes.x = 0, graphicAttributes.y = 0;
-        }
-      }],
-      [GrammarMarkType.area]: [{
-        channels: ["x", "y", "x1", "y1"],
-        transform: (graphicAttributes, nextAttrs, storedAttrs) => {
-          graphicAttributes.x = 0, graphicAttributes.y = 0, graphicAttributes.x1 = 0, graphicAttributes.y1 = 0;
-        }
-      }],
-      [GrammarMarkType.line]: [{
-        channels: ["x", "y", "defined", "enableSegments"],
-        transform: (graphicAttributes, nextAttrs, storedAttrs) => {
-          graphicAttributes.x = 0, graphicAttributes.y = 0;
-        }
-      }],
-      [GrammarMarkType.rect]: [{
-        channels: ["x", "y", "x1", "y1", "width", "height"],
-        transform: (graphicAttributes, nextAttrs, storedAttrs) => {
-          var _a, _b, _c, _d, _e, _f, _g, _h;
-          isValidNumber$1(nextAttrs.width) || !isValidNumber$1(nextAttrs.x1) && isValidNumber$1(storedAttrs.width) ? (graphicAttributes.x = Math.min(null !== (_a = storedAttrs.x) && void 0 !== _a ? _a : 0, null !== (_b = storedAttrs.x1) && void 0 !== _b ? _b : 1 / 0), graphicAttributes.width = storedAttrs.width) : isValidNumber$1(nextAttrs.x1) || !isValidNumber$1(nextAttrs.width) && isValidNumber$1(storedAttrs.x1) ? (graphicAttributes.x = Math.min(storedAttrs.x, storedAttrs.x1), graphicAttributes.width = Math.abs(storedAttrs.x1 - storedAttrs.x)) : (graphicAttributes.x = Math.min(null !== (_c = storedAttrs.x) && void 0 !== _c ? _c : 0, null !== (_d = storedAttrs.x1) && void 0 !== _d ? _d : 1 / 0), graphicAttributes.width = storedAttrs.width), isValidNumber$1(nextAttrs.height) || !isValidNumber$1(nextAttrs.y1) && isValidNumber$1(storedAttrs.height) ? (graphicAttributes.y = Math.min(null !== (_e = storedAttrs.y) && void 0 !== _e ? _e : 0, null !== (_f = storedAttrs.y1) && void 0 !== _f ? _f : 1 / 0), graphicAttributes.height = storedAttrs.height) : isValidNumber$1(nextAttrs.y1) || !isValidNumber$1(nextAttrs.height) && isValidNumber$1(storedAttrs.y1) ? (graphicAttributes.y = Math.min(storedAttrs.y, storedAttrs.y1), graphicAttributes.height = Math.abs(storedAttrs.y1 - storedAttrs.y)) : (graphicAttributes.y = Math.min(null !== (_g = storedAttrs.y) && void 0 !== _g ? _g : 0, null !== (_h = storedAttrs.y1) && void 0 !== _h ? _h : 1 / 0), graphicAttributes.height = storedAttrs.height);
-        },
-        storedAttrs: "sizeAttrs"
-      }],
-      rect3d: [{
-        channels: ["x", "y", "z", "x1", "y1", "width", "height", "length"],
-        transform: (graphicAttributes, nextAttrs, storedAttrs) => {
-          var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
-          isValidNumber$1(nextAttrs.width) || !isValidNumber$1(nextAttrs.x1) && isValidNumber$1(storedAttrs.width) ? (graphicAttributes.x = Math.min(null !== (_a = storedAttrs.x) && void 0 !== _a ? _a : 0, null !== (_b = storedAttrs.x1) && void 0 !== _b ? _b : 1 / 0), graphicAttributes.width = storedAttrs.width) : isValidNumber$1(nextAttrs.x1) || !isValidNumber$1(nextAttrs.width) && isValidNumber$1(storedAttrs.x1) ? (graphicAttributes.x = Math.min(storedAttrs.x, storedAttrs.x1), graphicAttributes.width = Math.abs(storedAttrs.x1 - storedAttrs.x)) : (graphicAttributes.x = Math.min(null !== (_c = storedAttrs.x) && void 0 !== _c ? _c : 0, null !== (_d = storedAttrs.x1) && void 0 !== _d ? _d : 1 / 0), graphicAttributes.width = storedAttrs.width), isValidNumber$1(nextAttrs.height) || !isValidNumber$1(nextAttrs.y1) && isValidNumber$1(storedAttrs.height) ? (graphicAttributes.y = Math.min(null !== (_e = storedAttrs.y) && void 0 !== _e ? _e : 0, null !== (_f = storedAttrs.y1) && void 0 !== _f ? _f : 1 / 0), graphicAttributes.height = storedAttrs.height) : isValidNumber$1(nextAttrs.y1) || !isValidNumber$1(nextAttrs.height) && isValidNumber$1(storedAttrs.y1) ? (graphicAttributes.y = Math.min(storedAttrs.y, storedAttrs.y1), graphicAttributes.height = Math.abs(storedAttrs.y1 - storedAttrs.y)) : (graphicAttributes.y = Math.min(null !== (_g = storedAttrs.y) && void 0 !== _g ? _g : 0, null !== (_h = storedAttrs.y1) && void 0 !== _h ? _h : 1 / 0), graphicAttributes.height = storedAttrs.height), isValidNumber$1(nextAttrs.length) || !isValidNumber$1(nextAttrs.z1) && isValidNumber$1(storedAttrs.length) ? (graphicAttributes.z = Math.min(null !== (_j = storedAttrs.z) && void 0 !== _j ? _j : 0, null !== (_k = storedAttrs.z1) && void 0 !== _k ? _k : 1 / 0), graphicAttributes.length = storedAttrs.length) : isValidNumber$1(nextAttrs.z1) || !isValidNumber$1(nextAttrs.length) && isValidNumber$1(storedAttrs.z1) ? (graphicAttributes.z = Math.min(storedAttrs.z, storedAttrs.z1), graphicAttributes.length = Math.abs(storedAttrs.z1 - storedAttrs.z)) : (graphicAttributes.z = Math.min(null !== (_l = storedAttrs.z) && void 0 !== _l ? _l : 0, null !== (_m = storedAttrs.z1) && void 0 !== _m ? _m : 1 / 0), graphicAttributes.length = storedAttrs.length);
-        },
-        storedAttrs: "sizeAttrs"
-      }],
-      [GrammarMarkType.text]: [{
-        channels: ["text", "limit", "autoLimit", "maxLineWidth"],
-        transform: (graphicAttributes, nextAttrs, storedAttrs) => {
-          var _a, _b, _c, _d;
-          const limit = null !== (_a = storedAttrs.limit) && void 0 !== _a ? _a : 1 / 0,
-            autoLimit = null !== (_b = storedAttrs.autoLimit) && void 0 !== _b ? _b : 1 / 0,
-            maxWidth = Math.min(limit, autoLimit),
-            isTextConfig = isPlainObject$1(storedAttrs.text) && !isNil$1(storedAttrs.text.text),
-            text = isTextConfig ? storedAttrs.text.text : storedAttrs.text;
-          graphicAttributes.maxLineWidth = maxWidth === 1 / 0 ? storedAttrs.maxLineWidth : maxWidth, isTextConfig ? "html" === storedAttrs.text.type ? (graphicAttributes.html = {
-            dom: text,
-            width: null !== (_c = nextAttrs.width) && void 0 !== _c ? _c : maxWidth,
-            height: null !== (_d = nextAttrs.height) && void 0 !== _d ? _d : nextAttrs.fontSize,
-            anchorType: "position"
-          }, graphicAttributes.text = "") : "rich" === storedAttrs.text.type ? graphicAttributes.textConfig = text : graphicAttributes.text = text : graphicAttributes.text = text;
-        },
-        storedAttrs: "limitAttrs"
-      }],
-      [GrammarMarkType.rule]: [{
-        channels: ["x", "y", "x1", "y1"],
-        transform: (graphicAttributes, nextAttrs, storedAttrs) => {
-          const points = getRulePoints(storedAttrs);
-          graphicAttributes.points = points, graphicAttributes.x = 0, graphicAttributes.y = 0;
-        },
-        storedAttrs: "pointAttrs"
-      }],
-      [GrammarMarkType.symbol]: [{
-        channels: ["shape", "symbolType"],
-        transform: (graphicAttributes, nextAttrs, storedAttrs) => {
-          var _a;
-          graphicAttributes.symbolType = null !== (_a = nextAttrs.shape) && void 0 !== _a ? _a : nextAttrs.symbolType;
-        }
-      }, {
-        channels: ["image", "fill", "background"],
-        transform: (graphicAttributes, nextAttrs, storedAttrs) => {
-          nextAttrs.image ? (graphicAttributes.background = nextAttrs.image, graphicAttributes.fill = !1) : storedAttrs.image ? (graphicAttributes.background = storedAttrs.image, graphicAttributes.fill = !1) : (graphicAttributes.fill = storedAttrs.fill, graphicAttributes.background = storedAttrs.background);
-        },
-        storedAttrs: "imageAttrs"
-      }],
-      [GrammarMarkType.richtext]: [{
-        channels: ["text", "textConfig"],
-        transform: (graphicAttributes, nextAttrs, storedAttrs) => {
-          var _a, _b, _c, _d;
-          graphicAttributes.text = null, "rich" === (null === (_a = nextAttrs.text) || void 0 === _a ? void 0 : _a.type) ? graphicAttributes.textConfig = nextAttrs.text.text : "html" === (null === (_b = nextAttrs.textConfig) || void 0 === _b ? void 0 : _b.type) ? (graphicAttributes.html = {
-            dom: nextAttrs.textConfig.text,
-            width: nextAttrs.width,
-            height: null !== (_c = nextAttrs.height) && void 0 !== _c ? _c : nextAttrs.fontSize,
-            anchorType: "position"
-          }, graphicAttributes.text = "") : "rich" === (null === (_d = nextAttrs.textConfig) || void 0 === _d ? void 0 : _d.type) ? graphicAttributes.textConfig = nextAttrs.textConfig.text : graphicAttributes.textConfig = nextAttrs.textConfig;
-        }
-      }]
-    };
-    function cloneTransformAttributes(markType, attributes) {
-      var _a;
-      return (null !== (_a = transformsByType[markType]) && void 0 !== _a ? _a : []).reduce((clonedAttributes, transform) => (transform.channels.forEach(channel => {
-        has$1(attributes, channel) && (clonedAttributes[channel] = attributes[channel]);
-      }), clonedAttributes), {});
-    }
-    const transformAttributes = (markType, nextAttrs, element, markName) => {
-      const graphicAttributes = {},
-        changedKeys = nextAttrs ? Object.keys(nextAttrs) : [],
-        transforms = isString$1(markType) ? transformsByType[markType] : markType;
-      if (null == transforms ? void 0 : transforms.length) {
-        const tags = [];
-        changedKeys.forEach(key => {
-          let isTransformed = !1;
-          transforms.forEach((transform, index) => {
-            if (transform.channels.includes(key)) {
-              if (!tags[index]) if (transform.storedAttrs) {
-                const storedAttrs = storeOriginAttributes(transform.storedAttrs, transform.channels, graphicAttributes, nextAttrs, element, markName);
-                transform.transform(graphicAttributes, nextAttrs, storedAttrs);
-              } else transform.transform(graphicAttributes, nextAttrs, null);
-              tags[index] = !0, isTransformed = !0;
-            }
-          }), isTransformed || (commonAttributes.includes(key) ? transformCommonAttribute(graphicAttributes, key, nextAttrs) : graphicAttributes[key] = nextAttrs[key]);
-        });
-      } else changedKeys.forEach(key => {
-        commonAttributes.includes(key) ? transformCommonAttribute(graphicAttributes, key, nextAttrs) : graphicAttributes[key] = nextAttrs[key];
-      });
-      return graphicAttributes;
-    };
-    const isStopsEqual = (prev, next) => {
-        var _a, _b;
-        if (prev === next) return !0;
-        const prevLength = null !== (_a = prev && prev.length) && void 0 !== _a ? _a : 0;
-        return prevLength === (null !== (_b = next && next.length) && void 0 !== _b ? _b : 0) && 0 !== prevLength && prev.every((prevEntry, prevIndex) => !prevEntry && !next[prevIndex] || prevEntry && next[prevIndex] && prevEntry.color === next[prevIndex].color && prevEntry.offset === next[prevIndex].offset);
-      },
-      isColorAttrEqual = (prev, next) => {
-        if (prev === next) return !0;
-        if (typeof prev != typeof next) return !1;
-        if (isString$1(prev)) return !1;
-        if (prev.gradient !== next.gradient) return !1;
-        const prevKeys = Object.keys(prev),
-          nextKeys = Object.keys(next);
-        return prevKeys.length === nextKeys.length && prevKeys.every(key => "stops" === key ? isStopsEqual(prev[key], next[key]) : prev[key] === next[key]);
-      },
-      isLineDashEqual = (prev, next) => prev.length === next.length && prev.join("-") === next.join("-"),
-      isSegmentAttrEqual = (prev, next, key) => !(!isNil$1(prev) || !isNil$1(next)) || !isNil$1(prev) && !isNil$1(next) && ("lineDash" === key ? isLineDashEqual(prev, next) : "stroke" === key || "fill" === key ? isColorAttrEqual(prev, next) : prev === next),
-      fillAttrs = ["fill", "fillOpacity", "background", "texture", "texturePadding", "textureSize", "textureColor"],
-      strokeAttrs = ["stroke", "strokeOpacity", "lineDash", "lineDashOffset", "lineCap", "lineJoin", "lineWidth", "miterLimit"],
-      areaAttrs = fillAttrs.concat(strokeAttrs);
-    function getLineSegmentConfigs(items, points, element) {
-      var _a;
-      if (!items || items.length <= 1) return null;
-      const checkAttributes = "area" === (null === (_a = null == element ? void 0 : element.mark) || void 0 === _a ? void 0 : _a.markType) ? areaAttrs : strokeAttrs,
-        segments = [];
-      let prevSegmentAttrs = null;
-      return items.forEach((item, index) => {
-        prevSegmentAttrs && checkAttributes.every(key => isSegmentAttrEqual(prevSegmentAttrs[key], item[key], key)) || (segments.length && (segments[segments.length - 1].endIndex = index), prevSegmentAttrs = item, segments.push({
-          attrs: prevSegmentAttrs,
-          startIndex: index
-        }));
-      }), segments.length >= 2 ? segments.map(entry => {
-        const res = transformAttributes(GrammarMarkType.line, entry.attrs, element);
-        return res.points = points.slice(entry.startIndex, isNil$1(entry.endIndex) ? points.length : entry.endIndex), res;
-      }) : null;
-    }
-    function getLinePointsFromSegments(segments) {
-      return segments ? segments.reduce((points, segment) => points.concat(segment.points), []) : null;
-    }
     function isPositionOrSizeChannel(type, channel) {
       if (["x", "y", "dx", "dy"].includes(channel)) return !0;
       switch (type) {
@@ -7957,6 +7774,9 @@
       }
       return !1;
     }
+    function isPointsMarkType(markType) {
+      return [GrammarMarkType.line, GrammarMarkType.area, GrammarMarkType.largeRects, GrammarMarkType.largeSymbols].includes(markType);
+    }
 
     class GlyphMeta {
       constructor(marks, encoders, defaultEncoder, progressiveChannels) {
@@ -7999,6 +7819,16 @@
         if (!Factory._plotMarks[type]) return null;
         return new (Factory._plotMarks[type])(id);
       }
+      static registerMark(key, mark) {
+        Factory._marks[key] = mark;
+      }
+      static createMark(type, view, group) {
+        if (!Factory._marks[type]) return null;
+        return new (Factory._marks[type])(view, type, group);
+      }
+      static hasMark(type) {
+        return !!Factory._marks[type];
+      }
       static registerComponent(key, component) {
         Factory._components[key] = component;
       }
@@ -8052,7 +7882,7 @@
         return Ctor ? new Ctor(view, options) : null;
       }
     };
-    Factory$1._plotMarks = {}, Factory$1._components = {}, Factory$1._graphicComponents = {}, Factory$1._transforms = {}, Factory$1._grammars = {}, Factory$1._glyphs = {}, Factory$1._animations = {}, Factory$1._interactions = {}, Factory$1.registerGlyph = (glyphType, marks, encoders, defaultEncoder, progressiveChannels) => (Factory$1._glyphs[glyphType] = new GlyphMeta(marks, encoders, defaultEncoder, progressiveChannels), Factory$1._glyphs[glyphType]), Factory$1.registerAnimationType = (animationType, animation) => {
+    Factory$1._plotMarks = {}, Factory$1._marks = {}, Factory$1._components = {}, Factory$1._graphicComponents = {}, Factory$1._transforms = {}, Factory$1._grammars = {}, Factory$1._glyphs = {}, Factory$1._animations = {}, Factory$1._interactions = {}, Factory$1.registerGlyph = (glyphType, marks, encoders, defaultEncoder, progressiveChannels) => (Factory$1._glyphs[glyphType] = new GlyphMeta(marks, encoders, defaultEncoder, progressiveChannels), Factory$1._glyphs[glyphType]), Factory$1.registerAnimationType = (animationType, animation) => {
       Factory$1._animations[animationType] = animation;
     }, Factory$1.getAnimationType = animationType => Factory$1._animations[animationType], Factory$1.registerInteraction = (interactionType, interaction) => {
       Factory$1._interactions[interactionType] = interaction;
@@ -13912,13 +13742,12 @@
         };
       }
       onBind() {
-        var _a, _b, _c, _d, _e, _f;
-        this.fromNumber = isNumber$2(null === (_a = this.from) || void 0 === _a ? void 0 : _a.text) ? null === (_b = this.from) || void 0 === _b ? void 0 : _b.text : Number.parseFloat(null === (_c = this.from) || void 0 === _c ? void 0 : _c.text), this.toNumber = isNumber$2(null === (_d = this.to) || void 0 === _d ? void 0 : _d.text) ? null === (_e = this.to) || void 0 === _e ? void 0 : _e.text : Number.parseFloat(null === (_f = this.to) || void 0 === _f ? void 0 : _f.text), Number.isFinite(this.toNumber) || (this.fromNumber = 0), Number.isFinite(this.toNumber) || (this.valid = !1);
+        var _a, _b, _c, _d, _e, _f, _g, _h;
+        this.fromNumber = isNumber$2(null === (_a = this.from) || void 0 === _a ? void 0 : _a.text) ? null === (_b = this.from) || void 0 === _b ? void 0 : _b.text : Number.parseFloat(null === (_c = this.from) || void 0 === _c ? void 0 : _c.text), this.toNumber = isNumber$2(null === (_d = this.to) || void 0 === _d ? void 0 : _d.text) ? null === (_e = this.to) || void 0 === _e ? void 0 : _e.text : Number.parseFloat(null === (_f = this.to) || void 0 === _f ? void 0 : _f.text), Number.isFinite(this.toNumber) || (this.fromNumber = 0), Number.isFinite(this.toNumber) || (this.valid = !1), !1 !== this.valid && (this.decimalLength = null !== (_h = null === (_g = this.params) || void 0 === _g ? void 0 : _g.fixed) && void 0 !== _h ? _h : Math.max(getDecimalPlaces(this.fromNumber), getDecimalPlaces(this.toNumber)));
       }
       onEnd() {}
       onUpdate(end, ratio, out) {
-        var _a, _b;
-        !1 !== this.valid && (out.text = end ? this.toNumber.toFixed() : (this.fromNumber + (this.toNumber - this.fromNumber) * ratio).toFixed(null !== (_b = null === (_a = this.params) || void 0 === _a ? void 0 : _a.fixed) && void 0 !== _b ? _b : 0));
+        !1 !== this.valid && (out.text = end ? this.toNumber : (this.fromNumber + (this.toNumber - this.fromNumber) * ratio).toFixed(this.decimalLength));
       }
     }
     var Direction$1;
@@ -26288,6 +26117,184 @@
       graphicItem && (graphicItem[BridgeElementKey] = null, graphicItem.release(), graphicItem.parent && graphicItem.parent.removeChild(graphicItem));
     };
 
+    const commonAttributes = ["fillOpacity"];
+    const transformCommonAttribute = (graphicAttributes, changedKey, nextAttrs) => {
+      var _a;
+      return "fillOpacity" === changedKey ? (graphicAttributes.fillOpacity = null !== (_a = nextAttrs.fillOpacity) && void 0 !== _a ? _a : 1, ["fillOpacity"]) : [];
+    };
+
+    function storeOriginAttributes(name, channels, graphicAttributes, nextAttrs, element, markName) {
+      var _a;
+      const prevStoredAttrs = null !== (_a = element.getGraphicAttribute(name, !1, markName)) && void 0 !== _a ? _a : {},
+        storedAttrs = {};
+      return channels.forEach(channel => {
+        var _a;
+        storedAttrs[channel] = null !== (_a = nextAttrs[channel]) && void 0 !== _a ? _a : prevStoredAttrs[channel];
+      }), graphicAttributes[name] = storedAttrs, storedAttrs;
+    }
+    const transformsByType = {
+      [GrammarMarkType.largeRects]: [{
+        channels: ["x", "y", "y1", "x1", "width", "height"],
+        transform: (graphicAttributes, nextAttrs, storedAttrs) => {
+          graphicAttributes.x = 0, graphicAttributes.y = 0;
+        }
+      }],
+      [GrammarMarkType.largeSymbols]: [{
+        channels: ["x", "y", "size"],
+        transform: (graphicAttributes, nextAttrs, storedAttrs) => {
+          graphicAttributes.x = 0, graphicAttributes.y = 0;
+        }
+      }],
+      [GrammarMarkType.area]: [{
+        channels: ["x", "y", "x1", "y1"],
+        transform: (graphicAttributes, nextAttrs, storedAttrs) => {
+          graphicAttributes.x = 0, graphicAttributes.y = 0, graphicAttributes.x1 = 0, graphicAttributes.y1 = 0;
+        }
+      }],
+      [GrammarMarkType.line]: [{
+        channels: ["x", "y", "defined", "enableSegments"],
+        transform: (graphicAttributes, nextAttrs, storedAttrs) => {
+          graphicAttributes.x = 0, graphicAttributes.y = 0;
+        }
+      }],
+      [GrammarMarkType.rect]: [{
+        channels: ["x", "y", "x1", "y1", "width", "height"],
+        transform: (graphicAttributes, nextAttrs, storedAttrs) => {
+          var _a, _b, _c, _d, _e, _f, _g, _h;
+          isValidNumber$1(nextAttrs.width) || !isValidNumber$1(nextAttrs.x1) && isValidNumber$1(storedAttrs.width) ? (graphicAttributes.x = Math.min(null !== (_a = storedAttrs.x) && void 0 !== _a ? _a : 0, null !== (_b = storedAttrs.x1) && void 0 !== _b ? _b : 1 / 0), graphicAttributes.width = storedAttrs.width) : isValidNumber$1(nextAttrs.x1) || !isValidNumber$1(nextAttrs.width) && isValidNumber$1(storedAttrs.x1) ? (graphicAttributes.x = Math.min(storedAttrs.x, storedAttrs.x1), graphicAttributes.width = Math.abs(storedAttrs.x1 - storedAttrs.x)) : (graphicAttributes.x = Math.min(null !== (_c = storedAttrs.x) && void 0 !== _c ? _c : 0, null !== (_d = storedAttrs.x1) && void 0 !== _d ? _d : 1 / 0), graphicAttributes.width = storedAttrs.width), isValidNumber$1(nextAttrs.height) || !isValidNumber$1(nextAttrs.y1) && isValidNumber$1(storedAttrs.height) ? (graphicAttributes.y = Math.min(null !== (_e = storedAttrs.y) && void 0 !== _e ? _e : 0, null !== (_f = storedAttrs.y1) && void 0 !== _f ? _f : 1 / 0), graphicAttributes.height = storedAttrs.height) : isValidNumber$1(nextAttrs.y1) || !isValidNumber$1(nextAttrs.height) && isValidNumber$1(storedAttrs.y1) ? (graphicAttributes.y = Math.min(storedAttrs.y, storedAttrs.y1), graphicAttributes.height = Math.abs(storedAttrs.y1 - storedAttrs.y)) : (graphicAttributes.y = Math.min(null !== (_g = storedAttrs.y) && void 0 !== _g ? _g : 0, null !== (_h = storedAttrs.y1) && void 0 !== _h ? _h : 1 / 0), graphicAttributes.height = storedAttrs.height);
+        },
+        storedAttrs: "sizeAttrs"
+      }],
+      rect3d: [{
+        channels: ["x", "y", "z", "x1", "y1", "width", "height", "length"],
+        transform: (graphicAttributes, nextAttrs, storedAttrs) => {
+          var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
+          isValidNumber$1(nextAttrs.width) || !isValidNumber$1(nextAttrs.x1) && isValidNumber$1(storedAttrs.width) ? (graphicAttributes.x = Math.min(null !== (_a = storedAttrs.x) && void 0 !== _a ? _a : 0, null !== (_b = storedAttrs.x1) && void 0 !== _b ? _b : 1 / 0), graphicAttributes.width = storedAttrs.width) : isValidNumber$1(nextAttrs.x1) || !isValidNumber$1(nextAttrs.width) && isValidNumber$1(storedAttrs.x1) ? (graphicAttributes.x = Math.min(storedAttrs.x, storedAttrs.x1), graphicAttributes.width = Math.abs(storedAttrs.x1 - storedAttrs.x)) : (graphicAttributes.x = Math.min(null !== (_c = storedAttrs.x) && void 0 !== _c ? _c : 0, null !== (_d = storedAttrs.x1) && void 0 !== _d ? _d : 1 / 0), graphicAttributes.width = storedAttrs.width), isValidNumber$1(nextAttrs.height) || !isValidNumber$1(nextAttrs.y1) && isValidNumber$1(storedAttrs.height) ? (graphicAttributes.y = Math.min(null !== (_e = storedAttrs.y) && void 0 !== _e ? _e : 0, null !== (_f = storedAttrs.y1) && void 0 !== _f ? _f : 1 / 0), graphicAttributes.height = storedAttrs.height) : isValidNumber$1(nextAttrs.y1) || !isValidNumber$1(nextAttrs.height) && isValidNumber$1(storedAttrs.y1) ? (graphicAttributes.y = Math.min(storedAttrs.y, storedAttrs.y1), graphicAttributes.height = Math.abs(storedAttrs.y1 - storedAttrs.y)) : (graphicAttributes.y = Math.min(null !== (_g = storedAttrs.y) && void 0 !== _g ? _g : 0, null !== (_h = storedAttrs.y1) && void 0 !== _h ? _h : 1 / 0), graphicAttributes.height = storedAttrs.height), isValidNumber$1(nextAttrs.length) || !isValidNumber$1(nextAttrs.z1) && isValidNumber$1(storedAttrs.length) ? (graphicAttributes.z = Math.min(null !== (_j = storedAttrs.z) && void 0 !== _j ? _j : 0, null !== (_k = storedAttrs.z1) && void 0 !== _k ? _k : 1 / 0), graphicAttributes.length = storedAttrs.length) : isValidNumber$1(nextAttrs.z1) || !isValidNumber$1(nextAttrs.length) && isValidNumber$1(storedAttrs.z1) ? (graphicAttributes.z = Math.min(storedAttrs.z, storedAttrs.z1), graphicAttributes.length = Math.abs(storedAttrs.z1 - storedAttrs.z)) : (graphicAttributes.z = Math.min(null !== (_l = storedAttrs.z) && void 0 !== _l ? _l : 0, null !== (_m = storedAttrs.z1) && void 0 !== _m ? _m : 1 / 0), graphicAttributes.length = storedAttrs.length);
+        },
+        storedAttrs: "sizeAttrs"
+      }],
+      [GrammarMarkType.text]: [{
+        channels: ["text", "limit", "autoLimit", "maxLineWidth"],
+        transform: (graphicAttributes, nextAttrs, storedAttrs) => {
+          var _a, _b, _c, _d;
+          const limit = null !== (_a = storedAttrs.limit) && void 0 !== _a ? _a : 1 / 0,
+            autoLimit = null !== (_b = storedAttrs.autoLimit) && void 0 !== _b ? _b : 1 / 0,
+            maxWidth = Math.min(limit, autoLimit),
+            isTextConfig = isPlainObject$1(storedAttrs.text) && !isNil$1(storedAttrs.text.text),
+            text = isTextConfig ? storedAttrs.text.text : storedAttrs.text;
+          graphicAttributes.maxLineWidth = maxWidth === 1 / 0 ? storedAttrs.maxLineWidth : maxWidth, isTextConfig ? "html" === storedAttrs.text.type ? (graphicAttributes.html = {
+            dom: text,
+            width: null !== (_c = nextAttrs.width) && void 0 !== _c ? _c : maxWidth,
+            height: null !== (_d = nextAttrs.height) && void 0 !== _d ? _d : nextAttrs.fontSize,
+            anchorType: "position"
+          }, graphicAttributes.text = "") : "rich" === storedAttrs.text.type ? graphicAttributes.textConfig = text : graphicAttributes.text = text : graphicAttributes.text = text;
+        },
+        storedAttrs: "limitAttrs"
+      }],
+      [GrammarMarkType.rule]: [{
+        channels: ["x", "y", "x1", "y1"],
+        transform: (graphicAttributes, nextAttrs, storedAttrs) => {
+          const points = getRulePoints(storedAttrs);
+          graphicAttributes.points = points, graphicAttributes.x = 0, graphicAttributes.y = 0;
+        },
+        storedAttrs: "pointAttrs"
+      }],
+      [GrammarMarkType.symbol]: [{
+        channels: ["shape", "symbolType"],
+        transform: (graphicAttributes, nextAttrs, storedAttrs) => {
+          var _a;
+          graphicAttributes.symbolType = null !== (_a = nextAttrs.shape) && void 0 !== _a ? _a : nextAttrs.symbolType;
+        }
+      }, {
+        channels: ["image", "fill", "background"],
+        transform: (graphicAttributes, nextAttrs, storedAttrs) => {
+          nextAttrs.image ? (graphicAttributes.background = nextAttrs.image, graphicAttributes.fill = !1) : storedAttrs.image ? (graphicAttributes.background = storedAttrs.image, graphicAttributes.fill = !1) : (graphicAttributes.fill = storedAttrs.fill, graphicAttributes.background = storedAttrs.background);
+        },
+        storedAttrs: "imageAttrs"
+      }],
+      [GrammarMarkType.richtext]: [{
+        channels: ["text", "textConfig"],
+        transform: (graphicAttributes, nextAttrs, storedAttrs) => {
+          var _a, _b, _c, _d;
+          graphicAttributes.text = null, "rich" === (null === (_a = nextAttrs.text) || void 0 === _a ? void 0 : _a.type) ? graphicAttributes.textConfig = nextAttrs.text.text : "html" === (null === (_b = nextAttrs.textConfig) || void 0 === _b ? void 0 : _b.type) ? (graphicAttributes.html = {
+            dom: nextAttrs.textConfig.text,
+            width: nextAttrs.width,
+            height: null !== (_c = nextAttrs.height) && void 0 !== _c ? _c : nextAttrs.fontSize,
+            anchorType: "position"
+          }, graphicAttributes.text = "") : "rich" === (null === (_d = nextAttrs.textConfig) || void 0 === _d ? void 0 : _d.type) ? graphicAttributes.textConfig = nextAttrs.textConfig.text : graphicAttributes.textConfig = nextAttrs.textConfig;
+        }
+      }]
+    };
+    function cloneTransformAttributes(markType, attributes) {
+      var _a;
+      return (null !== (_a = transformsByType[markType]) && void 0 !== _a ? _a : []).reduce((clonedAttributes, transform) => (transform.channels.forEach(channel => {
+        has$1(attributes, channel) && (clonedAttributes[channel] = attributes[channel]);
+      }), clonedAttributes), {});
+    }
+    const transformAttributes = (markType, nextAttrs, element, markName) => {
+      const graphicAttributes = {},
+        changedKeys = nextAttrs ? Object.keys(nextAttrs) : [],
+        transforms = isString$1(markType) ? transformsByType[markType] : markType;
+      if (null == transforms ? void 0 : transforms.length) {
+        const tags = [];
+        changedKeys.forEach(key => {
+          let isTransformed = !1;
+          transforms.forEach((transform, index) => {
+            if (transform.channels.includes(key)) {
+              if (!tags[index]) if (transform.storedAttrs) {
+                const storedAttrs = storeOriginAttributes(transform.storedAttrs, transform.channels, graphicAttributes, nextAttrs, element, markName);
+                transform.transform(graphicAttributes, nextAttrs, storedAttrs);
+              } else transform.transform(graphicAttributes, nextAttrs, null);
+              tags[index] = !0, isTransformed = !0;
+            }
+          }), isTransformed || (commonAttributes.includes(key) ? transformCommonAttribute(graphicAttributes, key, nextAttrs) : graphicAttributes[key] = nextAttrs[key]);
+        });
+      } else changedKeys.forEach(key => {
+        commonAttributes.includes(key) ? transformCommonAttribute(graphicAttributes, key, nextAttrs) : graphicAttributes[key] = nextAttrs[key];
+      });
+      return graphicAttributes;
+    };
+
+    const isStopsEqual = (prev, next) => {
+        var _a, _b;
+        if (prev === next) return !0;
+        const prevLength = null !== (_a = prev && prev.length) && void 0 !== _a ? _a : 0;
+        return prevLength === (null !== (_b = next && next.length) && void 0 !== _b ? _b : 0) && 0 !== prevLength && prev.every((prevEntry, prevIndex) => !prevEntry && !next[prevIndex] || prevEntry && next[prevIndex] && prevEntry.color === next[prevIndex].color && prevEntry.offset === next[prevIndex].offset);
+      },
+      isColorAttrEqual = (prev, next) => {
+        if (prev === next) return !0;
+        if (typeof prev != typeof next) return !1;
+        if (isString$1(prev)) return !1;
+        if (prev.gradient !== next.gradient) return !1;
+        const prevKeys = Object.keys(prev),
+          nextKeys = Object.keys(next);
+        return prevKeys.length === nextKeys.length && prevKeys.every(key => "stops" === key ? isStopsEqual(prev[key], next[key]) : prev[key] === next[key]);
+      },
+      isLineDashEqual = (prev, next) => prev.length === next.length && prev.join("-") === next.join("-"),
+      isSegmentAttrEqual = (prev, next, key) => !(!isNil$1(prev) || !isNil$1(next)) || !isNil$1(prev) && !isNil$1(next) && ("lineDash" === key ? isLineDashEqual(prev, next) : "stroke" === key || "fill" === key ? isColorAttrEqual(prev, next) : prev === next),
+      fillAttrs = ["fill", "fillOpacity", "background", "texture", "texturePadding", "textureSize", "textureColor"],
+      strokeAttrs = ["stroke", "strokeOpacity", "lineDash", "lineDashOffset", "lineCap", "lineJoin", "lineWidth", "miterLimit"],
+      areaAttrs = fillAttrs.concat(strokeAttrs);
+    function getLineSegmentConfigs(items, points, element) {
+      var _a;
+      if (!items || items.length <= 1) return null;
+      const checkAttributes = "area" === (null === (_a = null == element ? void 0 : element.mark) || void 0 === _a ? void 0 : _a.markType) ? areaAttrs : strokeAttrs,
+        segments = [];
+      let prevSegmentAttrs = null;
+      return items.forEach((item, index) => {
+        prevSegmentAttrs && checkAttributes.every(key => isSegmentAttrEqual(prevSegmentAttrs[key], item[key], key)) || (segments.length && (segments[segments.length - 1].endIndex = index), prevSegmentAttrs = item, segments.push({
+          attrs: prevSegmentAttrs,
+          startIndex: index
+        }));
+      }), segments.length >= 2 ? segments.map(entry => {
+        const res = transformAttributes(GrammarMarkType.line, entry.attrs, element);
+        return res.points = points.slice(entry.startIndex, isNil$1(entry.endIndex) ? points.length : entry.endIndex), res;
+      }) : null;
+    }
+    function getLinePointsFromSegments(segments) {
+      return segments ? segments.reduce((points, segment) => points.concat(segment.points), []) : null;
+    }
+
     let Element$1 = class Element {
       constructor(mark) {
         this.data = null, this.states = [], this.diffState = DiffState.enter, this.isReserved = !1, this.runtimeStatesEncoder = null, this.items = [], this.getStateAttrs = (stateName, nextStates) => {
@@ -31819,7 +31826,7 @@
         var _a;
         this.setAttribute("pickable", !1);
         const markerVisible = null === (_a = this.attribute.visible) || void 0 === _a || _a;
-        !1 === this.attribute.interactive && this.setAttribute("childrenPickable", !1), markerVisible && (this._container ? (this._updateContainer(), this.updateMarker()) : (this._initContainer(), this.initMarker(this._container)));
+        !1 === this.attribute.interactive && this.setAttribute("childrenPickable", !1), markerVisible && (!this._container && this.isValidPoints() ? (this._initContainer(), this.initMarker(this._container)) : this.isValidPoints() ? (this._updateContainer(), this.updateMarker()) : (this._container = null, this.removeAllChild()));
       }
     }
 
@@ -32078,7 +32085,7 @@
         return this._label;
       }
       constructor(attributes) {
-        super(merge$1({}, MarkLine.defaultAttributes, attributes));
+        super(merge$1({}, MarkLine.defaultAttributes, attributes)), this.name = "markLine";
       }
       setLabelPos() {
         var _a, _b;
@@ -32170,6 +32177,12 @@
           dy: 0
         }, label)), this.setLabelPos();
       }
+      isValidPoints() {
+        const {
+          points: points
+        } = this.attribute;
+        return !(!points || points.length < 2);
+      }
     };
     MarkLine$1.defaultAttributes = DEFAULT_MARK_LINE_THEME;
 
@@ -32181,7 +32194,7 @@
         return this._label;
       }
       constructor(attributes) {
-        super(merge$1({}, MarkArea.defaultAttributes, attributes));
+        super(merge$1({}, MarkArea.defaultAttributes, attributes)), this.name = "markArea";
       }
       _getPositionByDirection(area, direction) {
         const {
@@ -32260,12 +32273,18 @@
           dy: 0
         }, label)), this.setLabelPos();
       }
+      isValidPoints() {
+        const {
+          points: points
+        } = this.attribute;
+        return !(!points || points.length < 3);
+      }
     };
     MarkArea$1.defaultAttributes = DEFAULT_MARK_AREA_THEME;
 
     let MarkPoint$1 = class MarkPoint extends Marker {
       constructor(attributes) {
-        super(merge$1({}, MarkPoint.defaultAttributes, attributes));
+        super(merge$1({}, MarkPoint.defaultAttributes, attributes)), this.name = "markPoint";
       }
       setLabelPos() {}
       setItemAttributes(item, itemContent, itemPosition, itemType) {
@@ -32424,6 +32443,9 @@
           };
         this.setItemLineAttr(itemLine, position, itemPosition, null == itemLine ? void 0 : itemLine.visible), this.setDecorativeLineAttr(itemLine, itemPosition, null === (_a = null == itemLine ? void 0 : itemLine.decorativeLine) || void 0 === _a ? void 0 : _a.visible), this.setItemAttributes(this._item, itemContent, itemPosition, type);
       }
+      isValidPoints() {
+        return !0;
+      }
     };
     MarkPoint$1.defaultAttributes = DEFAULT_MARK_POINT_THEME;
 
@@ -33974,8 +33996,8 @@
         } else niceType = "all";
         if (niceType) {
           const niceDomain = nice(originalDomain.slice(), {
-            floor: x => this._pows(Math.floor(this._logs(x))),
-            ceil: x => this._pows(Math.ceil(this._logs(x)))
+            floor: x => Math.floor(x),
+            ceil: x => Math.ceil(x)
           });
           return "min" === niceType ? niceDomain[niceDomain.length - 1] = null !== (_a = niceMinMax[1]) && void 0 !== _a ? _a : niceDomain[niceDomain.length - 1] : "max" === niceType && (niceDomain[0] = null !== (_b = niceMinMax[0]) && void 0 !== _b ? _b : niceDomain[0]), this._niceDomain = niceDomain, this.rescale(), this;
         }
@@ -34170,8 +34192,8 @@
         } else niceType = "all";
         if (niceType) {
           const niceDomain = nice(originalDomain.slice(), {
-            floor: x => this.untransformer(Math.floor(this.transformer(x))),
-            ceil: x => this.untransformer(Math.ceil(this.transformer(x)))
+            floor: x => Math.floor(x),
+            ceil: x => Math.ceil(x)
           });
           return "min" === niceType ? niceDomain[niceDomain.length - 1] = null !== (_a = niceMinMax[1]) && void 0 !== _a ? _a : niceDomain[niceDomain.length - 1] : "max" === niceType && (niceDomain[0] = null !== (_b = niceMinMax[0]) && void 0 !== _b ? _b : niceDomain[0]), this._niceDomain = niceDomain, this.rescale(), this;
         }
@@ -35164,7 +35186,7 @@
           subtextWidth = this._subTitle ? null === (_1 = this._subTitle) || void 0 === _1 ? void 0 : _1.AABBBounds.width() : 0;
         let titleWidth = Math.max(maintextWidth, subtextWidth),
           titleHeight = maintextHeight + (null !== (_2 = null == subtextStyle ? void 0 : subtextStyle.height) && void 0 !== _2 ? _2 : subtextHeight);
-        if (isValid$1(width) && (titleWidth = width, null === (_3 = this._mainTitle) || void 0 === _3 || _3.setAttribute("maxLineWidth", width), null === (_4 = this._subTitle) || void 0 === _4 || _4.setAttribute("maxLineWidth", width)), isValid$1(height) && (titleHeight = height), isValid$1(minWidth) && titleWidth < minWidth && (titleWidth = minWidth), isValid$1(maxWidth) && (null === (_5 = this._mainTitle) || void 0 === _5 || _5.setAttribute("maxLineWidth", maxWidth), null === (_6 = this._subTitle) || void 0 === _6 || _6.setAttribute("maxLineWidth", maxWidth), null === (_7 = this._mainTitle) || void 0 === _7 || _7.setAttribute("maxWidth", maxWidth), null === (_8 = this._subTitle) || void 0 === _8 || _8.setAttribute("maxWidth", maxWidth), titleWidth > maxWidth && (titleWidth = maxWidth)), isValid$1(minHeight) && titleHeight < minHeight && (titleHeight = minHeight), isValid$1(maxHeight) && (null === (_9 = this._mainTitle) || void 0 === _9 || _9.setAttribute("maxHeight", maxHeight), null === (_10 = this._subTitle) || void 0 === _10 || _10.setAttribute("maxHeight", maxHeight - maintextHeight), titleHeight > maxHeight && (titleHeight = maxHeight)), group.attribute.width = titleWidth + parsedPadding[1] + parsedPadding[3], group.attribute.height = titleHeight + parsedPadding[0] + parsedPadding[2], isValid$1(align) || isValid$1(null == textStyle ? void 0 : textStyle.align)) {
+        if (isValid$1(width) && (titleWidth = width, null === (_3 = this._mainTitle) || void 0 === _3 || _3.setAttribute("maxLineWidth", width), null === (_4 = this._subTitle) || void 0 === _4 || _4.setAttribute("maxLineWidth", width)), isValid$1(height) && (titleHeight = height), isValid$1(minWidth) && titleWidth < minWidth && (titleWidth = minWidth), isValid$1(maxWidth) && (null === (_5 = this._mainTitle) || void 0 === _5 || _5.setAttribute("maxLineWidth", maxWidth), null === (_6 = this._subTitle) || void 0 === _6 || _6.setAttribute("maxLineWidth", maxWidth), null === (_7 = this._mainTitle) || void 0 === _7 || _7.setAttribute("maxWidth", maxWidth), null === (_8 = this._subTitle) || void 0 === _8 || _8.setAttribute("maxWidth", maxWidth), titleWidth > maxWidth && (titleWidth = maxWidth)), isValid$1(minHeight) && titleHeight < minHeight && (titleHeight = minHeight), isValid$1(maxHeight) && (null === (_9 = this._mainTitle) || void 0 === _9 || _9.setAttribute("maxHeight", maxHeight), null === (_10 = this._subTitle) || void 0 === _10 || _10.setAttribute("maxHeight", maxHeight - maintextHeight), titleHeight > maxHeight && (titleHeight = maxHeight)), group.attribute.width = titleWidth, group.attribute.height = titleHeight, group.attribute.boundsPadding = parsedPadding, isValid$1(align) || isValid$1(null == textStyle ? void 0 : textStyle.align)) {
           const mainTitleAlign = (null == textStyle ? void 0 : textStyle.align) ? null == textStyle ? void 0 : textStyle.align : align,
             mainTitleWidth = null !== (_11 = null == textStyle ? void 0 : textStyle.width) && void 0 !== _11 ? _11 : maintextWidth;
           "left" === mainTitleAlign ? (null === (_12 = this._mainTitle) || void 0 === _12 || _12.setAttribute("x", 0), null === (_13 = this._mainTitle) || void 0 === _13 || _13.setAttribute("textAlign", "left")) : "center" === mainTitleAlign ? (null === (_14 = this._mainTitle) || void 0 === _14 || _14.setAttribute("x", mainTitleWidth / 2), null === (_15 = this._mainTitle) || void 0 === _15 || _15.setAttribute("textAlign", "center")) : "right" === mainTitleAlign && (null === (_16 = this._mainTitle) || void 0 === _16 || _16.setAttribute("x", mainTitleWidth), null === (_17 = this._mainTitle) || void 0 === _17 || _17.setAttribute("textAlign", "right"));
@@ -38160,7 +38182,7 @@
         return 0;
       }
       getStaticCanvasCount() {
-        return 1;
+        return 999;
       }
       loadJson(url) {
         const jsonPromise = fetch(url).then(data => data.json());
@@ -41499,7 +41521,7 @@
             title: viewOptions.rendererTitle,
             beforeRender: viewOptions.beforeRender,
             afterRender: viewOptions.afterRender,
-            disableDirtyBounds: !!viewOptions.disableDirtyBounds,
+            disableDirtyBounds: !0,
             autoRender: !0,
             pluginList: viewOptions.pluginList,
             enableHtmlAttribute: viewOptions.enableHtmlAttribute
@@ -41980,7 +42002,7 @@
         value: null !== (_b = option[SIGNAL_HEIGHT]) && void 0 !== _b ? _b : 0
       }, {
         id: SIGNAL_PADDING,
-        value: normalizePadding(null !== (_d = null !== (_c = option[SIGNAL_PADDING]) && void 0 !== _c ? _c : config[SIGNAL_PADDING]) && void 0 !== _d ? _d : theme.padding)
+        value: normalizePadding(null !== (_d = null !== (_c = option[SIGNAL_PADDING]) && void 0 !== _c ? _c : config[SIGNAL_PADDING]) && void 0 !== _d ? _d : null == theme ? void 0 : theme.padding)
       }, {
         id: SIGNAL_VIEW_WIDTH,
         update: {
@@ -43203,7 +43225,7 @@
         const currentData = null != data ? data : DefaultMarkData;
         isCollectionMark || this.differ.setCurrentData(groupData(currentData, datum => `${groupKeyGetter(datum)}-${keyGetter(datum)}`, void 0)), this.differ.doDiff(), enterElements.forEach(element => {
           this.elementMap.delete(isCollectionMark ? element.groupKey : `${element.groupKey}-${element.key}`), element.remove(), element.release();
-        }), this.elements = elements, sort && this.elements.sort((elementA, elementB) => sort(elementA.getDatum(), elementB.getDatum()));
+        }), this.elements = elements, sort && this.elements.length >= 2 && this.elements.sort((elementA, elementB) => sort(elementA.getDatum(), elementB.getDatum()));
       }
       evaluateState(elements, stateSpec, parameters) {
         stateSpec && elements.forEach(element => {
@@ -44401,7 +44423,7 @@
 
     class ViewAnimate {
       constructor(view) {
-        this._animations = [], this._additionalAnimateMarks = [], this._onAnimationStart = event => {
+        this._animations = [], this._additionalAnimateMarks = [], this.isEnabled = !0, this._onAnimationStart = event => {
           this._additionalAnimateMarks = this._additionalAnimateMarks.filter(mark => {
             var _a;
             return null === (_a = null == mark ? void 0 : mark.animate) || void 0 === _a ? void 0 : _a.isAnimating();
@@ -44444,13 +44466,13 @@
         }), this;
       }
       enable() {
-        return this._view.traverseMarkTree(mark => {
+        return this.isEnabled = !0, this._view.traverseMarkTree(mark => {
           var _a, _b;
           null === (_b = null === (_a = mark.animate) || void 0 === _a ? void 0 : _a.enable) || void 0 === _b || _b.call(_a);
         }), this;
       }
       disable() {
-        return this._view.traverseMarkTree(mark => {
+        return this.isEnabled = !1, this._view.traverseMarkTree(mark => {
           var _a, _b;
           null === (_b = null === (_a = mark.animate) || void 0 === _a ? void 0 : _a.disable) || void 0 === _b || _b.call(_a);
         }), this._additionalAnimateMarks.forEach(mark => {
@@ -44477,9 +44499,9 @@
         });
       }
       animate() {
-        return this._view.traverseMarkTree(mark => {
+        return this.isEnabled ? (this._view.traverseMarkTree(mark => {
           mark.isUpdated && mark.animate && mark.animate.animate(), mark.cleanExitElements(), mark.isUpdated = !1;
-        }, null, !0), this;
+        }, null, !0), this) : this;
       }
       animateAddition(additionMark) {
         return additionMark.animate.animate(), this._additionalAnimateMarks.push(additionMark), this;
@@ -44489,120 +44511,6 @@
       }
     }
 
-    class Interval extends Mark {
-      encodeState(state, channel, value) {
-        return super.encodeState(state, channel, value), this._updateComponentEncoders(state), this;
-      }
-      _updateComponentEncoders(state) {
-        this._encoders || (this._encoders = {});
-        const userEncoder = this.spec.encode[state];
-        if (userEncoder && "update" === state) {
-          const params = this.parameters(),
-            scales = isFunctionType(userEncoder) ? null : Object.keys(userEncoder).reduce((res, channel) => (isScaleEncode(userEncoder[channel]) && (res[channel] = getGrammarOutput(userEncoder[channel].scale, params)), res), {});
-          this._encoders[state] = {
-            callback: (datum, element, parameters) => {
-              var _a, _b, _c;
-              const userEncodeRes = invokeEncoder(userEncoder, datum, element, parameters);
-              if (this.disableCoordinateTransform = !1, scales && scales.x && scales.x.type === ScaleEnum.Band) {
-                if (!isNil$1(scales.y)) {
-                  const domain = scales.y.domain(),
-                    min = Math.min.apply(null, domain),
-                    max = Math.max.apply(null, domain),
-                    baseValue = min > 0 ? min : max < 0 ? max : 0;
-                  userEncodeRes.y1 = scales.y.scale(baseValue);
-                }
-                const bandWidth = scales.x.bandwidth();
-                userEncodeRes.x = userEncodeRes.x + bandWidth / 4, userEncodeRes.x1 = userEncodeRes.x + bandWidth / 2;
-              } else if (scales && scales.y && scales.y.type === ScaleEnum.Band) {
-                if (!isNil$1(scales.x)) {
-                  const domain = scales.x.domain(),
-                    min = Math.min.apply(null, domain),
-                    max = Math.max.apply(null, domain),
-                    baseValue = min > 0 ? min : max < 0 ? max : 0;
-                  userEncodeRes.x1 = scales.x.scale(baseValue);
-                }
-                const bandWidth = scales.y.bandwidth();
-                userEncodeRes.y = userEncodeRes.y + bandWidth / 4, userEncodeRes.y1 = userEncodeRes.y + bandWidth / 2;
-              }
-              if (scales) {
-                const coord = (null !== (_b = this.view.getScaleById(null === (_a = userEncoder.x) || void 0 === _a ? void 0 : _a.scale)) && void 0 !== _b ? _b : this.view.getScaleById(null === (_c = userEncoder.y) || void 0 === _c ? void 0 : _c.scale)).getCoordinate();
-                if (coord && "polar" === coord.type) {
-                  this.disableCoordinateTransform = !0;
-                  const origin = coord.origin();
-                  userEncodeRes.cx = origin.x, userEncodeRes.cy = origin.y;
-                }
-              }
-              return userEncodeRes;
-            }
-          };
-        } else this._encoders[state] = userEncoder;
-      }
-      _getEncoders() {
-        var _a;
-        return null !== (_a = this._encoders) && void 0 !== _a ? _a : {};
-      }
-      getAttributeTransforms() {
-        return this.coord && "polar" === this.coord.output().type ? [{
-          channels: ["x", "y", "x1", "y1", "cx", "cy"],
-          transform: (graphicAttributes, nextAttrs, storedAttrs) => {
-            graphicAttributes.x = storedAttrs.cx, graphicAttributes.y = storedAttrs.cy, this.coord.output().isTransposed() ? (graphicAttributes.startAngle = storedAttrs.y, graphicAttributes.endAngle = storedAttrs.y1, graphicAttributes.innerRadius = storedAttrs.x, graphicAttributes.outerRadius = storedAttrs.x1) : (graphicAttributes.startAngle = storedAttrs.x, graphicAttributes.endAngle = storedAttrs.x1, graphicAttributes.innerRadius = storedAttrs.y, graphicAttributes.outerRadius = storedAttrs.y1);
-          },
-          storedAttrs: "sizeAttrs"
-        }] : transformsByType.rect;
-      }
-      addGraphicItem(attrs, groupKey) {
-        const graphicItem = createGraphicItem(this, this.coord && "polar" === this.coord.output().type ? GrammarMarkType.arc : GrammarMarkType.rect, attrs);
-        return super.addGraphicItem(attrs, groupKey, graphicItem);
-      }
-      release() {
-        super.release(), this._encoders = null;
-      }
-    }
-
-    class Cell extends Mark {
-      encodeState(state, channel, value) {
-        return super.encodeState(state, channel, value), this._updateComponentEncoders(state), this;
-      }
-      _updateComponentEncoders(state) {
-        this._encoders || (this._encoders = {});
-        const userEncoder = this.spec.encode[state];
-        if (userEncoder && "update" === state) {
-          const params = this.parameters(),
-            scales = isFunctionType(userEncoder) ? null : Object.keys(userEncoder).reduce((res, channel) => (isScaleEncode(userEncoder[channel]) && (res[channel] = getGrammarOutput(userEncoder[channel].scale, params)), res), {});
-          this._encoders[state] = {
-            callback: (datum, element, parameters) => {
-              const userEncodeRes = invokeEncoder(userEncoder, datum, element, parameters);
-              if (isNil$1(userEncodeRes.size)) {
-                const sizeX = scales.x ? getBandWidthOfScale(scales.x) : void 0,
-                  sizeY = scales.y ? getBandWidthOfScale(scales.y) : void 0;
-                isNil$1(sizeX) && isNil$1(sizeY) ? userEncodeRes.size = 10 : isNil$1(sizeX) ? userEncodeRes.size = sizeY : isNil$1(sizeY) && (userEncodeRes.size = sizeX), userEncodeRes.size = [sizeX, sizeY];
-              }
-              return isNil$1(userEncodeRes.shape) && (userEncodeRes.shape = "rect"), userEncodeRes;
-            }
-          };
-        } else this._encoders[state] = userEncoder;
-      }
-      _getEncoders() {
-        var _a;
-        return null !== (_a = this._encoders) && void 0 !== _a ? _a : {};
-      }
-      getAttributeTransforms() {
-        return [{
-          channels: ["size", "padding"],
-          transform: (graphicAttributes, nextAttrs, storedAttrs) => {
-            if (isNumber$2(storedAttrs.padding) && storedAttrs.padding > 0) graphicAttributes.size = isArray$1(storedAttrs.size) ? storedAttrs.size.map(entry => Math.max(entry - storedAttrs.padding, 1)) : Math.max(storedAttrs.size - storedAttrs.padding, 1);else if (isArray$1(storedAttrs.padding) && 2 === storedAttrs.padding.length) {
-              const arraySize = isArray$1(storedAttrs.size) ? storedAttrs.size : [storedAttrs.size, storedAttrs.size];
-              graphicAttributes.size = [Math.max(arraySize[0] - storedAttrs.padding[0], 1), Math.max(arraySize[1] - storedAttrs.padding[1], 1)];
-            } else graphicAttributes.size = storedAttrs.size;
-          },
-          storedAttrs: "paddingAttrs"
-        }].concat(transformsByType.symbol);
-      }
-      release() {
-        super.release(), this._encoders = null;
-      }
-    }
-
     class Text extends Mark {
       addGraphicItem(initAttrs, groupKey) {
         const textConfig = null == initAttrs ? void 0 : initAttrs.text,
@@ -44618,6 +44526,7 @@
         super.release();
       }
     }
+    Text.markType = GrammarMarkType.text;
 
     const axis = {
         label: {
@@ -45426,17 +45335,11 @@
           case GrammarMarkType.component:
             mark = Factory$1.hasComponent(null == markOptions ? void 0 : markOptions.componentType) ? Factory$1.createComponent(null == markOptions ? void 0 : markOptions.componentType, this, groupMark, null == markOptions ? void 0 : markOptions.mode) : new Component(this, null == markOptions ? void 0 : markOptions.componentType, groupMark, null == markOptions ? void 0 : markOptions.mode);
             break;
-          case GrammarMarkType.interval:
-            mark = new Interval(this, type, groupMark);
-            break;
-          case GrammarMarkType.cell:
-            mark = new Cell(this, type, groupMark);
-            break;
           case GrammarMarkType.text:
             mark = new Text(this, type, groupMark);
             break;
           default:
-            mark = new Mark(this, type, groupMark);
+            mark = Factory$1.hasMark(type) ? Factory$1.createMark(type, this, groupMark) : new Mark(this, type, groupMark);
         }
         return this.grammars.record(mark), this._dataflow.add(mark), mark;
       }
@@ -45556,7 +45459,7 @@
         return this.removeAllInteractions(), this.removeAllGrammars(), this.parseSpec(spec);
       }
       parseBuiltIn() {
-        builtInSignals(this._options, this._config, this.getCurrentTheme()).map(signalSpec => {
+        builtInSignals(this._options, this._config, this.getCurrentTheme()).forEach(signalSpec => {
           const signal = this.signal().parse(signalSpec);
           signalSpec.value && signal.set(signalSpec.value);
         });
@@ -45592,8 +45495,8 @@
         });
       }
       theme(theme) {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j;
-        return isString$1(theme) ? this._theme = null !== (_a = ThemeManager$1.getTheme(theme)) && void 0 !== _a ? _a : ThemeManager$1.getDefaultTheme() : this._theme = theme, this.background(null !== (_d = null !== (_c = null === (_b = this._spec) || void 0 === _b ? void 0 : _b.background) && void 0 !== _c ? _c : this._options.background) && void 0 !== _d ? _d : this._theme.background), this.padding(null !== (_g = null !== (_f = null === (_e = this._spec) || void 0 === _e ? void 0 : _e.padding) && void 0 !== _f ? _f : this._options.padding) && void 0 !== _g ? _g : this._theme.padding), null === (_j = null === (_h = this.renderer.stage()) || void 0 === _h ? void 0 : _h.setTheme) || void 0 === _j || _j.call(_h, Object.assign({}, this._theme.marks)), this;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
+        return isString$1(theme) ? this._theme = null !== (_a = ThemeManager$1.getTheme(theme)) && void 0 !== _a ? _a : ThemeManager$1.getDefaultTheme() : this._theme = theme, this._theme ? (this.background(null !== (_d = null !== (_c = null === (_b = this._spec) || void 0 === _b ? void 0 : _b.background) && void 0 !== _c ? _c : this._options.background) && void 0 !== _d ? _d : this._theme.background), this.padding(null !== (_g = null !== (_f = null === (_e = this._spec) || void 0 === _e ? void 0 : _e.padding) && void 0 !== _f ? _f : this._options.padding) && void 0 !== _g ? _g : this._theme.padding), null === (_j = null === (_h = this.renderer.stage()) || void 0 === _h ? void 0 : _h.setTheme) || void 0 === _j || _j.call(_h, Object.assign({}, this._theme.marks))) : (this.background(null !== (_l = null === (_k = this._spec) || void 0 === _k ? void 0 : _k.background) && void 0 !== _l ? _l : this._options.background), this.padding(null !== (_o = null === (_m = this._spec) || void 0 === _m ? void 0 : _m.padding) && void 0 !== _o ? _o : this._options.padding)), this;
       }
       getCurrentTheme() {
         return this._theme;
@@ -45718,7 +45621,7 @@
           const normalizedRunningConfig = normalizeRunningConfig(runningConfig);
           this.reuseCachedGrammars(normalizedRunningConfig);
           const grammarWillDetach = this._cachedGrammars.size() > 0;
-          this.detachCachedGrammar();
+          grammarWillDetach && this.detachCachedGrammar();
           const hasResize = this._resizeRenderer(),
             hasUpdate = this._dataflow.hasCommitted();
           return grammarWillDetach || hasUpdate || this._layoutState || hasResize ? (this.clearProgressive(), yield this._dataflow.evaluate(), this._needBuildLayoutTree && (this.buildLayoutTree(), this._needBuildLayoutTree = !1), this._layoutState && (this._layoutState = LayoutState.layouting, this.doLayout(), this._dataflow.hasCommitted() && (this._layoutState = LayoutState.reevaluate, yield this._dataflow.evaluate()), this._layoutState = LayoutState.after, (null === (_a = this._layoutMarks) || void 0 === _a ? void 0 : _a.length) && this.handleLayoutEnd()), this._layoutState = null, this.findProgressiveMarks(), this._resizeRenderer(), this.doRender(!1), null === (_b = this._willMorphMarks) || void 0 === _b || _b.forEach(morphMarks => {
@@ -45731,7 +45634,7 @@
         const normalizedRunningConfig = normalizeRunningConfig(runningConfig);
         this.reuseCachedGrammars(normalizedRunningConfig);
         const grammarWillDetach = this._cachedGrammars.size() > 0;
-        this.detachCachedGrammar();
+        grammarWillDetach && this.detachCachedGrammar();
         const hasResize = this._resizeRenderer(),
           hasUpdate = this._dataflow.hasCommitted();
         return grammarWillDetach || hasUpdate || this._layoutState || hasResize ? (this.clearProgressive(), this._dataflow.evaluateSync(), this._needBuildLayoutTree && (this.buildLayoutTree(), this._needBuildLayoutTree = !1), this._layoutState && (this._layoutState = LayoutState.layouting, this.doLayout(), this._dataflow.hasCommitted() && (this._layoutState = LayoutState.reevaluate, this._dataflow.evaluateSync()), this._layoutState = LayoutState.after, (null === (_a = this._layoutMarks) || void 0 === _a ? void 0 : _a.length) && this.handleLayoutEnd()), this._layoutState = null, this.findProgressiveMarks(), this._resizeRenderer(), this.doRender(!0), null === (_b = this._willMorphMarks) || void 0 === _b || _b.forEach(morphMarks => {
@@ -45972,12 +45875,9 @@
       }
       initialize() {
         var _a;
-        this.grammars = new RecordedGrammars(grammar => grammar.id(), (key, grammar) => this.logger.warn(`Grammar id '${key}' has been occupied`, grammar)), this._cachedGrammars = new RecordedTreeGrammars(grammar => grammar.id()), this._options.logger && Logger.setInstance(this._options.logger), this.logger = Logger.getInstance(null !== (_a = this._options.logLevel) && void 0 !== _a ? _a : 0), this._dataflow = new Dataflow(), this.animate = new ViewAnimate(this), this._morph = new Morph(), this._theme = ThemeManager$1.getDefaultTheme(), this._options.hooks && (Object.keys(this._options.hooks).forEach(key => {
+        this.grammars = new RecordedGrammars(grammar => grammar.id(), (key, grammar) => this.logger.warn(`Grammar id '${key}' has been occupied`, grammar)), this._cachedGrammars = new RecordedTreeGrammars(grammar => grammar.id()), this._options.logger && Logger.setInstance(this._options.logger), this.logger = Logger.getInstance(null !== (_a = this._options.logLevel) && void 0 !== _a ? _a : 0), this._dataflow = new Dataflow(), this.animate = new ViewAnimate(this), this._morph = new Morph(), this._options.hooks && (Object.keys(this._options.hooks).forEach(key => {
           this.on(key, this._options.hooks[key]);
-        }), this.hooks = this._options.hooks), this.container = null, this.renderer = null, this._eventListeners = [], this._eventConfig = initializeEventConfig(this._options.eventConfig), this._theme = ThemeManager$1.getDefaultTheme(), this.parseBuiltIn(), configureEnvironment(this._options), this.initializeRenderer(), this._eventConfig.disable || this.initEvent(), this._bindResizeEvent(), this._currentDataflow = null, this._needBuildLayoutTree = !0, this._layoutState = LayoutState.before, this.theme(this._theme);
-      }
-      normalBrowserEnv() {
-        return "browser" === this._options.mode;
+        }), this.hooks = this._options.hooks), this.container = null, this.renderer = null, this._eventListeners = [], this._eventConfig = initializeEventConfig(this._options.eventConfig), this._theme = this._options.disableTheme ? null : ThemeManager$1.getDefaultTheme(), this.parseBuiltIn(), configureEnvironment(this._options), this.initializeRenderer(), this._eventConfig.disable || this.initEvent(), this._bindResizeEvent(), this._currentDataflow = null, this._needBuildLayoutTree = !0, this._layoutState = LayoutState.before, this.theme(this._theme);
       }
       pauseProgressive() {
         return !1;
@@ -47935,15 +47835,16 @@
     });
 
     const moveIn = (element, options, animationParameters) => {
-      var _a, _b, _c, _d, _e;
+      var _a, _b, _c;
       const offset = null !== (_a = null == options ? void 0 : options.offset) && void 0 !== _a ? _a : 0,
         groupBounds = animationParameters.group ? animationParameters.group.getBounds() : null,
         groupWidth = null !== (_b = null == groupBounds ? void 0 : groupBounds.width()) && void 0 !== _b ? _b : animationParameters.width,
         groupHeight = null !== (_c = null == groupBounds ? void 0 : groupBounds.height()) && void 0 !== _c ? _c : animationParameters.height,
         changedX = ("negative" === (null == options ? void 0 : options.orient) ? groupWidth : 0) + offset,
         changedY = ("negative" === (null == options ? void 0 : options.orient) ? groupHeight : 0) + offset,
-        fromX = isValidNumber$1(null === (_d = null == options ? void 0 : options.point) || void 0 === _d ? void 0 : _d.x) ? options.point.x : changedX,
-        fromY = isValidNumber$1(null === (_e = null == options ? void 0 : options.point) || void 0 === _e ? void 0 : _e.y) ? options.point.y : changedY;
+        point = isFunction$1(null == options ? void 0 : options.point) ? options.point.call(null, element.getDatum(), element, animationParameters) : null == options ? void 0 : options.point,
+        fromX = isValidNumber$1(null == point ? void 0 : point.x) ? point.x : changedX,
+        fromY = isValidNumber$1(null == point ? void 0 : point.y) ? point.y : changedY;
       switch (null == options ? void 0 : options.direction) {
         case "x":
           return {
@@ -47977,15 +47878,16 @@
       }
     };
     const moveOut = (element, options, animationParameters) => {
-      var _a, _b, _c, _d, _e;
+      var _a, _b, _c;
       const offset = null !== (_a = null == options ? void 0 : options.offset) && void 0 !== _a ? _a : 0,
         groupBounds = animationParameters.group ? animationParameters.group.getBounds() : null,
         groupWidth = null !== (_b = null == groupBounds ? void 0 : groupBounds.width()) && void 0 !== _b ? _b : animationParameters.width,
         groupHeight = null !== (_c = null == groupBounds ? void 0 : groupBounds.height()) && void 0 !== _c ? _c : animationParameters.height,
         changedX = ("negative" === (null == options ? void 0 : options.orient) ? groupWidth : 0) + offset,
         changedY = ("negative" === (null == options ? void 0 : options.orient) ? groupHeight : 0) + offset,
-        fromX = isValidNumber$1(null === (_d = null == options ? void 0 : options.point) || void 0 === _d ? void 0 : _d.x) ? options.point.x : changedX,
-        fromY = isValidNumber$1(null === (_e = null == options ? void 0 : options.point) || void 0 === _e ? void 0 : _e.y) ? options.point.y : changedY;
+        point = isFunction$1(null == options ? void 0 : options.point) ? options.point.call(null, element.getDatum(), element, animationParameters) : null == options ? void 0 : options.point,
+        fromX = isValidNumber$1(null == point ? void 0 : point.x) ? point.x : changedX,
+        fromY = isValidNumber$1(null == point ? void 0 : point.y) ? point.y : changedY;
       switch (null == options ? void 0 : options.direction) {
         case "x":
           return {
@@ -48210,6 +48112,54 @@
       Factory$1.registerAnimationType("update", update);
     };
 
+    class Cell extends Mark {
+      encodeState(state, channel, value) {
+        return super.encodeState(state, channel, value), this._updateComponentEncoders(state), this;
+      }
+      _updateComponentEncoders(state) {
+        this._encoders || (this._encoders = {});
+        const userEncoder = this.spec.encode[state];
+        if (userEncoder && "update" === state) {
+          const params = this.parameters(),
+            scales = isFunctionType(userEncoder) ? null : Object.keys(userEncoder).reduce((res, channel) => (isScaleEncode(userEncoder[channel]) && (res[channel] = getGrammarOutput(userEncoder[channel].scale, params)), res), {});
+          this._encoders[state] = {
+            callback: (datum, element, parameters) => {
+              const userEncodeRes = invokeEncoder(userEncoder, datum, element, parameters);
+              if (isNil$1(userEncodeRes.size)) {
+                const sizeX = scales.x ? getBandWidthOfScale(scales.x) : void 0,
+                  sizeY = scales.y ? getBandWidthOfScale(scales.y) : void 0;
+                isNil$1(sizeX) && isNil$1(sizeY) ? userEncodeRes.size = 10 : isNil$1(sizeX) ? userEncodeRes.size = sizeY : isNil$1(sizeY) && (userEncodeRes.size = sizeX), userEncodeRes.size = [sizeX, sizeY];
+              }
+              return isNil$1(userEncodeRes.shape) && (userEncodeRes.shape = "rect"), userEncodeRes;
+            }
+          };
+        } else this._encoders[state] = userEncoder;
+      }
+      _getEncoders() {
+        var _a;
+        return null !== (_a = this._encoders) && void 0 !== _a ? _a : {};
+      }
+      getAttributeTransforms() {
+        return [{
+          channels: ["size", "padding"],
+          transform: (graphicAttributes, nextAttrs, storedAttrs) => {
+            if (isNumber$2(storedAttrs.padding) && storedAttrs.padding > 0) graphicAttributes.size = isArray$1(storedAttrs.size) ? storedAttrs.size.map(entry => Math.max(entry - storedAttrs.padding, 1)) : Math.max(storedAttrs.size - storedAttrs.padding, 1);else if (isArray$1(storedAttrs.padding) && 2 === storedAttrs.padding.length) {
+              const arraySize = isArray$1(storedAttrs.size) ? storedAttrs.size : [storedAttrs.size, storedAttrs.size];
+              graphicAttributes.size = [Math.max(arraySize[0] - storedAttrs.padding[0], 1), Math.max(arraySize[1] - storedAttrs.padding[1], 1)];
+            } else graphicAttributes.size = storedAttrs.size;
+          },
+          storedAttrs: "paddingAttrs"
+        }].concat(transformsByType.symbol);
+      }
+      release() {
+        super.release(), this._encoders = null;
+      }
+    }
+    Cell.markType = GrammarMarkType.cell;
+    const registerCellMark = () => {
+      Factory$1.registerMark(GrammarMarkType.cell, Cell);
+    };
+
     const BASE_EVENTS = [
         'pointerdown',
         'pointerup',
@@ -50897,10 +50847,30 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
         return bounds.x1 > x || bounds.x2 < x || bounds.y1 > y || bounds.y2 < y;
     }
     function min(data, field) {
-        return minInArray(data.map(d => +d[field]).filter(d => isValidNumber$1(d)));
+        const dataArray = [];
+        data.forEach(d => {
+            const value = +d[field];
+            if (isValidNumber$1(value)) {
+                dataArray.push(value);
+            }
+        });
+        if (dataArray.length === 0) {
+            return null;
+        }
+        return minInArray(dataArray);
     }
     function max(data, field) {
-        return maxInArray(data.map(d => +d[field]).filter(d => isValidNumber$1(d)));
+        const dataArray = [];
+        data.forEach(d => {
+            const value = +d[field];
+            if (isValidNumber$1(value)) {
+                dataArray.push(value);
+            }
+        });
+        if (dataArray.length === 0) {
+            return null;
+        }
+        return maxInArray(dataArray);
     }
     function sum(data, field) {
         return data.reduce((pre, _cur) => {
@@ -55937,7 +55907,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
                 return;
             }
             const { enterStyles } = this._separateStyle();
-            this._product.encodeState(this._facet ? 'group' : 'enter', enterStyles);
+            this._product.encodeState('group', enterStyles);
         }
         _separateStyle() {
             const _a = this.stateStyle, _b = STATE_VALUE_ENUM.STATE_NORMAL, normalStyle = _a[_b]; __rest$8(_a, [typeof _b === "symbol" ? _b : _b + ""]);
@@ -55966,7 +55936,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             const _a = this.stateStyle, _b = STATE_VALUE_ENUM.STATE_NORMAL; _a[_b]; const temp = __rest$8(_a, [typeof _b === "symbol" ? _b : _b + ""]);
             const { enterStyles, updateStyles } = this._separateStyle();
             this._product.encode(updateStyles);
-            this._product.encodeState(this._facet ? 'group' : 'enter', enterStyles);
+            this._product.encodeState('group', enterStyles);
             Object.keys(temp).forEach(state => {
                 const styles = {};
                 Object.keys(temp[state]).forEach(key => {
@@ -57812,7 +57782,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
     };
     registerVChartCore();
 
-    const version = "1.6.0";
+    const version = "1.6.1";
 
     class ChartData {
         get dataList() {
@@ -64767,7 +64737,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             this.seriesType = exports.SeriesTypeEnum.map;
         }
         _getDefaultSeriesSpec(spec) {
-            const series = Object.assign(Object.assign({}, super._getDefaultSeriesSpec(spec)), { type: spec.type, nameField: spec.nameField, valueField: spec.valueField, seriesField: spec.seriesField, map: spec.map, nameProperty: spec.nameProperty, nameMap: spec.nameMap, area: spec.area, defaultFillColor: spec.defaultFillColor });
+            const series = Object.assign(Object.assign({}, super._getDefaultSeriesSpec(spec)), { type: spec.type, nameField: spec.nameField, valueField: spec.valueField, seriesField: spec.seriesField, map: spec.map, nameProperty: spec.nameProperty, centroidProperty: spec.centroidProperty, nameMap: spec.nameMap, area: spec.area, defaultFillColor: spec.defaultFillColor });
             return series;
         }
         isValidSeries(type) {
@@ -65518,7 +65488,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             var _a, _b, _c;
             const animationParams = {
                 growFrom: (datum, element, state) => {
-                    var _a, _b;
+                    var _a;
                     if (state === AnimationStateEnum.appear) {
                         return this._startAngle;
                     }
@@ -65535,11 +65505,11 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
                     if (markElements.find(e => { var _a; return ((_a = e.data[0]) === null || _a === void 0 ? void 0 : _a[DEFAULT_DATA_INDEX]) > dataIndex; }) === undefined) {
                         return this._endAngle;
                     }
-                    const prevMarkElement = markElements.findLast(e => { var _a; return ((_a = e.data[0]) === null || _a === void 0 ? void 0 : _a[DEFAULT_DATA_INDEX]) < dataIndex; });
+                    const prevMarkElement = [...markElements].reverse().find(e => { var _a; return ((_a = e.data[0]) === null || _a === void 0 ? void 0 : _a[DEFAULT_DATA_INDEX]) < dataIndex; });
                     if (outState.includes(state)) {
-                        return (_a = prevMarkElement === null || prevMarkElement === void 0 ? void 0 : prevMarkElement.getGraphicItem().nextAttrs) === null || _a === void 0 ? void 0 : _a.endAngle;
+                        return (_a = prevMarkElement === null || prevMarkElement === void 0 ? void 0 : prevMarkElement.getNextGraphicAttributes()) === null || _a === void 0 ? void 0 : _a.endAngle;
                     }
-                    return (_b = prevMarkElement === null || prevMarkElement === void 0 ? void 0 : prevMarkElement.getGraphicItem().prevAttrs) === null || _b === void 0 ? void 0 : _b.endAngle;
+                    return prevMarkElement === null || prevMarkElement === void 0 ? void 0 : prevMarkElement.getGraphicAttribute('endAngle', true);
                 }
             };
             const appearPreset = (_b = (_a = this._spec) === null || _a === void 0 ? void 0 : _a.animationAppear) === null || _b === void 0 ? void 0 : _b.preset;
@@ -75368,7 +75338,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             const attr = labelMark.getAttribute(key, datum);
             textAttribute[key] = attr;
             if (key === 'text' && formatMethod) {
-                textAttribute[key] = formatMethod(textAttribute[key], datum);
+                textAttribute[key] = formatMethod(textAttribute[key], datum, { series });
             }
         }
         return textAttribute;
@@ -78545,6 +78515,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
     HeatmapSeries.type = exports.SeriesTypeEnum.heatmap;
     HeatmapSeries.mark = heatmapSeriesMark;
     const registerHeatmapSeries = () => {
+        registerCellMark();
         Factory.registerMark(CellMark.type, CellMark);
         Factory.registerMark(TextMark.type, TextMark);
         Factory.registerSeries(HeatmapSeries.type, HeatmapSeries);
@@ -79503,9 +79474,11 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
         }
         updateScaleDomain() {
         }
-        computeData() {
-            this._tickData.getDataView().reRunAllTransform();
-            this._tickData.updateData();
+        computeData(updateType) {
+            if (updateType === 'force' || !isEqual$1(this._scale.range(), [0, 1])) {
+                this._tickData.getDataView().reRunAllTransform();
+                this._tickData.updateData();
+            }
         }
         initScales() {
             this._scales = [this._scale];
@@ -79731,8 +79704,8 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             this._tick = undefined;
             this._layoutCache = { width: 0, height: 0, _lastComputeOutBounds: { x1: 0, x2: 0, y1: 0, y2: 0 } };
             this.effect = {
-                scaleUpdate: () => {
-                    this.computeData();
+                scaleUpdate: params => {
+                    this.computeData(params === null || params === void 0 ? void 0 : params.value);
                     eachSeries(this._regions, s => {
                         if (isXAxis(this.getOrient())) {
                             s.setXAxisHelper(this.axisHelper());
@@ -80015,7 +79988,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
         onLayoutEnd(ctx) {
             const isRangeChange = this.updateScaleRange();
             if (isRangeChange) {
-                this.event.emit(ChartEvent.scaleUpdate, { model: this });
+                this.event.emit(ChartEvent.scaleUpdate, { model: this, value: 'range' });
             }
             else {
                 this.updateSeriesScale();
@@ -80150,8 +80123,10 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             }
             this._verticalLimitSize = isXAxis(this.getOrient()) ? rect.height : rect.width;
             this.setLayoutRect(rect);
-            this.updateScaleRange();
-            this.computeData();
+            const isChanged = this.updateScaleRange();
+            if (isChanged) {
+                this.computeData('range');
+            }
             const context = { skipLayout: false };
             const isX = isXAxis(this.getOrient());
             if (this.pluginService) {
@@ -80164,29 +80139,35 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
                     });
             }
             const product = this._axisMark.getProduct();
-            this._latestBounds = product.getBounds();
+            let hasBounds = false;
             {
                 const attrs = this._getUpdateAttribute(true);
                 const axisComponent = product.getGroupGraphicItem();
-                const updateBounds = axisComponent.getBoundsWithoutRender(mergeSpec(Object.assign({}, this.getLayoutStartPoint()), this._axisStyle, attrs));
+                const spec = mergeSpec(Object.assign({}, this.getLayoutStartPoint()), this._axisStyle, attrs, { line: { visible: false } });
+                const updateBounds = axisComponent.getBoundsWithoutRender(spec);
                 if (isFinite(updateBounds.width())) {
                     result = this._appendAxisUnit(updateBounds, isX);
+                    hasBounds = true;
                     this._latestBounds = updateBounds;
                 }
             }
+            if (!hasBounds) {
+                this._latestBounds = product.getBounds();
+            }
             return result;
         }
         updateLayoutAttribute() {
             if (!this.visible) {
                 return;
             }
+            const startPoint = this.getLayoutStartPoint();
             const _a = this._getUpdateAttribute(false), { grid: updateGridAttrs } = _a, updateAxisAttrs = __rest$8(_a, ["grid"]);
             const axisProduct = this._axisMark.getProduct();
-            const axisAttrs = mergeSpec(Object.assign({}, this.getLayoutStartPoint()), this._axisStyle, updateAxisAttrs);
+            const axisAttrs = mergeSpec({ x: startPoint.x, y: startPoint.y }, this._axisStyle, updateAxisAttrs);
             axisProduct.encode(axisAttrs);
             if (this._gridMark) {
                 const gridProduct = this._gridMark.getProduct();
-                gridProduct.encode(mergeSpec(Object.assign({}, this.getLayoutStartPoint()), this._getGridAttributes(), updateGridAttrs));
+                gridProduct.encode(mergeSpec({ x: startPoint.x, y: startPoint.y }, this._getGridAttributes(), updateGridAttrs));
             }
             super.updateLayoutAttribute();
         }
@@ -80555,7 +80536,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             this.niceDomain(domain);
             this._scale.domain(domain, this._nice);
             this.setScaleNice();
-            this.event.emit(ChartEvent.scaleUpdate, { model: this });
+            this.event.emit(ChartEvent.scaleUpdate, { model: this, value: 'domain' });
         }
         extendDomain(domain) {
             let temp;
@@ -80604,7 +80585,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             this._scale.domain(domain, this._nice);
             this.setScaleNice();
             this.event.emit(ChartEvent.scaleDomainUpdate, { model: this });
-            this.event.emit(ChartEvent.scaleUpdate, { model: this });
+            this.event.emit(ChartEvent.scaleUpdate, { model: this, value: 'domain' });
         }
     }
 
@@ -80729,7 +80710,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             }
             this.transformScaleDomain();
             this.event.emit(ChartEvent.scaleDomainUpdate, { model: this });
-            this.event.emit(ChartEvent.scaleUpdate, { model: this });
+            this.event.emit(ChartEvent.scaleUpdate, { model: this, value: 'domain' });
         }
     }
 
@@ -80811,8 +80792,8 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             this.type = ComponentTypeEnum.cartesianTimeAxis;
             this._zero = false;
             this.effect = {
-                scaleUpdate: () => {
-                    this.computeData();
+                scaleUpdate: params => {
+                    this.computeData(params === null || params === void 0 ? void 0 : params.value);
                     eachSeries(this._regions, s => {
                         if (isXAxis(this.getOrient())) {
                             s.setXAxisHelper(this.axisHelper());
@@ -80860,8 +80841,8 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
                 this._layerTickData = new CompilableData(this._option, layerTickData);
             }
         }
-        computeData() {
-            super.computeData();
+        computeData(updateType) {
+            super.computeData(updateType);
             if (this._layerTickData) {
                 this._layerTickData.getDataView().reRunAllTransform();
                 this._layerTickData.updateData();
@@ -80983,8 +80964,8 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             this._orient = 'radius';
             this._groupScales = [];
             this.effect = {
-                scaleUpdate: () => {
-                    this.computeData();
+                scaleUpdate: param => {
+                    this.computeData(param === null || param === void 0 ? void 0 : param.value);
                     eachSeries(this._regions, s => {
                         if (this.getOrient() === 'radius') {
                             s.radiusAxisHelper = this.axisHelper();
@@ -81094,9 +81075,11 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             super.setLayoutStartPosition(startPoint);
         }
         onLayoutEnd(ctx) {
-            this.updateScaleRange();
-            this.updateSeriesScale();
-            this.event.emit(ChartEvent.scaleUpdate, { model: this });
+            const isChanged = this.updateScaleRange();
+            if (isChanged) {
+                this.updateSeriesScale();
+                this.event.emit(ChartEvent.scaleUpdate, { model: this, value: 'range' });
+            }
             super.onLayoutEnd(ctx);
         }
         onRender(ctx) {
@@ -81147,14 +81130,21 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
         }
         updateScaleRange() {
             const inverse = this._spec.inverse;
+            const prevRange = this._scale.range();
+            let newRange;
             if (this.getOrient() === 'radius') {
-                this._scale.range(inverse
+                newRange = inverse
                     ? [this.computeLayoutOuterRadius(), this.computeLayoutInnerRadius()]
-                    : [this.computeLayoutInnerRadius(), this.computeLayoutOuterRadius()]);
+                    : [this.computeLayoutInnerRadius(), this.computeLayoutOuterRadius()];
             }
             else {
-                this._scale.range(inverse ? [this._endAngle, this._startAngle] : [this._startAngle, this._endAngle]);
+                newRange = inverse ? [this._endAngle, this._startAngle] : [this._startAngle, this._endAngle];
+            }
+            if (prevRange && newRange && prevRange[0] === newRange[0] && prevRange[1] === newRange[1]) {
+                return false;
             }
+            this._scale.range(newRange);
+            return true;
         }
         collectData(depth) {
             const data = [];
@@ -81281,6 +81271,10 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             return this.computeLayoutInnerRadius();
         }
         tickValues() {
+            const latestData = this._tickData.getLatestData();
+            if (latestData && !isArray$1(latestData)) {
+                this.computeData('force');
+            }
             return this._tickData.getLatestData() || [];
         }
         updateLayoutAttribute() {
@@ -81451,8 +81445,9 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             return this.computeBandDomain(data);
         }
         updateScaleRange() {
-            super.updateScaleRange();
+            const isChanged = super.updateScaleRange();
             this.updateGroupScaleRange();
+            return isChanged;
         }
         axisHelper() {
             const helper = super.axisHelper();
@@ -82893,7 +82888,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
                     this._cacheActualTooltip = undefined;
                 }
                 if (changePositionOnly && this._cacheViewSpec && this._cacheActualTooltip) {
-                    return this.changeTooltipPosition(changePositionOnly, this._cacheActualTooltip, this._cacheViewSpec, activeType, data, params);
+                    return this.changeTooltipPosition(changePositionOnly, data, params);
                 }
                 return this.changeTooltip(true, params, changePositionOnly, activeType, data);
             };
@@ -82946,14 +82941,20 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
                     return TooltipResult.failed;
                 }
                 this._cacheActualTooltip = actualTooltip;
-                return this._changeTooltipPosition(!!changePositionOnly, actualTooltip, spec, activeType, data, params);
+                return this._changeTooltipPosition(!!changePositionOnly, data, params);
             };
-            this._changeTooltipPosition = (changePositionOnly, actualTooltip, spec, activeType, data, params) => {
+            this._changeTooltipPosition = (changePositionOnly, data, params) => {
                 var _a, _b, _c;
                 if (this._isReleased) {
                     return TooltipResult.failed;
                 }
                 const event = params.event;
+                const spec = this._cacheViewSpec;
+                const actualTooltip = this._cacheActualTooltip;
+                if (!spec || !actualTooltip) {
+                    return TooltipResult.failed;
+                }
+                const activeType = actualTooltip.activeType;
                 if (spec.handler) {
                     return (_c = (_b = (_a = spec.handler).showTooltip) === null || _b === void 0 ? void 0 : _b.call(_a, activeType, data, params)) !== null && _c !== void 0 ? _c : TooltipResult.success;
                 }
@@ -90501,13 +90502,13 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             return result;
         }
         getSizeFromUser(spec, type) {
-            var _a;
+            var _a, _b;
             const sizeList = type === 'col' ? this._colSize : this._rowSize;
-            if (!sizeList[spec[type]].isUserSetting) {
+            if (!((_a = sizeList[spec[type]]) === null || _a === void 0 ? void 0 : _a.isUserSetting)) {
                 return undefined;
             }
             let result = 0;
-            for (let index = spec[type]; index < spec[type] + ((_a = spec[`${type}Span`]) !== null && _a !== void 0 ? _a : 1); index++) {
+            for (let index = spec[type]; index < spec[type] + ((_b = spec[`${type}Span`]) !== null && _b !== void 0 ? _b : 1); index++) {
                 if (!sizeList[index].isUserSetting) {
                     return undefined;
                 }
@@ -90585,7 +90586,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             this._chartViewBox = chartViewBox;
             this.clearLayoutSize();
             items.sort((a, b) => b.layoutLevel - a.layoutLevel);
-            const normalItems = items.filter(item => item.layoutType === 'normal');
+            const normalItems = items.filter(item => item.layoutType === 'normal' && item.getVisible() !== false);
             const normalItemsCol = normalItems.filter(item => isColItem(item));
             const normalItemsRow = normalItems.filter(item => !isColItem(item));
             normalItems.forEach(item => {