Add Google Basemap via Javascript

deleted-user-XuRyPg9pv1OY · ‎01-18-2014

I am new to writing code and need help displaying a Google basemap (hybrid) in a web map built on the ArcGIS Javascript API. I have a Google Maps API key, which was removed for this example. I used the documentation at http://gmaps-utility-gis.googlecode.com/svn/tags/agsjs/2.00/docs/googlemapslayer/examples.html as a guide, but I am stuck. Any help would be greatly appreciated!

<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <!--The viewport meta tag is used to improve the presentation and behavior of the samples 
      on iOS devices-->
    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"> 
    <title></title>

    <link rel="stylesheet" href="http://js.arcgis.com/3.8/js/dojo/dijit/themes/claro/claro.css">
    <link rel="stylesheet" href="http://js.arcgis.com/3.8/js/esri/css/esri.css" />
    <link rel="stylesheet" href="css/layout.css"/> 

    <script>
    var djConfig = {
              parseOnLoad: true,
              packages: [{
                "name": "agsjs",
                "location": 'https://gmaps-utility-gis.googlecode.com/svn/tags/agsjs/2.04/xbuild/agsjs' // for xdomain load
              }]
            };
   </script>
   
    <script src="http://maps.google.com/maps?file=api&amp;v=3&amp;key=" type="text/javascript"></script>
    <script src="http://js.arcgis.com/3.8/"></script>
 
    <script>
      dojo.require("dijit.layout.BorderContainer");
      dojo.require("dijit.layout.ContentPane");
      dojo.require("esri.map");
   dojo.require("agsjs.layers.GoogleMapsLayer");
      dojo.require("dijit.layout.TabContainer");
      dojo.require("esri.dijit.Legend");
      
      var map, googleLayer;

      function init() {
        map = new esri.Map("map", {
          center: [-82.65862, 29.820309],
          zoom: 16
        });
  
        googleLayer = new agsjs.layers.GoogleMapsLayer({
                id: 'google',
                apiOptions: {
                  v: '3'
    },
  });
  
        map.addLayer(googleLayer);
  
      }
   
      dojo.ready(init);
   
  </script>
  </head>
  
  <body class="claro">
    <div id="mainWindow" 
         data-dojo-type="dijit.layout.BorderContainer" 
         data-dojo-props="design:'headline', gutters:false" 
         style="width:100%; height:100%;">

      <div id="header" 
           data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'top'">
        Tool
      </div>
      <div data-dojo-type="dijit.layout.ContentPane" id="leftPane" data-dojo-props="region:'left'">
        <div data-dojo-type="dijit.layout.TabContainer">
          <div data-dojo-type="dijit.layout.ContentPane" data-dojo-props="title:'Legend', selected:true">
            <div id="legendDiv"></div>
          </div>

          <div data-dojo-type="dijit.layout.ContentPane" data-dojo-props="title:'Identified Issues'" ></div>
      </div>

      <div id="map" data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'center'"></div>

      <div id="footer" data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'bottom'"></div>
      
    </div>
  </body>

</html>

Thank you!

Matt

LefterisKoumis · ‎10-12-2016

Thank you. However, it seems that the use of the above urls for the google maps violate the terms of use with Google. For the users who have a license how do they specify their license key or clientID?

ChristopherSchreiber · ‎02-14-2017

Is this allowed with Google Maps TOS? I have read before that Google does not allow it's maps to be used in any application that is based off of another mapping API (Like Esri).

Thanks,

Chris

RobertScheitlin__GISP · ‎02-14-2017

Christopher,

You are correct this is a violation of the TOS.

LefterisKoumis · ‎02-14-2017

It is not clear in the Google TOS that it is a violation to use Google Map on another API, if you possess a license.

ChristopherSchreiber · ‎02-14-2017

Lefteris,

Here is the entry that I am referencing:

No use of Content with a non-Google map. You must not use the Content in a Maps API Implementation that contains a non-Google map.

This is Requirement 10.4.e.

Link: Google Maps APIs Terms of Service | Google Maps APIs | Google Developers

I am not sure how licensing works with this though, I would contact a Google rep just to be sure.

Chris

LefterisKoumis · ‎02-14-2017

Thanks. I believe that when you purchase a license there is no condition that the license can be used only on Google API based products. Unless it is explicitly stated otherwise, when you purchase a license for a software you are free to use it (not modify) as you wish.