Recent Changes - Search:
Cookbook /

GMap

Summary: Easy Google Maps integration
Version: 20141204
Prerequisites: Google API key, PmWiki 2.2.58 or newer
Status: Abandoned (broken by Google)
Maintainer: Petko
Categories: Integration, Images, Includes, Google, PHP55
Discussion: GMap-Talk
License: PD (gmap.php), LGPL (googlemapsPlugin.js)

Note: Google has disabled the API version used by this recipe and now serves a special script that is capable to display most simple embedded maps, but not all. If you need to embed maps, please see Ape: Automagical PmWiki Embed or OpenLayersAPI.

Description

A simple and easy inclusion of Google Maps into wiki pages.

This recipe allows inclusion of Google Maps in wiki pages. It aims to be a simple and easy way to publish a map on your wiki.

Installation

  • You need an API key which looks like ABQIAAAA... from Google.
  • Get gmap.zipΔ (alt. download: gmap.zip).
    Place gmap.php in your /cookbook/ directory.
    Place googlemapsPlugin.js in your /pub/ directory.
  • Add to config.php this code :
    # your own API key
$GMap['Key'] = "ABQIAAAA...GWA";
include_once("$FarmD/cookbook/gmap.php");

Usage in a wiki page

To include a map, first you get a link from Google Maps, then add this link in the wiki page.

Basic usage

Go to https://maps.google.com/ and find the place you want to show. Select Map, Satelite or Hybrid view, zoom in, and double-click to center the map.

On the right-top corner of the map, click "Link to this page", and copy the first address.

In your wiki page, paste this address as a normal link : 

 [[ https://maps.google.com/... | Our location ]]

When you preview or save your page, the link will automatically be shortened like this: [[ GMap:... | Our location ]] with all unnecessary things removed, which is easier to edit.

When you view your page, a map will be created, with a red pin -marker- at the center. Clicking on the pin will open a popup window containing the link text.

You can also just write a GMap: link with the ll=latitude,longitude GPS coordinates, and optionally the z=zoom (1-19, default z=16): 

  [[ GMap:ll=48.853213,2.349116&z=15 | Notre-Dame de Paris ]]
  [[ GMap:ll=-22.904325,-43.209743&z=3 | Rio de Janeiro ]]

Negative degrees should be used for Western longitudes and Southern latitudes, see the example for Rio de Janeiro (22.9°S = -22.9°, 43.2°W = -43.2°).

Two other options exist:

  • icolor - You can change the color of the pin via &icolor=NNN (or &icolor=NNNNNN), where NNN is a hexvalue
  • t (map type) - sets the default map type via &t=, followed by either m (map - default), k (satellite), h (hybrid), or p (terrain).
    [[ GMap:ll=48.853213,2.349116&z=15&icolor=3cc&t=k | Notre-Dame de Paris ]]

Advanced usage : many pin markers in one map

This is done in a special :term:definition list. 

: %gmap% [[GMap:ll=...]]  : Center, view and zoom of the map
: GMap:ll=48.84,2.31      : First  pin description
: GMap:ll=...             : Second pin description
: GMap:ll=...             : Third  pin description img.jpg

Go to Google Maps and select the default view and zoom of your map. Copy the link from the top-right corner.

The first line of the definition list contains the style %gmap% and this link.

The next lines contain links to the pins' coordinates, and the description of each pin. (To get the links to a pin, center the map where it should appear, and copy the link from the top-right corner.)

The link of each pin needs only the numbers after ll=, you can remove the other code for a better readability.

The pin description may contain formatting, styles, colors, images, other links etc.

More precise placement of the pins (moving a marker)

From version 20090513, it is possible to get the precise coordinates from within the wiki page.

This only works in "Preview" mode, when you edit the wiki page and press "Preview" instead of "Save".

In the map preview, you can drag the pin with your mouse, and when you drop it on the correct position, an info-tip window will appear showing the current coordinates of the pin like a GMap:ll=lat,lng link which you can copy in the wiki edit field, then save the page.

This is the easiest way to fix a slightly imprecise pin. Note that the zoom factor is not displayed and you may add, e.g. &z=16 at the end of the link.

There is also a button "Center" near the top-right corner of the map. Clicking on it displays the current center and zoom of the map and a link for easier pasting in the wiki page (for maps with multiple markers).

Configuration

You can set the default map size in config.php, either in pixels, or in percents : 

 $GMap['H'] = 200;        # default is 300 pixels
 $GMap['W'] = '95%';      # default is 100%

You can disable the map controls or the red pin marker with : 

 $GMap['nocontrols'] = 1; # default is 0 (0 = controls enabled)
 $GMap['nomarker'] = 1;   # default is 0 (0 = markers enabled)

You can also control the display of maps via the link title: 

 [[GMap:ll=...&z=16"nocontrols;nomarker;w:300;h:400" | My map ]]

The commands are separated with semi-colons ";" and you can have any of them. They mean:

  • nomarker : do not display the red pin marker
  • nocontrols : do not display zoom, pan and view controls
  • w:300;h:400 : specify the width and height of the current map in pixels (e.g. 200) or in percents (e.g. 100%). This setting overrides the dimensions in config.php.

In advanced multi-maps, the first GMap: link may contain these commands: 

 : %gmap% [[GMap:ll=...&z=15"nocontrols;h:500"]] : (first line)

Notes

  • All links starting with http://maps.google... will be converted to the GMap: intermap for better readability, and to a framed map. To just "link" to Google Maps without creating an inline map, change the maps. prefix to www. like http://www.google.com/maps?ll=...

Release Notes

  • 20141204 : update for PHP 5.5 compatibility (please don't use this recipe if you can use other Map embedding recipes)
  • 20091025b : small speed optimization for maps with several pins
  • 20091025a : fixed the map type with the "Center" button in preview mode
  • 20091025 : enabled personalized multimarker maps created on Google
  • 20091022 : use existing sll= parameter if no ll= one is found
  • 20090829 : fixed bug with "Center" button in "Preview" mode, when the street map is active
  • 20090517 : added "Center" button in "Preview" mode, to get coordinates, zoom and view of the modified map; enabled zooming by scrolling the mouse wheel
  • 20090513 : added draggable markers in "Preview" mode, to get precise coordinates
  • 20090406 : changed list style from %googlemap% to %gmap% which is shorter and easier; enabled title controls in advanced multi-pin maps; added $GMap['nocontrols'] and $GMap['nomarker'] config variables
  • 20090405a : using a GMap: prefix now calls the JS libraries, no need to add (:gmap:) in the page
  • 20090405 : experimental public release

See Also

Authors

  • The unobtrusive JavaScript (LGPL license) was created for WordPress by Avi Alkalay. It was adapted for PmWiki, and further developed by Petko.
  • The PmWiki recipe is written and maintained by Petko.

Comments

See discussion at GMap-Talk

User notes? : If you use, used or reviewed this recipe, you can add your name. These statistics appear in the Cookbook listings and will help newcomers browsing through the wiki.