写在前面的话:

1.百度地图是自己定义的坐标系统,wkid=102100.百度地图数据是加密的产物。下文将附上百度坐标与WGS84,谷歌等坐标系统转换方法(地理-地理),此方法并未亲测,据说准

2.百度地图可以直接加载经纬度坐标

3.百度地图如果加载的arcgis api中会出现坐标偏移,1.中已经解决了地理坐标转换,那么找到百度投影-地理坐标的转换方式,则arcgis就可以直接无偏加载了,网上很多方法,但是亲测不行。

4.天地图不是涉密数据,根据本文提供的类库,arcgis api for js可以直接加载。但是数据有略微的偏移

天地图的切片地图可以通过esri.layers.TiledMapServiceLayer来加载,在此将之进行了一定的封装,如下:

1、切片线划图——TDTLayer.js

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
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://t" + col % 8 + ".tianditu.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";
            }
        });
    });

2、切片标注——TDTAnnoLayer.js

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
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://t" + row % 8 + ".tianditu.cn/cva_c/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=cva&STYLE=default&TILEMATRIXSET=c&TILEMATRIX=" + level + "&TILEROW=" + row + "&TILECOL=" + col + "&FORMAT=tiles";
            }
        });
    });

封装好之后就可以在页面调用了,调用的时候需要导入这些自定义的图层,导入方式为:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<script type="text/javascript">
    dojoConfig = {
        parseOnLoad: true,
        packages: [{
            name: 'tdlib',
            location: this.location.pathname.replace(/\/[^/]+$/, "")+"/js/tdlib"
        }]
    };
</script>
<script src="http://localhost/arcgis_js_api/library/3.9/3.9/init.js"></script>
<script>
    require(["tdlib/TDTLayer",
        "tdlib/TDTAnnoLayer"],
    function (TDTLayer,
         TDTAnnoLayer
    ){
        var basemap = new TDTLayer();
        map.addLayer(basemap);
        var annolayer = new TDTAnnoLayer();
        map.addLayer(annolayer);
    });
