Cesium加载天地图在线卫星切片，中文标注，防止视角钻入底下，加载超图在线地形服务
本代码展示加载天地图服务卫星和中文标志
加载超图地形服务
解决视角钻入底下的问题
代码如下
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>超图加载在线地形数据stk</title>
<link rel="stylesheet" href="../Build/Widgets/widgets.css" />
<script type="text/javascript" src="../Build/Cesium.js" ></script>
</head>
<body>
<div id="cesiumContainer" style="width: 100%;height: 900px;background-color: rosybrown;"></div>
</body>
<script>
var url="https://www.supermapol.com/realspace/services/3D-stk_terrain/rest/realspace/datas/info/data/path";
var vtxfTerrainProvider = new Cesium.CesiumTerrainProvider({
url : url,
requestVertexNormals : true
});
var viewer = new Cesium.Viewer('cesiumContainer', {
terrainProvider: vtxfTerrainProvider,
imageryProvider : new Cesium.WebMapTileServiceImageryProvider({
url: 'http://t0.tianditu.com/img_w/wmts?',
layer: 'img',
style: 'default',
format: 'tiles',
tileMatrixSetID: 'w',
credit: new Cesium.Credit('天地图全球影像服务'),
maximumLevel: 18
})
});
//全球影像中文注记服务
viewer.imageryLayers.addImageryProvider(new Cesium.WebMapTileServiceImageryProvider({
url: "http://t0.tianditu.com/cia_w/wmts?service=wmts&request=GetTile&version=1.0.0&LAYER=cia&tileMatrixSet=w&TileMatrix={TileMatrix}&TileRow={TileRow}&TileCol={TileCol}&style=default.jpg",
layer: "tdtAnnoLayer",
style: "default",
format: "image/jpeg",
tileMatrixSetID: "GoogleMapsCompatible",
show: false
}));
viewer.clock.onTick.addEventListener(function () {
if(viewer.camera.pitch > 0){
viewer.scene.screenSpaceCameraController.enableTilt = false;
}
});
/**
* 放置视角钻入底下
*/
var mousePosition,startMousePosition;
var handler = new Cesium.ScreenSpaceEventHandler(viewer.canvas);
handler.setInputAction(function(movement) {
mousePosition=startMousePosition= Cesium.Cartesian3.clone(movement.position);
handler.setInputAction(function(movement) {
mousePosition = movement.endPosition;
var y = mousePosition.y - startMousePosition.y;
if(y>0){
viewer.scene.screenSpaceCameraController.enableTilt = true;
}
}, Cesium.ScreenSpaceEventType.MOUSE_MOVE);
}, Cesium.ScreenSpaceEventType.MIDDLE_DOWN);
viewer.camera.setView({
destination: Cesium.Cartesian3.fromDegrees(116.36115,39.916927,100000)
});
</script>
</html>