关于天地图的key和cesium的token去官网申请一下就行了
下面废话不多说直接上代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>天地图</title>
<!-- 引用cesium的js和css,天地图的扩展js -->
<script src="/scripts/Build/Cesium/Cesium.js"></script>
//注意自己的srcf的路径与自己的html文件的关系,可能与博主有区别
<script src="http://api./cdn/plugins/cesium/cesiumTdt.js" ></script>
<link rel="stylesheet" href="/scripts/Build/Cesium/Widgets/widgets.css"/>
//注意自己的href路径与自己的html文件的关系,可能与博主有区别
<style type="text/css">
html, body, #tiandituContainer {
width: 100%; height: 100%; margin: 0; padding: 0; overflow: hidden;
}
</style>
</head>
<body>
<div id="tiandituContainer"></div>
<script>
var cesiumAsset='换成自己的 token';
var tiandituTk='换成自己的 key';
// 服务负载子域
var subdomains=['0','1','2','3','4','5','6','7'];
Cesium.Ion.defaultAccessToken = cesiumAsset;
var viewer = new Cesium.Viewer('tiandituContainer',{
animation:false, //动画
homeButton:true, //home键
geocoder:true,//地址编码
baseLayerPicker:false, //图层选择控件
timeline:false, //时间轴
fullscreenButton:true, //全屏显示
infoBox:true,//点击要素之后浮窗
sceneModePicker:true, //投影方式 三维/二维
navigationInstructionsInitiallyVisible:false, //导航指令
navigationHelpButton:false, //帮助信息
selectionIndicator:false, // 选择
imageryProvider: new Cesium.WebMapTileServiceImageryProvider({
//影像底图
url:"http://{s}./img_w/wmts?service=wmts&request=GetTile&version=1.0.0&LAYER=img&tileMatrixSet=w&TileMatrix={TileMatrix}&TileRow={TileRow}&TileCol={TileCol}&style=default&format=tiles&tk=换成自己的 key" ,
subdomains: ["t0", "t1", "t2", "t3", "t4", "t5", "t6", "t7"],
layer: "tdtImgLayer",
style: "default",
format: "image/jpeg",
tileMatrixSetID: "GoogleMapsCompatible",//使用谷歌的瓦片切片方式
show: true
})
});
viewer._cesiumWidget._creditContainer.style.display = "none"; // 隐藏cesium ion
viewer.imageryLayers.addImageryProvider(new Cesium.WebMapTileServiceImageryProvider({
//影像注记
url: "http://t{s}./cia_w/wmts?service=wmts&request=GetTile&version=1.0.0&LAYER=cia&tileMatrixSet=w&TileMatrix={TileMatrix}&TileRow={TileRow}&TileCol={TileCol}&style=default.jpg&tk=换成自己的 key",
subdomains: subdomains,
layer: "tdtCiaLayer",
style: "default",
format: "image/jpeg",
tileMatrixSetID: "GoogleMapsCompatible",
show: true
}));
// 将三维球定位到中国
viewer.camera.flyTo({
destination: Cesium.Cartesian3.fromDegrees(103.84, 31.15, 17850000),
orientation: {
heading : Cesium.Math.toRadians(348.4202942851978),
pitch : Cesium.Math.toRadians(-89.74026687972041),
roll : Cesium.Math.toRadians(0)
},
complete:function callback() {
// 定位完成之后的回调函数
}
});
</script>
</body>
</html>