Question

function btnClick() {
     var geocoder = new google.maps.Geocoder();
     var truckName = [];
     var addr = [];
     var Grid_Table = document.getElementById('GridView1');
     var locations2 = [{lat: -42.7545, lng: 147.735, addres: "3", geoAddress: "waa", truckName: "MX4" },
                       {lat: -43.7545, lng: 142.735, addres: "1", geoAddress: "waa", truckName: "MX5" },
                       {lat: -44.7545, lng: 143.735, addres: "2", geoAddress: "waa", truckName: "MX8" }];
            for (var row = 1; row < Grid_Table.rows.length - 1; row++) { 
            truckName.push(Grid_Table.rows[row].cells[0].textContent);
            var addr = Grid_Table.rows[row].cells[4].textContent;
            geocoder.geocode({ 'address': addr }, function (results, status) {
                if (status == google.maps.GeocoderStatus.OK) {
                    var loc = results[0].geometry.location;
                    var latitude = loc.lat();
                    var longitude = loc.lng();
                    locations2.push({ lat: latitude, lng: longitude, addres: addr, geoAddress: results[0].formatted_address, truckName: truckName[row] });
                } // end if
           }); // end geocoder
    } // end for
    document.cookie = "locations=" + JSON.stringify(locations2);
}

所以我的地图正在运作。但它只绘制了前三个位置。我知道这是因为GeoCoding是异步的。但对于我的生活，我无法弄清楚如何等待。我希望首先完成所有GeoCoding，然后设置cookie。请帮忙。

Answer 1

如果您不需要担心客户端地理编码速率限制为50 /秒 - 您的代码更改非常少

我添加了一个名为remaining的var，它设置了预期的地理编码请求数

然后在地理编码回调中，减少剩余，当为0时，全部完成

// if btnClick is add to a submit button (in a form), like so
submitButtonElement.addEventListener('click', btnClick);
// or using jQuery something like
$(submitButtonElement).on('click', btnClick);
// or
$(submitButtonElement).click(btnClick);
// then you'll need to preventDefault to stop the form submitting
function btnClick(e) {
    e.preventDefault(); // only required if handling a submit button
    var geocoder = new google.maps.Geocoder();
    var truckName =[];
    var addr = [];
    var Grid_Table = document.getElementById('GridView1');
    var locations2 = [{ lat: -42.7545, lng: 147.735, addres: "3", geoAddress: "waa", truckName: "MX4" },
                      { lat: -43.7545, lng: 142.735, addres: "1", geoAddress: "waa", truckName: "MX5" },
                      { lat: -44.7545, lng: 143.735, addres: "2", geoAddress: "waa", truckName: "MX8" }];
    var remaining = Grid_Table.rows.length - 2; // how many requests are pending
    for (var row = 1; row < Grid_Table.rows.length - 1; row++) {
        truckName.push(Grid_Table.rows[row].cells[0].textContent);
        var addr = Grid_Table.rows[row].cells[4].textContent;
        geocoder.geocode({ 'address': addr }, function (results, status) {
            if (status == google.maps.GeocoderStatus.OK) {
                var loc = results[0].geometry.location;
                var latitude = loc.lat();
                var longitude = loc.lng();
                locations2.push({ lat: latitude, lng: longitude, addres: addr, geoAddress: results[0].formatted_address, truckName: truckName[row] });
            } // end if
            remaining -= 1;
            if (remaining === 0) {
                // ************* ALL DONE HERE **********************
                document.cookie = "locations=" + JSON.stringify(locations2);
                // all done here - any other code should be here, or in a function called from here
            }
        }); // end geocoder
    } // end for
}

GeoCoding - 如何先等待所有位置解析，然后设置cookie

1 个答案: