WMTS加载

最新推荐文章于 2024-05-10 17:11:17 发布

su317

最新推荐文章于 2024-05-10 17:11:17 发布

阅读量1.7k

点赞数 2

本文链接：https://blog.csdn.net/su317/article/details/107958943

版权

使用arcgis js api 加载wmts代码

直接访问http://www.supermap.com.cn:8090/iserver/services/map-china400/wmts-china 可以直接查看wmts的GetCapabilities内容。等同于http://www.supermap.com.cn:8090/iserver/services/map-china400/wmts-china?SERVICE=WMTS&request=GetCapabilities

ResourceURl 可以通过http://www.supermap.com.cn:8090/iserver/services/map-china400/wmts-china/China/default/ChinaPublicServices_China/9/150/849.png进行访问。实际在web中查看network访问的地址是通过wmts的

GetTile进行访问的：

http://www.supermap.com.cn:8090/iserver/services/map-china400/wmts-china?SERVICE=WMTS&VERSION=1.0.0&REQUEST=GetTile&LAYER=China&STYLE=default&FORMAT=image/png&TILEMATRIXSET=ChinaPublicServices_China&TILEMATRIX=9&TILEROW=150&TILECOL=849

在JS代码中TileInfo的rows和cols应该是对应TileMatrix的TileWidth和TileHeight。如果修改该值，虽然也可以显示，但是会出现图片显示有问题，位置不对。超图中TileInfo中LODS是标准<WellKnownScaleSet>ChinaPublicServices</WellKnownScaleSet>，天地图http://t0.tianditu.gov.cn/img_w/wmts?request=GetCapabilities&service=wmts&tk=41992f255f5c4efffceb41e0f06d3dc2也是采用这个切图比例。但是其它省的发布的服务不一定是采用这个比例的（天地图官网可以查询其它地图服务），比如浙江（也不需要申请key）。天地图每个种类的地图都有两种切图，一种是经纬度，一个是墨卡托。

http://srv.zjditu.cn/ZJEMAP_2D/wmts?request=GetCapabilities&service=wmts

加载esr的WMTS服务

https://gibs.earthdata.nasa.gov/wmts/epsg4326/best/?SERVICE=WMTS&VERSION=1.0.0&REQUEST=GetTile&LAYER=SRTM_Color_Index&STYLE=default&FORMAT=image/png&TILEMATRIXSET=31.25m&TILEMATRIX=3&TILEROW=2&TILECOL=7

可以通过上面访问具体某个图片，但是https://gibs.earthdata.nasa.gov/wmts/epsg4326/best/?SERVICE=WMTS&request=GetCapabilities访问不到元数据信息，如何获取？还是该服务并没有提供此功能？

<!DOCTYPE html>
<html>

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
    <title>Map with WMTS resourceinfo</title>

    <link rel="stylesheet" href="https://js.arcgis.com/3.33/dijit/themes/claro/claro.css">
    <link rel="stylesheet" href="https://js.arcgis.com/3.33/esri/css/esri.css">
    <style>
        html,
        body,
        #map {
            height: 100%;
            width: 100%;
            margin: 0;
            padding: 0;
        }
    </style>
    <script src="https://js.arcgis.com/3.33/"></script>

    <script>
        require([
            "esri/map",
            "esri/layers/WMTSLayer",
            "esri/layers/WMTSLayerInfo",
            "esri/geometry/Extent",
            "esri/layers/TileInfo",
            "esri/SpatialReference",
            "dojo/parser",
            "dijit/layout/BorderContainer",
            "dijit/layout/ContentPane",
            "dojo/domReady!"
        ], function(
            Map, WMTSLayer, WMTSLayerInfo,
            Extent, TileInfo, SpatialReference,
            parser
        ) {
            parser.parse();

            var map = new Map("map", {
                center: [86.9, 28],
                zoom: 3
            });

            var tileInfo = new TileInfo({
                "dpi": 96,
                "format": "format/png",
                "compressionQuality": 0,
                "spatialReference": new SpatialReference({
                    "wkid": 4326
                }),
                "rows": 512,
                "cols": 512,
                "origin": {
                    "x": -180,
                    "y": 90
                },
                "lods": [{
                    "level": "0",
                    "scale": 236663484.36365247,
                    "resolution": 0.5624999999999999
                }, {
                    "level": "1",
                    "scale": 118331742.18182631,
                    "resolution": 0.28125000000000017
                }, {
                    "level": "2",
                    "scale": 59165871.090913124,
                    "resolution": 0.140625
                }, {
                    "level": "3",
                    "scale": 29582935.545456562,
                    "resolution": 0.0703125
                }, {
                    "level": "4",
                    "scale": 14791467.772728289,
                    "resolution": 0.03515625000000002
                }, {
                    "level": "5",
                    "scale": 395733.8863641415,
                    "resolution": 0.017578125000000003
                }, {
                    "level": "6",
                    "scale": 3697866.94318207,
                    "resolution": 0.008789062499999998
                }, {
                    "level": "7",
                    "scale": 1848933.471591035,
                    "resolution": 0.004394531249999999
                }, {
                    "level": "8",
                    "scale": 924466.7357955176,
                    "resolution": 0.002197265625
                }, {
                    "level": "9",
                    "scale": 462233.3678977588,
                    "resolution": 0.0010986328125
                }, {
                    "level": "10",
                    "scale": 231116.6839488794,
                    "resolution": 0.00054931640625
                }, {
                    "level": "11",
                    "scale": 115558.3419744397,
                    "resolution": 0.000274658203125
                }]
            });
            var tileExtent = new Extent(-180, -90, 180, 90, new SpatialReference({
                wkid: 4326
            }));

            var layerInfo = new WMTSLayerInfo({
                tileInfo: tileInfo,
                fullExtent: tileExtent,
                initialExtent: tileExtent,
                identifier: "SRTM_Color_Index",
                tileMatrixSet: "31.25m",
                format: "png",
                style: "default"
            });

            var resourceInfo = {
                version: "1.0.0",
                layerInfos: [layerInfo],
                copyright: "earthdata"
            };

            var options = {
                serviceMode: "KVP",
                resourceInfo: resourceInfo,
                layerInfo: layerInfo
            };

            wmtsLayer = new WMTSLayer("https://gibs.earthdata.nasa.gov/wmts/epsg4326/best", options);
            map.addLayer(wmtsLayer);
        });
    </script>
</head>

<body>
<div data-dojo-type="dijit/layout/BorderContainer" data-dojo-props="design:'headline', gutters:false" style="width: 100%; height: 100%; margin: 0;">

    <div id="map" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'center'">
        <div id="citationInfo">
            <a href="https://earthdata.nasa.gov">Earthdata</a>
            served by
            <a href="https://www.nasa.gov">NASA</a>
        </div>
    </div>

</div>
</body>

</html>

