Google logo

Google Earth Enterprise Documentation Home | Developers

Google Maps API v3 for GEE 5.x

Overview

The Google Maps Javascript API V3 is bundled with Google Earth Enterprise (GEE) Server and, for offline use, with Portable Server. As of November 2015, Google Maps JavaScript API v3.20 is bundled with GEE v5.1.2, but the API is updated periodically to align with the Release version.

The bundled offline Google Maps JavaScript API is the same core Javascript V3 API supporting:

However there are some differences:

Using the Fusion Maps API

The Fusion Maps API is used to create and interact with map layers created in Google Earth Enterprise. The API is based on the Google Maps API but includes geeCreateFusionMap, which makes it easier to interact with map layers generated by Google Earth Enterprise. Essentially, geeCreateFusionMap is a factory used to create instances of the google.maps.Map class in which the GEE-specific configuration options can be added as Method extensions.

The following code snippet is a Hello World example of using geeCreateFusionMap to load a map:

<html>
  <head>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <style type="text/css">
      html { height: 100% }
      body { height: 100%; margin: 0px; padding: 0px }
      #map_canvas { height: 100% }
    </style>
    <title>Hello World - GEE 2D Map Example</title>

    <!-- Start by defining GEE_BASE_URL. -->
    <script type="text/javascript">
      var GEE_BASE_URL = window.location.protocol + '//' + window.location.host;
    </script>

    <!-- Include the provided Maps API v3 files.  Located in /opt/google/gehttpd/htdocs/maps/api/ -->
    <script type="text/javascript" src="/maps/api/bootstrap.js"></script>
    <script type="text/javascript"
    src="/maps/api/fusion_extended_map.js"></script>

    <!-- geeServerDefs must be defined with the following script; insert name of your published 2D database -->
    <script type="text/javascript" src="/YourPublishedDatabase/query?request=Json&var=geeServerDefs"></script>

    <script type="text/javascript">
      function initialize() {
        var myOptions = {
          center: new google.maps.LatLng(-34.397, 150.644),           zoom: 8         };
      var geemap = new geeCreateFusionMap("map_canvas", geeServerDefs, myOptions);
      }
    </script>

  </head>
  <body onload="initialize()">
    <!-- Be sure there is an element on the page with the id you specified above (map_canvas in this case). -->
    <div id="map_canvas" style="width:100%; height:100%"></div>
  </body>
</html>

Factory geeCreateFusionMap

Use of the factory geeCreateFusionMap is distinct from the standard Google Maps JavaScript API usage in the following ways:

Factory geeCreateFusionMap Description

The Factory and Method extensions are described in the following tables.

Factory

Factoryclass Description
geeCreateFusionMap(container, opts?) Creates a new Fusion map inside of the given HTML container, which is typically a DIV element. The options are the same as the options for google.maps.Map. However, if a map type is passed in to the options, the Fusion maps server will override these if an imagery layer is included in the Fusion Maps Database. After this constructor is invoked, the setCenter() method should be called before any methods that display Fusion layers on top of the map.

Method extensions

geeCreateFusionMap Method extensions are extensions of the Google Maps API v3 google.maps.Map class.

Method extensions Return Value Description
showInitialFusionLayers() None Show all layers that are enabled by default. This method should only be invoked after the setCenter()
getFusionLayerCount() Number Returns the number of Fusion map layers. This does not include the base imagery layer, which is built as a custom map type and serves as the background of the map.
isFusionLayerVisible(index) Boolean Returns true if the layer is currently shown on the map and false if it is hidden.
showFusionLayer(index) None Shows a previously hidden Fusion map layer. This method should only be invoked after the setCenter() method has been called to initially draw the map.
hideFusionLayer(index) None Hides the specified Fusion map layer.
getFusionLayerName(index) String Returns the name of the specified layer.
getFusionLayerIcon(index) String Returns the URL of the icon associated with the specified layer.

Examples

Several examples that illustrate how to use the Fusion Maps API are installed by default. You can find these examples in:

/opt/google/gehttpd/htdocs/maps

The following files are used by default for a published database. For example, when serving http://your-host.com/YourPublishedDatabase, this code is used to render the page.

The following files provide basic examples of initializing a Fusion Map. You can use them as templates but you'll need to edit them with the target path of a published 2D database to correctly initialize a map in the browser.

KML Support

The KMLLayer object in the Google Maps Javascript API is unavailable in GEE since KML rendering is performed server-side and requires a connection to google.com. As a workaround, you can overlay KML data on your 2D Map using the GeoXml parser extension for Google Maps.

The following steps are needed to utilize the GeoXml library with 2D maps hosted on a Google Earth Enterprise Server:

  1. Download the GeoXml library to your GEE Server. geoxmlfull_v3.js is the main file to download.
  2. Store the GeoXml library in the GEE Server Apache Document root. Default location is /opt/google/gehttpd/htdocs/js
  3.  Load the GeoXml library in your GEE 2D Map HTML file: <script type="text/javascript" src="/js/geoxmlfull_v3.js"></script>
  4. Store the target KML file in the GEE Server Apache Document root.
  5. Create a GeoXml object in the GEE 2D Map HTML file to load your KML file. Refer to GeoXml-specific methods and options.

See GeoXml samples.

Note:

  • Performance may degrade with large KML files.
  • GeoXml is an open-source package, not supported by Google.