console 命令行工具 X clear
console
<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <title>ArcGIS API 示例 - 加载天地图</title>
    <link rel="stylesheet" href="https://js.arcgis.com/4.26/esri/css/main.css">
    <script src="https://js.arcgis.com/4.26/"></script>
    <style>
        html,
        body,
        #viewDiv {
            height: 100%;
            margin: 0;
            padding: 0;
        }
    </style>
</head>

<body>
    <div id="viewDiv"></div>
    <script>
        require([
            "esri/Map",
            "esri/views/MapView",
            "esri/layers/WebTileLayer"
        ], function (Map, MapView, WebTileLayer) {
            // 创建地图
            var map = new Map({
                //basemap: "topo-vector" // 设置基础地图
            });

            // 创建地图视图
            var view = new MapView({
                container: "viewDiv", // 将视图附加到 div
                map: map,
                center: [85, 42.2], // 设置中心点（经度, 纬度）
                zoom: 5 // 设置缩放级别
            });

            // 创建天地图 WebTileLayer
            var tiandituLayer = new WebTileLayer({
                id:'tiandituLayer',
                urlTemplate: "https://t0.tianditu.gov.cn/img_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=img&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles&transparent=true&TILEMATRIX={level}&TILEROW={row}&TILECOL={col}&tk=8c88eba266a165eac9c085724708f2f9",
            });

            // 将天地图图层添加到地图
            map.add(tiandituLayer);
        });
    </script>
</body>

</html>