From fec2765f60d0465cd5a0178eb05c1bb4f9455691 Mon Sep 17 00:00:00 2001
From: tongcizhang <ztongci@gmail.com>
Date: Tue, 26 May 2026 16:55:48 +0900
Subject: [PATCH 1/2] fix(web): recreate Cesium3DTileset and
 ClippingPlaneCollection when tile source changes

---
 .../Visualizer/Engine/Cesium/Tileset/index.tsx   | 16 ++++++++++++++--
 1 file changed, 14 insertions(+), 2 deletions(-)

diff --git a/web/src/classic/components/molecules/Visualizer/Engine/Cesium/Tileset/index.tsx b/web/src/classic/components/molecules/Visualizer/Engine/Cesium/Tileset/index.tsx
index ef7af152a..3e2ef5df6 100644
--- a/web/src/classic/components/molecules/Visualizer/Engine/Cesium/Tileset/index.tsx
+++ b/web/src/classic/components/molecules/Visualizer/Engine/Cesium/Tileset/index.tsx
@@ -87,8 +87,17 @@ const Tileset: FC<PrimitiveProps<Property, any, SceneProperty>> = memo(function
     }
     return prevPlanes.current;
   }, [_planes]);
-  // Create immutable object
-  const [clippingPlanes] = useState(
+
+  const tilesetKey =
+    sourceType === "osm"
+      ? "osm"
+      : sourceType === "google-photorealistic"
+        ? "google"
+        : tileset ?? "";
+
+  // Recreate when tilesetKey changes: Cesium destroys the ClippingPlaneCollection
+  // when its parent Cesium3DTileset is destroyed, so we must not reuse it.
+  const clippingPlanes = useMemo(
     () =>
       new CesiumClippingPlaneCollection({
         planes: planes?.map(
@@ -101,6 +110,8 @@ const Tileset: FC<PrimitiveProps<Property, any, SceneProperty>> = memo(function
         edgeWidth: edgeWidth,
         edgeColor: toColor(edgeColor),
       }),
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [tilesetKey],
   );
   const tilesetRef = useRef<Cesium3DTilesetType>();
 
@@ -244,6 +255,7 @@ const Tileset: FC<PrimitiveProps<Property, any, SceneProperty>> = memo(function
 
   return !isVisible || (!tileset && !sourceType) || !tilesetUrl ? null : (
     <Cesium3DTileset
+      key={tilesetKey}
       ref={ref}
       url={tilesetUrl}
       style={style}

From 8efd8d9faa6609dd84cd11c377c9bbab407dcf8c Mon Sep 17 00:00:00 2001
From: tongcizhang <ztongci@gmail.com>
Date: Tue, 26 May 2026 19:31:35 +0900
Subject: [PATCH 2/2] refactor: add planes and edgeWidth, edgeColor to useMemo

---
 .../molecules/Visualizer/Engine/Cesium/Tileset/index.tsx        | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/web/src/classic/components/molecules/Visualizer/Engine/Cesium/Tileset/index.tsx b/web/src/classic/components/molecules/Visualizer/Engine/Cesium/Tileset/index.tsx
index 2f99bbe2d..4782deb76 100644
--- a/web/src/classic/components/molecules/Visualizer/Engine/Cesium/Tileset/index.tsx
+++ b/web/src/classic/components/molecules/Visualizer/Engine/Cesium/Tileset/index.tsx
@@ -118,7 +118,7 @@ const Tileset: FC<PrimitiveProps<Property, any, SceneProperty>> = memo(function
         edgeColor: toColor(edgeColor),
       }),
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    [tilesetKey],
+    [planes, edgeWidth, edgeColor, tilesetKey],
   );
   const tilesetRef = useRef<Cesium3DTilesetType>();