packages/screen/src/views/3DSituationalAwarenessRefactor/composables/useDualMapCompare.js

@@ -6,7 +6,6 @@ import { use3DTiles } from './use3DTiles'
  * 双地图对比模式
  * 使用两个独立的Cesium Viewer实现并排对比
  * 左侧显示灾前场景，右侧显示灾后场景
- * 单向相机同步：右侧主地图驱动，左侧对比地图跟随
  */
 export function useDualMapCompare() {
   /** 左侧Viewer引用 */
@@ -59,25 +58,17 @@ export function useDualMapCompare() {
     // 移除默认的Cesium logo和版权信息
     viewer.cesiumWidget.creditContainer.style.display = 'none'
 
-    // 完全禁用左侧Viewer的所有交互（只作为对比显示）
-    viewer.scene.screenSpaceCameraController.enableRotate = false
-    viewer.scene.screenSpaceCameraController.enableTranslate = false
-    viewer.scene.screenSpaceCameraController.enableZoom = false
-    viewer.scene.screenSpaceCameraController.enableTilt = false
-    viewer.scene.screenSpaceCameraController.enableLook = false
-
     leftViewer.value = viewer
-    console.log('[useDualMapCompare] 左侧Viewer初始化成功（交互已禁用）')
+    console.log('[useDualMapCompare] 左侧Viewer初始化成功')
 
     return viewer
   }
 
   /**
-   * 设置单向相机同步（右→左）
-   * 右侧主地图驱动，左侧对比地图跟随
-   * 使用 postRender 实现逐帧同步，直接传递 position 引用以获得最佳性能
-   * @param {Cesium.Viewer} rightViewerInstance - 右侧Viewer（主地图，驱动者）
-   * @param {Cesium.Viewer} leftViewerInstance - 左侧Viewer（对比地图，跟随者）
+   * 设置相机同步
+   * 右侧相机移动时，左侧相机跟随
+   * @param {Cesium.Viewer} rightViewerInstance - 右侧Viewer（主地图）
+   * @param {Cesium.Viewer} leftViewerInstance - 左侧Viewer（对比地图）
    */
   const setupCameraSync = (rightViewerInstance, leftViewerInstance) => {
     if (!rightViewerInstance || !leftViewerInstance) {
@@ -85,23 +76,18 @@ export function useDualMapCompare() {
       return
     }
 
-    console.log('[useDualMapCompare] 设置单向相机同步（右→左）...')
+    console.log('[useDualMapCompare] 设置相机同步（右侧主地图 → 左侧对比地图）...')
 
-    /**
-     * 相机同步处理函数
-     * 在右侧 Viewer 的 postRender 中调用，将右侧相机状态同步到左侧
-     */
-    const handleCameraSync = () => {
-      // 检查 Viewer 是否有效
+    // 监听右侧相机变化
+    const syncCamera = () => {
       if (!leftViewerInstance || leftViewerInstance.isDestroyed()) return
-      if (!rightViewerInstance || rightViewerInstance.isDestroyed()) return
 
       const rightCamera = rightViewerInstance.camera
+      const leftCamera = leftViewerInstance.camera
 
-      // 直接传递 position 引用（不 clone），获得最佳性能
-      // Cesium 内部会处理拷贝，且在单向同步场景下安全
-      leftViewerInstance.camera.setView({
-        destination: rightCamera.position,
+      // 同步位置和方向
+      leftCamera.setView({
+        destination: rightCamera.position.clone(),
         orientation: {
           heading: rightCamera.heading,
           pitch: rightCamera.pitch,
@@ -110,17 +96,16 @@ export function useDualMapCompare() {
       })
     }
 
-    // 只在右侧 Viewer 的 postRender 中注册同步函数
-    // 确保右侧相机更新完成后再同步到左侧
-    rightViewerInstance.scene.postRender.addEventListener(handleCameraSync)
+    // 添加监听器
+    rightViewerInstance.camera.changed.addEventListener(syncCamera)
 
     // 保存移除函数
     cameraSyncRemover = () => {
-      rightViewerInstance.scene.postRender.removeEventListener(handleCameraSync)
+      rightViewerInstance.camera.changed.removeEventListener(syncCamera)
       console.log('[useDualMapCompare] 相机同步已移除')
     }
 
-    console.log('[useDualMapCompare] 单向相机同步设置完成')
+    console.log('[useDualMapCompare] 相机同步设置完成')
   }
 
   /**
@@ -170,7 +155,7 @@ export function useDualMapCompare() {
       }
     })
 
-    // 设置相机同步（单向：右→左）
+    // 设置相机同步（右侧主地图 → 左侧对比地图）
     setupCameraSync(rightViewerInstance, leftViewerInstance)
 
     // 异步加载灾前模型到左侧（不阻塞对比模式启用）