Skip to content

Instantly share code, notes, and snippets.

@mheadd
Forked from boutell/gist:3941578
Created October 24, 2012 14:41
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save mheadd/3946457 to your computer and use it in GitHub Desktop.
Save mheadd/3946457 to your computer and use it in GitHub Desktop.
Display a Google map with markers linking to pages
// Display a map with markers that link to other pages. Each marker must
// have latitude, longitude and slug properties. There must also be a
// a 'url' option which is used to build the links. The following
// wildcards are replaced in the url: ID (with the id), SLUG (with the
// slug property), PUBLISHED (with /year/month/day taken from published_at),
// and START (with /year/month/day taken from start_date). In other words,
// you can pass most array-hydrated Doctrine objects, including Apostrophe
// blog posts and events, and easily generate links back to them.
// The hover text title of the marker is taken from title if present,
// otherwise from name.
// Any markers without a latitude property are ignored. This makes
// it easy to skip events with no location or similar.
// Use the zoom option to specify the google maps zoom level.
// (10 is city-ish, 13 is neighborhood-sized.)
function mapWithMarkers(options) {
var $map = $(options.selector);
var markers = options.markers;
var zoom = options.zoom ? options.zoom : 10;
var url = options.url;
var center = { latitude: 0, longitude: 0 };
var count = 0;
var i;
for (i = 0; (i < markers.length); i++)
{
if (!markers[i].latitude)
{
continue;
}
// PHP treats these as strings, therefore json_encodes them as strings, but we need to average them
markers[i].latitude = parseFloat(markers[i].latitude);
markers[i].longitude = parseFloat(markers[i].longitude);
center.latitude += markers[i].latitude;
center.longitude += markers[i].longitude;
count++;
}
center.latitude /= count;
center.longitude /= count;
var map = new google.maps.Map($map[0], {
zoom: zoom,
center: new google.maps.LatLng(center.latitude, center.longitude),
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var marker;
for (i = 0; i < markers.length; i++) {
if (!markers[i].latitude)
{
continue;
}
marker = new google.maps.Marker({
position: new google.maps.LatLng(markers[i].latitude, markers[i].longitude),
title: markers[i].title ? markers[i].title : markers[i].name,
map: map
});
google.maps.event.addListener(marker, 'click', (function(marker, i) {
console.log(url + ',' + markers[i].published_at);
var markerUrl = url.replace('SLUG', markers[i].slug);
markerUrl = markerUrl.replace('ID', markers[i].id);
var matches = /^(\d\d\d\d)\-(\d\d)\-(\d\d)/.exec(markers[i].published_at);
if (matches) {
markerUrl = markerUrl.replace('PUBLISHED', matches[1] + '/' + matches[2] + '/' + matches[3]);
}
var matches = /^(\d\d\d\d)\-(\d\d)\-(\d\d)/.exec(markers[i].start_date);
if (matches) {
markerUrl = markerUrl.replace('START', matches[1] + '/' + matches[2] + '/' + matches[3]);
}
console.log(markerUrl);
return function() {
window.location.href = markerUrl;
}
})(marker, i));
}
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment