From GamingWiki
(24 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
− | |||
− | |||
<html> | <html> | ||
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> | <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> | ||
Line 22: | Line 20: | ||
var infowindow; | var infowindow; | ||
var markers = new Array(); | var markers = new Array(); | ||
+ | var defaultLatLng = new google.maps.LatLng(43.243702,-79.889145); | ||
+ | var defaultZoom = 13; | ||
function initialize() { | function initialize() { | ||
− | |||
var myOptions = { | var myOptions = { | ||
− | zoom: | + | zoom: defaultZoom, |
− | center: | + | center: defaultLatLng, |
mapTypeId: google.maps.MapTypeId.ROADMAP | mapTypeId: google.maps.MapTypeId.ROADMAP | ||
} | } | ||
Line 34: | Line 33: | ||
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); | map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); | ||
getMarkerList(); | getMarkerList(); | ||
+ | //addOverlays(); | ||
+ | addRailways(); | ||
+ | jumpto = unescape(self.document.location.hash.substring(1)); | ||
+ | recentre(jumpto); | ||
} | } | ||
// Initialize on page load | // Initialize on page load | ||
Line 41: | Line 44: | ||
* Add a marker to the map | * Add a marker to the map | ||
*/ | */ | ||
− | function addMarker(latlng, title, | + | function addMarker(latlng, title, id) { |
+ | var descId = 'desc'+id; | ||
var marker = new google.maps.Marker({position:latlng, map: map, title:title}); | var marker = new google.maps.Marker({position:latlng, map: map, title:title}); | ||
google.maps.event.addListener(marker, "click", function() { | google.maps.event.addListener(marker, "click", function() { | ||
Line 47: | Line 51: | ||
infowindow.open(map,marker); | infowindow.open(map,marker); | ||
}); | }); | ||
+ | markers[id]["GMarker"] = marker; | ||
} | } | ||
/** | /** | ||
* Add a marker with a lat/lng pair | * Add a marker with a lat/lng pair | ||
*/ | */ | ||
− | function addMarkerByLatLng(lat, lng, title, | + | function addMarkerByLatLng(lat, lng, title, id) { |
var latlng = new google.maps.LatLng(lat, lng); | var latlng = new google.maps.LatLng(lat, lng); | ||
− | addMarker(latlng, title, | + | addMarker(latlng, title, id); |
} | } | ||
Line 59: | Line 64: | ||
* Add markers by address | * Add markers by address | ||
*/ | */ | ||
− | function addMarkerByAddress(address, title, | + | function addMarkerByAddress(address, title, id) { |
if (geocoder) { | if (geocoder) { | ||
geocoder.geocode({'address':address}, function(results, status) { | geocoder.geocode({'address':address}, function(results, status) { | ||
if (status == google.maps.GeocoderStatus.OK) { | if (status == google.maps.GeocoderStatus.OK) { | ||
var latlng = results[0].geometry.location; | var latlng = results[0].geometry.location; | ||
− | addMarker(latlng, title, | + | addMarker(latlng, title, id); |
} else { | } else { | ||
− | alert(address + " not found: "+results[0]+"; "+status); | + | //alert(address + " not found: "+results[0]+"; "+status); |
} | } | ||
}); | }); | ||
} | } | ||
+ | } | ||
+ | |||
+ | /** | ||
+ | * Add a marker that is actually a zone | ||
+ | */ | ||
+ | function addZone(lat, lng, corners, title, id) { | ||
+ | // Draw zone | ||
+ | var zone = new google.maps.Polygon({ | ||
+ | paths: corners, | ||
+ | strokeColor: "#FF0000", | ||
+ | strokeOpacity: 0.8, | ||
+ | strokeWeight: 2, | ||
+ | fillColor: "#FF0000", | ||
+ | fillOpacity: 0.35, | ||
+ | map: map | ||
+ | }); | ||
+ | // Also add a marker | ||
+ | addMarkerByLatLng(lat,lng,title,id); | ||
+ | } | ||
+ | |||
+ | /** | ||
+ | * Add a polyline to the map | ||
+ | */ | ||
+ | function addPath(corners, title, id) { | ||
+ | var path = new google.maps.Polyline({ | ||
+ | path: corners, | ||
+ | strokeColor: "#00FF00", | ||
+ | strokeOpacity: 0.8, | ||
+ | strokeWeight: 2, | ||
+ | map: map | ||
+ | }); | ||
+ | // Don't create a marker | ||
} | } | ||
Line 76: | Line 113: | ||
*/ | */ | ||
function getMarkerList() { | function getMarkerList() { | ||
− | for ( | + | for ( var key in markers ) { |
− | + | var marker = markers[key]; | |
− | if (typeof marker['lat'] === 'undefined' || marker['lat'] == '' | + | // Figure out what sort of information we have here. |
+ | if (marker['corners'] != '') { | ||
+ | // this is a zone | ||
+ | // parse the corners into an array | ||
+ | var corners = new Array(); | ||
+ | var cornerstrings = marker['corners'].split('::'); | ||
+ | for ( j = 0; j < cornerstrings.length; j++ ) { | ||
+ | var ll = cornerstrings[j].split(','); | ||
+ | corners[j] = new google.maps.LatLng(ll[0],ll[1]); | ||
+ | } | ||
+ | addZone(marker['lat'], marker['lng'], corners, marker['name'], marker['id']); | ||
+ | } else if (typeof marker['lat'] === 'undefined' || marker['lat'] == '' | ||
|| typeof marker['lng'] === 'undefined' || marker['lng'] == '') { | || typeof marker['lng'] === 'undefined' || marker['lng'] == '') { | ||
− | addMarkerByAddress(marker['address'], marker['name'], marker[' | + | // Missing lat/lng information; add by address. |
+ | addMarkerByAddress(marker['address'], marker['name'], marker['id']); | ||
} else { | } else { | ||
− | addMarkerByLatLng(marker['lat'], marker['lng'], marker['name'], marker[' | + | // Add a marker by latlng. |
+ | addMarkerByLatLng(marker['lat'], marker['lng'], marker['name'], marker['id']); | ||
+ | } | ||
+ | } | ||
+ | } | ||
+ | |||
+ | /** | ||
+ | * Centre on a particular location on the map, if it exists | ||
+ | */ | ||
+ | function recentre(key) { | ||
+ | var newLatLng = defaultLatLng; | ||
+ | var newZoom = defaultZoom; | ||
+ | if (key) { | ||
+ | var marker = markers[key]; | ||
+ | if (typeof marker !== 'undefined') { | ||
+ | var gMarker = marker["GMarker"]; | ||
+ | if (typeof gMarker !== 'undefined') { | ||
+ | newLatLng = gMarker.getPosition(); | ||
+ | if (marker["zoom"]) { | ||
+ | newZoom = Number(marker["zoom"]); | ||
+ | } | ||
+ | } | ||
} | } | ||
} | } | ||
+ | //alert("About to recentre, and zoom to "+newZoom+" for key '"+key+"'"); | ||
+ | map.panTo(newLatLng); | ||
+ | map.setZoom(newZoom); | ||
+ | } | ||
+ | |||
+ | /** | ||
+ | * addOverlays: custom overlays such as zones, roads, and so on. | ||
+ | */ | ||
+ | function addOverlays() { | ||
+ | // Gage Park | ||
+ | var GageParkCorners = [ | ||
+ | new google.maps.LatLng(43.2449, -79.8298), | ||
+ | new google.maps.LatLng(43.2437, -79.8252), | ||
+ | new google.maps.LatLng(43.2433, -79.8242), | ||
+ | new google.maps.LatLng(43.2421, -79.8248), | ||
+ | new google.maps.LatLng(43.2422, -79.8258), | ||
+ | new google.maps.LatLng(43.2373, -79.8280), | ||
+ | new google.maps.LatLng(43.2394, -79.8320) | ||
+ | ]; | ||
+ | var GagePark = new google.maps.Polygon({ | ||
+ | paths: GageParkCorners, | ||
+ | strokeColor: "#FF0000", | ||
+ | strokeOpacity: 0.8, | ||
+ | strokeWeight: 2, | ||
+ | fillColor: "#FF0000", | ||
+ | fillOpacity: 0.35 | ||
+ | }); | ||
+ | GagePark.setMap(map); | ||
+ | } | ||
+ | |||
+ | function addRailways() { | ||
+ | var coords = [ | ||
+ | new google.maps.LatLng(43.2416,-79.7588), | ||
+ | new google.maps.LatLng(43.2482,-79.7869), | ||
+ | new google.maps.LatLng(43.2524,-79.8048), | ||
+ | new google.maps.LatLng(43.2576,-79.8270), | ||
+ | new google.maps.LatLng(43.2595,-79.8349), | ||
+ | new google.maps.LatLng(43.2648,-79.8576), | ||
+ | new google.maps.LatLng(43.2676,-79.8693), | ||
+ | new google.maps.LatLng(43.2707,-79.8827), | ||
+ | new google.maps.LatLng(43.2721,-79.8852), | ||
+ | new google.maps.LatLng(43.2738,-79.8867), | ||
+ | new google.maps.LatLng(43.2787,-79.8899), | ||
+ | new google.maps.LatLng(43.2843,-79.8911), | ||
+ | new google.maps.LatLng(43.2852,-79.8910), | ||
+ | new google.maps.LatLng(43.2929,-79.8863), | ||
+ | new google.maps.LatLng(43.2950,-79.8841), | ||
+ | new google.maps.LatLng(43.2965,-79.8816), | ||
+ | new google.maps.LatLng(43.3110,-79.8582), | ||
+ | new google.maps.LatLng(43.3183,-79.8464), | ||
+ | new google.maps.LatLng(43.3352,-79.8187), | ||
+ | new google.maps.LatLng(43.3353,-79.8172), | ||
+ | new google.maps.LatLng(43.3348,-79.8158), | ||
+ | new google.maps.LatLng(43.3338,-79.8153), | ||
+ | new google.maps.LatLng(43.3289,-79.8106), | ||
+ | new google.maps.LatLng(43.3229,-79.8040), | ||
+ | new google.maps.LatLng(43.3214,-79.8024), | ||
+ | new google.maps.LatLng(43.3203,-79.8017), | ||
+ | new google.maps.LatLng(43.3192,-79.8021), | ||
+ | new google.maps.LatLng(43.3170,-79.8050), | ||
+ | new google.maps.LatLng(43.3163,-79.8052), | ||
+ | new google.maps.LatLng(43.3152,-79.8051), | ||
+ | new google.maps.LatLng(43.3136,-79.8043), | ||
+ | new google.maps.LatLng(43.3119,-79.8034), | ||
+ | new google.maps.LatLng(43.3100,-79.8031), | ||
+ | new google.maps.LatLng(43.3025,-79.7988), | ||
+ | new google.maps.LatLng(43.2901,-79.7917), | ||
+ | new google.maps.LatLng(43.2853,-79.7890), | ||
+ | new google.maps.LatLng(43.2813,-79.7881), | ||
+ | new google.maps.LatLng(43.2766,-79.7872), | ||
+ | new google.maps.LatLng(43.2757,-79.7869), | ||
+ | new google.maps.LatLng(43.2735,-79.7852), | ||
+ | new google.maps.LatLng(43.2723,-79.7834), | ||
+ | new google.maps.LatLng(43.2714,-79.7827), | ||
+ | new google.maps.LatLng(43.2708,-79.7820), | ||
+ | new google.maps.LatLng(43.2699,-79.7813), | ||
+ | new google.maps.LatLng(43.2693,-79.7812), | ||
+ | new google.maps.LatLng(43.2687,-79.7813), | ||
+ | new google.maps.LatLng(43.2665,-79.7854), | ||
+ | new google.maps.LatLng(43.2655,-79.7867), | ||
+ | new google.maps.LatLng(43.2626,-79.7881), | ||
+ | new google.maps.LatLng(43.2623,-79.7883), | ||
+ | new google.maps.LatLng(43.2615,-79.7910), | ||
+ | new google.maps.LatLng(43.2615,-79.7920), | ||
+ | new google.maps.LatLng(43.2609,-79.7931), | ||
+ | new google.maps.LatLng(43.2583,-79.7942), | ||
+ | new google.maps.LatLng(43.2579,-79.7951), | ||
+ | new google.maps.LatLng(43.2575,-79.7965), | ||
+ | new google.maps.LatLng(43.2571,-79.7971), | ||
+ | new google.maps.LatLng(43.2550,-79.7981), | ||
+ | new google.maps.LatLng(43.2545,-79.7990), | ||
+ | new google.maps.LatLng(43.2546,-79.8002), | ||
+ | new google.maps.LatLng(43.2568,-79.8054), | ||
+ | new google.maps.LatLng(43.2587,-79.8115), | ||
+ | new google.maps.LatLng(43.2589,-79.8129), | ||
+ | new google.maps.LatLng(43.2635,-79.8281), | ||
+ | new google.maps.LatLng(43.2673,-79.8448), | ||
+ | new google.maps.LatLng(43.2682,-79.8494), | ||
+ | new google.maps.LatLng(43.2681,-79.8506), | ||
+ | new google.maps.LatLng(43.2676,-79.8524), | ||
+ | new google.maps.LatLng(43.2666,-79.8540), | ||
+ | new google.maps.LatLng(43.2650,-79.8564), | ||
+ | new google.maps.LatLng(43.2648,-79.8571), | ||
+ | new google.maps.LatLng(43.2648,-79.8578) | ||
+ | ]; | ||
+ | //var corners = new google.maps.MVCArray(); | ||
+ | //var count = 0; | ||
+ | //for (var pair in coords) { | ||
+ | // count += corners.push(new google.maps.LatLng(pair[1],pair[0])); | ||
+ | //} | ||
+ | //console.log("Added "+count+" LatLngs"); | ||
+ | addPath(coords,'',''); | ||
} | } | ||
// --></script> | // --></script> | ||
</html> | </html> |
Latest revision as of 19:00, 3 June 2012