@visactor/vchart 1.2.0-beta.3 → 1.2.0-beta.4

package/build/index.js

@@ -2588,6 +2588,7 @@
 	    ComponentTypeEnum["cartesianBandAxis"] = "cartesianAxis-band";
 	    ComponentTypeEnum["cartesianLinearAxis"] = "cartesianAxis-linear";
 	    ComponentTypeEnum["cartesianTimeAxis"] = "cartesianAxis-time";
+	    ComponentTypeEnum["cartesianLogAxis"] = "cartesianAxis-log";
 	    ComponentTypeEnum["polarAxis"] = "polarAxis";
 	    ComponentTypeEnum["polarBandAxis"] = "polarAxis-band";
 	    ComponentTypeEnum["polarLinearAxis"] = "polarAxis-linear";
@@ -17830,11 +17831,13 @@
 	    return console.error("暂不支持该函数"), nodes;
 	  }
 	  insertBefore(newNode, referenceNode) {
+	    if (!referenceNode) return this.appendChild(newNode);
 	    if (this._uid === newNode._uid) return null;
 	    if (newNode.isAncestorsOf(this)) throw new Error("【Node::insertBefore】不能将父辈元素insert为子元素");
 	    return referenceNode.parent !== this ? null : (newNode.parent && newNode.parent.removeChild(newNode), newNode.parent = this, newNode._prev = referenceNode._prev, referenceNode._prev ? referenceNode._prev._next = newNode : this._firstChild = newNode, referenceNode._prev = newNode, newNode._next = referenceNode, this._idMap || (this._idMap = new Map()), this._idMap.set(newNode._uid, newNode), this._structEdit = !0, this.setCount(newNode.count), newNode);
 	  }
 	  insertAfter(newNode, referenceNode) {
+	    if (!referenceNode) return this.appendChild(newNode);
 	    if (this._uid === newNode._uid) return null;
 	    if (newNode.isAncestorsOf(this)) throw new Error("【Node::insertAfter】不能将父辈元素insert为子元素");
 	    return referenceNode.parent !== this ? null : (newNode.parent && newNode.parent.removeChild(newNode), newNode.parent = this, referenceNode._next ? (referenceNode._next._prev = newNode, newNode._next = referenceNode._next) : this._lastChild = newNode, referenceNode._next = newNode, newNode._prev = referenceNode, this._idMap || (this._idMap = new Map()), this._idMap.set(newNode._uid, newNode), this._structEdit = !0, this.setCount(newNode.count), newNode);
@@ -35659,10 +35662,12 @@
 	};
 
 	const transform$9 = (options, upstreamData) => {
+	  var _a;
 	  const positiveValues = new Map(),
 	    negativeValues = new Map(),
 	    needSum = options.asPercentStack || options.asPrevPercentStack || options.asPercent || options.asSum,
-	    data = "negative" === options.orient ? upstreamData.slice().reverse() : upstreamData,
+	    orient = null !== (_a = options.orient) && void 0 !== _a ? _a : "positive",
+	    data = "negative" === orient ? upstreamData.slice().reverse() : upstreamData,
 	    defaultDimValue = Symbol("dim");
 	  let stackedValues = data.map(datum => {
 	    var _a, _b, _c;
@@ -35693,7 +35698,7 @@
 	      newDatum = Object.assign({}, datum),
 	      sum = null !== (_a = (value >= 0 ? positiveValues : negativeValues).get(dimension)) && void 0 !== _a ? _a : 0;
 	    return options.asSum && (newDatum[options.asSum] = sum), options.asPercent && (newDatum[options.asPercent] = 0 === sum ? 0 : value / sum), options.asPercentStack && (newDatum[options.asPercentStack] = 0 === sum ? 0 : stack / sum), options.asPrevPercentStack && (newDatum[options.asPrevPercentStack] = 0 === sum ? 0 : prevStack / sum), options.asPrevStack && (newDatum[options.asPrevStack] = prevStack), newDatum[null !== (_b = options.asStack) && void 0 !== _b ? _b : options.stackField] = stack, newDatum;
-	  })), "negative" === options.orient ? stackedValues.reverse() : stackedValues;
+	  })), "negative" === orient ? stackedValues.reverse() : stackedValues;
 	};
 
 	const transform$8 = (options, upstreamData) => {
@@ -36164,9 +36169,9 @@
 	    }
 	  }],
 	  [GrammarMarkType.area]: [{
-	    channels: ["x", "y", "x1", "y1", "width", "height"],
+	    channels: ["x", "y", "x1", "y1"],
 	    transform: (graphicAttributes, nextAttrs, storedAttrs) => {
-	      graphicAttributes.x = 0, graphicAttributes.y = 0;
+	      graphicAttributes.x = 0, graphicAttributes.y = 0, graphicAttributes.x1 = 0, graphicAttributes.y1 = 0;
 	    }
 	  }],
 	  [GrammarMarkType.line]: [{
@@ -37996,7 +38001,7 @@
 	          y: y
 	        }
 	      };
-	    return isValidNumber(min) && (animateAttributes.to.min = center, animateAttributes.from.min = min), isValidNumber(max) && (animateAttributes.to.max = center, animateAttributes.from.max = max), isValidNumber(q1) && (animateAttributes.to.q1 = center, animateAttributes.from.q1 = q1), isValidNumber(q3) && (animateAttributes.to.q3 = center, animateAttributes.from.q3 = q3), isValidNumber(median) && (animateAttributes.to.median = center, animateAttributes.from.median = q3), animateAttributes;
+	    return isValidNumber(min) && (animateAttributes.to.min = center, animateAttributes.from.min = min), isValidNumber(max) && (animateAttributes.to.max = center, animateAttributes.from.max = max), isValidNumber(q1) && (animateAttributes.to.q1 = center, animateAttributes.from.q1 = q1), isValidNumber(q3) && (animateAttributes.to.q3 = center, animateAttributes.from.q3 = q3), isValidNumber(median) && (animateAttributes.to.median = center, animateAttributes.from.median = median), animateAttributes;
 	  },
 	  computeBoxplotCenter = (glyphElement, direction, options) => {
 	    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
@@ -38082,6 +38087,8 @@
 	      x1: x + width / 2
 	    }))), attributes;
 	  };
+	const boxplotScaleIn = scaleIn(computeBoxplotCenter);
+	const boxplotScaleOut = scaleOut(computeBoxplotCenter);
 	function registerBoxplotGlyph() {
 	  registerGlyph("boxplot", {
 	    shaft: "rule",
@@ -38199,7 +38206,7 @@
 	    median: {
 	      visible: !1
 	    }
-	  })), registerAnimationType("boxplotScaleIn", scaleIn(computeBoxplotCenter)), registerAnimationType("boxplotScaleOut", scaleOut(computeBoxplotCenter));
+	  })), registerAnimationType("boxplotScaleIn", boxplotScaleIn), registerAnimationType("boxplotScaleOut", boxplotScaleOut);
 	}
 	const computeBarBoxplotCenter = (glyphElement, direction, options) => {
 	    var _a, _b, _c, _d;
@@ -38277,6 +38284,8 @@
 	      x1: x + width / 2
 	    }))), attributes;
 	  };
