Goggle Maps Examples

Marker draggable with coordinates

Written to input field

Coordinates

Tools, Resources

Loading ...
<div id="mapCanvas" style="width:430px;height:400px">Loading ...</div>

<script type="text/javascript">

function initialize() {
var latLng = new google.maps.LatLng(47.377035981279576, 8.529851183932417);
var myOptions = {
zoom: 19,
center: latLng,
mapTypeId: google.maps.MapTypeId.SATELLITE,
mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU},
navigationControlOptions: {style: google.maps.NavigationControlStyle.SMALL}
}
var map = new google.maps.Map(document.getElementById("mapCanvas"), myOptions);

mymarker = new google.maps.Marker({
position: latLng,
map: map,
draggable: true
});

google.maps.event.addListener(mymarker, "dragend", function() {
var lat = document.getElementById("show_lat");
var lng = document.getElementById("show_lng");
var coords = this.getPosition()
lat.value = coords.lat();
lng.value = coords.lng();
});

}

</script>