知道一串经纬度,如何使用cesium 漫游飞行,完整代码
时间: 2023-10-20 15:05:20 浏览: 100
使用 Cesium 进行漫游飞行需要以下步骤:
1. 创建地球实例
2. 创建相机实例
3. 设置相机的位置和朝向
4. 创建路径实例
5. 设置路径的经纬度点并添加到路径实例中
6. 创建路径漫游实例
7. 将路径漫游实例绑定到相机实例上
8. 启动路径漫游实例
下面是一个完整的示例代码:
```html
<!DOCTYPE html>
<html lang="en">
<head>
<title>Cesium Path Flyover</title>
<script src="https://cesiumjs.org/releases/1.88/Build/Cesium/Cesium.js"></script>
<link href="https://cesiumjs.org/releases/1.88/Build/Cesium/Widgets/widgets.css" rel="stylesheet">
<style>
html, body, #cesiumContainer {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
overflow: hidden;
}
</style>
</head>
<body>
<div id="cesiumContainer"></div>
<script>
// 创建地球实例
var viewer = new Cesium.Viewer('cesiumContainer', {
terrainProvider: Cesium.createWorldTerrain()
});
// 创建相机实例
var camera = viewer.camera;
// 设置相机的位置和朝向
var initialPosition = new Cesium.Cartesian3.fromDegrees(-74.018813, 40.691143, 20000.0);
var heading = Cesium.Math.toRadians(180.0);
var pitch = Cesium.Math.toRadians(-20.0);
var roll = Cesium.Math.toRadians(0.0);
camera.setView({
destination: initialPosition,
orientation: {
heading: heading,
pitch: pitch,
roll: roll
}
});
// 创建路径实例
var path = new Cesium.PathGraphics();
path.material = new Cesium.PolylineGlowMaterialProperty({
glowPower: 0.1,
color: Cesium.Color.RED
});
path.width = 10;
// 设置路径的经纬度点并添加到路径实例中
var positions = [
Cesium.Cartesian3.fromDegrees(-74.018813, 40.691143, 20000.0),
Cesium.Cartesian3.fromDegrees(-73.985453, 40.748817, 20000.0),
Cesium.Cartesian3.fromDegrees(-73.966373, 40.789640, 20000.0),
Cesium.Cartesian3.fromDegrees(-73.949358, 40.830856, 20000.0),
Cesium.Cartesian3.fromDegrees(-73.935242, 40.864386, 20000.0),
Cesium.Cartesian3.fromDegrees(-73.921127, 40.897916, 20000.0),
Cesium.Cartesian3.fromDegrees(-73.906311, 40.932580, 20000.0)
];
path.positions = new Cesium.CallbackProperty(function() {
return positions;
}, false);
// 创建路径漫游实例
var flight = new Cesium.FlightPath({
path: path,
orientation: Cesium.OrientationMode.HEADING_PITCH,
speed: 1000.0,
loop: true
});
// 将路径漫游实例绑定到相机实例上
camera.flightController.flight = flight;
// 启动路径漫游实例
camera.flightController.fly();
</script>
</body>
</html>
```
在这个示例中,我们创建了一个沿着经过多个经纬度点的路径进行漫游飞行的场景。你可以将经纬度点替换为你自己的点,并更改漫游的速度和循环方式来适应你的需求。
阅读全文
相关推荐
![-](https://img-home.csdnimg.cn/images/20241231044736.png)
![-](https://img-home.csdnimg.cn/images/20241231045053.png)
![-](https://img-home.csdnimg.cn/images/20241231045053.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![zip](https://img-home.csdnimg.cn/images/20241231045053.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![zip](https://img-home.csdnimg.cn/images/20241231045053.png)
![7z](https://img-home.csdnimg.cn/images/20241231044736.png)
![-](https://img-home.csdnimg.cn/images/20241231044955.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)