Google Maps API,Javascript,返回距离Geocoder用作Circle的半径

犹太人

我正在尝试使用距城市/地铁界线的最短距离作为要在Google地图上为该特定城市绘制的圆圈的大小。但是,尽管我相信我已考虑到与AJAX有关的请求响应问题,但该值仍未定义。我在这里做错什么了。

function initialize() {
    autoComplete();

    map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);

    for (var i=0;i<5;i++) {            

        var centerLocation = new google.maps.LatLng(myLat[i],myLng[i]);
        var address = myMetro[i] + "," + myCountry[i];
        var testRadius = 500000;

        Geocode(address, function(distance) {
            myRadius = distance;   
            console.log("it works here " + myRadius);         
        });

        console.log("it is undefined here " + myRadius);

        circleMetroBounds = new google.maps.Circle({
            strokeColor: 'rgb(255,255,255)', //sets the color for the border of the circle
            strokeOpacity: 0.8, //sets the opacity for the border
            strokeWeight: 2, //sets the border size in pixels
            fillColor: 'rgb(166,116,178)', //sets the fill color for the circle (should become a variable, like center)
            fillOpacity: 0.4, //sets the opacity for the fill color
            center: centerLocation, //sets the coordinates for the location of the circle
            map: map,
            radius: myRadius
        });
    }       
}

function Geocode(address, cb){
    geocoder = new google.maps.Geocoder();
    geocoder.geocode({ 'address': address }, function (results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            var boundMetroNE = results[0].geometry.bounds.getNorthEast(); // NE bound for Metro
            var boundMetroSE = new google.maps.LatLng(results[0].geometry.bounds.getSouthWest().lat(), results[0].geometry.bounds.getNorthEast().lng()); // SE
            var boundMetroNW = new google.maps.LatLng(results[0].geometry.bounds.getNorthEast().lat(), results[0].geometry.bounds.getSouthWest().lng()); // NW
            var boundMetroSW = results[0].geometry.bounds.getSouthWest(); // SW bound for Metro

            var distanceMetroNS = google.maps.geometry.spherical.computeDistanceBetween(boundMetroNE,boundMetroSE);
            var distanceMetroEW = google.maps.geometry.spherical.computeDistanceBetween(boundMetroNE,boundMetroNW);

            if (distanceMetroNS<distanceMetroEW) {
                distanceMetroBounds = distanceMetroNS;
            } else {
                distanceMetroBounds = distanceMetroEW;
            }
        } else {
            console.log("Geocoding failed: " + status);
        }
        console.log("distance Shortest: " + distanceMetroBounds + " meters");
        cb(distanceMetroBounds);
    });
}

还找到包含Javascript控制台的输出

this goes wrong it undefined (index):84
this goes wrong it undefined (index):84
this goes wrong it undefined (index):84
this goes wrong it undefined (index):84
this goes wrong it undefined (index):84
distance Shortest: 89152.91926541901 meters (index):119
this goes wrong it 89152.91926541901 (index):81
distance Shortest: 62673.31119262365 meters (index):119
this goes wrong it 62673.31119262365 (index):81
distance Shortest: 78080.76940877317 meters (index):119
this goes wrong it 78080.76940877317 (index):81
distance Shortest: 12077.897792227775 meters (index):119
this goes wrong it 12077.897792227775 (index):81
distance Shortest: 13643.316791625093 meters (index):119
this goes wrong it 13643.316791625093

编辑:

完成工作的最终代码:)

function initialize() {
    autoComplete();

    map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);

    for (var i=0;i<5;i++) {        
        var address = myMetro[i] + "," + myCountry[i];    
        var centerLocation = new google.maps.LatLng(myLat[i],myLng[i]);

        Geocode(address, centerLocation, function(callbackDistance, callbackCenterlocation) {
            circleMetroBounds = new google.maps.Circle({
                strokeColor: 'rgb(255,255,255)', //sets the color for the border of the circle
                strokeOpacity: 0.8, //sets the opacity for the border
                strokeWeight: 2, //sets the border size in pixels
                fillColor: 'rgb(166,116,178)', //sets the fill color for the circle (should become a variable, like center)
                fillOpacity: 0.4, //sets the opacity for the fill color
                center: callbackCenterlocation, //sets the coordinates for the location of the circle
                map: map,
                radius: callbackDistance
            });         
        });   
    }       
}