</script><br><br><span style="color: rgb(128, 0, 0);">完整调用代码:<br></span>
1
<strong>[javascript]</strong> <a title="view plain" class="ViewSource" href="http://blog.csdn.net/gisshixisheng/article/details/44853709#">view plain</a><span data-mod="popu_168"> <a title="copy" class="CopyToClipboard" href="http://blog.csdn.net/gisshixisheng/article/details/44853709#">copy</a><span data-mod="popu_169"> <a title="print" class="PrintSource" href="http://blog.csdn.net/gisshixisheng/article/details/44853709#">print</a><a title="?" class="About" href="http://blog.csdn.net/gisshixisheng/article/details/44853709#">?</a><span class="tracking-ad" data-mod="popu_167"><a title="在CODE上查看代码片" style="text-indent: 0px;" href="https://code.csdn.net/snippets/635113" target="_blank"><img width="12" height="12" style="left: 2px; top: 1px; position: relative;" alt="在CODE上查看代码片" src="https://code.csdn.net/assets/CODE_ico.png"></a><span class="tracking-ad" data-mod="popu_170"><a title="派生到我的代码片" style="text-indent: 0px;" href="https://code.csdn.net/snippets/635113/fork" target="_blank"><img width="12" height="12" style="left: 2px; top: 2px; position: relative;" alt="派生到我的代码片" src="https://code.csdn.net/assets/ico_fork.svg"></a></span></span></span></span>
1
<span style="color: rgb(128, 0, 0);"><br><br><br><!DOCTYPE html><br><html><br><head><br>    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><br>    <title>Baidu Map</title><br>   <link rel="stylesheet" href="https://js.arcgis.com/3.17/esri/css/esri.css"><br>    <style><br>        html, body, #map {<br>            height: 100%;<br>            margin: 0;<br>            padding: 0;<br>        }<br>        .base-map-ano{<br>            position: absolute;<br>            right: 0pt;<br>            top:18pt;<br>            background: #e6edf1;<br>            border: #96aed1 1px solid;<br>            padding: 4px 5px;<br>            padding-left: 0px;<br>            padding-top: 0px;<br>            display: none;<br>            font-weight: normal;<br>        }<br>        .base-map{<br>            position: absolute;<br>            right: 15pt;<br>            top:15pt;<br>            background: #f0f0f0;<br>            border: #96aed1 1px solid;<br>            width: auto;<br>            height: auto;<br>            z-index: 99;<br>            font:normal 11px "宋体",Arial;<br>            color:#868686;<br>        }<br>        .base-map-switch{<br>            padding: 4px 8px;<br>            float: left;<br>        }<br>        .base-map-switch-active{<br>            background:#e6edf1;<br>            font-weight: bold;<br>            color: #4d4d4d;<br>        }<br>        .base-map-switch:hover{<br>            cursor: pointer;<br>        }<br>        .base-map-switch-center{<br>            border: 1px #96aed1 solid;<br>            border-top:none;<br>            border-bottom:none;<br>        }<br>    </style><br>    <script type="text/javascript"><br>        dojoConfig = {<br>            parseOnLoad: true,<br>            packages: [{<br>                name: 'bdlib',<br>                location: this.location.pathname.replace(/\/[^/]+$/, "")+"/js/bdlib"<br>            }]<br>        };<br>    </script><br>    <script type="text/javascript" src="js/transformspatial.js"></script><br>    <script src="https://js.arcgis.com/3.17/"></script><br>    <script type="text/javascript" src="js/plugins/jquery-1.11.1.min.js"></script><br>    <script><br>       var test=GPS.mercator_encrypt(39.115698,117.264604);<br>       console.log(test);<br>        var map,showMap,anoCtrl;<br>        require(["esri/map",<br>            "bdlib/BDVecLayer",<br>            "bdlib/BDImgLayer",<br>            "bdlib/BDAnoLayer",<br>            "esri/layers/FeatureLayer",<br>            "esri/geometry/Point",<br>            "esri/SpatialReference",<br>            "dojo/domReady!"],<br>                function (Map,<br>                          BDVecLayer,<br>                          BDImgLayer,<br>                          BDAnoLayer,<br>                          FeatureLayer,<br>                          Point,<br>                          SpatialReference<br>                        ){<br>                    map = new Map("map", {<br>                        logo: false<br>                    });<br>                    var vecMap = new BDVecLayer();<br>                    var imgMap = new BDImgLayer();<br>                    var anoMap = new BDAnoLayer();<br>                    map.addLayer(vecMap);<br>                    map.addLayers([imgMap,anoMap]);<br>                    imgMap.hide(),anoMap.hide();<br>map.on("mouse-down",function(item){<br>                        mousedownlocation=item;<br>                        console.log(item.mapPoint.x+"||"+item.mapPoint.y);<br>                        //console.log(mousedownlocation.pageX+"down||down"+mousedownlocation.pageY);<br>                    })<br>                    var pt = new Point(7795368.13681627, 2813270.0795953586, new SpatialReference({ wkid: 102100 }));<br>                    map.centerAndZoom(pt, 19);<br>                    map.on("mouse-move",function(evt){<br>                      // console.log(evt);<br>                    })<br>                    showMap = function(layer){<br>                        //设置按钮样式<br>                        var baseMap = ["vec","img"];<br>                        for(var i= 0, dl=baseMap.length;i<dl;i++){<br>                            $("#"+baseMap[i]).removeClass("base-map-switch-active");<br>                        }<br>                        $("#"+layer).addClass("base-map-switch-active");<br>                        //设置显示地图<br>                        switch(layer){<br>                            case "img":{//影像<br>                                vecMap.hide();<br>                                imgMap.show();<br>                                $("#ano").show();<br>                                break;<br>                            }<br>                            default :{//地图<br>                                vecMap.show();<br>                                imgMap.hide(),anoMap.hide();<br>                                $("#ano").hide();<br>                                $("#chkAno").attr("checked",false);<br>                                break;<br>                            }<br>                        }<br>                    };<br>                    anoCtrl = function(){<br>                        if($("#chkAno").is(":checked")){<br>                            anoMap.show();<br>                        }<br>                        else{<br>                            anoMap.hide();<br>                        }<br>                    }<br>                });<br>    </script><br></head><br><body><br><div id="map"><br>    <div class="base-map"><br>        <div id="vec" class="base-map-switch base-map-switch-active" onclick="showMap('vec')">地图</div><br>        <div id="img" class="base-map-switch base-map-switch-center"  onclick="showMap('img')">影像<br>            <div id="ano" class="base-map-ano"><br>                <input id="chkAno" type="checkbox" name="chkAno" value="chkAno" onchange="anoCtrl()"/>标注<br>            </div><br>        </div><br>    </div><br></div><br></body><br></html><br><br><br>百度地图可调用的有地图切片,影像切片,以及道路等POI切片,我将之用<span style="font-family: Consolas; font-size: 9pt;"><span style="font-family: Consolas; font-size: 9pt;">TiledMapServiceLayer做了扩展,成了BDAnoLayer,BDVecLayer,BDimgLayer三个图层,其代码如下:</span></span></span>

BDAnoLayer.js

  1. define(["dojo/_base/declare",
  2. "esri/layers/tiled"],
  3. function (declare) {
  4. return declare(esri.layers.TiledMapServiceLayer, {
  5. constructor: function () {
  6. this.spatialReference = new esri.SpatialReference({ wkid: 102100 });
  7. this.initialExtent = (this.fullExtent = new esri.geometry.Extent(-20037508.3427892, -20037508.3427892, 20037508.3427892, 20037508.3427892, this.spatialReference));
  8. this.scale = [591657527.591555,295828763.795777,147914381.897889,73957190.948944,36978595.474472,18489297.737236,9244648.868618,
  9. 4622324.434309,2311162.217155,1155581.108577,577790.554289,288895.277144,144447.638572,72223.819286,
  10. 36111.9096437,18055.9548224,9027.977411,4513.988705,2256.994353,1128.497176];
  11. this.resolution = [156543.033928,78271.5169639999,39135.7584820001,19567.8792409999,9783.93962049996,4891.96981024998,2445.98490512499,
  12. 1222.99245256249,611.49622628138,305.748113140558,152.874056570411,76.4370282850732,38.2185141425366,19.1092570712683,9.55462853563415,
  13. 4.77731426794937,2.38865713397468,1.19432856685505,0.597164283559817,0.298582141647617];
  14. this.tileInfo = new esri.layers.TileInfo({
  15. "rows": 256,
  16. "cols": 256,
  17. "compressionQuality": 90,
  18. "origin": {
  19. "x": -20037508.3427892,
  20. "y": 20037508.3427892
  21. },
  22. "spatialReference": this.spatialReference,
  23. "lods": [{ "level": 0, "resolution": this.resolution[0], "scale": this.scale[0] },
  24. { "level": 1, "resolution": this.resolution[1], "scale": this.scale[1] },
  25. { "level": 2, "resolution": this.resolution[2], "scale": this.scale[2] },
  26. { "level": 3, "resolution": this.resolution[3], "scale": this.scale[3] },
  27. { "level": 4, "resolution": this.resolution[4], "scale": this.scale[4] },
  28. { "level": 5, "resolution": this.resolution[5], "scale": this.scale[5] },
  29. { "level": 6, "resolution": this.resolution[6], "scale": this.scale[6] },
  30. { "level": 7, "resolution": this.resolution[7], "scale": this.scale[7] },
  31. { "level": 8, "resolution": this.resolution[8], "scale": this.scale[8] },
  32. { "level": 9, "resolution": this.resolution[9], "scale": this.scale[9] },
  33. { "level": 10, "resolution": this.resolution[10], "scale": this.scale[10] },
  34. { "level": 11, "resolution": this.resolution[11], "scale": this.scale[11] },
  35. { "level": 12, "resolution": this.resolution[12], "scale": this.scale[12] },
  36. { "level": 13, "resolution": this.resolution[13], "scale": this.scale[13] },
  37. { "level": 14, "resolution": this.resolution[14], "scale": this.scale[14] },
  38. { "level": 15, "resolution": this.resolution[15], "scale": this.scale[15] },
  39. { "level": 16, "resolution": this.resolution[16], "scale": this.scale[16] },
  40. { "level": 17, "resolution": this.resolution[17], "scale": this.scale[17] },
  41. { "level": 18, "resolution": this.resolution[18], "scale": this.scale[18] },
  42. { "level": 19, "resolution": this.resolution[19], "scale": this.scale[19] }
  43. ]
  44. });
  45. this.loaded = true;
  46. this.onLoad(this);
  47. },
  48. getTileUrl: function (level, row, col) {
  49. var zoom = level - 1;
  50. var offsetX = parseInt(Math.pow(2, zoom));
  51. var offsetY = offsetX - 1;
  52. var numX = col - offsetX, numY = (-row) + offsetY ;
  53. var num = (col + row) % 8 + 1;
  54. return "http://online" + num + ".map.bdimg.com/tile/?qt=tile&x="+numX+"&y="+numY+"&z="+level+"&styles=sl&udt=20141015";
  55. }
  56. });
  57. });

