Template:Fragoria Map
From FragoriaWiki
(Difference between revisions)
Line 34: | Line 34: | ||
} | } | ||
}; | }; | ||
+ | var map = new google.maps.Map(document.getElementById('map_canvas'), | ||
+ | mapOptions); | ||
+ | map.mapTypes.set('moon', moonMapType); | ||
+ | map.setMapTypeId('moon'); | ||
- | + | //Report Coordinates | |
- | + | google.maps.event.addListener(FragotownMarker, 'dragend', function(evt){ | |
- | + | document.getElementById('current').innerHTML = '<p>Marker dropped: ( ' + evt.latLng.lat().toFixed(6) + ',' + evt.latLng.lng().toFixed(6) + ')</p>'; | |
- | + | }); | |
- | + | google.maps.event.addListener(FragotownMarker, 'dragstart', function(evt){ | |
- | + | document.getElementById('current').innerHTML = '<p>Currently dragging marker...</p>'; | |
- | + | }); | |
+ | |||
+ | // Bounds | ||
+ | var strictBounds = new google.maps.LatLngBounds( | ||
new google.maps.LatLng(-89.957,-125), | new google.maps.LatLng(-89.957,-125), | ||
new google.maps.LatLng(65,125) | new google.maps.LatLng(65,125) | ||
- | + | ); | |
+ | // Listen for the CENTER_CHANGED event | ||
+ | google.maps.event.addListener(map, 'center_changed', function() { | ||
+ | if (strictBounds.contains(map.getCenter())) return; | ||
+ | // We're out of bounds - Move the map back within the bounds | ||
+ | var c = map.getCenter(), | ||
+ | x = c.lng(), | ||
+ | y = c.lat(), | ||
+ | maxX = strictBounds.getNorthEast().lng(), | ||
+ | maxY = strictBounds.getNorthEast().lat(), | ||
+ | minX = strictBounds.getSouthWest().lng(), | ||
+ | minY = strictBounds.getSouthWest().lat(); | ||
+ | if (x < minX) x = minX; | ||
+ | if (x > maxX) x = maxX; | ||
+ | if (y < minY) y = minY; | ||
+ | if (y > maxY) y = maxY; | ||
+ | map.setCenter(new google.maps.LatLng(y, x)); | ||
+ | }); | ||
+ | // Limit the zoom level | ||
+ | google.maps.event.addListener(map, 'zoom_changed', function() { | ||
+ | if (map.getZoom() < minZoomLevel) map.setZoom(minZoomLevel); | ||
+ | }); | ||
- | + | // Origins, anchor positions and coordinates of the marker | |
- | + | // increase in the X direction to the right and in | |
- | + | // the Y direction down. | |
- | + | var image = { | |
- | + | url: '/wiki/images/c/c3/Greendungeon.png', | |
- | + | // (width, length). | |
- | + | size: new google.maps.Size(21, 20), | |
- | + | // The origin for this image is 0,0. | |
- | + | origin: new google.maps.Point(10.5,20), | |
- | + | // The anchor for this image is the base of the flagpole at 0,32. | |
- | + | anchor: new google.maps.Point(10.5,20) | |
- | + | }; | |
- | + | // Shapes define the clickable region of the icon. | |
- | + | // The type defines an HTML <area> element 'poly' which | |
- | + | // traces out a polygon as a series of X,Y points. The final | |
- | + | // coordinate closes the poly by connecting to the first | |
- | + | // coordinate. | |
- | + | var shape = { | |
- | + | coords: [0, 0, 0, 20, 21, 20, 21, 0], | |
- | + | type: 'poly' | |
- | + | }; | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
var FragotownMarker = new google.maps.Marker({ | var FragotownMarker = new google.maps.Marker({ | ||
position: new google.maps.LatLng(-89.623848,33.001326), | position: new google.maps.LatLng(-89.623848,33.001326), | ||
map: map, | map: map, | ||
- | draggable:true, | + | draggable:true, |
title:"Fragotown" | title:"Fragotown" | ||
}); | }); | ||
Line 106: | Line 106: | ||
position: new google.maps.LatLng(-89.128166,16.829451), | position: new google.maps.LatLng(-89.128166,16.829451), | ||
map: map, | map: map, | ||
- | icon: | + | icon: image, |
- | shape: shape, | + | shape: shape, |
title:"Dark Konung's Tomb" | title:"Dark Konung's Tomb" | ||
}); | }); | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
} | } |
Revision as of 05:41, 5 April 2015
Coordinates