Get Geolocation For Drupal GMAP

by Good Muyis

HTML

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
https://stackoverflow.com/questions/30524576/geolocation-how-to-get-city-from-long-and-lat
<hr/>City
<pre id="city"></pre>
<hr/> Lon-Lat
<pre id="lon-lat"></pre>

<hr/>Full response:
<pre id="raw"></pre>

JavaScript

$(document).ready(function() {
  function displayLocation(latitude, longitude) {
    var request = new XMLHttpRequest();
    var method = 'GET';
    var url = '//maps.googleapis.com/maps/api/geocode/json?latlng=' + latitude + ',' + longitude + '&sensor=true';
    var async = true;

    request.open(method, url, async);
    request.onreadystatechange = function() {
      if (request.readyState == 4 && request.status == 200) {
        var data = JSON.parse(request.responseText);
        //$("#raw").html(request.responseText); //Output the raw json
        var addressComponents = data.results[0].address_components;
        for (i = 0; i < addressComponents.length; i++) {
          var types = addressComponents[i].types
          //alert(types);
          if (types == "administrative_area_level_1,political") {
            $("#city").html(addressComponents[i].long_name);
						$("#lon-lat").html("Lat: " + latitude + " Long: " + longitude );
          }
        }
        //alert(address.city.short_name);
      }
    };
    request.send();
  };

  var successCallback = function(position) {
    var x = position.coords.latitude;
    var y = position.coords.longitude;
    displayLocation(x, y);
  };
  navigator.geolocation.getCurrentPosition(successCallback);
});