How to call google map geocode service with jquery ajax

Question

I'm trying to get the LatLng from google map geocode api. my code is below with address values is "New York, NY"

$.ajax({
    url: 'http://maps.googleapis.com/maps/api/geocode/json',
    data: {
        sensor: false,
        address: address
    },
    success: function (data) {
        alert(data)
    }
});

But I'm not getting any values in alert.

Thanks for any help.

What are you getting? Please use Firebug (or equivalent) for debugging. What does te request contain? — Fokko Driesprong, Mar 04 '11 at 08:29
@Fokko Driesprong checked in firebug, getting data as empty and url as http://maps.googleapis.com/maps/api/geocode/json?sensor=false&address=NewYork%2C+NY and when pasting this url in browser address bar giving the results. :-) — rajakvk, Mar 04 '11 at 08:33

score 14 · Accepted Answer · edited May 23 '17 at 11:53

14

You will need to contact the API regarding the rules.

$.getJSON( {
    url  : 'https://maps.googleapis.com/maps/api/geocode/json',
    data : {
        sensor  : false,
        address : address
    },
    success : function( data, textStatus ) {
        console.log( textStatus, data );
    }
} );

Edit:

How dumb of me, shouldn't be on stackoverflow in the morning! The problem is a cross-domain request. For security reasons this is not allowed. See: How to make cross-domain AJAX calls to Google Maps API?

Please use Google's own Geocoding client.

edited May 23 '17 at 11:53

Community

1
1

answered Mar 04 '11 at 08:33

Fokko Driesprong

2,075
19
31

thanks again. I tried with the above code but no luck. By the way, before function i added "success:" – rajakvk Mar 04 '11 at 08:44
I tried this solution, but I'm getting "Uncaught SyntaxError: Unexpected identifier" error for address parameter in data. Can somebody help me how to resolve this please? – snoopy_15 Sep 19 '16 at 21:12

score 10 · Answer 2 · answered Jul 24 '15 at 12:26

10

there is no need to make use of jquery, Google maps javascript API v3 has build in its own functions which makes the API easy to use.

https://developers.google.com/maps/documentation/javascript/geocoding https://developers.google.com/maps/documentation/geocoding/intro

var geocoder = new google.maps.Geocoder();
geocoder.geocode({ 'address': address }, function(results, status) {
    if (status == google.maps.GeocoderStatus.OK) {
        map.setCenter(results[0].geometry.location);
        var marker = new google.maps.Marker({
            map: map,
            position: results[0].geometry.location
        });
    }
});

answered Jul 24 '15 at 12:26

Melvin

3,421
2
37
41

Just as a side note, if you will be performing look-ups for international addresses, it's a good idea to use the componentRestrictions parameter rather than the address. `geocoder.geocode({ componentRestrictions: { country: country, postalCode: zip } }, function (results, status) { } });` This ensures that the API doesn't mis-interpret the values you are passing in as something it isn't (country as a city, etc) – Nick Apr 26 '18 at 21:47

user2534532 · Answer 3 · 2015-03-22T16:32:40.583

3

If anyone is seeking help on this topic, this is how I have done it. Note this is a reverse lookup, but a forward lookup should work the same way:

`

    function getLocation() {
var latdegrees=40.2298;
var londegrees=-41.88754;
     var url = "https://maps.googleapis.com/maps/api/geocode/json?latlng=" + latdegrees + "," + londegrees + "YOUR API KEY";
    $.getJSON(url,function (data, textStatus) {
           var streetaddress=data.results[0].formatted_address;
          return streetaddress;
      });
     }`

edited Mar 22 '15 at 16:32

answered Mar 22 '15 at 15:26

user2534532

31
2

Even though reverse geocoding wasn't asked for. Thanks for adding that anyway! – Jester Jun 18 '19 at 17:39

score 1 · Answer 4 · answered Dec 27 '12 at 03:33

1

V3 geocoding webservice doesn't support JSONP requests, but it's still available in V2

See: http://blog.futtta.be/2010/04/09/no-more-jsonp-for-google-geocoding-webservice/

answered Dec 27 '12 at 03:33

Brankodd

831
9
21

score 1 · Answer 5 · answered Jan 20 '15 at 01:18

This is how I did it. Geocoder seems like is creating it's own callback.

geo.geocode({ 'address': myaddress }, function(data, status) {
    if (status == google.maps.GeocoderStatus.OK) { 
        var myylocation = data[0].geometry.location;
        lat = myylocation.lat();
        lng = myylocation.lng();
    }
});

score 0 · Answer 6 · 2012-11-23T02:33:54.750

0

or specify dataType to jsonp?

$.ajax({
    url: 'http://maps.googleapis.com/maps/api/geocode/json',
    data: {
        sensor: false,
        address: address
    },
    dataType:'jsonp',
    success: function (data) {
        alert(data)
    }
});

edited Nov 23 '12 at 02:33

answered Nov 23 '12 at 01:38

How to call google map geocode service with jquery ajax

6 Answers6

Linked