Created
March 21, 2011 05:42
-
-
Save fatgy/879082 to your computer and use it in GitHub Desktop.
get marker's coordinates (latitude,longitude,zoom,mercator,container,div) http://www.william-map.com/20100416/1/map.htm
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<html> | |
<head> | |
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> | |
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> | |
<script type="text/javascript"> | |
var map; | |
var marker; | |
var overlay; | |
function initialize() { | |
var latlng = new google.maps.LatLng(48.86, 2.34); | |
var myOptions = { | |
zoom: 13, | |
center: latlng, | |
mapTypeId: google.maps.MapTypeId.ROADMAP | |
}; | |
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); | |
google.maps.event.addListener(map, 'click', function(event) { | |
placeMarker(event.latLng); | |
}); | |
overlay = new google.maps.OverlayView(); | |
overlay.draw = function() {}; | |
overlay.setMap(map); | |
} | |
function placeMarker(location) { | |
if (marker != null) { | |
marker.setMap(null); | |
} | |
marker = new google.maps.Marker({ | |
position: location, | |
map: map | |
}); | |
var mapType = map.mapTypes[map.getMapTypeId()]; | |
var mapPixel = mapType.projection.fromLatLngToPoint(location); | |
var containerPixel = overlay.getProjection().fromLatLngToContainerPixel(location); | |
var divPixel = overlay.getProjection().fromLatLngToDivPixel(location); | |
document.getElementById("info").innerHTML = "<table>" + | |
"<tr><td>LatLng</td><td>" + location.lat() + ","+ location.lng() + "</td></tr>" + | |
"<tr><td>Zoom</td><td>" + map.getZoom() + "</td>,</tr>" + | |
"<tr><td>Mercator</td><td>" + mapPixel.x + "," + mapPixel.y + "</td></tr>" + | |
"<tr><td>Container</td><td>" + containerPixel.x + "," + containerPixel.y + "</td></tr>" + | |
"<tr><td>Div</td><td>" + divPixel.x + "," + divPixel.y + "</td></tr></table>"; | |
} | |
</script> | |
</head> | |
<body onload="initialize()"> | |
<p>Click on the map to see coordinates (latitude,longitude,zoom,mercator,container,div)</p> | |
<div id="map_canvas" style="width:512px; height:384px"></div> | |
<div id="info" style="width:512px"></div> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment