基础地图-在线地图-天地图（无标注）

柔情只为你懂 2023-06-04 12:53 88阅读 0赞

示例效果：  
![1340563-20190820154351458-1955697710.png][]

代码展示：

<!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>
        
        <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>

![1340563-20190820155037165-1632469076.png][]

传送门：[天地图官网][Link 1]

先注册-->申请成为个人开发者-->控制台创建引用-->应用key=此处的tk

转载于:https://www.cnblogs.com/justyouadmin/p/11383345.html

[1340563-20190820154351458-1955697710.png]: /images/20230601/775a08ab80f44890a8642d25bd8a9832.png
[1340563-20190820155037165-1632469076.png]: /images/20230601/aace74009ae548339e31f581f1377060.png
[Link 1]: https://www.tianditu.gov.cn/?tdsourcetag=s_pcqq_aiomsg