加载supermap发布的wmts服务

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
    <title>WMTS地图服务</title>
    <link rel="stylesheet" href="https://js.arcgis.com/3.33/dijit/themes/claro/claro.css">
    <link rel="stylesheet" href="https://js.arcgis.com/3.33/esri/css/esri.css">
    <script src="https://js.arcgis.com/3.33/"></script>

    <style>
        html,
        body,
        #map {
            height: 100%;
            width: 100%;
            margin: 0;
            padding: 0;
        }
    </style>

    <script>
        require([
            "esri/map",
            "esri/layers/WMTSLayer",
            "esri/layers/WMTSLayerInfo",
            "esri/geometry/Extent",
            "esri/layers/TileInfo",
            "esri/SpatialReference",
            "dojo/domReady!"
        ], function (
            Map,
            WMTSLayer,
            WMTSLayerInfo,
            Extent,
            TileInfo,
            SpatialReference,
            parser
        ) {
            var map = new Map("map", {
                center: [117,36.651],
                zoom: 8
            });

            var tileInfo = new TileInfo({
                "dpi": 96,
                "format": "image/png",
                "compressionQuality": 0,
                "spatialReference": new SpatialReference({
                    "wkid": 4326
                }),
                "rows": 256,
                "cols": 256,
                "origin": {
                    "x": -180,
                    "y": 90
                },
                "lods": [
                    {"level": "0","scale": 295829355.45,"resolution": 0.703125},
                    {"level": "1","scale": 147914677.725,"resolution": 0.3515625},
                    {"level": "2", "scale": 73957338.8625,"resolution": 0.17578125},
                    {"level": "3","scale": 36978669.43125,"resolution": 0.087890625},
                    {"level": "4","scale": 18489334.715625,"resolution": 0.0439453125},
                    {"level": "5","scale": 9244667.3578125,"resolution": 0.02197265625},
                    {"level": "6","scale": 4622333.67890625,"resolution": 0.010986328125},
                    {"level": "7","scale": 2311166.83945312,"resolution": 0.0054931640625},
                    {"level": "8","scale": 1155583.41972656,"resolution": 0.00274658203125},
                    {"level": "9","scale": 577791.709863281,"resolution": 0.001373291015625},
                    {"level": "10","scale": 288895.8549316406,"resolution": 0.0006866455078125},
                    {"level": "11","scale": 144447.9274658203,"resolution": 0.00034332275390625},
                    {"level": "12","scale": 4508.935440959931,"resolution": 0.000171661376953125},
                    {"level": "13","scale": 36111.98186645508,"resolution": 0.0000858306884765625},
                    {"level": "14","scale": 18055.99093322754,"resolution": 0.0000429153442382812},
                    {"level": "15","scale": 9027.99546661377,"resolution": 0.0000214576721191406},
                    {"level": "16","scale": 4513.997733306885,"resolution": 0.0000107288360595703},
                    {"level": "17","scale": 2256.9988666534423,"resolution": 0.00000536441802978515},
                    {"level": "18","scale": 1128.4994333267211,"resolution": 0.00000268220901489257},
                    {"level": "19","scale": 564.2497166633606,"resolution": 0.00000134110450744628}
                ]
            });
            var tileExtent = new Extent(-180.0 , -85.0511287798065,180.0 , 85.05112877980648, new SpatialReference({
                wkid: 4326
            }));

            var layerInfo = new WMTSLayerInfo({
                tileInfo: tileInfo,
                fullExtent: tileExtent,
                initialExtent: tileExtent,
                identifier: "China",
                tileMatrixSet: "ChinaPublicServices_China",
                format: "png",
                style: "default"
            });

            var resourceInfo = {
                version: "1.0.0",
                layerInfos: [layerInfo],
                copyright: ""
            };
            var options = {
                serviceMode: "KVP",
                resourceInfo: resourceInfo,
                layerInfo: layerInfo
            };
            var wmtsLayer = new WMTSLayer("http://www.supermap.com.cn:8090/iserver/services/map-china400/wmts-china", options);
            map.addLayer(wmtsLayer);
        });
    </script>
</head>
<body>
<div id="map"></div>
</body>
</html>

ArcMap加载天地图，因为需要tk，所以和其他的有所不同，（参数需要如下添加使用服务端tk）但是添加img_w平面的就无法显示？

添加之后拖动到地图窗口就可以显示

