admin管理员组

文章数量:1281721

I don't understand why but i'm getting this error when I try to initialize the google.maps.Geocoder.

Here is the error:

Uncaught TypeError: undefined is not a function

And the code : 

function updateMapPosition(map){
    var geocoder = new google.maps.Geocoder(); //crashes here !!
    var position = geocoder.geocode( {'address':$('#id_address').val()},
        function(results,status){
            if(status == google.maps.GeocoderStatus.OK){
                if (status != google.maps.GeocoderStatus.ZERO_RESULTS) {
                    map.setCenter(results[0].geometry.location);
                    var marker = new google.maps.Marker({map:map, position:results[0].geometry.location});
                }
                else{
                    alert("hop")
                }
            }
        }
    )
}

I don't understand why but i'm getting this error when I try to initialize the google.maps.Geocoder.

Here is the error:

Uncaught TypeError: undefined is not a function

And the code : 

function updateMapPosition(map){
    var geocoder = new google.maps.Geocoder(); //crashes here !!
    var position = geocoder.geocode( {'address':$('#id_address').val()},
        function(results,status){
            if(status == google.maps.GeocoderStatus.OK){
                if (status != google.maps.GeocoderStatus.ZERO_RESULTS) {
                    map.setCenter(results[0].geometry.location);
                    var marker = new google.maps.Marker({map:map, position:results[0].geometry.location});
                }
                else{
                    alert("hop")
                }
            }
        }
    )
}
  • javascript
  • google-maps
  • undefined
Share Improve this question edited Aug 23, 2011 at 20:13 ayublin 1,84517 silver badges25 bronze badges asked Jun 18, 2011 at 19:21 iva123iva123 3,51510 gold badges51 silver badges68 bronze badges 1
  • 1 can you give more information on how you load the library? maybe you can post the part of the <head></head> where you load all the javascript libraries. – ayublin Commented Aug 23, 2011 at 19:52
Add a comment  | 

4 Answers 4

Reset to default 11

Since you appear to be using something like jQuery, you may have the same issue I had where jQuery considers the script loading complete before Google Maps is actually completely "assembled". Using jQuery's $.getScript (equivalent to $.ajax with dataType: "script" used here), it appears parts of the maps API are not yet available in the success/done callbacks.

$(function() {
    var doSomethingMapRelatedInvolvingJQuery = function(geocoder, map) { ... };

    $.ajax({
        url: "https://maps.googleapis.com/maps/api/js?v=3&sensor=false",
        dataType: "script"
    }).done(function() {
        var geocoder = new google.maps.Geocoder(), // ERROR!
            activityMap = new google.maps.Map($("#map_canvas")[0], {
                center: new google.maps.LatLng(0, 0),
                zoom: 0,
                mapTypeId: google.maps.MapTypeId.SATELLITE
            });

        doSomethingMapRelatedInvolvingJQuery(geocoder, map);
    });
});

For some reason, even though jQuery is saying the script has been executed already by executing the callbacks, parts of the Google Maps API are not yet available (possibly additional asynchronous stuff by Google after the first file executes).

The only solution I could find was to declare a global variable name to hold a function that Google Maps would be responsible for calling when it was completely ready. You can give it that control by adding the callback={yourfunctionname} querystring parameter to the URL (e.g., https://maps.googleapis.com/maps/api/js?v=3&callback=googleMapsCallback&sensor=false). It's not the prettiest solution, but it works.

var googleMapsCallback;
$(function() {
    var doSomethingMapRelatedInvolvingJQuery= function(geocoder, map) { ... };

    googleMapsCallback = function() {
        var geocoder = new google.maps.Geocoder(), // Works when google makes the call.
            activityMap = new google.maps.Map($("#map_canvas")[0], {
                center: new google.maps.LatLng(0, 0),
                zoom: 0,
                mapTypeId: google.maps.MapTypeId.SATELLITE
            });

        doSomethingMapRelatedInvolvingJQuery(geocoder, map);
    };
    $.ajax({
        url: "https://maps.googleapis.com/maps/api/js?v=3&callback=googleMapsCallback&sensor=false",
        dataType: "script"
    });
});

EDIT:

I put together a proof-of-concept jsFiddle that pulls all that ugliness into a jQuery-extended method that allows for Deferred-chaining. Here's a quick example of how it can be used:

$.loadGoogleMaps().done(function () {
    var geocoder = new google.maps.Geocoder();
    // ... do stuff with your geocoder here ...
});

If you use the Google AJAX API Loader to load the Google Maps API you must explicitly specify whether your app uses a sensor, otherwise you won't get the Geocoder object. 

google.load('maps','3.6',{other_params:'sensor=false'});

Looks to me like Geocoder isn't defined, hence the error that Undefined is not a function. However, google.maps is defined or you would have gotten an error that it wasn't defined before Geocoder was resolved.

You'll need to check how you're loading the Map API because it doesn't seem to have been loaded correctly.

I solved my problem, it was because of a bad href url in the script tag for the Maps library:

<script src="http://maps.google.com/maps/api/js?v=3.6&sensor=false&key=XXXX" ....

本文标签： javascriptCan39t initiate the googlemapsGeocoderStack Overflow

版权声明：本文标题：javascript - Can&#39;t initiate the google.maps.Geocoder - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1738437628a2086767.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。