1. 程式人生 > >arcgis api for javascrpt呼叫google 地圖

arcgis api for javascrpt呼叫google 地圖

<!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>Tiled map service</title>
    <link rel="stylesheet" href="https://js.arcgis.com/3.24/esri/css/esri.css">
    <style>
        html, body, #map {
            height: 100%;
            width: 100%;
            margin: 0;
            padding: 0;
        }
    </style>


    <script src="https://js.arcgis.com/3.24/"></script>
    <script>
      var map;


      require(["esri/map",
        "esri/layers/ArcGISTiledMapServiceLayer",
        "esri/layers/WebTiledLayer",
        "esri/geometry/Extent",
        "esri/geometry/Point",
        "esri/SpatialReference",
        "dojo/domReady!"],
        function(Map, ArcGISTiledMapServiceLayer,WebTiledLayer,Extent, Point, SpatialReference) {
            //初始化地圖範圍
            var fullExtent = new Extent({ xmin: 12618458.717709353, ymin: 2649413.0984451086, xmax: 12642918.566760575, ymax: 2654878.3459674916, spatialReference: { wkid: 102100 } });
            initMap();


            //初始化地圖
            function initMap() {
                map = new Map("map", {
                    extent: fullExtent,
                    logo: false,
                    slider: false//是否顯示放大縮小控制元件
                });


                //google地圖
                var gMap = new WebTiledLayer("http://mt${subDomain}.google.cn/maps/vt?lyrs=s%40717&hl=zh-CN&gl=CN&x=${col}&y=${row}&z=${level}", {
                    "id": "gMap",
                    "subDomains": ["0", "1", "2"]
                });


                map.addLayer(gMap);


                var gMap2 = new WebTiledLayer("http://mt${subDomain}.google.cn/maps/vt/imgtp=png32&
[email protected]
&hl=x-local&gl=cn&x=${col}&y=${row}&z=${level}&s=G", {
                    "id": "gMap2",
                    "subDomains": ["0", "1", "2"]
                });
                map.addLayer(gMap2);
            }
        }
      );
    </script>
</head>
<body>
    <div id="map"></div>
</body>
</html>