Guide to the map array

A GMap array is used to define and render a map inside PHP code. This is useful for things like creating a map based on a database query, or doing things that you can't do with a macro.

Defaults for map attributes can be set on the GMap settings page.

TOP LEVEL ATTRIBUTES

These are all of the (by default) recognized keys for a map array. You usually will only use a subset of them.

  $map = array(
    'id' =>                  // "Map ID" -- used to associate a map with other controls.
    'width' =>               // Map width as a CSS dimension.
    'height' =>              // Map height as a CSS dimension (usually px).
    'latitude' =>            // Map center latitude.
    'longitude' =>           // Map center longitude.
    'zoom' =>                // Zoom level.
    'maxzoom' =>             // Maximum zoom level for autozoom.
    'extent =>               // Map bounds.
    'maptype' =>             // Initial baselayer type.
    'controltype' =>         // Size of map controls.
    'align' =>               // CSS alignment for map div.
    'mtc' =>                 // Map type control.
    'baselayers' => array(), // Enabled map baselayers.
    'styles' => array(),     // Shape style definitions.
    'behavior' => array(),   // Various map behavior flags.
    'rmtcallback' =>         // Remote callback for ahah info windows.
    'iwq' =>                 // Info window DOM query.
    'markers' => array(),    // Array of markers to place on the map.
    'shapes' => array(),     // Array of shapes to place on the map.
  );

