tvcharts 0.5.75 → 0.5.76

package/dist/echarts.js

@@ -2128,9 +2128,9 @@ function isHover(displayable, x, y) {
         if (clipPath && !clipPath.contain(x, y)) {
           return false;
         }
-        if (el.silent) {
-          isSilent = true;
-        }
+      }
+      if (el.silent) {
+        isSilent = true;
       }
       const hostEl = el.__hostTarget;
       el = hostEl ? hostEl : el.parent;
@@ -2161,7 +2161,6 @@ var Handler_default = Handler;
 // node_modules/zrender/src/core/timsort.ts
 var DEFAULT_MIN_MERGE = 32;
 var DEFAULT_MIN_GALLOPING = 7;
-var DEFAULT_TMP_STORAGE_LENGTH = 256;
 function minRunLength(n) {
   var r = 0;
   while (n >= DEFAULT_MIN_MERGE) {
@@ -2322,18 +2321,10 @@ function gallopRight(value, array, start2, length2, hint, compare2) {
 }
 function TimSort(array, compare2) {
   let minGallop = DEFAULT_MIN_GALLOPING;
-  let length2 = 0;
-  let tmpStorageLength = DEFAULT_TMP_STORAGE_LENGTH;
-  let stackLength = 0;
   let runStart;
   let runLength;
   let stackSize = 0;
-  length2 = array.length;
-  if (length2 < 2 * DEFAULT_TMP_STORAGE_LENGTH) {
-    tmpStorageLength = length2 >>> 1;
-  }
   var tmp = [];
-  stackLength = length2 < 120 ? 5 : length2 < 1542 ? 10 : length2 < 119151 ? 19 : 40;
   runStart = [];
   runLength = [];
   function pushRun(_runStart, _runLength) {
@@ -2367,8 +2358,8 @@ function TimSort(array, compare2) {
     var start1 = runStart[i];
     var length1 = runLength[i];
     var start2 = runStart[i + 1];
-    var length22 = runLength[i + 1];
-    runLength[i] = length1 + length22;
+    var length2 = runLength[i + 1];
+    runLength[i] = length1 + length2;
     if (i === stackSize - 3) {
       runStart[i + 1] = runStart[i + 2];
       runLength[i + 1] = runLength[i + 2];
@@ -2380,17 +2371,17 @@ function TimSort(array, compare2) {
     if (length1 === 0) {
       return;
     }
-    length22 = gallopLeft(array[start1 + length1 - 1], array, start2, length22, length22 - 1, compare2);
-    if (length22 === 0) {
+    length2 = gallopLeft(array[start1 + length1 - 1], array, start2, length2, length2 - 1, compare2);
+    if (length2 === 0) {
       return;
     }
-    if (length1 <= length22) {
-      mergeLow(start1, length1, start2, length22);
+    if (length1 <= length2) {
+      mergeLow(start1, length1, start2, length2);
     } else {
-      mergeHigh(start1, length1, start2, length22);
+      mergeHigh(start1, length1, start2, length2);
     }
   }
-  function mergeLow(start1, length1, start2, length22) {
+  function mergeLow(start1, length1, start2, length2) {
     var i = 0;
     for (i = 0; i < length1; i++) {
       tmp[i] = array[start1 + i];
@@ -2399,17 +2390,17 @@ function TimSort(array, compare2) {
     var cursor2 = start2;
     var dest = start1;
     array[dest++] = array[cursor2++];
-    if (--length22 === 0) {
+    if (--length2 === 0) {
       for (i = 0; i < length1; i++) {
         array[dest + i] = tmp[cursor1 + i];
       }
       return;
     }
     if (length1 === 1) {
-      for (i = 0; i < length22; i++) {
+      for (i = 0; i < length2; i++) {
         array[dest + i] = array[cursor2 + i];
       }
-      array[dest + length22] = tmp[cursor1];
+      array[dest + length2] = tmp[cursor1];
       return;
     }
     var _minGallop = minGallop;
@@ -2425,7 +2416,7 @@ function TimSort(array, compare2) {
           array[dest++] = array[cursor2++];
           count2++;
           count1 = 0;
-          if (--length22 === 0) {
+          if (--length2 === 0) {
             exit = true;
             break;
           }
@@ -2457,19 +2448,19 @@ function TimSort(array, compare2) {
           }
         }
         array[dest++] = array[cursor2++];
-        if (--length22 === 0) {
+        if (--length2 === 0) {
           exit = true;
           break;
         }
-        count2 = gallopLeft(tmp[cursor1], array, cursor2, length22, 0, compare2);
+        count2 = gallopLeft(tmp[cursor1], array, cursor2, length2, 0, compare2);
         if (count2 !== 0) {
           for (i = 0; i < count2; i++) {
             array[dest + i] = array[cursor2 + i];
           }
           dest += count2;
           cursor2 += count2;
-          length22 -= count2;
-          if (length22 === 0) {
+          length2 -= count2;
+          if (length2 === 0) {
             exit = true;
             break;
           }
@@ -2492,10 +2483,10 @@ function TimSort(array, compare2) {
     minGallop = _minGallop;
     minGallop < 1 && (minGallop = 1);
     if (length1 === 1) {
-      for (i = 0; i < length22; i++) {
+      for (i = 0; i < length2; i++) {
         array[dest + i] = array[cursor2 + i];
       }
-      array[dest + length22] = tmp[cursor1];
+      array[dest + length2] = tmp[cursor1];
     } else if (length1 === 0) {
       throw new Error();
     } else {
@@ -2504,25 +2495,25 @@ function TimSort(array, compare2) {
       }
     }
   }
-  function mergeHigh(start1, length1, start2, length22) {
+  function mergeHigh(start1, length1, start2, length2) {
     var i = 0;
-    for (i = 0; i < length22; i++) {
+    for (i = 0; i < length2; i++) {
       tmp[i] = array[start2 + i];
     }
     var cursor1 = start1 + length1 - 1;
-    var cursor2 = length22 - 1;
-    var dest = start2 + length22 - 1;
+    var cursor2 = length2 - 1;
+    var dest = start2 + length2 - 1;
     var customCursor = 0;
     var customDest = 0;
     array[dest--] = array[cursor1--];
     if (--length1 === 0) {
-      customCursor = dest - (length22 - 1);
-      for (i = 0; i < length22; i++) {
+      customCursor = dest - (length2 - 1);
+      for (i = 0; i < length2; i++) {
         array[customCursor + i] = tmp[i];
       }
       return;
     }
-    if (length22 === 1) {
+    if (length2 === 1) {
       dest -= length1;
       cursor1 -= length1;
       customDest = dest + 1;
@@ -2551,7 +2542,7 @@ function TimSort(array, compare2) {
           array[dest--] = tmp[cursor2--];
           count2++;
           count1 = 0;
-          if (--length22 === 1) {
+          if (--length2 === 1) {
             exit = true;
             break;
           }
@@ -2577,21 +2568,21 @@ function TimSort(array, compare2) {
           }
         }
         array[dest--] = tmp[cursor2--];
-        if (--length22 === 1) {
+        if (--length2 === 1) {
           exit = true;
           break;
         }
-        count2 = length22 - gallopLeft(array[cursor1], tmp, 0, length22, length22 - 1, compare2);
+        count2 = length2 - gallopLeft(array[cursor1], tmp, 0, length2, length2 - 1, compare2);
         if (count2 !== 0) {
           dest -= count2;
           cursor2 -= count2;
-          length22 -= count2;
+          length2 -= count2;
           customDest = dest + 1;
           customCursor = cursor2 + 1;
           for (i = 0; i < count2; i++) {
             array[customDest + i] = tmp[customCursor + i];
           }
-          if (length22 <= 1) {
+          if (length2 <= 1) {
             exit = true;
             break;
           }
@@ -2615,7 +2606,7 @@ function TimSort(array, compare2) {
     if (minGallop < 1) {
       minGallop = 1;
     }
-    if (length22 === 1) {
+    if (length2 === 1) {
       dest -= length1;
       cursor1 -= length1;
       customDest = dest + 1;
@@ -2624,11 +2615,11 @@ function TimSort(array, compare2) {
         array[customDest + i] = array[customCursor + i];
       }
       array[dest] = tmp[cursor2];
-    } else if (length22 === 0) {
+    } else if (length2 === 0) {
       throw new Error();
     } else {
-      customCursor = dest - (length22 - 1);
-      for (i = 0; i < length22; i++) {
+      customCursor = dest - (length2 - 1);
+      for (i = 0; i < length2; i++) {
         array[customCursor + i] = tmp[i];
       }
     }
@@ -5409,6 +5400,7 @@ var Transformable2 = class {
     const parent = this.parent;
     let m2 = this.transform;
     if (parent && parent.transform) {
+      parent.invTransform = parent.invTransform || create2();
       mul2(tmpTransform, parent.invTransform, m2);
       m2 = tmpTransform;
     }
@@ -6905,7 +6897,7 @@ var ZRender = class {
     const ssrMode = opts.ssr || painter.ssrOnly;
     this.storage = storage2;
     this.painter = painter;
-    const handerProxy = !env_default.node && !env_default.worker && !ssrMode ? new HandlerProxy_default(painter.getViewportRoot(), painter.root) : null;
+    const handlerProxy = !env_default.node && !env_default.worker && !ssrMode ? new HandlerProxy_default(painter.getViewportRoot(), painter.root) : null;
     const useCoarsePointer = opts.useCoarsePointer;
     const usePointerSize = useCoarsePointer == null || useCoarsePointer === "auto" ? env_default.touchEventsSupported : !!useCoarsePointer;
     const defaultPointerSize = 44;
@@ -6913,7 +6905,7 @@ var ZRender = class {
     if (usePointerSize) {
       pointerSize = retrieve2(opts.pointerSize, defaultPointerSize);
     }
-    this.handler = new Handler_default(storage2, painter, handerProxy, painter.root, pointerSize);
+    this.handler = new Handler_default(storage2, painter, handlerProxy, painter.root, pointerSize);
     this.animation = new Animation_default({
       stage: {
         update: ssrMode ? null : () => this._flush(true)
@@ -6924,7 +6916,7 @@ var ZRender = class {
     }
   }
   add(el) {
-    if (!el) {
+    if (this._disposed || !el) {
       return;
     }
     this.storage.addRoot(el);
@@ -6932,7 +6924,7 @@ var ZRender = class {
     this.refresh();
   }
   remove(el) {
-    if (!el) {
+    if (this._disposed || !el) {
       return;
     }
     this.storage.delRoot(el);
@@ -6940,12 +6932,18 @@ var ZRender = class {
     this.refresh();
   }
   configLayer(zLevel, config) {
+    if (this._disposed) {
+      return;
+    }
     if (this.painter.configLayer) {
       this.painter.configLayer(zLevel, config);
     }
     this.refresh();
   }
   setBackgroundColor(backgroundColor2) {
+    if (this._disposed) {
+      return;
+    }
     if (this.painter.setBackgroundColor) {
       this.painter.setBackgroundColor(backgroundColor2);
     }
@@ -6963,6 +6961,9 @@ var ZRender = class {
     return this._darkMode;
   }
   refreshImmediately(fromInside) {
+    if (this._disposed) {
+      return;
+    }
     if (!fromInside) {
       this.animation.update(true);
     }
@@ -6971,10 +6972,16 @@ var ZRender = class {
     this._needsRefresh = false;
   }
   refresh() {
+    if (this._disposed) {
+      return;
+    }
     this._needsRefresh = true;
     this.animation.start();
   }
   flush() {
+    if (this._disposed) {
+      return;
+    }
     this._flush(false);
   }
   _flush(fromInside) {
@@ -7005,6 +7012,9 @@ var ZRender = class {
     this._sleepAfterStill = stillFramesCount;
   }
   wakeUp() {
+    if (this._disposed) {
+      return;
+    }
     this.animation.start();
     this._stillFrameAccum = 0;
   }
@@ -7012,42 +7022,74 @@ var ZRender = class {
     this._needsRefreshHover = true;
   }
   refreshHoverImmediately() {
+    if (this._disposed) {
+      return;
+    }
     this._needsRefreshHover = false;
     if (this.painter.refreshHover && this.painter.getType() === "canvas") {
       this.painter.refreshHover();
     }
   }
   resize(opts) {
+    if (this._disposed) {
+      return;
+    }
     opts = opts || {};
     this.painter.resize(opts.width, opts.height);
     this.handler.resize();
   }
   clearAnimation() {
+    if (this._disposed) {
+      return;
+    }
     this.animation.clear();
   }
   getWidth() {
+    if (this._disposed) {
+      return;
+    }
     return this.painter.getWidth();
   }
   getHeight() {
+    if (this._disposed) {
+      return;
+    }
     return this.painter.getHeight();
   }
   setCursorStyle(cursorStyle) {
+    if (this._disposed) {
+      return;
+    }
     this.handler.setCursorStyle(cursorStyle);
   }
   findHover(x, y) {
+    if (this._disposed) {
+      return;
+    }
     return this.handler.findHover(x, y);
   }
   on(eventName, eventHandler, context) {
-    this.handler.on(eventName, eventHandler, context);
+    if (!this._disposed) {
+      this.handler.on(eventName, eventHandler, context);
+    }
     return this;
   }
   off(eventName, eventHandler) {
+    if (this._disposed) {
+      return;
+    }
     this.handler.off(eventName, eventHandler);
   }
   trigger(eventName, event) {
+    if (this._disposed) {
+      return;
+    }
     this.handler.trigger(eventName, event);
   }
   clear() {
+    if (this._disposed) {
+      return;
+    }
     const roots2 = this.storage.getRoots();
     for (let i = 0; i < roots2.length; i++) {
       if (roots2[i] instanceof Group_default) {
@@ -7058,12 +7100,16 @@ var ZRender = class {
     this.painter.clear();
   }
   dispose() {
+    if (this._disposed) {
+      return;
+    }
     this.animation.stop();
     this.clear();
     this.storage.dispose();
     this.painter.dispose();
     this.handler.dispose();
     this.animation = this.storage = this.painter = this.handler = null;
+    this._disposed = true;
     delInstance(this.id);
   }
 };
@@ -7089,9 +7135,7 @@ function getInstance(id) {
 function registerPainter(name, Ctor) {
   painterCtors[name] = Ctor;
 }
-var ssrDataGetter = function(el) {
-  return null;
-};
+var ssrDataGetter;
 function getElementSSRData(el) {
   if (typeof ssrDataGetter === "function") {
     return ssrDataGetter(el);
@@ -7100,7 +7144,7 @@ function getElementSSRData(el) {
 function registerSSRDataGetter(getter) {
   ssrDataGetter = getter;
 }
-var version = "5.4.4-dev.20231116";
+var version = "5.5.0";
 
 // src/util/number.ts
 var RADIAN_EPSILON = 1e-4;
@@ -9449,7 +9493,6 @@ var PathProxy2 = class {
           let delta = data[i++];
           const endAngle = delta + startAngle;
           i += 1;
-          const anticlockwise = !data[i++];
           if (isFirst) {
             x0 = mathCos2(startAngle) * rx + cx;
             y0 = mathSin2(startAngle) * ry + cy;
@@ -11715,6 +11758,27 @@ function getAllSelectedIndices(ecModel) {
   });
   return ret;
 }
+function getSeriesPointData(ecModel, payload = {}) {
+  const seriesPointData = [];
+  ecModel.eachSeries(function(seriesModel) {
+    const data = seriesModel.getData();
+    const index = payload.dataIndex ?? data.count() - 1;
+    const values = data.getValues(index);
+    const style = data.getItemVisual(index, "style");
+    const dim = seriesModel.subType === "candlestick" ? "close" : "y";
+    const currentValue = data.get(dim, index);
+    const prevValue = data.get(dim, index - 1);
+    const changePercent = ((currentValue - prevValue) / prevValue * 100).toFixed(2) + "%";
+    seriesPointData.push({
+      name: seriesModel.name,
+      data: values,
+      color: style.fill,
+      seriesId: seriesModel.id,
+      changePercent
+    });
+  });
+  return seriesPointData;
+}
 function enableHoverEmphasis(el, focus, blurScope) {
   setAsHighDownDispatcher(el, true);
   traverseUpdateState(el, setDefaultStateProxy);
@@ -23101,6 +23165,37 @@ var ECharts = class extends Eventful_default {
     const dataIndexInside = parsedFinder.hasOwnProperty("dataIndexInside") ? parsedFinder.dataIndexInside : parsedFinder.hasOwnProperty("dataIndex") ? data.indexOfRawIndex(parsedFinder.dataIndex) : null;
     return dataIndexInside != null ? getItemVisualFromData(data, dataIndexInside, visualType) : getVisualFromData(data, visualType);
   }
+  getDataByIndex(finder) {
+    const ecModel = this._model;
+    const parsedFinder = parseFinder(ecModel, finder, {
+      defaultMainType: "series"
+    });
+    const seriesModel = parsedFinder.seriesModel;
+    if (true) {
+      if (!seriesModel) {
+        warn("There is no specified series model");
+      }
+    }
+    const data = seriesModel.getData();
+    const dataIndexInside = parsedFinder.hasOwnProperty("dataIndexInside") ? parsedFinder.dataIndexInside : parsedFinder.hasOwnProperty("dataIndex") ? data.indexOfRawIndex(parsedFinder.dataIndex) : null;
+    return dataIndexInside != null ? data.getValues(dataIndexInside) : data.getValues(data.count() - 1);
+  }
+  getCategories(finder) {
+    const ecModel = this._model;
+    const parsedFinder = parseFinder(ecModel, finder, {
+      defaultMainType: "series"
+    });
+    const seriesModel = parsedFinder.seriesModel;
+    if (true) {
+      if (!seriesModel) {
+        warn("There is no specified series model");
+      }
+    }
+    const data = seriesModel.getData();
+    const dataIndex = parsedFinder.hasOwnProperty("dataIndex") ? data.indexOfRawIndex(parsedFinder.dataIndex) : 0;
+    const axis = seriesModel.getBaseAxis();
+    return axis.scale.getLabel({value: dataIndex});
+  }
   getViewOfComponentModel(componentModel) {
     return this._componentsMap[componentModel.__viewId];
   }
@@ -23162,7 +23257,7 @@ var ECharts = class extends Eventful_default {
         this.trigger(eventType, event);
       }, this);
     });
-    each(["selectchanged"], (eventType) => {
+    each(["selectchanged", "selectitem"], (eventType) => {
       this._messageCenter.on(eventType, function(event) {
         this.trigger(eventType, event);
       }, this);
@@ -23686,6 +23781,11 @@ ECharts.internalField = function() {
         };
         messageCenter.trigger(newObj.type, newObj);
       }
+      const isUpdateAxisPointer = payload.type === "updateAxisPointer";
+      if (isUpdateAxisPointer) {
+        const data = getSeriesPointData(ecModel, {dataIndex: eventObj.dataIndexInside});
+        messageCenter.trigger("selectitem", {data, dataIndex: eventObj.dataIndexInside});
+      }
     }
   };
   flushPendingActions = function(silent) {
@@ -23849,6 +23949,9 @@ ECharts.internalField = function() {
       updateStates(seriesModel, chartView);
     });
     updateHoverLayerStatus(ecIns, ecModel);
+    const data = getSeriesPointData(ecModel);
+    const messageCenter = ecIns._messageCenter;
+    messageCenter.trigger("selectitem", {data});
     lifecycle_default.trigger("series:afterupdate", ecModel, api2, updateParams);
   };
   markStatusToUpdate = function(ecIns) {
@@ -30458,7 +30561,7 @@ function setMetaData(attrs, el) {
   const metaData = getElementSSRData(el);
   if (metaData) {
     metaData.each((val, key) => {
-      attrs[(META_DATA_PREFIX + key).toLowerCase()] = val + "";
+      val != null && (attrs[(META_DATA_PREFIX + key).toLowerCase()] = val + "");
     });
     if (el.isSilent()) {
       attrs[META_DATA_PREFIX + "silent"] = "true";
@@ -31328,8 +31431,7 @@ function createBackgroundVNode(width, height, backgroundColor2, scope) {
       width,
       height,
       x: "0",
-      y: "0",
-      id: "0"
+      y: "0"
     });
     if (isGradient(backgroundColor2)) {
       setGradient({fill: backgroundColor2}, bgVNode.attrs, "fill", scope);
@@ -31509,7 +31611,7 @@ var Layer = class extends Eventful_default {
     }
     for (let i = this.__prevStartIndex; i < this.__prevEndIndex; ++i) {
       const el = prevList[i];
-      const shouldPaint = el.shouldBePainted(viewWidth, viewHeight, true, true);
+      const shouldPaint = el && el.shouldBePainted(viewWidth, viewHeight, true, true);
       if (el && (!shouldPaint || !el.__zr) && el.__isRendered) {
         const prevRect = el.getPrevPaintRect();
         if (prevRect) {
@@ -37804,29 +37906,33 @@ var builders = {
   },
   axisBackground(opt, axisModel, group, transformGroup) {
     const shown = axisModel.get(["axisBackground", "show"]);
-    if (!shown) {
+    if (!shown || axisModel.axis.dim !== "y") {
       return;
     }
     const extent3 = axisModel.axis.getExtent();
     const matrix13 = transformGroup.transform;
     const pt12 = [extent3[0], 0];
+    const pt22 = [extent3[1], 0];
+    const inverse = pt12[0] > pt22[0];
     if (matrix13) {
       applyTransform(pt12, pt12, matrix13);
+      applyTransform(pt22, pt22, matrix13);
     }
     const style = extend({}, axisModel.getModel(["axisBackground", "backStyle"]).getAreaStyle());
     const position2 = axisModel.axis.position;
     const api2 = axisModel.ecModel.scheduler.api;
+    const pt = inverse ? pt22 : pt12;
     const background = new Rect_default({
       shape: position2 === "left" ? {
         x: 0,
         y: 0,
-        width: pt12[0],
-        height: pt12[1]
+        width: pt[0],
+        height: pt[1]
       } : {
-        x: pt12[0],
+        x: pt[0],
         y: 0,
-        width: api2.getWidth() - pt12[0],
-        height: pt12[1]
+        width: api2.getWidth() - pt[0],
+        height: pt[1]
       },
       style,
       cursor: "ns-resize",
@@ -57769,7 +57875,10 @@ function axisTrigger(payload, ecModel, api2) {
     processOnAxis(axesInfo[tarKey], val, updaters, true, outputPayload);
   });
   updateModelActually(showValueMap, axesInfo, outputPayload);
-  dispatchTooltipActually(dataByCoordSys, point, payload, dispatchAction3);
+  const tooltipDisabled = ecModel.get("tooltipDisabled");
+  if (!tooltipDisabled) {
+    dispatchTooltipActually(dataByCoordSys, point, payload, dispatchAction3);
+  }
   const highlightDisabled = ecModel.get("highlightDisabled");
   if (!highlightDisabled) {
     dispatchHighDownActually(axesInfo, dispatchAction3, api2);
@@ -66860,7 +66969,8 @@ var MarkLabelView2 = class extends Component_default2 {
       }
       const gridRect = coordSys.master.getRect();
       const yAxisModel = coordSys.getAxis("y");
-      const x = yAxisModel.position === "right" ? gridRect.x + gridRect.width : gridRect.x;
+      const offset = yAxisModel.model.get("offset") || 0;
+      const x = yAxisModel.position === "right" ? gridRect.x + gridRect.width + offset : gridRect.x - offset;
       each(markLabelData, (item) => {
         let el = markerGroupMap.get(item.name);
         if (item.$action === "remove") {
@@ -66943,6 +67053,7 @@ var MarkLabelView2 = class extends Component_default2 {
       const gridRect = coordSys.master.getRect();
       const yAxisModel = coordSys.getAxis("y");
       const position2 = yAxisModel.position;
+      const offset = yAxisModel.model.get("offset") || 0;
       each(labels, (label) => {
         if (!label.children) {
           return;
@@ -67061,10 +67172,10 @@ function getLeftTextX(x, text, textStyle, ecModel) {
   const paddings = normalizeCssArray2(textStyle.padding || 0);
   return x - textRect.width - paddings[1] - paddings[3] - 1;
 }
-function createText({option, gridRect, position: position2, ecModel, y}) {
+function createText({option, gridRect, position: position2, ecModel, y, offset}) {
   const isLeft = position2 === "left";
   const {style, zlevel} = option;
-  const startX = isLeft ? gridRect.x : gridRect.x + gridRect.width;
+  const startX = isLeft ? gridRect.x - offset : gridRect.x + gridRect.width + offset;
   const x = isLeft ? getLeftTextX(startX, style.text, style, ecModel) : startX;
   const textEl = new Text_default({
     x,
@@ -67076,9 +67187,9 @@ function createText({option, gridRect, position: position2, ecModel, y}) {
   inner21(textEl).y = y;
   return textEl;
 }
-function updateText({option, gridRect, position: position2, ecModel, el, y}) {
+function updateText({option, gridRect, position: position2, ecModel, el, y, offset}) {
   const isLeft = position2 === "left";
-  const startX = isLeft ? gridRect.x : gridRect.x + gridRect.width;
+  const startX = isLeft ? gridRect.x - offset : gridRect.x + gridRect.width + offset;
   const {style} = option;
   const x = isLeft ? getLeftTextX(startX, style.text, style, ecModel) : startX;
   el.x = x;
@@ -67101,7 +67212,7 @@ function createLabel({x, y, labelData, markerModel, gridRect, position: position
     zlevel
   });
   const textNameEl = new Text_default({
-    x: isLeft ? x : getLeftTextX(x, labelData.name, textStyle, markerModel.ecModel),
+    x: isLeft ? gridRect.x : getLeftTextX(gridRect.x + gridRect.width, labelData.name, textStyle, markerModel.ecModel),
     y: labelY,
     style: Object.assign({text: labelData.name}, textStyle),
     z: 101,
@@ -67111,7 +67222,7 @@ function createLabel({x, y, labelData, markerModel, gridRect, position: position
   const lineEl = new Line_default({
     style: lineStyle,
     shape: {
-      x1: showName && isLeft ? gridRect.x - 10 : gridRect.x,
+      x1: showName && isLeft ? gridRect.x + 10 : gridRect.x,
       y1: y,
       x2: showName && !isLeft ? gridRect.x + gridRect.width - 10 : gridRect.x + gridRect.width,
       y2: y
@@ -67146,7 +67257,7 @@ function updateLabel({x, y, labelData, markerModel, gridRect, position: position
         }
         element.attr({
           shape: {
-            x1: showName && isLeft ? gridRect.x - 10 : gridRect.x,
+            x1: showName && isLeft ? gridRect.x + 10 : gridRect.x,
             y1: y,
             x2: showName && !isLeft ? gridRect.x + gridRect.width - 10 : gridRect.x + gridRect.width,
             y2: y
@@ -67158,7 +67269,8 @@ function updateLabel({x, y, labelData, markerModel, gridRect, position: position
       case "textLabel":
         const textLabel = labelData.text;
         const labelX = isLeft ? getLeftTextX(x, textLabel, textStyle, markerModel.ecModel) : x;
-        element.x = labelX + (labelTextStyle ? 1 : 0);
+        const margin = isLeft ? -1 : 1;
+        element.x = labelX + (labelTextStyle ? margin : 0);
         element.y = labelY;
         element.attr("style", Object.assign({text: textLabel}, textStyle, labelTextStyle));
         break;
@@ -67168,7 +67280,7 @@ function updateLabel({x, y, labelData, markerModel, gridRect, position: position
           return;
         }
         const nameLabel = labelData.name;
-        const nameX = isLeft ? x : getLeftTextX(x, nameLabel, textStyle, markerModel.ecModel);
+        const nameX = isLeft ? gridRect.x : getLeftTextX(gridRect.x + gridRect.width, nameLabel, textStyle, markerModel.ecModel);
         element.x = nameX;
         element.y = labelY;
         element.attr("style", Object.assign({text: nameLabel}, textStyle, labelTextStyle));