相机的方向和位置
浏览器所展现的内容其实就是相机照到的内容，我们是从Cesium的相机来观察Cesium的世界。在Cesium中，使用Camera类来表示相机。
场景Camera获取
var viewer=new Cesium.Viewer("cesiumContainer");
var camera=viewer.camera;
camera常用方法
setView()
setView方法是瞬间到达，没有过渡时间。
//创建一个笛卡尔三维坐标（从经纬度转）
var position=Cesium.Cartesian3.fromDegrees(116.39742,39.9092,100);
camera.setView({
//设置相机位置
destination:position,
//设置相机视角
orientation: {
//设置相机朝向
heading: Cesium.Math.toRadians(0.0),
//设置相机俯仰角
pitch: Cesium.Math.toRadians(-90.0),
//设置相机翻滚角
roll: 0.0,
},
})
destination属性
该属性表示的是相机所处位置，其放入的变量为三维笛卡尔坐标类（Cartesian3）
orientation属性
该属性表示的是三个角度，分别为heading（朝向）、pitch（俯仰角）和roll（翻滚角）。 单位都为弧度
heading表示的是物体与z轴的旋转角（好比身体转向，脸的朝向改变），pitch表示的是物体与y轴的旋转角（好比抬头和低头），roll表示的是物体与x轴的旋转角（好比我们的头左右歪头，头向肩膀靠）
代码中的pitch为-90°，相机就会正向下。（我们的视线垂直地球表面）
camera.setView({
//设置相机位置
destination:position,
//设置相机视角
orientation: {
//设置相机朝向（脸朝向）
heading: Cesium.Math.toRadians(0.0),
//设置相机俯仰角（抬低头）
pitch: Cesium.Math.toRadians(90.0),
//设置相机翻滚角（歪头）
roll: 0.0,
},
})
代码中的pitch为90°，相机就会正向上。（我们的视线看向天空）
camera.setView({
//设置相机位置
destination:position,
//设置相机视角
orientation: {
//设置相机朝向
heading: Cesium.Math.toRadians(0.0),
//设置相机俯仰角
pitch: Cesium.Math.toRadians(0.0),
//设置相机翻滚角
roll: 0.0,
},
})
代码中的pitch为0°，相机就会看向地平线。（我们的视线看向远处）
我们把pitch设置为-90，也就是看向地球表面。然后，把heading设置为0°
camera.setView({
//设置相机位置
destination:position,
//设置相机视角
orientation: {
//设置相机朝向
heading: Cesium.Math.toRadians(0.0),
//设置相机俯仰角
pitch: Cesium.Math.toRadians(-90.0),
//设置相机翻滚角
roll: 0.0,
},
})
此时相机看到的场景是这样：
把pitch设置为-90，也就是看向地球表面。然后，把heading设置为45°
camera.setView({
//设置相机位置
destination:position,
//设置相机视角
orientation: {
//设置相机朝向
heading: Cesium.Math.toRadians(45.0),
//设置相机俯仰角
pitch: Cesium.Math.toRadians(-90.0),
//设置相机翻滚角
roll: 0.0,
},
})
此时相机看到的场景是这样：
相当于身体转向了45°（好比是低着头转动身体45°）
把heading改回为0°，pitch设置为-45°（好比45°俯视）
camera.setView({
//设置相机位置
destination:position,
//设置相机视角
orientation: {
//设置相机朝向
heading: Cesium.Math.toRadians(0.0),
//设置相机俯仰角
pitch: Cesium.Math.toRadians(-45.0),
//设置相机翻滚角
roll: 0.0,
},
})
此时，相机的场景是这样：
把roll设置为-45°
camera.setView({
//设置相机位置
destination:position,
//设置相机视角
orientation: {
//设置相机朝向
heading: Cesium.Math.toRadians(0.0),
//设置相机俯仰角
pitch: Cesium.Math.toRadians(-45.0),
//设置相机翻滚角
roll: 0.0,
},
})
此时，相机的场景是这样：
roll从0设置为-45°好比头向左肩膀靠45°
flyto()
flyto方法是缓慢到达，有一个动画。
viewer.camera.flyTo({
destination: position,
duration: 2,
orientation: {
heading: Cesium.Math.toRadians(0.0),
pitch: Cesium.Math.toRadians(-45.0),
roll: 0.0,
},
})
destination和orientation属性和上面一样。duration表示动画过渡时间，单位秒。
键盘控制相机位置
监听键盘按键事件
document.addEventListener("keydown",(e)=>{
console.log(e)
})
使用document.addEventListener()来监听键盘按键事件，其中的回调函数中的参数e如下图所示。
我们可以使用参数e的key属性来判断按下了哪个键。
document.addEventListener("keydown",(e)=>{
if(e.key=='w')
{
console.log("按下了w")
}
})
键盘动态改变相机的位置与方位
document.addEventListener("keydown",(e)=>{
//通过相机高度来设置相机向前移动的速率
var height=viewer.camera.positionCartographic.height;
var movespeed=height/100;
if(e.key=='w')
{
//相机向前移动（改变相机位置）
viewer.camera.moveForward(movespeed);
}else if(e.key=='s')
{
//相机向后移动（改变相机位置）
viewer.camera.moveBackward(movespeed);
}else if(e.key=='a')
{
//相机向左移动（改变相机位置）
viewer.camera.moveLeft(movespeed);
}else if(e.key=='d')
{
//相机向右移动（改变相机位置）
viewer.camera.moveRight(movespeed);
}else if(e.key=='q')
{
//相机向左旋转0.5°（改变相机朝向heading，好比身体向左转）
viewer.camera.lookLeft(Cesium.Math.toRadians(0.5));
}else if(e.key=='e')
{
//相机向左旋转0.5°（改变相机朝向heading，好比身体向右转）
viewer.camera.lookRight(Cesium.Math.toRadians(0.5));
}else if(e.key=='r')
{
//相机向上旋转0.5°（改变相机俯仰角pitch，好比抬头）
viewer.camera.lookUp(Cesium.Math.toRadians(0.5));
}else if(e.key=='t')
{
//相机向下旋转0.5°（改变相机俯仰角pitch，好比低头）
viewer.camera.lookDown(Cesium.Math.toRadians(0.5));
}else if(e.key=='y')
{
//相机向左翻滚（改变相机翻滚角roll,好比向左歪头）
viewer.camera.twistLeft(Cesium.Math.toRadians(0.5));
}else if(e.key=='u')
{
//相机向左翻滚（改变相机翻滚角roll,好比向右歪头）
viewer.camera.twistRight(Cesium.Math.toRadians(0.5));
}
})
