示例效果：
代碼展示：
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<meta name="xbsj-labels" content="Earth示例"></meta>
<title>天地圖-無標記</title>
<!-- 0 引入js文件 -->
<script src="../../XbsjEarth/XbsjEarth.js"></script>
<style>
html,
body {
width: 100%;
height: 100%;
margin: 0px;
padding: 0px;
}
</style>
</head>
<body>
<div id="earthContainer" style="width: 100%; height: 100%; background: grey">
</div>
<script>
var earth;
function startup() {
earth = new XE.Earth('earthContainer');
earth.sceneTree.root = {
"children": [
{
"czmObject": {
"name": "天地圖",
"xbsjType": "Imagery",
"xbsjImageryProvider": {
"XbsjImageryProvider": {
"url": "http://t6.tianditu.com/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=xxxxxxxxxxxxxxxxxxxxxxxxxxx"
},
}
}
}
]
}
}
// 1 XE.ready()會加載Cesium.js等其他資源，注意ready()返回一個Promise對象。
XE.ready().then(startup);
</script>
</body>
</html>
傳送門：天地圖官網
先注冊-->申請成為個人開發者-->控制台創建引用-->應用key=此處的tk