81 lines
3.2 KiB
HTML
81 lines
3.2 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="utf-8" />
|
||
<script src="./Build/Cesium/Cesium.js"></script>
|
||
<link href="./Build/Cesium/Widgets/widgets.css" rel="stylesheet" />
|
||
<style>
|
||
@import url(./Build/Cesium/Widgets/widgets.css);
|
||
html,
|
||
body,
|
||
#cesiumContainer {
|
||
width: 100%;
|
||
height: 100%;
|
||
margin: 0;
|
||
padding: 0;
|
||
overflow: hidden;
|
||
}
|
||
</style>
|
||
<!-- <script src="https://cesium.com/downloads/cesiumjs/releases/1.68/Build/Cesium/Cesium.js"></script> -->
|
||
<!-- <link href="https://cesium.com/downloads/cesiumjs/releases/1.68/Build/Cesium/Widgets/widgets.css" rel="stylesheet"> -->
|
||
</head>
|
||
<body>
|
||
<div id="cesiumContainer"></div>
|
||
<script>
|
||
/**
|
||
* 数据主要分为两大类
|
||
* 1、地形数据和影像服务
|
||
* 2、矢量数据
|
||
*
|
||
* 地形数据相当于Cesium的骨架，影像地图则是Cesium的外衣，骨架只有一副，外衣可以换。
|
||
* 一个项目中通常只有一种地形数据，terrainProvider不支持多种地形数据的叠加。
|
||
*
|
||
* 使用Cesium的静态方法Cesium.createWorldTerrain()加载Cesium的全球地形数据，这需要一个Cesium Ion账号的token。
|
||
* 它包含了地形光照数据，以及水面效果所以的水域数据（开启地形光照需要使用VertextNormals扩展，水体流动效果可以通过请求WaterMask方法设置）
|
||
*/
|
||
Cesium.Ion.defaultAccessToken =
|
||
"eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiI5ZjRjNTZkNC01NDYxLTRhMjQtOGEwZC1kZjA3YzQ5YTJlZDkiLCJpZCI6MjYwODQsInNjb3BlcyI6WyJhc3IiLCJnYyJdLCJpYXQiOjE1ODcxOTMwODN9.prGsSKyAW_9Ow5zHYPhbm3LsQL-ApQw5-5PNJkDaHi8";
|
||
var viewer = new Cesium.Viewer("cesiumContainer", {
|
||
scene3DOnly: true,
|
||
selectionIndicator: false,
|
||
baseLayerPicker: false,
|
||
//使用Cesium ion 中的高程服务
|
||
// terrainProvider: new Cesium.CesiumTerrainProvider({
|
||
// url: Cesium.IonResource.fromAssetId(1),
|
||
// }),
|
||
terrainProvider: Cesium.createWorldTerrain({
|
||
requestVertexNormal: true, //添加地形光照
|
||
requestWaterMask: true, //添加水面波浪效果
|
||
}),
|
||
});
|
||
viewer.scene.globe.enableLighting = true; //terrain和globe同时设置才会有光照效果
|
||
|
||
// viewer.camera.setView({
|
||
// destination: new Cesium.Cartesian3(318563.80878618505, 5644591.227282946, 2966285.7276969287),
|
||
// orientation: {
|
||
// heading: 6.134811516839214,
|
||
// pitch: -0.25770321622063097,
|
||
// roll: 0.000020402764222104963,
|
||
// },
|
||
// });
|
||
|
||
/**
|
||
添加定义地形数据
|
||
*/
|
||
var rectAngle = new Cesium.Rectangle(
|
||
Cesium.Math.toRadians(109.96181),
|
||
Cesium.Math.toRadians(19.86912),
|
||
Cesium.Math.toRadians(115.23594),
|
||
Cesium.Math.toRadians(25.05672)
|
||
);
|
||
// var customTerrainLayer = new Cesium.CesiumTerrainProvider({
|
||
// url:"http://localhost:9000/terrain/911d68d07b9511ecbf80f19916c6cf74",
|
||
// requestWaterMask:false,
|
||
// credit:"版权信息"
|
||
// });
|
||
// viewer.terrainProvider = customTerrainLayer;
|
||
viewer.camera.flyTo({ destination: rectAngle });
|
||
</script>
|
||
</body>
|
||
</html>
|