js加载使用申请的浏览器的tk

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no"/>
    <title>天地图影像(经纬度) - 4.x</title>

    <!-- 用4.12的api会报错  -->
    <link rel="stylesheet" href="https://js.arcgis.com/4.10/esri/css/main.css"/>
    <script src="https://js.arcgis.com/4.10/"></script>

    <style>
        html,
        body,
        #viewDiv {
            padding: 0;
            margin: 0;
            height: 100%;
            width: 100%;
        }
    </style>

    <script>
        require([
            "esri/Map",
            "esri/layers/WebTileLayer",
            'esri/layers/support/TileInfo',
            'esri/views/MapView',
            'dojo/domReady!'
        ], function (Map, WebTileLayer, TileInfo, MapView) {
            var tiandituBaseUrl = "http://{subDomain}.tianditu.com"; //天地图服务地址
            var token = "41992f255f5c4efffceb41e0f06d3dc2"; //天地图token

            // 首先设定瓦片信息，天地图经纬度地图的切片信息全部使用该信息设定
            var tileInfo = new TileInfo({
                dpi: 90.71428571427429,
                rows: 256,
                cols: 256,
                compressionQuality: 0,
                origin: {
                    x: -180,
                    y: 90
                },
                spatialReference: {
                    wkid: 4326
                },
                lods: [
                    {level: 2, levelValue: 2, resolution: 0.3515625, scale: 147748796.52937502},
                    {level: 3, levelValue: 3, resolution: 0.17578125, scale: 73874398.264687508},
                    {level: 4, levelValue: 4, resolution: 0.087890625, scale: 36937199.132343754},
                    {level: 5, levelValue: 5, resolution: 0.0439453125, scale: 18468599.566171877},
                    {level: 6, levelValue: 6, resolution: 0.02197265625, scale: 9234299.7830859385},
                    {level: 7, levelValue: 7, resolution: 0.010986328125, scale: 4617149.8915429693},
                    {level: 8, levelValue: 8, resolution: 0.0054931640625, scale: 2308574.9457714846},
                    {level: 9, levelValue: 9, resolution: 0.00274658203125, scale: 1154287.4728857423},
                    {level: 10, levelValue: 10, resolution: 0.001373291015625, scale: 577143.73644287116},
                    {level: 11, levelValue: 11, resolution: 0.0006866455078125, scale: 288571.86822143558},
                    {level: 12, levelValue: 12, resolution: 0.00034332275390625, scale: 144285.93411071779},
                    {level: 13, levelValue: 13, resolution: 0.000171661376953125, scale: 72142.967055358895},
                    {level: 14, levelValue: 14, resolution: 8.58306884765625e-005, scale: 36071.483527679447},
                    {level: 15, levelValue: 15, resolution: 4.291534423828125e-005, scale: 18035.741763839724},
                    {level: 16, levelValue: 16, resolution: 2.1457672119140625e-005, scale: 9017.8708819198619},
                    {level: 17, levelValue: 17, resolution: 1.0728836059570313e-005, scale: 4508.9354409599309},
                    {level: 18, levelValue: 18, resolution: 5.3644180297851563e-006, scale: 2254.4677204799655},
                    {level: 19, levelValue: 19, resolution: 2.68220901489257815e-006, scale: 1127.23386023998275},
                    {level: 20, levelValue: 2, resolution: 1.341104507446289075e-006, scale: 563.616930119991375}
                ]
            })

            //地图(经纬度)
            var tiledLayer = new WebTileLayer({
                urlTemplate: tiandituBaseUrl + "/DataServer?T=img_c&x={col}&y={row}&l={level}&tk=" + token,
                subDomains: ["t0", "t1", "t2", "t3", "t4", "t5", "t6", "t7"],
                tileInfo: tileInfo
            });

            //注记(经纬度)
            var tiledLayerAnno = new WebTileLayer({
                urlTemplate: tiandituBaseUrl + "/DataServer?T=cia_c&x={col}&y={row}&l={level}&tk=" + token,
                subDomains: ["t0", "t1", "t2", "t3", "t4", "t5", "t6", "t7"],
                tileInfo: tileInfo
            });

            // 创建地图，不设置底图，如果设置底图会造成坐标系无法被转换成 ESPG:4326 (WGS1984)
            var map = new Map({
                spatialReference: {
                    wkid: 4326
                },
                basemap: {
                    baseLayers: [tiledLayer, tiledLayerAnno]
                }
            });

            var view = new MapView({
                container: "viewDiv",
                spatialReference: {
                    wkid: 4326
                },
                map: map,
                center: [108.953098279, 34.2777998978],
                //1:scale的图
                scale: 2000000
            });

        });
    </script>
</head>

<body>
<div id="viewDiv"></div>
</body>
</html>

对于3.x的js api可以使用扩展TiledMapServiceLayer方式，注意网上代码url地址最新t1.tianditu.gov.cn

