通过ajax()请求获取Google Maps API的地址坐标

时间:2011-04-11 15:30:55

标签: javascript jquery ajax google-maps google-maps-api-3

我正试图通过下一个示例http://jsbin.com/inepo3/7/edit获取Google Maps API的lng和lat坐标。我期待一个“成功”弹出窗口,但它会一直显示“错误”弹出窗口。 谷歌地图请求提供了正确的json反馈(由firebug检查)。

<script type="text/javascript">
    $().ready(function() {

        $.fn.getCoordinates=function(address){

            $.ajax(
            {
                type : "GET",
                url: "http://maps.google.com/maps/api/geocode/json",
                dataType: "jsonp",
                data: {
                    address: address,
                    sensor: "true"
                },
                success: function(data) {
                    set = data;
                    alert(set);
                },
                error : function() {
                    alert("Error.");
                }
            });
        };

        $().getCoordinates("Amsterdam, Netherlands");
    });
</script>

有谁知道如何解决这个问题?

此致 Guido Lemmens

修改

我在jQuery中使用Google Maps Javascript API找到了更好的解决方案:

<script type="text/javascript">
    $().ready(function() {
        var user1Location = "Amsterdam, Netherlands";
        var geocoder = new google.maps.Geocoder();
        //convert location into longitude and latitude
        geocoder.geocode({
            address: user1Location
        }, function(locResult) {
            console.log(locResult);
            var lat1 = locResult[0].geometry.location.lat();
            var lng1 = locResult[0].geometry.location.lng();
            $("#testDiv").html("latitude:" + lat1 + "<p>longitude:" + lng1 + "</p>");
        });
    });
</script>

1 个答案:

答案 0 :(得分:9)

Google Map API V3使外部库更难与JSONP配合使用。这是一篇关于它的博客文章。

JSONP and Google Maps API Geocoder Plus A Fix w/ jQuery


获取地理编码的另一种方法是使用Google Map V3 API Geocoder Service。这是一个例子,我帮助一个有类似问题的人替换他的JSONP以使用Google Map V3地理编码服务。看一下这个JSFiddle Demo:

这基本上是核心。我们基本上使用twitter来获取推文的地址(IE。伦敦,马德里或佐治亚等),并使用Google Map的地理编码服务将实际地址转换为LatLng:

$.getJSON(
    url1, function(results) { // get the tweets
        var res1 = results.results[0].text;
        var user1name = results.results[0].from_user;
        var user1Location = results.results[0].location;

        // get the first tweet in the response and place it inside the div
        $("#last-tweet1").html(res1 + "<p>from: " + user1name + " (" + user1Location + ")</p><p>");
        //convert location into longitude and latitude
        geocoder.geocode({
            address: user1Location
        }, function(locResult) {
            console.log(locResult);
            var lat1 = locResult[0].geometry.location.lat();
            var lng1 = locResult[0].geometry.location.lng();
            $("#testDiv").html("latitude:" + lat1 + "<p>longitude:" + lng1 + "</p>");
        });
    });