From 6013d72881276aca9d17d93908d33b21194979c6 Mon Sep 17 00:00:00 2001
From: Mengting Jiang <787982239@qq.com>
Date: Fri, 18 Oct 2024 14:01:21 +0800
Subject: [PATCH] fix:  prevent label overlap in multiple charts (#6490)

---
 src/label-transform/exceedAdjust.ts | 9 ++++-----
 src/runtime/plot.ts                 | 3 ++-
 src/runtime/types/component.ts      | 2 ++
 3 files changed, 8 insertions(+), 6 deletions(-)

diff --git a/src/label-transform/exceedAdjust.ts b/src/label-transform/exceedAdjust.ts
index bc60d436a3..828782d5ad 100644
--- a/src/label-transform/exceedAdjust.ts
+++ b/src/label-transform/exceedAdjust.ts
@@ -34,9 +34,7 @@ export type ExceedAdjustOptions = Omit<ExceedAdjustLabel, 'type'>;
  * adjust the label when exceed the plot
  */
 export const ExceedAdjust: LLC<ExceedAdjustOptions> = () => {
-  return (labels: DisplayObject[], { canvas }) => {
-    const { width, height } = canvas.getConfig();
-
+  return (labels: DisplayObject[], { canvas, layout }) => {
     labels.forEach((l) => {
       show(l);
       const { max, min } = l.getRenderBounds();
@@ -47,9 +45,10 @@ export const ExceedAdjust: LLC<ExceedAdjustOptions> = () => {
           [xMin, yMin],
           [xMax, yMax],
         ],
+        // Prevent label overlap in multiple charts by calculating layouts separately to avoid collisions.
         [
-          [0, 0],
-          [width, height],
+          [layout.x, layout.y],
+          [layout.x + layout.width, layout.y + layout.height],
         ],
       );
       // For label with connectorPoints
diff --git a/src/runtime/plot.ts b/src/runtime/plot.ts
index c6000f0434..2ec5314f29 100644
--- a/src/runtime/plot.ts
+++ b/src/runtime/plot.ts
@@ -1229,11 +1229,12 @@ function plotLabel(
   const labelGroups = group(labelShapes, (d) =>
     labelDescriptor.get(d.__data__),
   );
-  const { coordinate } = view;
+  const { coordinate, layout } = view;
 
   const labelTransformContext = {
     canvas: context.canvas,
     coordinate,
+    layout,
   };
   for (const [label, shapes] of labelGroups) {
     const { transform = [] } = label;
diff --git a/src/runtime/types/component.ts b/src/runtime/types/component.ts
index 3d54483126..576891d566 100644
--- a/src/runtime/types/component.ts
+++ b/src/runtime/types/component.ts
@@ -15,6 +15,7 @@ import {
   Vector2,
   G2MarkState,
   GuideComponentPlane,
+  Layout,
 } from './common';
 import { DataComponent } from './data';
 import { Encode, EncodeComponent } from './encode';
@@ -233,6 +234,7 @@ export type LabelTransform = (
   context: {
     coordinate: Coordinate;
     canvas: Canvas;
+    layout: Layout;
   },
 ) => DisplayObject[];
 export type LabelTransformComponent<O = Record<string, unknown>> =