BDVecLayer.js

  1. define(["dojo/_base/declare",
  2. "esri/layers/tiled"],
  3. function (declare) {
  4. return declare(esri.layers.TiledMapServiceLayer, {
  5. constructor: function () {
  6. this.spatialReference = new esri.SpatialReference({ wkid: 102100 });
  7. this.initialExtent = (this.fullExtent = new esri.geometry.Extent(-20037508.3427892, -20037508.3427892, 20037508.3427892, 20037508.3427892, this.spatialReference));
  8. this.scale = [591657527.591555,295828763.795777,147914381.897889,73957190.948944,36978595.474472,18489297.737236,9244648.868618,
  9. 4622324.434309,2311162.217155,1155581.108577,577790.554289,288895.277144,144447.638572,72223.819286,
  10. 36111.9096437,18055.9548224,9027.977411,4513.988705,2256.994353,1128.497176];
  11. this.resolution = [156543.033928,78271.5169639999,39135.7584820001,19567.8792409999,9783.93962049996,4891.96981024998,2445.98490512499,
  12. 1222.99245256249,611.49622628138,305.748113140558,152.874056570411,76.4370282850732,38.2185141425366,19.1092570712683,9.55462853563415,
  13. 4.77731426794937,2.38865713397468,1.19432856685505,0.597164283559817,0.298582141647617];
  14. this.tileInfo = new esri.layers.TileInfo({
  15. "rows": 256,
  16. "cols": 256,
  17. "compressionQuality": 90,
  18. "origin": {
  19. "x": -20037508.3427892,
  20. "y": 20037508.3427892
  21. },
  22. "spatialReference": this.spatialReference,
  23. "lods": [{ "level": 0, "resolution": this.resolution[0], "scale": this.scale[0] },
  24. { "level": 1, "resolution": this.resolution[1], "scale": this.scale[1] },
  25. { "level": 2, "resolution": this.resolution[2], "scale": this.scale[2] },
  26. { "level": 3, "resolution": this.resolution[3], "scale": this.scale[3] },
  27. { "level": 4, "resolution": this.resolution[4], "scale": this.scale[4] },
  28. { "level": 5, "resolution": this.resolution[5], "scale": this.scale[5] },
  29. { "level": 6, "resolution": this.resolution[6], "scale": this.scale[6] },
  30. { "level": 7, "resolution": this.resolution[7], "scale": this.scale[7] },
  31. { "level": 8, "resolution": this.resolution[8], "scale": this.scale[8] },
  32. { "level": 9, "resolution": this.resolution[9], "scale": this.scale[9] },
  33. { "level": 10, "resolution": this.resolution[10], "scale": this.scale[10] },
  34. { "level": 11, "resolution": this.resolution[11], "scale": this.scale[11] },
  35. { "level": 12, "resolution": this.resolution[12], "scale": this.scale[12] },
  36. { "level": 13, "resolution": this.resolution[13], "scale": this.scale[13] },
  37. { "level": 14, "resolution": this.resolution[14], "scale": this.scale[14] },
  38. { "level": 15, "resolution": this.resolution[15], "scale": this.scale[15] },
  39. { "level": 16, "resolution": this.resolution[16], "scale": this.scale[16] },
  40. { "level": 17, "resolution": this.resolution[17], "scale": this.scale[17] },
  41. { "level": 18, "resolution": this.resolution[18], "scale": this.scale[18] },
  42. { "level": 19, "resolution": this.resolution[19], "scale": this.scale[19] }
  43. ]
  44. });
  45. this.loaded = true;
  46. this.onLoad(this);
  47. },
  48. getTileUrl: function (level, row, col) {
  49. var zoom = level - 1;
  50. var offsetX = parseInt(Math.pow(2, zoom));
  51. var offsetY = offsetX - 1;
  52. var numX = col - offsetX, numY = (-row) + offsetY ;
  53. var num = (col + row) % 8 + 1;
  54. return "http://online" + num + ".map.bdimg.com/tile/?qt=tile&x="+numX+"&y="+numY+"&z="+level+"&styles=pl&scaler=1&udt=20141103";
  55. }
  56. });
  57. });

