WSN Knowledge Base
Featuresspacer Showcasespacer Reviewsspacer Demosspacer Purchasespacer Manualspacer Support
Google Maps
Google Maps
By Paul

When cataloging data which has a physical location, you may want to display it on a map to help viewers find it. The "google maps" switch will active a google map with a pin identifying the location.

You must have a google API key in order to use maps, and must type that key into the box where it's requested at Admin -> Settings -> System (this box only shows up after you turn on the google maps switch). Note that google requires you to get a new key for every directory.

If you have geographically-limited categories, you may want to display all the items on the category page in a map with a pin for each. Activate the "category google maps" switch for that.

Troubleshooting

Make sure your API key is valid for the directory. Note that the map positions are determined by querying this URL: http://maps.google.com/maps/geo?q=street+address,...

A Full-Site Google Map

If you want a map showing all your listings, or any toplist-generated selection of them, use this template code:

<script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key={GOOGLEMAPSKEY}" type="text/javascript"></script> <script type="text/javascript"> //<![CDATA[
function load()
{
if (GBrowserIsCompatible())
{
var map = new GMap2(document.getElementById("map"));
var mapControl = new GMapTypeControl();
map.addControl(mapControl);
map.addControl(new GLargeMapControl());

<!-- BEGIN TOPLIST -->
<CONFIG>links,time,100,descending,latitude>0,,,0,0,0,0,0,0,,0</CONFIG>
<IF {LINKNUMBER} is 1> map.setCenter(new GLatLng({LINKLATITUDE}, {LINKLONGITUDE}), 7);</IF>

var marker{LINKID} = new GMarker(new GLatLng({LINKLATITUDE}, {LINKLONGITUDE}));
map.addOverlay(marker{LINKID});
var WINDOW_HTML{LINKID} = '<div style="width: 210px; padding-right: 10px"><a href="{TRACKLINKURL}"><b>{LINKTITLE}</b></a><br />{LINKADDRESS}<br />{LINKCITY}, {LINKSTATE} {LINKZIP}<br />{LINKCOUNTRY}</div>';
GEvent.addListener(marker{LINKID}, "click", function() { marker{LINKID}.openInfoWindowHtml(WINDOW_HTML{LINKID}); });
<!-- END TOPLIST -->

}
}
//]]>
</script>
<div id="map" style="width: 500px; height: 300px"></div>


You can switch out the toplist config line for one you prefer. Note the latitude>0 condition is needed to prevent it from trying to map any listings which don't have an address associated with them.

Rating:


0/5 based on 0 votes. The median rating is 0.

Submitted: 04/24/08 (Edited 10/09/08)

Description: Enabling google maps for address-oriented items.

Views: 131 views. Averaging 1 per day.
In the most recent 30 day period, there've been 13 views.

Previous Article | Next Article


Home    |    Features    |    Showcase    |    Reviews    |    Demos    |    Purchase    |    Manual    |    Support