define(["dojo/_base/declare",
        "esri/layers/tiled"],
    function (declare) {
        return declare(esri.layers.TiledMapServiceLayer, {
            constructor: function () {
                this.spatialReference = new esri.SpatialReference({ wkid: 4326 });
                this.initialExtent = (this.fullExtent = new esri.geometry.Extent(-180.0, -90.0, 180.0, 90.0, this.spatialReference));
                this.tileInfo = new esri.layers.TileInfo({
                    "rows": 256,
                    "cols": 256,
                    "compressionQuality": 0,
                    "origin": {
                        "x": -180,
                        "y": 90
                    },
                    "spatialReference": {
                        "wkid": 4326
                    },
                    "lods": [
                        { "level": 2, "resolution": 0.3515625, "scale": 147748796.52937502 },
                        { "level": 3, "resolution": 0.17578125, "scale": 73874398.264687508 },
                        { "level": 4, "resolution": 0.087890625, "scale": 36937199.132343754 },
                        { "level": 5, "resolution": 0.0439453125, "scale": 18468599.566171877 },
                        { "level": 6, "resolution": 0.02197265625, "scale": 9234299.7830859385 },
                        { "level": 7, "resolution": 0.010986328125, "scale": 4617149.8915429693 },
                        { "level": 8, "resolution": 0.0054931640625, "scale": 2308574.9457714846 },
                        { "level": 9, "resolution": 0.00274658203125, "scale": 1154287.4728857423 },
                        { "level": 10, "resolution": 0.001373291015625, "scale": 577143.73644287116 },
                        { "level": 11, "resolution": 0.0006866455078125, "scale": 288571.86822143558 },
                        { "level": 12, "resolution": 0.00034332275390625, "scale": 144285.93411071779 },
                        { "level": 13, "resolution": 0.000171661376953125, "scale": 72142.967055358895 },
                        { "level": 14, "resolution": 8.58306884765625e-005, "scale": 36071.483527679447 },
                        { "level": 15, "resolution": 4.291534423828125e-005, "scale": 18035.741763839724 },
                        { "level": 16, "resolution": 2.1457672119140625e-005, "scale": 9017.8708819198619 },
                        { "level": 17, "resolution": 1.0728836059570313e-005, "scale": 4508.9354409599309 },
                        { "level": 18, "resolution": 5.3644180297851563e-006, "scale": 2254.4677204799655 }
                    ]
                });
                this.loaded = true;
                this.onLoad(this);
            },
            getTileUrl: function (level, row, col) {
                return "http://t1.tianditu.gov.cn/vec_c/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=vec&STYLE=default&TILEMATRIXSET=c&TILEMATRIX=" + level + "&TILEROW=" + row + "&TILECOL=" + col + "&FORMAT=tiles&tk=41992f255f5c4efffceb41e0f06d3dc2";
            }
        });
    });

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>TianDi Map</title>
    <link rel="stylesheet" href="https://js.arcgis.com/3.26/esri/css/esri.css">
    <style>
        html, body, #map {
            height: 100%;
            margin: 0;
            padding: 0;
        }
    </style>
    <script type="text/javascript">
        dojoConfig = {
            parseOnLoad: true,
            packages: [{
                name: 'bdlib',
                location: this.location.pathname.replace(/\/[^/]+$/, "")+"/js/bdlib"
            }]
        };
    </script>
    <script src="https://js.arcgis.com/3.26/"></script>
    <script>
        var map;
        require(["esri/map",
                "bdlib/TDTLayer",
                "esri/layers/FeatureLayer",
                "esri/geometry/Point",
                "esri/symbols/SimpleFillSymbol",
                "esri/symbols/SimpleLineSymbol",
                "dojo/_base/Color",
                "dojo/domReady!"],
            function (Map,
                      TDTLayer,
                      FeatureLayer,
                      Point,
                      SimpleFillSymbol,
                      SimpleLineSymbol,
                      Color
            ){
                map = new Map("map", { logo: false });
                var basemap = new TDTLayer();
                map.addLayer(basemap);
                var pt = new Point(103.847, 36.0473);
                map.centerAndZoom(pt, 3);
            });
    </script>
</head>
<body>
<div id="map"></div>
</body>
</html>

目录结构如下：

注意上面天地图使用的是经纬度的，如果是墨卡托地图只是修改了url地址这样虽然可以显示地图，但是经纬度定位是不对的。

http://www.supermap.com.cn:8090/iserver/services 超图官方的IServer