BDimgLayer.js

  1. define(["dojo/_base/declare",
  2. "esri/layers/tiled"],
  3. function (declare) {
  4. return declare(esri.layers.TiledMapServiceLayer, {
  5. constructor: function () {
  6. this.spatialReference = new esri.SpatialReference({ wkid: 102100 });
  7. this.initialExtent = (this.fullExtent = new esri.geometry.Extent(-20037508.3427892, -20037508.3427892, 20037508.3427892, 20037508.3427892, this.spatialReference));
  8. this.scale = [591657527.591555,295828763.795777,147914381.897889,73957190.948944,36978595.474472,18489297.737236,9244648.868618,
  9. 4622324.434309,2311162.217155,1155581.108577,577790.554289,288895.277144,144447.638572,72223.819286,
  10. 36111.9096437,18055.9548224,9027.977411,4513.988705,2256.994353,1128.497176];
  11. this.resolution = [156543.033928,78271.5169639999,39135.7584820001,19567.8792409999,9783.93962049996,4891.96981024998,2445.98490512499,
  12. 1222.99245256249,611.49622628138,305.748113140558,152.874056570411,76.4370282850732,38.2185141425366,19.1092570712683,9.55462853563415,
  13. 4.77731426794937,2.38865713397468,1.19432856685505,0.597164283559817,0.298582141647617];
  14. this.tileInfo = new esri.layers.TileInfo({
  15. "rows": 256,
  16. "cols": 256,
  17. "compressionQuality": 90,
  18. "origin": {
  19. "x": -20037508.3427892,
  20. "y": 20037508.3427892
  21. },
  22. "spatialReference": this.spatialReference,
  23. "lods": [{ "level": 0, "resolution": this.resolution[0], "scale": this.scale[0] },
  24. { "level": 1, "resolution": this.resolution[1], "scale": this.scale[1] },
  25. { "level": 2, "resolution": this.resolution[2], "scale": this.scale[2] },
  26. { "level": 3, "resolution": this.resolution[3], "scale": this.scale[3] },
  27. { "level": 4, "resolution": this.resolution[4], "scale": this.scale[4] },
  28. { "level": 5, "resolution": this.resolution[5], "scale": this.scale[5] },
  29. { "level": 6, "resolution": this.resolution[6], "scale": this.scale[6] },
  30. { "level": 7, "resolution": this.resolution[7], "scale": this.scale[7] },
  31. { "level": 8, "resolution": this.resolution[8], "scale": this.scale[8] },
  32. { "level": 9, "resolution": this.resolution[9], "scale": this.scale[9] },
  33. { "level": 10, "resolution": this.resolution[10], "scale": this.scale[10] },
  34. { "level": 11, "resolution": this.resolution[11], "scale": this.scale[11] },
  35. { "level": 12, "resolution": this.resolution[12], "scale": this.scale[12] },
  36. { "level": 13, "resolution": this.resolution[13], "scale": this.scale[13] },
  37. { "level": 14, "resolution": this.resolution[14], "scale": this.scale[14] },
  38. { "level": 15, "resolution": this.resolution[15], "scale": this.scale[15] },
  39. { "level": 16, "resolution": this.resolution[16], "scale": this.scale[16] },
  40. { "level": 17, "resolution": this.resolution[17], "scale": this.scale[17] },
  41. { "level": 18, "resolution": this.resolution[18], "scale": this.scale[18] },
  42. { "level": 19, "resolution": this.resolution[19], "scale": this.scale[19] }
  43. ]
  44. });
  45. this.loaded = true;
  46. this.onLoad(this);
  47. },
  48. getTileUrl: function (level, row, col) {
  49. var zoom = level - 1;
  50. var offsetX = parseInt(Math.pow(2, zoom));
  51. var offsetY = offsetX - 1;
  52. var numX = col - offsetX, numY = (-row) + offsetY ;
  53. var num = (col + row) % 8 + 1;
  54. return "http://shangetu" + num + ".map.bdimg.com/it/u=x="+numX+";y="+numY+";z="+level+";v=009;type=sate&fm=46&udt=20141015";
  55. }
  56. });
  57. });
1
2
<span style="color: rgb(128, 0, 0);">
<span style="font-family: Consolas; font-size: 9pt;"><span style="font-family: Consolas; font-size: 9pt;"><span style="font-family: Consolas;"><span class="tracking-ad" data-mod="popu_170"><strong>[javascript]</strong> <a title="view plain" class="ViewSource" href="http://blog.csdn.net/gisshixisheng/article/details/44853709#">view plain</a><span data-mod="popu_168"> <a title="copy" class="CopyToClipboard" href="http://blog.csdn.net/gisshixisheng/article/details/44853709#">copy</a><span data-mod="popu_169"> <a title="print" class="PrintSource" href="http://blog.csdn.net/gisshixisheng/article/details/44853709#">print</a><a title="?" class="About" href="http://blog.csdn.net/gisshixisheng/article/details/44853709#">?</a><span class="tracking-ad" data-mod="popu_167"><a title="在CODE上查看代码片" style="text-indent: 0px;" href="https://code.csdn.net/snippets/635113" target="_blank"><img width="12" height="12" style="left: 2px; top: 1px; position: relative;" alt="在CODE上查看代码片" src="https://code.csdn.net/assets/CODE_ico.png"></a><span class="tracking-ad" data-mod="popu_170"><a title="派生到我的代码片" style="text-indent: 0px;" href="https://code.csdn.net/snippets/635113/fork" target="_blank"><img width="12" height="12" style="left: 2px; top: 2px; position: relative;" alt="派生到我的代码片" src="https://code.csdn.net/assets/ico_fork.svg"></a></span></span></span></span></span></span></span></span></span>
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
  6. <style type="text/css">
  7. body, html,#allmap {width: 100%;height: 100%;overflow: hidden;margin:0;font-family:"微软雅黑";}
  8. </style>
  9. <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=你的秘钥"></script>
  10. <title>地图展示</title>
  11. </head>
  12. <body>
  13. <div id="allmap"></div>
  14. </body>
  15. </html>
  16. <script type="text/javascript">
  17. // 百度地图API功能
  18. var map = new BMap.Map("allmap");    // 创建Map实例
  19. map.centerAndZoom(new BMap.Point(116.404, 39.915), 5);  // 初始化地图,设置中心点坐标和地图级别
  20. map.addControl(new BMap.MapTypeControl());   //添加地图类型控件
  21. map.setCurrentCity("北京");          // 设置地图显示的城市 此项是必须设置的
  22. map.enableScrollWheelZoom(true);     //开启鼠标滚轮缩放
  23. </script>
1
<span style="color: rgb(128, 0, 0);"> </span>

arcgis api for javascipt 加载天地图、百度地图的更多相关文章

  1. ArcGIS API for Javascript 加载天地图(经纬度投影)

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  2. ArcGIS API for Javascript 加载天地图(墨卡托投影)

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  3. ArcGIS API for Silverlight 加载google地图

    原文:ArcGIS API for Silverlight 加载google地图 using System; using System.Net; using System.Windows; using ...

  4. ArcGIS API for Silverlight加载google地图(后续篇)

    原文:ArcGIS API for Silverlight加载google地图(后续篇) 之前在博客中(http://blog.csdn.net/taomanman/article/details/8 ...

  5. 解决ArcGIS API for Silverlight 加载地图的内外网访问问题

    原文:解决ArcGIS API for Silverlight 加载地图的内外网访问问题 先上一个类,如下: public class BaseClass { public static string ...

  6. ArcGIS api for javascript——加载查询结果,悬停显示信息窗口

    转自原文 ArcGIS api for javascript——加载查询结果,悬停显示信息窗口 描述 本例在开始和地图交互前执行一个查询任务并加在查询结果.这允许用户鼠标悬停在任意郡县时立即见到Inf ...

  7. ArcGis Javascript API (V3.6)加载天地图

    Arcgis的Javascript api开发很活跃,不知不觉都发布了3.6的版本了.该版本基于dojo 1.8.3开发的. 从dojo 1.8开始,AMD机制用得越来越多了,而且require([& ...

  8. (转载)arcgis for js - 解决加载天地图和WMTS服务,WMTS服务不显示的问题,以及wmts服务密钥。

    1 arcgis加载天地图和wmts服务 arcgis for js加载天地图的例子网上有很多,这里先不写了,后期有空再贴代码,这里主要分析下WMTS服务为什么不显示,怎么解决. 条件:这里的WMTS ...

  9. 使用ArcGIS JavaScript API 3.18 加载天地图

    对于中国开发者在创建GIS应用的时候,往往比较头疼的是底图资源的缺乏.其实国家测绘地信局就提供一个很好的免费资源:天地图.使用ArcGIS API的开发人员可以直接利用该资源作为地图应用的底图. Ar ...

随机推荐

  1. Jmeter接口自动化培训

    课程前提 速成班,讲的不会非常深,每个人基础不一样,但是实现接口自动化没有问题,因为jmeter更多的用来做性能测试.当然有兴趣我们也可以穿插一点 课程基本大纲 接口基础概念 部署本地测试环境(使用d ...

  2. pojPseudoprime numbers (快速幂)

    Description Fermat's theorem states that for any prime number p and for any integer a > 1, ap = a ...

  3. Win7 VSCode 离线安装Rust语言及环境配置

    前置依赖 装过Visual Studio或Visual Studio Build Tool 2015 下载Rust离线安装包 https://forge.rust-lang.org/other-ins ...

  4. P2747 [USACO5.4]周游加拿大Canada Tour

    题目描述 你赢得了一场航空公司举办的比赛,奖品是一张加拿大环游机票.旅行在这家航空公司开放的最西边的城市开始,然后一直自西向东旅行,直到你到达最东边的城市,再由东向西返回,直到你回到开始的城市.除了旅 ...

  5. [暑假集训Day1T1]黑暗城堡

    因为D[i]表示i号节点到1号节点的最短路径,所以可以先以1为源点跑一边SPFA,预处理出每个点到1号节点的最短路.之后开始考虑所谓的“最短路径生成树”,在这棵生成树中有以下性质:当fa[i]==no ...

  6. [Python] 迭代器是什么?你每天在用的for循环都依赖它!

    从循环说起 顺序,分支,循环是编程语言的三大逻辑结构,在Python中都得到了支持,而Python更是为循环结构提供了非常便利的语法:for ... in ... 刚从C语言转入Python的同学可能 ...

  7. python学习三十四天函数高阶函数定义及用法

    python函数高阶函数是把函数当成一个变量,传递给函数作为参数,或者函数的返回值里面有函数,都称为高阶函数, 1,把函数作为参数传递 def dac(x,y): return x+y def tes ...

  8. python学习第四天基本数据类型 int,string,bool

    python跟其他编程语言一样,拥有基本的数据类型,计算机 只能识别0101,python是解释语言,有其他的解释器 python整型 int a=10 type(a) "int| pyth ...

  9. JDK8之ArrayList源码

    ArrayList三个构造器 /** * Default initial capacity. */ private static final int DEFAULT_CAPACITY = 10; // ...

  10. linux 日常学习

    杀掉进程 ps aux |grep caddy axy5418+ 14186 0.0 1.7 117032 10372 ? Sl 02:17 0:00 caddy axy5418+ 14332 0.0 ...