function Geocode(address, centerlocation, cb){
    geocoder = new google.maps.Geocoder();
    geocoder.geocode({ 'address': address }, function (results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            var boundMetroNE = results[0].geometry.bounds.getNorthEast(); // NE bound for Metro
            var boundMetroSE = new google.maps.LatLng(results[0].geometry.bounds.getSouthWest().lat(), results[0].geometry.bounds.getNorthEast().lng()); // SE
            var boundMetroNW = new google.maps.LatLng(results[0].geometry.bounds.getNorthEast().lat(), results[0].geometry.bounds.getSouthWest().lng()); // NW
            var boundMetroSW = results[0].geometry.bounds.getSouthWest(); // SW bound for Metro

            var distanceMetroNS = google.maps.geometry.spherical.computeDistanceBetween(boundMetroNE,boundMetroSE);
            var distanceMetroEW = google.maps.geometry.spherical.computeDistanceBetween(boundMetroNE,boundMetroNW);

            if (distanceMetroNS<distanceMetroEW) {
                distanceMetroBounds = distanceMetroNS;
            } else {
                distanceMetroBounds = distanceMetroEW;
            }
            // else if solves QUERY LIMIT
            } else if (status === google.maps.GeocoderStatus.OVER_QUERY_LIMIT) {    
                    setTimeout(function() {
                        Geocode(address, centerlocation, cb);
                    }, 200);
            } else {
            console.log("Geocoding failed: " + status);
        }
        console.log("distance Shortest: " + distanceMetroBounds + " meters");
        cb(distanceMetroBounds, centerlocation);
    });
}
地理编码

地理编码是异步的。如果可用,则必须在回调函数中使用返回值。

请注意,地理编码受速率限制和配额的限制,如果您尝试对循环中的太多点进行地理编码,它将失败并显示OVER_QUERY_LIMIT。

function initialize() {
    autoComplete();

    map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);

    for (var i=0;i<5;i++) {            

        var centerLocation = new google.maps.LatLng(myLat[i],myLng[i]);
        var address = myMetro[i] + "," + myCountry[i];
        var testRadius = 500000;

        Geocode(address, function(distance) {
            myRadius = distance;   
            console.log("it works here " + myRadius);         
            circleMetroBounds = new google.maps.Circle({
              strokeColor: 'rgb(255,255,255)', //sets the color for the border of the circle
              strokeOpacity: 0.8, //sets the opacity for the border
              strokeWeight: 2, //sets the border size in pixels
              fillColor: 'rgb(166,116,178)', //sets the fill color for the circle (should become a variable, like center)
              fillOpacity: 0.4, //sets the opacity for the fill color
              center: centerLocation, //sets the coordinates for the location of the circle
              map: map,
              radius: myRadius
            });
        });

        console.log("it is undefined here " + myRadius);

    }       
}

function Geocode(address, cb){
    geocoder = new google.maps.Geocoder();
    geocoder.geocode({ 'address': address }, function (results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            var boundMetroNE = results[0].geometry.bounds.getNorthEast(); // NE bound for Metro
            var boundMetroSE = new google.maps.LatLng(results[0].geometry.bounds.getSouthWest().lat(), results[0].geometry.bounds.getNorthEast().lng()); // SE
            var boundMetroNW = new google.maps.LatLng(results[0].geometry.bounds.getNorthEast().lat(), results[0].geometry.bounds.getSouthWest().lng()); // NW
            var boundMetroSW = results[0].geometry.bounds.getSouthWest(); // SW bound for Metro

            var distanceMetroNS = google.maps.geometry.spherical.computeDistanceBetween(boundMetroNE,boundMetroSE);
            var distanceMetroEW = google.maps.geometry.spherical.computeDistanceBetween(boundMetroNE,boundMetroNW);

            if (distanceMetroNS<distanceMetroEW) {
                distanceMetroBounds = distanceMetroNS;
            } else {
                distanceMetroBounds = distanceMetroEW;
            }
        } else {
            console.log("Geocoding failed: " + status);
        }
        console.log("distance Shortest: " + distanceMetroBounds + " meters");
        cb(distanceMetroBounds);
    });
}

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章