另外使用js3.x版本使用WMTSLayer加载天地图，（ArcGIS源码会给WMTSLayer的format字段自动加上“image/”，而天地图支持的格式“tiles”不接受format=image/png这样的参数）。可以参考https://blog.csdn.net/OldMonkeyYu_s/article/details/53710779?utm_medium=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-1.channel_param&depth_1-utm_source=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-1.channel_param

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
    <title>test</title>

    <style>
        html, body { height: 100%; width: 100%; margin: 0; padding: 0; }
        #map { padding:0; }
        #citationInfo { position:absolute; color:black; font-weight:bold; font-size:12pt; left:10px; bottom:10px; z-Index:999; }
    </style>
    <link rel="stylesheet" href="https://js.arcgis.com/3.18/esri/css/esri.css">

    <script type="text/javascript" src="https://js.arcgis.com/3.18compact/"></script>
    <script type="text/javascript" src="WMTSLayer.js"></script>
    <script>
        var map, wmtsLayer;
        require([
            "esri/map", "esri/layers/WMTSLayer", "esri/layers/WMTSLayerInfo",
            "esri/geometry/Extent", "esri/layers/TileInfo", "esri/SpatialReference",
            "dojo/parser",

            "dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dojo/domReady!"
        ], function (
            Map, WMTSLayer, WMTSLayerInfo,
            Extent, TileInfo, SpatialReference,
            parser
        ) {
            parser.parse();

            var bounds = new Extent({
                "xmin": -128.816, "ymin": 25.076, "xmax": -72.855, "ymax": 51.385,
                "spatialReference": { "wkid": 4326 }
            });
            map = new Map("map", {
                extent: bounds
            });

            var tileInfo1 = new TileInfo({
                "dpi": 96,
                "format": "tiles",
                "compressionQuality": 0,
                "spatialReference": new SpatialReference({
                    "wkid": 4326
                }),
                "rows": 256,
                "cols": 256,
                "origin": {
                    "x": -180,
                    "y": 90
                },
                "lods": [{
                    "level": "1",
                    "scale": 295829355.455,
                    "resolution": 0.703914402554
                }, {
                    "level": "2",
                    "scale": 147914677.727,
                    "resolution": 0.351957201277
                }, {
                    "level": "3",
                    "scale": 73957338.8636,
                    "resolution": 0.175978600638
                }, {
                    "level": "4",
                    "scale": 36978669.4318,
                    "resolution": 0.0879893003192
                }, {
                    "level": "5",
                    "scale": 18489334.7159,
                    "resolution": 0.0439946501596
                }, {
                    "level": "6",
                    "scale": 9244667.35796,
                    "resolution": 0.0219973250798
                }, {
                    "level": "7",
                    "scale": 4622333.67898,
                    "resolution": 0.0109986625399
                }, {
                    "level": "8",
                    "scale": 2311166.83949,
                    "resolution": 0.00549933126995
                }, {
                    "level": "9",
                    "scale": 1155583.41974,
                    "resolution": 0.00274966563497
                }, {
                    "level": "10",
                    "scale": 577791.709872,
                    "resolution": 0.00137483281749
                }]
            });
            var tileExtent1 = new Extent(-179.99999, -89.99999, 179.99999, 89.99999, new SpatialReference({
                wkid: 4326
            }));
            var layerInfo1 = new WMTSLayerInfo({
                tileInfo: tileInfo1,
                fullExtent: tileExtent1,
                initialExtent: tileExtent1,
                identifier: "vec",
                tileMatrixSet: "c",
                format: "png",
                style: "default"
            });

            var resourceInfo = {
                version: "1.0.0",
                layerInfos: [layerInfo1],
                copyright: "天地图"
            };

            var options = {
                serviceMode: "KVP",
                resourceInfo: resourceInfo,
                //如果没有配置resourceinfo会通过getCapacities获取
                layerInfo: layerInfo1,
                //附加参数
                customParameters:{tk:"41992f255f5c4efffceb41e0f06d3dc2"}
            };

            wmtsLayer = new WMTSLayer("http://t0.tianditu.gov.cn/vec_c/wmts", options);
            map.addLayer(wmtsLayer);
        });

    </script>
</head>

<body>
<div data-dojo-type="dijit/layout/BorderContainer"
     data-dojo-props="design:'headline', gutters:false"
     style="width: 100%; height: 100%; margin: 0;">

    <div id="map"
         data-dojo-type="dijit/layout/ContentPane"
         data-dojo-props="region:'center'">
        <div id="citationInfo">
            <a href="http://v2.suite.opengeo.org/geoserver/gwc/service/wmts">WMTS</a>
            served by
            <a href="http://opengeo.org/">天地图</a>
        </div>
    </div>

</div>
</body>
</html>

还可以参考https://gitee.com/MrHuanLiu/TDTLib

su317

关注

2
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
WMTS加载

使用arcgis js api 加载wmts代码直接访问http://www.supermap.com.cn:8090/iserver/services/map-china400/wmts-china可以直接查看wmts的GetCapabilities内容。等同于http://www.supermap.com.cn:8090/iserver/services/map-china400/wmts-china?SERVICE=WMTS&request=GetCapabilitiesReso.
复制链接

扫一扫