1200字范文,内容丰富有趣,写作的好帮手!
1200字范文 > cesium加载天地图的卫星影像图

cesium加载天地图的卫星影像图

时间:2024-03-29 21:31:35

相关推荐

cesium加载天地图的卫星影像图

关于天地图的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>

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。