cesium 之 flyTo、setView、lookat

orientation配置项的参数

cesium中，朝向orientation，通常使用heading、pitch、roll这三个参数来描述

heading

javascript 复制代码

通过调整`heading`的值，使相机朝向特定的方向

朝向方向说明【北：0，  东：π/2弧度，  南：π弧度，  西：-π/2弧度】

'例如'：
	让，相机朝向，西北方向：
		将heading设置为正北（0弧度）和正西（-π/2弧度）之间的某个值

	让，相机朝向，西南方向：
		将heading设置为正南（π弧度）和正西（-π/2弧度）之间的某个值

pitch

javascript 复制代码

pitch：'控制相机的俯仰角'，它的值决定了，'相机视线' 与 '地平面' 之间的角度


因为，'pitch是以弧度为单位的'，
所以，它的取值范围在理论上是从负无穷到正无穷，
但是，实际上对于相机的可视化来说，它的有效范围是有限的。


1、Cesium.Math.toRadians(0)：
	相机水平看向地平线（默认值），相机的视线，完全平行于地平面

2、Cesium.Math.toRadians(-90)：
	相机直视地面，相机的视线，完全垂直于地平面，朝向地面

3、Cesium.Math.toRadians(90)：
	相机直视天空，相机的视线，完全垂直于地平面，朝向天空
	在某些情况下，由于'地球曲率'和'相机的近裁剪面（near clipping plane）'的限制，相机可能无法完全直视天空


补充：
	1、
		介于`Cesium.Math.toRadians(-90)` 和 `Cesium.Math.toRadians(90)`之间的值，
		表示：相机在地面和天空之间的某个角度上，正值（表示相机向上看），负值（表示相机向下看）

	2、
		pitch的值，不能超过其有效范围，否则可能会导致相机视图不可见或不可预测的行为。

	3、
		'pitch的值，是相对于地平面的'，而不是，相对于相机当前位置的法线方向，
		因此，当相机位置发生变化时，相同的pitch值可能会导致相机看向不同的方向，
		如果需要让相机始终朝向某个固定点或方向，可能需要使用其他方式（如lookAt方法或调整相机的位置和朝向）来实现。

roll

javascript 复制代码

roll：
	用于描述，相机绕其视线方向（Direction轴，即+X轴）旋转的角度，'单位是弧度'。
	（roll通常用于表示，相机在保持heading和pitch不变的情况下，绕其视线方向的旋转）

定义：
	roll：相机绕Direction轴（视线方向）旋转的角度，Direction轴为+X轴，且绕+X轴旋转为正。

【右手定则】
	核心：以`场景`为根本
	当你的右手拇指指向X轴的正方向（即视线方向）时，其他四个手指的弯曲方向表示了旋转的正方向。

【旋转方向】：
	roll为正，相机将绕视线方向，顺时针旋转（根据右手定则来转）
	roll为负，相机将绕视线方向，逆时针旋转（根据右手定则来转）

例子：
	1、Cesium.Math.toRadians(0)：
		表示，相机没有发生绕视线方向的旋转，即保持其原始朝向。
	
	2、Cesium.Math.toRadians(180)（或Math.PI）：
		表示，相机绕视线方向旋转了180度，即相机上下颠倒。
	
	3、介于Cesium.Math.toRadians(0)和Cesium.Math.toRadians(180)之间的值：
		表示，相机在保持heading和pitch不变的情况下，绕视线方向发生了不同程度的旋转。


实际应用
	在Cesium中，roll通常用于模拟某些特殊效果，如：飞机的翻滚动作、相机的特殊视角，
	在大多数情况下，你可能不需要频繁地调整roll的值，但在需要精细控制相机视角时，了解并调整roll可能会很有帮助。

---------------------------------------------------------------

三种方法

flyTo

javascript 复制代码

viewer.value.camera.flyTo({
	// destination：目的地
	destination: Cesium.Cartesian3.fromDegrees(-122.4175, 37.655, 400),
	duration: 3.0, // 飞行持续时间（秒）
	orientation: {
		heading: Cesium.Math.toRadians(20), // 朝向（单位：弧度，20度，转换为弧度）
		pitch: Cesium.Math.toRadians(-15), // 倾斜（单位：弧度，-15度，转换为弧度）
		roll: 0.0 // 翻滚（通常设置为0）
	},
	complete: () => {
		console.log('飞行动画完成后，被调用')
	},
	cancel: () => {
		console.log('飞行动画被取消时，被调用')
	}
})

setView

javascript 复制代码

const setView = () => {
  // 将相机移动到北京的上空，并朝向地面
  const position = Cesium.Cartesian3.fromDegrees(116.4, 39.9, 1000)
  viewer.value.camera.setView({
    destination: position,
    orientation: {
      heading: Cesium.Math.toRadians(0),
      pitch: Cesium.Math.toRadians(-90),
      roll: Cesium.Math.toRadians(90)
    }
  })
}

lookat

javascript 复制代码

'lookAt方法'，用于将相机（即视角）锁定到指定的位置，并可能在此基础上应用一定的偏移。

【语法】
	let target = Cesium.Cartesian3.fromRadians(经度, 纬度, height) // 设置目标位置
	let offset = new Cesium.HeadingPitchRange(heading, pitch, range) // 设置偏移
	viewer.camera.lookAt(target, offset)

例子：
	const lookat = () => {
		/* 
			Cesium.Cartesian3.fromDegrees(120.0, 30.0, 3000000)
			将经纬度（120.0, 30.0）和高度（3000000 米）转换为 Cartesian3对象（表示3D空间中的一个点）
			这里设置的目标位置是：东经120.0度、北纬30.0度，并且距离地球表面3000000米
		*/
		const target = Cesium.Cartesian3.fromDegrees(120.0, 30.0, 3000000)
		
		/*
			0：相机的朝向（Heading），表示正北方向
			
			Cesium.Math.PI_OVER_TWO：相机的俯仰（Pitch），表示相机向下看，即朝向地球。
				【Cesium.Math.PI_OVER_TWO 等于 Math.PI / 2，即90度】 
				所以 "-Cesium.Math.PI_OVER_TWO 等于 -90度"，即指向地面。
			
			5000000：是相机的范围（Range），
				表示，相机距离目标点的距离是`5000000`米。

		*/
		const offset = new Cesium.HeadingPitchRange(0, -Cesium.Math.PI_OVER_TWO, 5000000)
		viewer.value.camera.lookAt(target, offset)
	}