7.2 ArcGIS Server: Displaying Your Map Service

Ok! Let’s start with an empty maproom:

Adding ArcGIS Link

Take note that the starter code includes the highlighted line (27) that calls a third party javascript library that allows us to use ArcGIS Server Maps within a Google Maps environment.  You can find the full documentation on using this library here:

Displaying your GIS Data

To pull layers from your map services, we will be using a function from the MapOverlay class. Documentation can be found here. Since we want to make the layer “toggle-able”, let’s create a variable for it in the global space:

Finding your map service URL

In tutorial 7.1, you created a map service on Whippet.  Now you need to find the correct map service URL in order to map it with Google Maps.  First, navigate to your folder on Whippet:


Drill down until you find your project.  The URL must end with “/MapServer“.  For example:


Take a note of this URL, as you will add it in the initialize function below.

Next, in the initialize function, add the call to draw the mapservice:

*Note that you can change the opacity by changing the “0.8” value above.

Toggling ArcGIS Layers

Toggling GIS layers uses the function toggleLayer that we have used in previous tutorials. Make sure to include the toggleLayer function and create a checkbox for your ArcGIS Layer.

To add GIS layers from multiple map services, create unique variables for the REST Service URL and the MapOverlay function. Remember to create toggle checkboxes for every GIS layer you want to display. Let’s add two more GIS layers, one more basemap and a map with point data.

Final Sample Code

Leave a Reply