Here is a description of the top level keys of the map array.

  • id
    Values:
    Identifier (String)
    Description:
    A unique identifier, used to distinguish a map from other maps on the page, and as a key to tie controls to a map.
    Example:
    "mymap"
    Notes:
    Assign this if you are planning on using external controls with a map. One will be automatically assigned if you don't specify an id.
  • width
    Values:
    CSS Dimension (String)
    Description:
    Width of map div, in valid css dimensions (generally pixels or percent).
    Example:
    "100%"
  • height
    Values:
    CSS Dimension (String)
    Description:
    Height of map div, in valid css dimensions (generally pixels).
    Example:
    "400px"
    Notes:
    Using a percentage for height will most likely lead to a buggy map. Google's javascript must be able to determine the actual height of the map div for proper operation.
  • latitude
    Values:
    Latitude of map center in degrees decimal format. (Float)
    Description:
    Map center point latitude, as a signed float.
    Example:
    39.36827914916013
    Notes:
    Cast to float if you are unsure what type your latitude variable is; some parts of Google Maps do not operate correctly if latitude is passed as a string. See "extent" if you wish to provide a bounding rectangle instead.
  • longitude
    Values:
    Longitude of map center in degrees decimal format. (Float)
    Description:
    Map center point longitude, as a signed float.
    Example:
    -81.5625
    Notes:
    Cast to float if you are unsure what type your latitude variable is; some parts of Google Maps do not operate correctly if latitude is passed as a string. See "extent" if you wish to provide a bounding rectangle instead.
  • zoom
    Values:
    0-17 (Integer)
    Description:
    Initial map zoom level. (This may be modified after map load by the user / autozoom / etc.)
    Example:
    7
    Notes:
    0 is the furthest out zoom level, 17 is the closest up zoom level (but is subject to change.) Some areas do not have satellite data all the way to 17, you may want to stay zoomed out a few clicks. See "extent" if you wish to provide a bounding rectangle instead.
  • maxzoom
    Values:
    0-17 (Integer)
    Description:
    Sets the maximum level of zoom the 'autozoom' behavior flag will zoom to. Useful to prevent single-marker maps from zooming in too far.
    Example:
    7
    Notes:
  • extent
    Values:
    array(array(float, float), array(float, float))
    Description:
    Initial bounding box for map. The first inner array is the southwest corner, the second inner array is the northeast corner. All units are degrees decimal. Make sure to cast coordinate components to float as needed.
    Example:
    array(array(43.19, -104.06), array(46.01, -96.76))
    Notes:
    Setting extent will cause the map to disregard latitude, longitude, and zoom. The actual map extent may vary slightly from the requested extent due to the tiled zoom level based nature of Google Maps.
  • maptype
    Values:
    "Map", "Satellite", "Hybrid", "Terrain", ... (String)
    Description:
    Initial baselayer of map. The set of allowable baselayers can be extended, see the gmap_extrabaselayers in the gmap_addons project for examples of how to add additional baselayers.
    Example:
    "Map"
    Notes:
    The most common values are "Map" and "Hybrid". Addon modules that add additional baselayers must use identfiers that won't conflict with other modules. (The four "core" maptypes are poorly named due to legacy macros.)
  • controltype
    Values:
    "None", "Micro", "Small", "Large" (String)
    Description:
    Set the pan/zoom control type.
    Example:
    "Small"
    Notes:
    "Micro" corresponds to GSmallZoomControl, which only provides zoom control.
  • align
    Values:
    "Right", "Left", "Center" (String)
    Description:
    Sets the css alignment of the map div, using classes provided by gmap.css.
    Example:
    "Center"
    Notes:
    The limited flexibility of align is a holdover from the early days. If you need to position a map div more accurately, consider using a mapid and targeting the div yourself with css.
  • mtc
    Values:
    "none", "standard", "hier", "menu" (String)
    Description:
    The "map type control" widget used to select different baselayers.
    Example:
    "standard"
    Notes:
    "standard" -- buttons ('GMapTypeControl' widget)
    "hier" -- buttons + dropdown menu ('GHierarchicalMapTypeControl' widget)
    "menu" -- dropdown menu ('GMenuMapTypeControl' widget)
  • baselayers
    Values:
    array(string, ...)
    Description:
    Enabled baselayers.
    Example:
    array("Map", "Satellite", "Hybrid", "Terrain")
    Notes:
    The "traditional" set of baselayers is [Map, Satellite, Hybrid]. Other modules, such as gmap_extrabaselayers (from gmap_addons) may provide additional possibilities.
    The example shows the four "core" baselayers.
  • styles
    Values:
    array(string => array(...), ...)
    Description:
    An array of style names and definitions.
    Example:
      array(
        'line_default' => array('0000ff',5,45,'',0,0),
        'poly_default' => array('000000',3,25,'ff0000',45),
        'green' => array('00ff00', 5, 100)
      );
    
    Notes:
    Currently, 'line_default' and 'poly_default' are predefined, and apply to lines and filled polygons that do not have style information assigned. You can override these two defaults on the map level if you wish.
    See the shape style definition for more information on styles.
  • behavior
    Values:
    array(string, ...)
    Description:
    Map behavior flags.
    Any that aren't set on the map level will be inherited from the defaults.
    Example:
    array('autozoom', 'overview')
    Notes:

    There are several behavior flags recognized by gmap.module, and other modules may choose to add their own behavior flags as well.

    All behavior flags recognized are documented on the GMap settings page.

    Core behavior flags:
    locpick
    Puts the map into "locpick" mode, which is used to choose a coordinate using the map.
    nodrag
    Disables map dragging. Also disables keyboard shortcuts.
    nokeyboard
    Disables the keyboard handler (arrow keys, etc.)
    nomousezoom
    Disables the ability to zoom with the mouse wheel.
    autozoom
    Enables automatic map bounds calculation, based on the markers added to the map.
    dynmarkers
    Ensures the marker system is loaded. Use this if you will be dynamically adding markers to an empty map.
    overview
    Enables the miniature overview map in the bottom right corner.
    collapsehack
    Attempts to work around a resize bug when placing maps inside collapsible fieldsets.
    This does not work in all themes.
    scale
    Adds a map scale legend to the map.
    fatmarkers
    If enabled on a View, this will cause the gmap_views code to serialize the views fields and pass it through the map object. This is useful if you wish to use custom marker handling code. Since you can't currently use map arrays with GMap Views (only macros), there's usually no point in setting it.
  • rmtcallback
    Values:
    Base url of callback path. (String)
    Description:
    This specifies the location that GMap needs to call the Drupal site back at to retrieve the contents of an ahah info window.
    Example:
    check_url(url('my/callback'))
    Notes:
    Each marker can have a rmt parameter that determines what is appended to the path when making the callback. This should be used to pass a unique identifier to your callback so you can retrieve the correct data.
  • iwq
    Values:
    jQuery query for matching DOM elements. (String)
    Description:

    Info Window Query (default).

    This specifies the query to use to match existing DOM elements to use for info window contents. You can use this in combination with iwo on markers to make info windows copied from data already on the page. Additionally, iwq can also be specified directly on a marker.

    Example:
    .markerdata>.marker
    Notes:
    Each marker that has iwo set and does not have iwq set will use the default iwq from the map. A marker with neither set will not use the iwq method of providing info window content. This allows mixing methods of providing info window content on a single map.
  • markers
    Values:
    array(array(...), ...)
    Description:
    An array of marker arrays to place on the map.
    Example:
    array(
      array(
        'options' => array(),
        'text' => 'start',
        'longitude' => 12.196,
        'latitude' => -58.13,
        'markername' => 'route',
        'offset' => 0,
      ),
      array(
        'options' => array(),
        'text' => 'finish',
        'longitude' => 12.196,
        'latitude' => -58.523,
        'markername' => 'route',
        'offset' => 1,
      ),
    );
    
    Notes:

    There are three types of overlays you can place on a map: markers, shapes, and feeds. Each of these classes is represented by a sub-array in the GMap array.

    This is not the only way to put markers on the map. It is, however, the easiest way. The markers specified here are loaded through the "static marker loader."

    You can also set arbitrary keys in the array. They will be passed to the javascript side automatically.

  • shapes
    Values:
    array(array(...), ...)
    Description:

    An array of shapes to place on the map.

    The format of the shape arrays depends on the type.

    Example:
      array(
        array(
          'type' => 'line',
          'points' => array(
            array(0.000, 0.000),            // First point.
            array(0.000, 0.000),            // Second point.
            array(0.000, 0.000),            // Third point.
          ),
          'style' => array("00ff00", 5, 80),
        )
        array(
          'type' => 'polygon',
          'points' => array(
            array(0.000, 0.000),            // First point.
            array(0.000, 0.000),            // Second point.
            array(0.000, 0.000),            // Third point.
          ),
          'style' => array("ff0000", 5, 80, "00ff00", 60),
        ),
        array(
          'type' => 'circle',
          'center' => array(0.000, 0.000),  // Center coordinate of the circle.
          'radius' => 100,                  // Radius of the circle in kilometers.
          'style' => array(),               // Style to use.
        ),
        array(
          'type' => 'rpolygon',
          'center' => array(0.000, 0.000),  // Center coordinate of the regular polygon.
          'numpoints' => 4,                 // Number of vertices the polygon should have.
          'point2' => array(0.000, 0.000),  // One of the vertex coordinates.
          'style' => array(),               // Style to use.
        ),
        array(
          'type' => 'encoded_line',
          'points' => 'icx~FfigvOt~CsnB~Vo`G~aDqnBp`@chB',  // a series of points, encoded
          'levels' => 'BBBBB',                              // zoom level for each point, encoded
          'numLevels' => 18,                                // derived from the encoding algorithm
          'zoomFactor' => 2,                                // derived from the encoding algorithm
          'style' => array(),
        ),
        array(
          'type' => 'encoded_polygon',
          'polylines' => array(
            array(
              'points' => 's{r~FnwcvO`zB{qHa}Fa`E~aC|rN',
              'levels' => 'BBBB',
              'numLevels' => 18,
              'zoomFactor' => 2,
            ),
          ),
          'style' => array(),
        ),
      );
    
    Notes:

    For both encoded_line and encoded_polyline, the 'points', 'levels', 'numLevels', and 'zoomFactor' should be generated using the gmap_polyutil_polyline() function in gmap_polyutil.inc. To use this, pass an array of points into the function:

    $points = array(
      array(41.90625, -87.67634),
      array(41.91226, -87.65643),
      array(41.91021, -87.65059),
      array(41.90753, -87.64956),
    );
    $gmap_encoding = gmap_polyutil_polyline($points);
    

    results in:

    Array
    (
        [points] => ayw~FbhcvOqd@m{BxKoc@vOmE
        [levels] => PGFP
        [numLevels] => 18
        [zoomFactor] => 2
    )
    

OVERLAYS

There are three types of overlays you can place on a map by default: markers, shapes, and feeds. Each of these classes is represented by a sub-array in the GMap array. Addon modules can add more types of overlays.

MARKERS

Markers are point features on a map. They are placed somewhere on the globe and can optionally be programmed to show an information window when clicked.

Any additional keys / values you put in a marker array will be passed to the javascript side automatically. This is very useful when writing custom code.

  $marker = array(
    'latitude' => 0.000,            // Marker latitude.
    'longitude' => 0.000,           // Marker longitude.
    'markername' => 'smileyface',   // Name of marker set to use.
    'offset' => 0,                  // Offset in marker set.
    'text' => 'popup text',         // GInfoWindow contents.
    'tabs' => array(),              // Tabbed GInfoWindow contents.
    'link' => 'http://google.com',  // Use marker as hyperlink.
    'rmt' => '',                    // Argument to pass for rmt
    'iwq' => '',                    // Info window query
    'iwo' => 0,                     // Info window offset
    'opts' => array(),              // Use custom GMarkerOptions.
    'options' => array(),           // Misc. behavior modifications.
  );

Here is a description of the keys of a marker array.

  • latitude
    Values:
    Latitude of point in degrees decimal format. (Float)
    Description:
    Marker latitude, as a signed float
    Example:
    39.36827914916013
    Notes:
    Cast to float if you are unsure what type your latitude variable is; some parts of Google Maps do not operate correctly if latitude is passed as a string.
  • longitude
    Values:
    Longitude of point in degrees decimal format. (Float)
    Description:
    Marker longitude, as a signed float.
    Example:
    -81.5625
    Notes:
    Cast to float if you are unsure what type your latitude variable is; some parts of Google Maps do not operate correctly if latitude is passed as a string.
  • markername
    Values:
    The name of the icon set to use (String)
    Description:
    Marker icons are located in the GMap module's 'markers' directory. GMap reads the .ini files to find available markers.
    Example:
    "Light Blue"
    Notes:
    Some markers have multiple icons. Use offset to choose which one to show.
  • offset
    Values:
    The index of the marker to use (Integer)
    Description:
    For markernames with multiple icons, you can choose which one to use.
    Example:
    0
    Notes:

    The code will automatically wrap around if you simply increment offset every marker.

    You do not need to know how many icons are actually assigned to the marker set.

  • text
    Values:
    HTML or Text to show in info window on marker click (String)
    Description:

    This will set up an info window popup when you click the marker.

    If you specify as a string, it will make a regular GInfoWindow.

    If you specify as an array, it will make a tabbed GInfoWindow, where the array keys are the tab titles, and the array values are the contents of the tabs.

    Example:
    "Point A"
    Notes:
    Anything put in here will be sent inline to the javascript side, so if you are planning on using complex popups, you may want to consider using rmt instead.
  • tabs
    Values:
    array('' => '',...)
    Description:
    Tab titles and HTML or text to show in info window on marker click.
    Example:
      array(
        'Name' => '<em>United States</em>',
        'Currency' => 'United States Dollar',
      );
    
    Notes:
    Anything put in here will be sent inline to the javascript side.
  • link
    Values:
    A url to go to when the marker is clicked. (String)
    Description:
    This will program the marker to act like a hyperlink.
    Example:
    "http://google.com/"
    Notes:
    It is pointless to specify text or tabs at the same time as link, as link causes immediate navigation away from the map.
  • rmt
    Values:
    Path to append to the rmtcallback. (String)
    Description:
    When using ahah markers, this should be set to the identifiers expected by your callback.
    Example:
    "15/0"
    Notes:
    If you need to pass multiple identifiers, just seperate them with slashes.
  • iwq
    Values:
    jQuery query for matching DOM elements. (String)
    Description:

    Info Window Query.

    This specifies the query to use to match existing DOM elements to use for info window contents. You can also specify a default iwq at the top level.

    Example:
    .markerdata>.marker
    Notes:
    When iwq is set on the marker, iwo will default to 0. Otherwise, you must set iwo if you want the default iwq to be used.
  • iwo
    Values:
    Zero based index to choose a single match from the iwq query. (Integer)
    Description:

    Info Window offset.

    When using iwq, iwo will select which of the matches to use for the info window.

    Example:
    0
    Notes:
    If using the default iwq, you must set iwo even if you are using offset 0. This is to allow mixing methods of showing info windows within the same map.
  • opts
    Values:
    array('' => ...,...)
    Description:

    Filling out this parameter will allow you to override the GMarkerOptions that a marker is initialized with.

    The icon key is automatically filled in, you can't set it here.

    Example:
      array(
        'bouncy' => TRUE,
      );
    
    Notes:
    The documentation for GMarkerOptions can be found here.
  • options
    Values:
    array('',...)
    Description:
    This is used similar to how behavior works at the map level.
    Example:
      array('autoclick');
    
    Notes:
    Available options:
    autoclick
    Automatically causes a click event on this marker. Useful when you want to automatically show an info window.

SHAPES

Shapes are the non point features on the map.

  $shape = array(
    'type' => '',
    'points' => array(),
    'center' => array(0,0),
    'radius' => 0,
    'point2' => array(0,0),
    'numpoints' => 10,
    'style' => array(),
  );
  • type
    Values:
    "circle", "polygon", "rpolygon", "line" (String)
    Description:
    Determines how the shape is processed. Circles and rpolygons are converted into lines with javascript math.
    Example:
    "circle"
    Notes:
    "line" is drawn as a GPolyline.
    "polygon" is drawn as a GPolygon.
    "circle" and "rpolygon" (regular polygon) are special cases of "polygon".
  • points
    Values:
    array(array(lat1, lon1), array(lat2, lon2), ... , array(latN, lonN))
    Description:

    An array of points defining the shape.

    Used by the line and polygon types.

    Example:
      array(
        array(44.205835001, -70.3674316406),
        array(44.3159879052, -68.6096191406),
      ),
    
    Notes:

    Each point itself is an array with two elements (latitude, longitude). The different shapes have different requirements with respect to points.

    "line" must have at least two points. It is best to break up long lines into shorter segments, because long lines can be buggy--sometimes beginning and ending points are switched.

    "polygon" should have at least three points; the first and last points should have the same coordinates.

  • center
    Values:
    array(lat, lon)
    Description:
    Center point of circle or rpolygon.
    Example:
    array(44.213, -96.411)
    Notes:
  • radius
    Values:
    Float
    Description:

    The radius of the circle, in km.

    Only used for the circle type.

    Example:
    100
    Notes:
    Big circles look more like ovals. This is due to the mercator projection used by Google Maps.
  • point2
    Values:
    array(lat, lon)
    Description:

    The coordinate of a vertex on the rim of the rpolygon.

    Only used for the rpolygon type.

    Example:
    array(12.66, -55.23)
    Notes:
    Changing both the latitude and longitude in respect to the center point will make the polygon "rotate."
  • numpoints
    Values:
    Integer
    Description:

    Sets the number of points used to draw the circle or rpolygon.

    Only used for the circle and rpolygon types.

    Example:
    20
    Notes:
    Don't use a very large number, it will slow down the map drawing.
  • style
    Values:
    array(stroke color, stroke weight, stroke opacity, fill color, fill opacity) OR String
    Description:

    A style array, or a key to the styles array on the map.

    This is the same format used for the map level styles array.

    Example:
    array("ff0000", 5, 80, "00ff00", 60)
    Notes:

    The elements of this array MUST be in the specified order.

    Stroke and fill colors should be hex color codes (without the leading "#"); Google Maps does not accept named colors.

    The stroke weight is the width of the line or polygon border in pixels.

    Stroke and fill opacities should be a percentage between 0 and 100.

    Fill color and fill opacity are not used for type "line".

    If shapes of type "line" don't have styles defined, the 'line_default' style will be used; shapes of type "polygon", "circle", and "rpolygon" will use 'poly_defalt'.

    In previous versions of GMap (Specifically, all Drupal 4.6 and 4.7 versions), opacity was specified as a number between 0 and 1. It is now a number between 0 and 100.

    On backwards compatibility: there were originally more style options, but they were dependant on xmaps; xmaps is no longer compatible with Google Maps, so these options are now ignored. They are: 'pattern', 'text', 'fillcolor', 'fillopacity'; all except for 'pattern' are now available with different syntax.

USING A MAP ARRAY

$map = array(...); // Set up your map array.
$output = theme('gmap', array('#settings' => $map));