The Solution BOX: Getting Latitude & Longitude from Google Maps using drag and drop marker

Recently i was working on a website of real estate selling. For that i have created a simple code which enables users to drag and drop the marker and make it easy to understand where the property or land is located. For that i have used the google maps api as well as my some simple code and finally it started to work.

The code!

<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> <style>#map {   height: 500px;   border: 1px solid #000; }</style> <div id="map"> </div> <script> window.onload = function() {     var latlng = new google.maps.LatLng(19.9974533,73.7898023); //Set the default location of map     var map = new google.maps.Map(document.getElementById('map'), {         center: latlng,         zoom: 11, //The zoom value for map         mapTypeId: google.maps.MapTypeId.ROADMAP     });     var marker = new google.maps.Marker({         position: latlng,         map: map,         title: 'Place the marker for your location!', //The title on hover to display         draggable: true //this makes it drag and drop     });     google.maps.event.addListener(marker, 'dragend', function(a) {         console.log(a);         document.getElementById('loc').value = a.latLng.lat().toFixed(4) + ', ' + a.latLng.lng().toFixed(4); //Place the value in input box            }); }; </script> <input id='loc' type='text'  value=''/>
It can be further improved for the getting the same location by simply changing the command of draggable to false.

CODEPEN DEMO:

See the Pen Google Maps Latitude & Longitude by Draggable Marker by Abhishek (@abhibagul) on CodePen.