Question

我想将谷歌地图图层添加到Esri BaseMapGallery控件。在我更新Web应用程序以使用最新的ArcGIS JS API 3.19之前，一切进展顺利。之后，BaseMapGallery不会将地图更改为任何Google图层。控制台没有错误。

你可以看到我创建她的现场演示：https://jsbin.com/denoduquzi/edit?html,output

如果我只是将Esri API版本降级到3.17它会正常工作，但升级到3.18或3.19时会失败

<title>Basemap gallery</title>
  <link rel="stylesheet" href="https://js.arcgis.com/3.19/dijit/themes/claro/claro.css">    
  <link rel="stylesheet" href="https://js.arcgis.com/3.19/esri/css/esri.css">
  <style> 
    html, body { height: 100%; width: 100%; margin: 0; padding: 0; }
    #map{
      padding:0;
    }
  </style> 
  <script>
    var djConfig = {
      async: true,
      packages: [
          { name: "agsjs", location: "https://maps.ngdc.noaa.gov/viewers/dijits/agsjs/xbuild/agsjs" }
      ]
    };
  </script>
  <script src="https://js.arcgis.com/3.19/"></script>
  <script type="text/javascript" src="https://www.google.com/jsapi"></script>
  <script> 
    var map;
    require([
      "esri/map", "esri/dijit/BasemapGallery", "esri/arcgis/utils",
      "dojo/parser",

      "dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dijit/TitlePane","agsjs/layers/GoogleMapsLayer",
      "dojo/domReady!"
    ], function(
      Map, BasemapGallery, arcgisUtils,
      parser
    ) {
      parser.parse();

      map = new Map("map", {
        basemap: "topo",
        center: [-105.255, 40.022],
        zoom: 13
      });

      //add the basemap gallery, in this case we'll display maps from ArcGIS.com including bing maps
      var basemapGallery = new BasemapGallery({
        showArcGISBasemaps: true,
        toggleReference: true,
        google: {
          apiOptions: {
            v: '3.6'
          }
        },
        map: map
      }, "basemapGallery");
      basemapGallery.startup();

      basemapGallery.on("error", function(msg) {
        console.log("basemap gallery error:  ", msg);
      });
    });
  </script> 


  <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'" 
         style="padding:0;">

      <div style="position:absolute; right:20px; top:10px; z-Index:999;">
        <div data-dojo-type="dijit/TitlePane" 
             data-dojo-props="title:'Switch Basemap', closable:false, open:false">
          <div data-dojo-type="dijit/layout/ContentPane" style="width:380px; height:280px; overflow:auto;">
            <div id="basemapGallery"></div>
          </div>
        </div>
      </div>

    </div>
  </div>

Answer 1

我觉得我应该提一下。我认为不允许使用第三方API中的Google地图内容 - ＆gt; Google Maps Terms of Use (section 10.1)：

无法通过服务访问API或内容。除非通过服务，否则您不会访问Maps API或内容。例如，您不得通过Maps API之外的接口或通道（包括未记录的Google界面）访问地图图块或图像。

除此之外，从技术上来说这样做是没有问题的：

//Adding Google Imagery Basemap
var mapGMapSat = new Basemap({
  layers: [new BasemapLayer({
    type: "WebTiledLayer",
    url : "https://mts1.google.com/vt/lyrs=s@186112443&hl=x-local&src=app&x={col}&y={row}&z={level}&s=Galile", 
    copyright: "Google Maps"
  })],
  id: "gmapsat",
  thumbnailUrl: "https://maps.ngdc.noaa.gov/viewers/dijits/agsjs/xbuild/agsjs/dijit/images/googlehybrid.png",
  title: "Google Imagery"
});
basemapGallery.add(mapGMapSat);

As you can see here: https://jsbin.com/rabacoq

将谷歌地图图层添加到BaseMapGallery ArcGIS JS API 3.19

1 个答案: