Camera表示观察场景的视角。通过操作摄像机，可以控制视图的位置、方向和角度。
帮助文档：Camera - Cesium Documentation
1 setView
setView 方法允许你指定相机的目标位置和姿态。你可以通过 Cartesian3 对象来指定目标位置，并通过 orientation 对象来设置相机的航向、俯仰和翻滚角。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>相机</title>
<script src="../../libs/Cesium/Cesium.js"></script>
<link href="../../libs/Cesium/Widgets/widgets.css" rel="stylesheet">
<style>
html,
body {
margin: 0px;
padding: 0px;
}
</style>
</head>
<body>
<div id="puiedu-cesiumContainer"></div>
<script>
Cesium.Ion.defaultAccessToken = '你的key';
const viewer = new Cesium.Viewer('puiedu-cesiumContainer');
const position = Cesium.Cartesian3.fromDegrees(116.39,39.91,400);
viewer.camera.setView({
destination:position,
orientation:{
heading:Cesium.Math.toRadians(0),
pitch:Cesium.Math.toRadians(-90),
roll:0
}
})
</script>
</body>
</html>destination：接受两种类型，一个是Cartesian3，我们这里用鼠标点击获取到经纬度之后，转换成笛卡尔坐标系传递。另一个类型是Rectangle，这个我们在下边讲解。
orientation（欧拉角）：调整相机视角方向的；它有3个参数：heading、pitch、roll
- heading 值为 0 时，指向正北方，随着数值变大，顺时针旋转（模型左右摆动），航向角，代表飞机的航向。
- pitch 值为 0 时，相机前后保持水平，改变数值（模型上下摆动），负值时俯视，负得越大，越向下俯视，正值时仰视，正得越大，越向上仰视，这就是为什么用-180°-180°的角度范围，而不是0°-360°，很方便记忆和理解，俯仰角，俯（向下）为负，仰（向上）为正。
- roll 值为 0 时，相机左右保持水平，改变数值（模型左右摆动），roll和pitch的表现类似，只是将前后变成了左右，左为负，右为正，用-180°-180°也很方便记忆和理解。
duration：飞行时间，单位秒；
您可以修改控件上的值，然后看每个值被修改后，相机是如何变化的，您会得出以下结论。
效果如下：
2 flyTo
flyTo 方法会让相机以动画的方式飞到指定的位置，你可以设置飞行时间和其他动画参数。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>相机</title>
<script src="../../libs/Cesium/Cesium.js"></script>
<link href="../../libs/Cesium/Widgets/widgets.css" rel="stylesheet">
<style>
html,
body {
margin: 0px;
padding: 0px;
}
</style>
</head>
<body>
<div id="puiedu-cesiumContainer"></div>
<script>
Cesium.Ion.defaultAccessToken = '你的key';
const viewer = new Cesium.Viewer('puiedu-cesiumContainer');
const position = Cesium.Cartesian3.fromDegrees(116.39,39.91,400);
viewer.camera.flyTo({
destination:position,
orientation: {
heading: Cesium.Math.toRadians(0),
pitch: Cesium.Math.toRadians(-90),
roll: 0
},
duration:5,
})
</script>
</body>
</html>这里的参数和setView中的一致，这里就不讲解了。
效果如下：
启动后，会发现相机通过飞行的方式到底制定位置。
3 lookAt
lookAt 方法允许相机以某个位置为中心来确定位置和姿态。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>相机</title>
<script src="../../libs/Cesium/Cesium.js"></script>
<link href="../../libs/Cesium/Widgets/widgets.css" rel="stylesheet">
<style>
html,
body {
margin: 0px;
padding: 0px;
}
</style>
</head>
<body>
<div id="puiedu-cesiumContainer"></div>
<script>
Cesium.Ion.defaultAccessToken = '你的key';
const viewer = new Cesium.Viewer('puiedu-cesiumContainer');
const center = Cesium.Cartesian3.fromDegrees(116.39,39.91);
const heading = Cesium.Math.toRadians(50);
const pitch = Cesium.Math.toRadians(-90);
const range = 2500;
viewer.camera.lookAt(center, new Cesium.HeadingPitchRange(heading,pitch,range));
</script>
</body>
</html>效果如下：
4 viewBoundingSphere
它的视角切换效果也是和setView方法一样，没有飞行过渡效果，直接切换视口到指定目的地。优点是可以指定玩目标点后，可以从多个角度更好的观测。
代码如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>相机</title>
<script src="../../libs/Cesium/Cesium.js"></script>
<link href="../../libs/Cesium/Widgets/widgets.css" rel="stylesheet">
<style>
html,
body {
margin: 0px;
padding: 0px;
}
</style>
</head>
<body>
<div id="puiedu-cesiumContainer"></div>
<script>
Cesium.Ion.defaultAccessToken = '你的key';
const viewer = new Cesium.Viewer('puiedu-cesiumContainer');
const position = Cesium.Cartesian3.fromDegrees(116.39,39.91,1500);
var orientation = Cesium.Transforms.headingPitchRollQuaternion(position, new Cesium.HeadingPitchRoll(-90,0,0));
var entity = viewer.entities.add({
position:position,
orientation:orientation,
model:{
uri:"../../libs/models/Cesium_Air.glb",
minimumPixelSize:100,
maximumScale:10000,
show:true
}
});
viewer.camera.viewBoundingSphere(new Cesium.BoundingSphere(position,20),new Cesium.HeadingPitchRange(0,0,0));
</script>
</body>
</html>效果如下：
无论如何移动相机的视角都是绑定在飞机模型上的，由此发现，当我们需要对一个物体进行多角度观测时，或者建筑物进行定点漫游时，我们就需要viewBoundingSphere方法。
