cesium 分屏对比多窗同步_cesium 分屏同步-CSDN博客

本文介绍了一种实现双视图同步的方法，通过监听左右视图的移动事件，并在移动时更新另一个视图的相机位置来保持同步。此外，还提供了一个用于获取当前相机位置及其旋转角度的函数。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

不说废话, 代码

		// 视图同步
		this.leftViewer.eventManager.addCameraMoveListener(e => {
			if (this.isLeft() && this.synchronous) {
				const viewPoint = this.leftViewer.getViewPoint()
				this.rightViewer.baseViewer.camera.setView({
					destination: viewPoint.position,
					orientation: viewPoint.orientation
				})
			}
		})

		this.rightViewer.eventManager.addCameraMoveListener(e => {
			if (!this.isLeft() && this.synchronous) {
				const viewPoint = this.rightViewer.getViewPoint()
				this.leftViewer.baseViewer.camera.setView({
					destination: viewPoint.position,
					orientation: viewPoint.orientation
				})
			}
		})

获取相机位置

	/**
	 * 获取相机位置及旋转角度
	 * @return {{orientation: {heading: number, roll: number, pitch: number}, position: Cesium.Cartesian3}}
	 */
	getViewPoint() {
		return {
			position: this.baseViewer.camera.position.clone(),
			orientation: {
				heading: this.baseViewer.camera.heading,
				pitch: this.baseViewer.camera.pitch,
				roll: this.baseViewer.camera.roll
			}
		}
	}

监听move, 看鼠标在哪边

		// 记忆是哪一边在操作
		this.leftViewer.eventManager.addEventListener(EventConstant.MOUSE_MOVE, e => {
			this.currentOperation = ManyWindowViewer.LEFT_VIEWER
		})

		this.rightViewer.eventManager.addEventListener(EventConstant.MOUSE_MOVE, e => {
			this.currentOperation = ManyWindowViewer.RIGHT_VIEWER
		})


	/**
	 * 是否操纵左边
	 * @return {boolean}
	 */
	isLeft() {
		return this.currentOperation === ManyWindowViewer.LEFT_VIEWER
	}