Google 地图地理编码在 For 循环中不起作用

Question

编辑 - 我已经通过使用 forEach 而不是 for 循环来解决这个问题，因为项目是从数组中提取的

我正在使用此代码检索要与 leaflet.js 一起使用的给定地址的纬度和经度。

markers = [
        {
            "name": "Tom David",   
            "address": "Karachi, Pakistan",
            "url": "https://en.wikipedia.org/wiki/Anguilla"
        },
        {
            "name": "Bob Thomas",
            "address": "London, Canada",
            "url": "https://en.wikipedia.org/wiki/Japan"
        },
        {
            "name": "Bob Mike",
            "address": "Paris, FR",
            "url": "https://en.wikipedia.org/wiki/Japan"
        }
];


for ( var i=0; i < markers.length; i++ ) {

            geocoder =  new google.maps.Geocoder();
            geocoder.geocode({'address': markers[i].address}, function(results, status) {

            L.marker([results[0].geometry.location.lat(), results[0].geometry.location.lng()]).bindTooltip(markers[i].address).addTo(map); 


            });               

}

问题出在 bindToolTip(markers[i].address) 上，因为看起来 'break' 代码虽然在使用字符串名称（如 "Hello"）时工作正常。

这是因为在 new google.maps.geocoder() 部分之后循环没有按预期工作。我已经尝试在上述代码下方使用 alert(i)，但出于某种原因它只是将数字 12 迭代了三次。

当它放在 geocoder() 部分上方时，它可以正常工作并迭代 0、1 和 2。

我将非常感谢对此的任何帮助。

总体

根据for循环中的当前i值从数组中取出地址
显示在 bindTooltip() 部分中检索到的地址，以在地图中显示为工具提示值。

编辑

Asynchronous Process inside a javascript for loop 此问题已被标记为与显示的 link 重复，但我不确定所提供的答案如何用于我自己的答案。有人可以帮我解决这个问题吗？

Answer 1

我刚刚意识到我可以使用 forEach 而不是必须使用 for 循环，因为数据是从数组中提取的

Google 地图地理编码在 For 循环中不起作用

Google Maps Geocode Not Working in For Loop

javascript

google-maps

geocoding

google-maps-api-3

google-maps-markers