+	const barBoxplotScaleIn = scaleIn(computeBarBoxplotCenter);
+	const barBoxplotScaleOut = scaleOut(computeBarBoxplotCenter);
 	function registerBarBoxplotGlyph() {
 	  registerGlyph("barBoxplot", {
 	    minMaxBox: "rect",
@@ -38371,7 +38380,7 @@
 	    median: {
 	      visible: !1
 	    }
-	  })), registerAnimationType("barBoxplotScaleIn", scaleIn(computeBarBoxplotCenter)), registerAnimationType("barBoxplotScaleOut", scaleOut(computeBarBoxplotCenter));
+	  })), registerAnimationType("barBoxplotScaleIn", barBoxplotScaleIn), registerAnimationType("barBoxplotScaleOut", barBoxplotScaleOut);
 	}
 
 	const getHorizontalPath = (options, ratio) => {
@@ -38622,7 +38631,7 @@
 	    Object.keys(from).forEach(channel => {
 	      isNil(from[channel]) && delete from[channel];
 	    });
-	    const computePoints = isValidPointsChannel(Object.keys(from), element.mark.markType);
+	    const computePoints = isValidPointsChannel(Object.keys(from), element.mark.markType) && !isValid(from.segments);
 	    if (computePoints) {
 	      const items = element.items.map(item => Object.assign({}, item, {
 	        nextAttrs: from
@@ -38635,7 +38644,7 @@
 	    Object.keys(to).forEach(channel => {
 	      isNil(to[channel]) && delete to[channel];
 	    });
-	    const computePoints = isValidPointsChannel(Object.keys(to), element.mark.markType);
+	    const computePoints = isValidPointsChannel(Object.keys(to), element.mark.markType) && !isValid(to.segments);
 	    if (computePoints) {
 	      const items = element.items.map(item => Object.assign({}, item, {
 	        nextAttrs: to
@@ -39445,10 +39454,11 @@
 	    });
 	  }
 	  encodeCustom(nextAttrs) {
+	    var _a;
 	    let customEncodeValues = {};
 	    const channelEncoder = this.glyphMeta.getChannelEncoder(),
 	      functionEncoder = this.glyphMeta.getFunctionEncoder();
-	    if (functionEncoder && (customEncodeValues = functionEncoder.call(null, nextAttrs, this.getDatum(), this, this.mark.getGlyphConfig())), channelEncoder) {
+	    if (functionEncoder && (customEncodeValues = functionEncoder.call(null, Object.assign({}, null === (_a = this.graphicItem) || void 0 === _a ? void 0 : _a.attribute, nextAttrs), this.getDatum(), this, this.mark.getGlyphConfig())), channelEncoder) {
 	      let allAttrs;
 	      Object.keys(channelEncoder).forEach(channel => {
 	        var _a;
@@ -39834,7 +39844,7 @@
 	  }
 	  getScalesByChannel() {
 	    const encoders = this.spec.encode;
-	    if (!encoders) return;
+	    if (!encoders) return {};
 	    const res = {},
 	      params = this.parameters();
 	    return Object.keys(encoders).forEach(state => {
@@ -40575,8 +40585,7 @@
 	        maxWidth: maxWidth,
 	        padding = 4,
 	        visible: visible,
-	        state: state,
-	        formatMethod: formatMethod
+	        state: state
 	      } = this.attribute,
 	      parsedPadding = normalizePadding$1(padding),
 	      group = this.createOrUpdateChild("tag-content", {
@@ -40608,7 +40617,7 @@
 	    }
 	    tagWidth += symbolPlaceWidth, textX += symbolPlaceWidth;
 	    const textAttrs = Object.assign(Object.assign({
-	      text: formatMethod ? formatMethod(text) : text,
+	      text: text,
 	      visible: isValid(text) && !1 !== visible,
 	      lineHeight: null == textStyle ? void 0 : textStyle.fontSize
 	    }, textStyle), {
@@ -41415,6 +41424,24 @@
 	function defaultLabelPosition(type) {
 	  return "rect" === type ? DefaultRectPositions : DefaultPositions;
 	}
+	function clampText(text, width, height) {
+	  const {
+	      x1: x1,
+	      x2: x2,
+	      y1: y1,
+	      y2: y2
+	    } = text.AABBBounds,
+	    minX = Math.min(x1, x2),
+	    maxX = Math.max(x1, x2),
+	    minY = Math.min(y1, y2),
+	    maxY = Math.max(y1, y2);
+	  let dx = 0,
+	    dy = 0;
+	  return minX < 0 && maxX - minX <= width ? dx = -minX : maxX > width && minX - (maxX - width) >= 0 && (dx = width - maxX), minY < 0 && maxY - minY <= height ? dy = -minY : maxY > height && minY - (maxY - height) >= 0 && (dy = height - maxY), {
+	    dx: dx,
+	    dy: dy
+	  };
+	}
 
 	const fadeIn = function () {
 	    let textAttribute = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
@@ -41493,9 +41520,17 @@
 	    this._bmpTool = bmpTool;
 	  }
 	  render() {
-	    const currentBaseMarks = this._checkMarks(),
-	      labels = this.layout(currentBaseMarks);
-	    this._smartInvert(labels), this._renderLabels(labels);
+	    this._prepare();
+	    const {
+	      overlap: overlap,
+	      smartInvert: smartInvert,
+	      dataFilter: dataFilter,
+	      customLayoutFunc: customLayoutFunc,
+	      customOverlapFunc: customOverlapFunc
+	    } = this.attribute;
+	    let labels,
+	      data = this.attribute.data;
+	    isFunction(dataFilter) && (data = dataFilter(data)), isFunction(customLayoutFunc) ? labels = customLayoutFunc(data, d => this._idToGraphic.get(d.id)) : (labels = this.layout(data), isFunction(customOverlapFunc) ? labels = customOverlapFunc(labels, d => this._idToGraphic.get(d.id)) : !1 !== overlap && (labels = this._overlapping(labels))), !1 !== smartInvert && this._smartInvert(labels), this._renderLabels(labels);
 	  }
 	  _bindEvent(target) {
 	    if (!target) return;
@@ -41514,52 +41549,53 @@
 	    const text = createText(attributes);
 	    return this._bindEvent(text), this._setStates(text), text;
 	  }
-	  _checkMarks() {
+	  _prepare() {
 	    var _a;
 	    const baseMarks = this.getBaseMarks(),
 	      currentBaseMarks = [];
-	    return baseMarks.forEach(mark => {
+	    if (baseMarks.forEach(mark => {
 	      "willRelease" !== mark.releaseStatus && currentBaseMarks.push(mark);
-	    }), this._prevRelationMap = new Map(this._relationMap), null === (_a = this._relationMap) || void 0 === _a || _a.clear(), currentBaseMarks;
-	  }
-	  layout(currentMarks) {
+	    }), null === (_a = this._idToGraphic) || void 0 === _a || _a.clear(), this._baseMarks = currentBaseMarks, !currentBaseMarks || 0 === currentBaseMarks.length) return;
 	    const {
-	      textStyle: textStyle,
-	      position: position,
-	      offset: offset
-	    } = this.attribute;
-	    let {
 	      data: data
 	    } = this.attribute;
-	    if (isFunction(data) && (data = data({})), !data || 0 === data.length) return [];
-	    let labels = [];
-	    isFunction(this.attribute.sort) && currentMarks && currentMarks.length && (currentMarks = currentMarks.sort(this.attribute.sort)), this._relationMap || (this._relationMap = new Map());
+	    if (data && 0 !== data.length) {
+	      this._idToGraphic || (this._idToGraphic = new Map());
+	      for (let i = 0; i < currentBaseMarks.length; i++) {
+	        const textData = data[i],
+	          baseMark = currentBaseMarks[i];
+	        textData && baseMark && (isValid(textData.id) || (textData.id = `vrender-component-${this.name}-${i}`), this._idToGraphic.set(textData.id, baseMark));
+	      }
+	    }
+	  }
+	  layout() {
+	    let data = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
+	    const {
+	        textStyle = {},
+	        position: position,
+	        offset: offset
+	      } = this.attribute,
+	      labels = [];
 	    for (let i = 0; i < data.length; i++) {
 	      const textData = data[i],
-	        baseMark = null == currentMarks ? void 0 : currentMarks[i],
-	        labelAttribute = Object.assign(Object.assign(Object.assign({}, textStyle), textData), {
-	          _relatedIndex: i
-	        });
-	      if (this._relationMap.set(i, baseMark), textData) {
-	        const text = createText(labelAttribute);
-	        text.update();
-	        const textBounds = this.getGraphicBounds(text),
-	          graphicBounds = this.getGraphicBounds(baseMark, {
-	            x: textData.x,
-	            y: textData.y
-	          }),
-	          textAttributes = this.labeling(textBounds, graphicBounds, isFunction(position) ? position(textData) : position, offset);
-	        if (!textAttributes) continue;
-	        labelAttribute.x = textAttributes.x, labelAttribute.y = textAttributes.y, labels.push(labelAttribute);
-	      }
+	        baseMark = this._idToGraphic.get(textData.id),
+	        labelAttribute = Object.assign(Object.assign({}, textStyle), textData),
+	        text = this._createLabelText(labelAttribute),
+	        textBounds = this.getGraphicBounds(text),
+	        graphicBounds = this.getGraphicBounds(baseMark, {
+	          x: textData.x,
+	          y: textData.y
+	        }),
+	        textLocation = this.labeling(textBounds, graphicBounds, isFunction(position) ? position(textData) : position, offset);
+	      textLocation && (labelAttribute.x = textLocation.x, labelAttribute.y = textLocation.y, text.setAttributes(textLocation), labels.push(text));
 	    }
-	    return this._baseMarks = currentMarks, !1 !== this.attribute.overlap && (labels = this.overlapping(labels, this.attribute.overlap)), labels;
+	    return labels;
 	  }
-	  overlapping(labels) {
-	    let option = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-	    var _a, _b, _c, _d, _e;
+	  _overlapping(labels) {
+	    var _a, _b, _c, _d;
 	    if (0 === labels.length) return [];
-	    const result = [],
+	    const option = this.attribute.overlap,
+	      result = [],
 	      baseMarkGroup = this.getBaseMarkGroup(),
 	      size = null !== (_a = option.size) && void 0 !== _a ? _a : {
 	        width: null !== (_b = null == baseMarkGroup ? void 0 : baseMarkGroup.AABBBounds.width()) && void 0 !== _b ? _b : 0,
@@ -41580,27 +41616,45 @@
 	    }));
 	    for (let i = 0; i < labels.length; i++) {
 	      if (!1 === labels[i].visible) continue;
-	      const text = createText(labels[i]),
-	        baseMark = null === (_e = this._baseMarks) || void 0 === _e ? void 0 : _e[i];
+	      const text = labels[i],
+	        baseMark = this._idToGraphic.get(text.attribute.id);
 	      if (text.update(), canPlace(bmpTool, bitmap, text.AABBBounds, clampForce)) {
 	        if (!checkBounds) {
-	          bitmap.setRange(boundToRange(bmpTool, text.AABBBounds, !0)), result.push(Object.assign({}, text.attribute));
+	          bitmap.setRange(boundToRange(bmpTool, text.AABBBounds, !0)), result.push(text);
 	          continue;
 	        }
 	        if (checkBounds && (null == baseMark ? void 0 : baseMark.AABBBounds) && canPlaceInside(text.AABBBounds, null == baseMark ? void 0 : baseMark.AABBBounds)) {
-	          bitmap.setRange(boundToRange(bmpTool, text.AABBBounds, !0)), result.push(Object.assign({}, text.attribute));
+	          bitmap.setRange(boundToRange(bmpTool, text.AABBBounds, !0)), result.push(text);
 	          continue;
 	        }
 	      }
 	      let hasPlace = !1;
 	      for (let j = 0; j < strategy.length; j++) if (hasPlace = place$2(bmpTool, bitmap, strategy[j], this.attribute, text, this.getGraphicBounds(baseMark, labels[i]), this.labeling), !1 !== hasPlace) {
-	        result.push(Object.assign(Object.assign({}, text.attribute), {
+	        text.setAttributes({
 	          x: hasPlace.x,
 	          y: hasPlace.y
-	        }));
+	        }), result.push(text);
 	        break;
 	      }
-	      !hasPlace && !hideOnHit && result.push(Object.assign({}, text.attribute));
+	      if (clampForce) {
+	        const {
+	          dx = 0,
+	          dy = 0
+	        } = clampText(text, bmpTool.width, bmpTool.height);
+	        if ((0 !== dx || 0 !== dy) && canPlace(bmpTool, bitmap, {
+	          x1: text.AABBBounds.x1 + dx,
+	          x2: text.AABBBounds.x2 + dx,
+	          y1: text.AABBBounds.y1 + dy,
+	          y2: text.AABBBounds.y2 + dy
+	        })) {
+	          text.setAttributes({
+	            x: text.attribute.x + dx,
+	            y: text.attribute.y + dy
+	          }), bitmap.setRange(boundToRange(bmpTool, text.AABBBounds, !0)), result.push(text);
+	          continue;
+	        }
+	      }
+	      !hasPlace && !hideOnHit && result.push(text);
 	    }
 	    return isFunction(this.onAfterLabelOverlap) && this.onAfterLabelOverlap(bitmap), result;
 	  }
@@ -41632,17 +41686,16 @@
 	      easing = null !== (_d = animationConfig.easing) && void 0 !== _d ? _d : DefaultLabelAnimation.easing,
 	      delay = null !== (_e = animationConfig.delay) && void 0 !== _e ? _e : 0,
 	      currentTextMap = new Map(),
-	      prevTextMap = this._textMap || new Map(),
+	      prevTextMap = this._graphicToText || new Map(),
 	      texts = [];
-	    labels.forEach((label, index) => {
-	      const text = this._createLabelText(label),
-	        relatedGraphic = this._relationMap.get(label._relatedIndex),
+	    labels.forEach((text, index) => {
+	      const relatedGraphic = this._idToGraphic.get(text.attribute.id),
 	        state = (null == prevTextMap ? void 0 : prevTextMap.get(relatedGraphic)) ? "update" : "enter";
 	      if ("enter" === state) if (texts.push(text), currentTextMap.set(relatedGraphic, text), !disableAnimation && relatedGraphic) {
 	        const {
 	          from: from,
 	          to: to
-	        } = getAnimationAttributes(label, "fadeIn");
+	        } = getAnimationAttributes(text.attribute, "fadeIn");
 	        this.add(text), relatedGraphic.onAnimateBind = () => {
 	          text.setAttributes(from);
 	          const listener = this._afterRelatedGraphicAttributeUpdate(text, texts, index, relatedGraphic, {
@@ -41667,7 +41720,7 @@
 	      disableAnimation ? this.removeChild(label) : null == label || label.animate().to(getAnimationAttributes(label.attribute, "fadeOut").to, duration, easing).onEnd(() => {
 	        this.removeChild(label);
 	      });
-	    }), this._textMap = currentTextMap;
+	    }), this._graphicToText = currentTextMap;
 	  }
 	  _afterRelatedGraphicAttributeUpdate(text, texts, index, relatedGraphic, _ref) {
 	    let {
@@ -41710,21 +41763,32 @@
 	    return listener;
 	  }
 	  _smartInvert(labels) {
-	    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
-	    if (!1 !== this.attribute.smartInvert) for (let i = 0; i < labels.length; i++) {
-	      const label = null == labels ? void 0 : labels[i];
+	    const option = this.attribute.smartInvert || {},
+	      {
+	        textType: textType,
+	        contrastRatiosThreshold: contrastRatiosThreshold,
+	        alternativeColors: alternativeColors
+	      } = option;
+	    for (let i = 0; i < labels.length; i++) {
+	      const label = labels[i];
 	      if (!label) continue;
-	      const isInside = canPlaceInside(createText(label).AABBBounds, null === (_a = this._relationMap.get(label._relatedIndex)) || void 0 === _a ? void 0 : _a.AABBBounds);
-	      if (label.stroke && label.lineWidth > 0) label.fill = labelSmartInvert(label.fill, label.stroke, null === (_b = this.attribute.smartInvert) || void 0 === _b ? void 0 : _b.textType, null === (_c = this.attribute.smartInvert) || void 0 === _c ? void 0 : _c.contrastRatiosThreshold, null === (_d = this.attribute.smartInvert) || void 0 === _d ? void 0 : _d.alternativeColors);else if (isInside) {
-	        const backgroundColor = this._relationMap.get(label._relatedIndex).attribute.fill,
-	          foregroundColor = label.fill;
-	        label.fill = labelSmartInvert(foregroundColor, backgroundColor, null === (_e = this.attribute.smartInvert) || void 0 === _e ? void 0 : _e.textType, null === (_f = this.attribute.smartInvert) || void 0 === _f ? void 0 : _f.contrastRatiosThreshold, null === (_g = this.attribute.smartInvert) || void 0 === _g ? void 0 : _g.alternativeColors);
-	      } else if (label.lineWidth > 0) {
-	        const baseMark = this._relationMap.get(label._relatedIndex);
-	        label.stroke = baseMark.attribute.fill;
-	        const backgroundColor = label.stroke,
-	          foregroundColor = label.fill;
-	        label.fill = labelSmartInvert(foregroundColor, backgroundColor, null === (_h = this.attribute.smartInvert) || void 0 === _h ? void 0 : _h.textType, null === (_j = this.attribute.smartInvert) || void 0 === _j ? void 0 : _j.contrastRatiosThreshold, null === (_k = this.attribute.smartInvert) || void 0 === _k ? void 0 : _k.alternativeColors);
+	      const baseMark = this._idToGraphic.get(label.attribute.id),
+	        isInside = canPlaceInside(label.AABBBounds, null == baseMark ? void 0 : baseMark.AABBBounds);
+	      if (label.attribute.stroke && label.attribute.lineWidth > 0) label.setAttributes({
+	        fill: labelSmartInvert(label.attribute.fill, label.attribute.stroke, textType, contrastRatiosThreshold, alternativeColors)
+	      });else if (isInside) {
+	        const backgroundColor = baseMark.attribute.fill,
+	          foregroundColor = label.attribute.fill;
+	        label.setAttributes({
+	          fill: labelSmartInvert(foregroundColor, backgroundColor, textType, contrastRatiosThreshold, alternativeColors)
+	        });
+	      } else if (label.attribute.lineWidth > 0) {
+	        const backgroundColor = label.attribute.stroke,
+	          foregroundColor = label.attribute.fill;
+	        label.setAttributes({
+	          stroke: baseMark.attribute.fill,
+	          fill: labelSmartInvert(foregroundColor, backgroundColor, textType, contrastRatiosThreshold, alternativeColors)
+	        });
 	      }
 	    }
 	  }
@@ -42107,6 +42171,9 @@
 	    line.name = "line", line.id = this._getNodeId("line"), isEmpty(null == state ? void 0 : state.line) || (line.states = state.line), this.line = line, this.add(line);
 	  }
 	  renderSymbol(attribute, dim) {
+	    const {
+	      autoRotate = !0
+	    } = attribute;
 	    let symbol;
 	    if (null == attribute ? void 0 : attribute.visible) {
 	      const startAngle = this._startAngle,
@@ -42135,7 +42202,7 @@
 	      }, rotate = endAngle + Math.PI / 2), symbol = createSymbol(Object.assign(Object.assign(Object.assign({}, position), {
 	        symbolType: symbolType,
 	        size: size,
-	        angle: rotate + refAngle,
+	        angle: autoRotate ? rotate + refAngle : 0,
 	        strokeBoundsBuffer: 0
 	      }), style)), symbol.name = `${dim}-symbol`, symbol.id = this._getNodeId(`${dim}-symbol`), isEmpty(null == state ? void 0 : state.symbol) || (symbol.states = state.symbol), this.add(symbol);
 	    }
@@ -42156,6 +42223,7 @@
 	  },
 	  startSymbol: {
 	    visible: !1,
+	    autoRotate: !0,
 	    symbolType: "triangle",
 	    size: 12,
 	    refX: 0,
@@ -42168,6 +42236,7 @@
 	  },
 	  endSymbol: {
 	    visible: !1,
+	    autoRotate: !0,
 	    symbolType: "triangle",
 	    size: 12,
 	    refX: 0,
@@ -47840,7 +47909,7 @@
 	    super(view, ComponentEnum.axis, group), this.spec.componentType = ComponentEnum.axis, this.spec.axisType = "line", this.mode = mode;
 	  }
 	  parseAddition(spec) {
-	    return super.parseAddition(spec), this.tickCount(spec.tickCount), this.inside(spec.inside), this.baseValue(spec.baseValue), this;
+	    return super.parseAddition(spec), this.axisType(spec.axisType), this.tickCount(spec.tickCount), this.inside(spec.inside), this.baseValue(spec.baseValue), this;
 	  }
 	  axisType(axisType) {
 	    return this.spec.axisType = axisType, this._axisComponentType = null, this._prepareRejoin(), this.commit(), this;
@@ -58170,7 +58239,7 @@
 	VChart.useMark([ComponentMark, GroupMark, ImageMark]);
 	Factory.registerRegion('region', Region);
 	Factory.registerLayout('base', Layout);
-	const version = "1.2.0-beta.3";
+	const version = "1.2.0-beta.4";
 	Logger.getInstance(LoggerLevel.Error);
 
 	var SeriesMarkNameEnum;
@@ -65118,7 +65187,7 @@
 	    coordinate = 'geo';
 	    _mapViewData;
 	    getMapViewData() {
-	        return this._mapViewData.getDataView();
+	        return this._mapViewData?.getDataView();
 	    }
 	    _mapViewDataStatistics;
 	    _nameField;
@@ -65471,7 +65540,9 @@
 	            spec?.nameMap !== nameMap ||
 	            spec?.valueField !== valueField ||
 	            spec?.nameProperty !== nameProperty) {
+	            result.change = true;
 	            result.reRender = true;
+	            result.reMake = true;
 	        }
 	        return result;
 	    }
@@ -69007,7 +69078,7 @@
 	    for (this.data = data; i < n;) {
 	      if (this.layoutWord(i) && i++, this.progressiveIndex = i, this.exceedTime()) break;
 	    }
-	    if (!this.options.clip && this.options.enlarge && this.shrinkBoard(this._bounds), ["cardioid", "triangle", "triangle-upright"].includes(this.options.shape)) {
+	    if (!this.options.clip && this.options.enlarge && this._bounds && this.shrinkBoard(this._bounds), this._bounds && ["cardioid", "triangle", "triangle-upright"].includes(this.options.shape)) {
 	      const currentCenterY = (this._bounds[0].y + this._bounds[1].y) / 2;
 	      this._dy = -(currentCenterY - this._size[1] / 2);
 	    }
@@ -69532,8 +69603,9 @@
 	  var _a, _b, _c, _d, _e, _f, _g;
 	  if (options.size && (!options.size[0] || !options.size[1])) return upstreamData;
 	  const data = upstreamData,
-	    canvasSize = null !== (_a = options.size) && void 0 !== _a ? _a : [500, 500],
-	    fontFamily = options.fontFamily ? field$1(options.fontFamily) : "sans-serif",
+	    canvasSize = (null !== (_a = options.size) && void 0 !== _a ? _a : [500, 500]).slice();
+	  canvasSize[0] = Math.floor(canvasSize[0]), canvasSize[1] = Math.floor(canvasSize[1]);
+	  const fontFamily = options.fontFamily ? field$1(options.fontFamily) : "sans-serif",
 	    fontStyle = options.fontStyle ? field$1(options.fontStyle) : "normal",
 	    fontWeight = options.fontWeight ? field$1(options.fontWeight) : "normal",
 	    rotate = options.rotate ? field$1(options.rotate) : 0,
@@ -70879,15 +70951,11 @@
 	            });
 	        }
 	        const textField = this._spec.word?.formatMethod ? WORD_CLOUD_TEXT : this._nameField;
-	        const srView = this.getCompiler().getVGrammarView();
 	        if (!this._isWordCloudShape) {
 	            wordCloudTransforms.push({
 	                type: 'wordcloud',
 	                layoutType: !isTrueBrowser(this._option.mode) ? 'fast' : this._wordCloudConfig.layoutMode,
-	                size: [
-	                    srView.width() - this._padding?.left || 0 - this._padding?.right || 0,
-	                    srView.height() - this._padding?.top || 0 - this._padding?.bottom || 0
-	                ],
+	                size: [this._region.getLayoutRect().width, this._region.getLayoutRect().height],
 	                shape: this._maskShape,
 	                dataIndexKey: DEFAULT_DATA_KEY,
 	                text: { field: textField },
@@ -70912,7 +70980,7 @@
 	            wordCloudTransforms.push({
 	                type: 'wordcloudShape',
 	                dataIndexKey: DEFAULT_DATA_KEY,
-	                size: [srView.width(), srView.height()],
+	                size: [this._region.getLayoutRect().width, this._region.getLayoutRect().height],
 	                shape: this._maskShape,
 	                text: { field: this._spec.word?.formatMethod ? WORD_CLOUD_TEXT : this._nameField },
 	                fontSize: valueField ? { field: valueField } : this._fontSizeRange[0],
@@ -70987,6 +71055,10 @@
 	    }
 	    setValueFieldToPercent() {
 	    }
+	    onLayoutEnd(ctx) {
+	        super.onLayoutEnd(ctx);
+	        this.compile();
+	    }
 	    updateSpec(spec) {
 	        const originalSpec = this._originalSpec;
 	        const result = super.updateSpec(spec);
@@ -71052,15 +71124,11 @@
 	            });
 	        }
 	        const textField = this._spec.word?.formatMethod ? WORD_CLOUD_TEXT : this._nameField;
-	        const srView = this.getCompiler().getVGrammarView();
 	        if (!this._isWordCloudShape) {
 	            wordCloudTransforms.push({
 	                type: 'wordcloud',
 	                layoutType: this._wordCloudConfig.layoutMode,
-	                size: [
-	                    srView.width() - this._padding?.left || 0 - this._padding?.right || 0,
-	                    srView.height() - this._padding?.top || 0 - this._padding?.bottom || 0
-	                ],
+	                size: [this._region.getLayoutRect().width, this._region.getLayoutRect().height],
 	                shape: this._maskShape,
 	                postProjection: this._spec.postProjection ?? 'StereographicProjection',
 	                dataIndexKey: DEFAULT_DATA_KEY,
@@ -71086,7 +71154,7 @@
 	        else {
 	            wordCloudTransforms.push({
 	                type: 'wordcloudShape',
-	                size: [srView.width(), srView.height()],
+	                size: [this._region.getLayoutRect().width, this._region.getLayoutRect().height],
 	                shape: this._maskShape,
 	                postProjection: this._spec.postProjection ?? 'StereographicProjection',
 	                dataIndexKey: DEFAULT_DATA_KEY,
@@ -74006,11 +74074,25 @@
 	        view.y1 - view.y0 === Infinity) {
 	        return data;
 	    }
-	    if (data[0]?.latestData) {
-	        data = data[0].latestData[0];
+	    if (data.length > 1) {
+	        const updateData = {
+	            links: [],
+	            nodes: []
+	        };
+	        data.forEach((datum) => {
+	            if (datum.id === 'links' || datum.id === 'nodes') {
+	                updateData[datum.id] = datum.values;
+	            }
+	        });
+	        data = updateData;
 	    }
 	    else {
-	        data = data[0];
+	        if (data[0]?.latestData) {
+	            data = data[0].latestData[0];
+	        }
+	        else {
+	            data = data[0];
+	        }
 	    }
 	    if (op.sourceField !== 'source' || op.targetField !== 'target') {
 	        for (const key in data) {
@@ -77400,6 +77482,7 @@
 	    _getDefaultSeriesSpec(spec) {
 	        return {
 	            ...super._getDefaultSeriesSpec(spec),
+	            bar: spec.bar,
 	            stackLabel: spec.stackLabel,
 	            leaderLine: spec.leaderLine,
 	            total: spec.total
@@ -77595,6 +77678,8 @@
 	            return getCartesianAxisTheme(getOrient(componentSpec), 'band', theme);
 	        case ComponentTypeEnum.cartesianLinearAxis:
 	            return getCartesianAxisTheme(getOrient(componentSpec), 'linear', theme);
+	        case ComponentTypeEnum.cartesianLogAxis:
+	            return getCartesianAxisTheme(getOrient(componentSpec), 'log', theme);
 	        case ComponentTypeEnum.cartesianAxis:
 	        case ComponentTypeEnum.cartesianTimeAxis:
 	            return getCartesianAxisTheme(getOrient(componentSpec), undefined, theme);
@@ -78147,9 +78232,6 @@
 	        return allDomain.slice(Math.min(startIndex, endIndex), Math.max(startIndex, endIndex) + 1);
 	    }
 	    _handleStateChange = (startValue, endValue) => {
-	        if (startValue === this._startValue && endValue === this._endValue) {
-	            return false;
-	        }
 	        this._startValue = startValue;
 	        this._endValue = endValue;
 	        this._newDomain = this._parseDomainFromState(this._startValue, this._endValue);
@@ -78396,12 +78478,12 @@
 	        this._middleHandlerSize = this._computeMiddleHandlerSize();
 	        this._width = this._computeWidth();
 	        this._height = this._computeHeight();
-	        if (this._originalSpec.startHandler?.style?.size ?? true) {
+	        if (isNil(this._originalSpec?.startHandler?.style?.size)) {
 	            this._spec.startHandler.style.size = this._isHorizontal
 	                ? this._height - this._middleHandlerSize
 	                : this._width - this._middleHandlerSize;
 	        }
-	        if (this._originalSpec.endHandler?.style?.size ?? true) {
+	        if (isNil(this._originalSpec?.startHandler?.style?.size)) {
 	            this._spec.endHandler.style.size = this._isHorizontal
 	                ? this._height - this._middleHandlerSize
 	                : this._width - this._middleHandlerSize;
@@ -78484,7 +78566,8 @@
 	        const offsetLeft = this._orient === 'left' ? this._middleHandlerSize : 0;
 	        const offsetHandler = this._isHorizontal ? this._startHandlerSize / 2 : 0;
 	        const xScale = this._isHorizontal ? this._stateScale : this._valueScale;
-	        return xScale.scale(datum[this._stateField]) + this.getLayoutStartPoint().x + offsetLeft + offsetHandler;
+	        const xField = this._isHorizontal ? this._stateField : this._valueField;
+	        return xScale.scale(datum[xField]) + this.getLayoutStartPoint().x + offsetLeft + offsetHandler;
 	    };
 	    _dataToPositionX2 = (datum) => {
 	        const offsetLeft = this._orient === 'left' ? this._middleHandlerSize : 0;
@@ -78497,7 +78580,8 @@
 	        const offsetTop = this._isHorizontal ? this._middleHandlerSize : 0;
 	        const offsetHandler = this._isHorizontal ? 0 : this._startHandlerSize / 2;
 	        const yScale = this._isHorizontal ? this._valueScale : this._stateScale;
-	        return yScale.scale(datum[this._valueField]) + this.getLayoutStartPoint().y + offsetTop + offsetHandler;
+	        const yField = this._isHorizontal ? this._valueField : this._stateField;
+	        return yScale.scale(datum[yField]) + this.getLayoutStartPoint().y + offsetTop + offsetHandler;
 	    };
 	    _dataToPositionY2 = (datum) => {
 	        const offsetTop = this._isHorizontal ? this._middleHandlerSize : 0;
@@ -81254,7 +81338,7 @@
 	    transformScaleDomain() {
 	        this.setScaleNice();
 	    }
-	    setScaleNice() {
+	    setLinearScaleNice() {
 	        let tickCount = this._spec.tick?.forceTickCount ?? this._spec.tick?.tickCount ?? 10;
 	        if (this._spec.niceType === 'accurateFirst') {
 	            tickCount = Math.max(10, tickCount);
@@ -81269,6 +81353,25 @@
 	            this._nice && this._scale.niceMin(tickCount);
 	        }
 	    }
+	    setLogScaleNice() {
+	        if (isNil(this._domain?.min) && isNil(this._domain?.max)) {
+	            this._nice && this._scale.nice();
+	        }
+	        else if (isValid(this._domain?.min) && isNil(this._domain?.max)) {
+	            this._nice && this._scale.niceMax();
+	        }
+	        else if (isNil(this._domain?.min) && isValid(this._domain?.max)) {
+	            this._nice && this._scale.niceMin();
+	        }
+	    }
+	    setScaleNice() {
+	        if (this._spec.type === 'log') {
+	            this.setLogScaleNice();
+	        }
+	        else {
+	            this.setLinearScaleNice();
+	        }
+	    }
 	    dataToPosition(values, cfg) {
 	        return this.valueToPosition(values[0]);
 	    }
@@ -81692,6 +81795,20 @@
 	    }
 	}
 
+	class CartesianLogAxis extends CartesianLinearAxis {
+	    static type = ComponentTypeEnum.cartesianLogAxis;
+	    type = ComponentTypeEnum.cartesianLogAxis;
+	    _zero = false;
+	    _scale = new LogScale();
+	    initScales() {
+	        super.initScales();
+	        this._scale.base(this._spec.base ?? 10);
+	    }
+	    transformScaleDomain() {
+	    }
+	}
+	mixin(CartesianLogAxis, LinearAxisMixin);
+
 	class PolarAxis extends AxisComponent {
 	    static type = ComponentTypeEnum.polarAxis;
 	    type = ComponentTypeEnum.polarAxis;
@@ -89051,6 +89168,7 @@
 	    CartesianLinearAxis,
 	    CartesianBandAxis,
 	    CartesianTimeAxis,
+	    CartesianLogAxis,
 	    PolarBandAxis,
 	    PolarLinearAxis,
 	    DiscreteLegend,
@@ -89096,6 +89214,7 @@
 	exports.CartesianChart = CartesianChart;
 	exports.CartesianCrossHair = CartesianCrossHair;
 	exports.CartesianLinearAxis = CartesianLinearAxis;
+	exports.CartesianLogAxis = CartesianLogAxis;
 	exports.CartesianSeries = CartesianSeries;
 	exports.CartesianTimeAxis = CartesianTimeAxis;
 	exports.CellMark = CellMark;