Arcgis api for js 3.x調用浙江省天地圖

Arcgis api for js 3.x調用浙江省天地圖

代碼

參照浙江天地圖的調用說明http://www.zjditu.cn/resource/apihelp,編寫代碼調用地wmts天圖服務。

<!DOCTYPE html>
<html>
<head>

    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no">
    <title>TDT_ZJ</title>
    <link rel="stylesheet" href="https://js.arcgis.com/3.27/dijit/themes/claro/claro.css" />
    <link rel="stylesheet" href="https://js.arcgis.com/3.27/esri/css/esri.css" />

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




    <script src="https://js.arcgis.com/3.27/"></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
    ) {


    var map = new Map("map", {
    center: [120.675,30.75],
    zoom: 19
    });

    var tileInfo = new TileInfo({
    "dpi": 96,
    "format": "format/png",
    "compressionQuality": 0,
    "spatialReference": new SpatialReference({"EPSG":4490 }),
    "rows": 256,
    "cols": 256,
    "origin": {
    "x": -180,
    "y": 90
    },
    "lods": [
        {"level": "0", "scale": 590995197.141669, "resolution": 1.40625},
        {"level": "1", "scale": 295497598.570835, "resolution": 0.703125},
        {"level": "2", "scale": 147748799.285417, "resolution":  0.3515625},
        {"level": "3", "scale": 73874399.6427086, "resolution": 0.17578125},
        {"level": "4", "scale": 36937199.8213543, "resolution":0.087890625},
        {"level": "5", "scale": 18468599.9106772, "resolution": 0.0439453125},
        {"level": "6","scale": 9234299.95533858, "resolution": 0.02197265625},
        {"level": "7", "scale": 4617149.97766929, "resolution": 0.010986328125},
        {"level": "8", "scale": 2308574.98883465, "resolution": 0.0054931640625},
        {"level": "9", "scale": 1154287.49441732, "resolution": 0.00274658203125},
        {"level": "10", "scale":  577143.747208661, "resolution": 0.001373291015625},
        {"level": "11", "scale": 288571.873604331, "resolution": 0.0006866455078125},
        {"level" : 12, "resolution" : 0.00034332275390625, "scale" : 144285.936802165},
        {"level" : 13, "resolution" : 0.000171661376953125, "scale" : 72142.9684010827},
        {"level" : 14, "resolution" : 8.58306884765625e-005, "scale" : 36071.4842005413},
        {"level" : 15, "resolution" : 4.291534423828125e-005, "scale" : 18035.7421002707},
        {"level" : 16, "resolution" : 2.1457672119140625e-005, "scale" : 9017.87105013533},
        {"level" : 17, "resolution" : 1.0728836059570313e-005, "scale" : 4508.93552506767},
        {"level" : 18, "resolution" : 5.3644180297851563e-006, "scale" : 2254.46776253383},
        {"level" : 19, "resolution" : 0.0000053644180297851563, "scale" : 1127.23388126692},
        {"level" : 20, "resolution" : 0.00000268220901489257815, "scale" : 563.616940633458}
    ]
    });
    var tileExtent = new Extent(117,20,123,59, new  SpatialReference({"wkid": 4326}));

    var layerInfo = new WMTSLayerInfo({
    tileInfo: tileInfo,
    fullExtent: tileExtent,
    initialExtent: tileExtent,
    identifier: "*",
    tileMatrixSet: "TileMatrixSet0",
    format: "png",
    style: "default"

    });

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

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

    wmtsLayer = new WMTSLayer("http://srv1.zjditu.cn/ZJEMAP_2D/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>

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

坑點

1,天地圖的座標系是脫敏過的,所以要定位到對應的範圍需要使用脫敏後的座標
2,wkid應該是4490,但是使用4490後會掉到海里,改成了4326。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章