Help:Googlemap
From QED
This page describes the <googlemap> tag. For help about viewing, creating, and editing Google maps on this website, see Help:Google Maps.
Contents |
Usage
The googlemap tag allows the general attributes of a map to be specified, together with markers, captions, and paths, which are specified in the body between the opening and closing tags. Here is an example:
<googlemap lat="40.345497" lon="-74.661713" zoom=11 height=100>
blue
40.345497, -74.661713, [http://www.princeton.edu Princeton University]{{wp|Princeton University}}
40.300000, -74.600000
</googlemap>
In this example, the result of which is shown below, the opening googlemap tag includes specifications for "lat", "lon", etc, and the remaining lines before the closing tag specify a path: a color specification followed by lat/long co-ordinations of successive points along the path.
Color specification
Any RGB hex code triplet may be used to specify the color of the page, e.g. #0000FF for blue. In addition, the sixteen standard HTML colors may be specified by name:
- aqua or cyan, black, blue, fuchsia or magenta, gray, green, lime, maroon, navy, olive, purple, red, silver , teal, white, yellow
Tag Attributes
The recognized attributes, all of which are optional, are as follows:
- width (in pixels; defaults to 450)
- height (in pixels; defaults to 300)
- lat (the center latitude on the map)
- lon (the center longitude on the map)
- zoom (the zoom level, from 0 (furthest away) to 17 (closest in)
- type — one of:
- normal (or equivalently map)
- hybrid (the default)
- satellite
- controls — one of:
- small (creates +/- zoom buttons)
- medium (zoom buttons and pan buttons)
- large (pan buttons and a sliding scale for zoom)
- none (no zoom or pan buttons)
- selector — one of:
- yes, the default, causes the map/hybrid/satellite selector to be displayed;
- no is the alternative
- scale — one of:
- yes causes the distance scale to be displayed
- no is the default
- overview — one of:
- yes causes the inset navigation map to be displayed
- no is the default
- icons (URL template for custom markers, with "{label}" where the name of the icon will be inserted; defaults to "http:/skins/common/images/GoogleMapsIcons/icon{label}.png")
- icon (URL for markers without an icon specified; defaults to http:/skins/common/images/GoogleMapIcons/icon.png)
- doubleclick (what to do when the user double-clicks) — one of:
- recenter (default)
- zoom
- zoomstyle — one of:
- fast (default)
- smooth for continuous zooming, but this does not work in all browsers.
Markers and Captions
One can define one marker per line in the body of the tag. Each such line can take one of several forms:
- latitude, longitude
- latitude, longitude, caption text that may contain commas and wiki markup, and which continues to the end of the line
- (label) latitude, longitude
- (label) latitude, longitude, caption text as above
The "label" determines the icon that will be used. If "icons" has not been specified, then "label" may be one of the labels described in the following subsection.
If the "icons" attribute is specified, then the same algorithm is applied with respect to the specified "icons" URL.
Alternative Icons
A set of alternative icons is available on QED as illustrated by this table:
| Label (r=red, b=blue, g=green) | Icon |
|---|---|
| r | |
| b1 | |
| g25 | |
| Z | |
To change the default icon, use a "label" constructed as suggested by the table above and as illustrated in the next example. The number can range from 1 to 25 inclusive.
If you would like to add other location markers to the QED collection, please send mail to qed@princeton.edu.
The numbered icons are courtesy of brennan.offwhite.net.
Tabbed Info Balloons
A marker can be associated with one or more tabs specified after the marker's latitude and longitude.
Each tab has a title specified between forward and backward slashes, like /so\. The title is then followed by a caption.
<googlemap lat="40.348611" lon="-74.659444" zoom="15">
40.346544, -74.655104
/Township\ Princeton{{wp|Princeton}}
/University\ [http://www.princeton.edu Princeton University]
/Gargoyle\ http://etcweb.princeton.edu/campusgiffiles/ape3.gif
(M) 40.344189, -74.66064, [http://www.mccarter.org McCarter Theater]<br/>http://www.mccarter.org/Images/Events/2006--2007/World/Flying-Karamazov-Brothers-s.jpg
</googlemap>
Paths
A path is specified by a sequence of lines starting with a color specification, followed by lines specifying each point in turn as illustrated in the Usage section above.
The color may be specified in one of two ways:
- by starting a line with color=NAME where NAME is one of the 16 standard W3C color names:
- aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white, yellow;
- by starting a line with #nnnnnn where nnnnnn is the RGB hex code for the color (see Help:Color).
Isolated points must be specified before the first path.












