Skip to content

Instantly share code, notes, and snippets.

@robozavri
Created May 9, 2018 10:02
Show Gist options
  • Save robozavri/c981b9b6a3681bd68cb86e850bf6a389 to your computer and use it in GitHub Desktop.
Save robozavri/c981b9b6a3681bd68cb86e850bf6a389 to your computer and use it in GitHub Desktop.
get coordinate by point from google map
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<style media="screen">
#map_canvas {
width: 980px;
height: 500px;
}
#current {
padding-top: 25px;
}
</style>
<section>
<div id='map_canvas'></div>
<div id="current">Nothing yet...</div>
</section>
<script src="http://maps.google.com/maps/api/js?sensor=false&.js"></script>
<script type="text/javascript">
var map = new google.maps.Map(document.getElementById('map_canvas'), {
zoom: 1,
center: new google.maps.LatLng(35.137879, -82.836914),
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var myMarker = new google.maps.Marker({
position: new google.maps.LatLng(47.651968, 9.478485),
draggable: true
});
google.maps.event.addListener(myMarker, 'dragend', function (evt) {
document.getElementById('current').innerHTML = '<p>Marker dropped: Current Lat: ' + evt.latLng.lat().toFixed(3) + ' Current Lng: ' + evt.latLng.lng().toFixed(3) + '</p>';
});
google.maps.event.addListener(myMarker, 'dragstart', function (evt) {
document.getElementById('current').innerHTML = '<p>Currently dragging marker...</p>';
});
map.setCenter(myMarker.position);
myMarker.setMap(map);
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment