Javascript 如何使用GoogleMapsAPI定义多个位置，为循环生成的帖子列表中的每个帖子添加pin

这个问题可能会在其他帖子中得到回答，但我还没有找到具体的答案，而且我很难辨别如何逻辑地思考这个问题。我有一个网站，每个帖子都有一个地址。在每个帖子页面上，我都使用谷歌地图API将地址转换为地图位置，并在该地址显示带有pin的地图。效果很好

我现在需要做的是在我的归档/分类/etc页面（包含由查询和循环生成的帖子列表的页面）顶部显示一个地图，并为在特定查询中显示的每个帖子列出一个pin。我还需要地图自动调整大小，以显示所有的引脚，而不是显示引脚边界以外的无关地图

这样看来，我可以使用循环中的脚本创建标记，这样每次循环运行时，它都会生成一个新标记并将其添加到地图中

另一种似乎有潜力的方法是，为循环的每一圈将位置添加到数组中，然后在循环完成时显示管脚数组

有谁能给我一些关于如何做到这一点的建议吗？此时，我正在使用下面的代码，它为我提供了一个映射和循环生成的列表中最后一篇文章的位置。此代码在循环之外。我需要知道我应该在循环中移动哪个部分，以及如何调整它，这样我就不会在循环的每次迭代中简单地重写标记

<script type="text/javascript">
    function initialize() {
        geocoder = new google.maps.Geocoder();
        var mapOptions = {
            zoom: 3,
        }
        var myAddress = document.getElementById('theAddress');
        var address = myAddress.textContent;
        geocoder.geocode({
            'address': address
        }, function(results, status) {
            if (status == google.maps.GeocoderStatus.OK) {
                map.setCenter(results[0].geometry.location);
                var marker = new google.maps.Marker({
                    map: map,
                    position: results[0].geometry.location,

                });


            } else {
                alert('Geocode was not successful for the following reason: ' + status);
            }
        });

        var map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions);

    }
    google.maps.event.addDomListener(window, 'load', initialize);
</script>

函数初始化（）{
geocoder=新的google.maps.geocoder（）；
变量映射选项={
缩放：3，
}
var myAddress=document.getElementById（'theAddress'）；
var address=myAddress.textContent；
地理编码({
“地址”：地址
}，功能（结果、状态）{
if（status==google.maps.GeocoderStatus.OK）{
map.setCenter（结果[0].geometry.location）；
var marker=new google.maps.marker({
地图：地图，
位置：结果[0]。geometry.location，
});
}否则{
警报（'地理编码因以下原因未成功：'+状态）；
}
});
var map=new google.maps.map（document.getElementById（“地图画布”），mapOptions）；
}
google.maps.event.addDomListener（窗口“加载”，初始化）；

您需要在循环中添加标记。这是从我正在工作的一个项目中提取的

var locations = ["Denver, CO, United States"];
var markers = [];
var iterator = 0;

for (var i = 0; i < locations.length; i++) {
    setTimeout(function() {
            geocoder.geocode({'address': locations[iterator]}, function(results, status){
        if (status == google.maps.GeocoderStatus.OK) {
            var marker = new google.maps.Marker({
                map: map,
                position: results[0].geometry.location,
                animation: google.maps.Animation.DROP
            });
            bounds.extend(marker.getPosition());
            map.fitBounds(bounds);
        } else {
            log('Geocode was not successful for the following reason: ' + status);
        }
    });
    iterator++;

    }, i * 250);
}

var位置=[“美国科罗拉多州丹佛市”]；
var标记=[]；
var迭代器=0；
对于（变量i=0；i

一张将你想要完成的事情可视化的图片可能会有所帮助。有太多的信息（至少对我来说）无法理解您实际想要实现的目标。这看起来是一个很好的答案-与此同时，我一直在努力在PHP循环中创建一个位置数组，然后我可以使用它来创建标记，但我一直坚持这样做。我就这个话题提出了一个不同的问题。一旦我的大脑冷却下来，我会尝试这种方法：/一个问题-I*250是干什么的？I*250只是超时。我想先等谷歌对这个位置进行地理编码，然后再删除pin码。您可以根据需要更改此值。看起来它正在工作，这让我松了一口气。我确实需要添加

var geocoder=new google.maps.geocoder

让它工作，因为在此之前我得到了“geocoder未定义”-现在我得到了“bounds未定义”，但我不确定我需要声明什么来修复它-现在像个魔术师一样工作！杰出的非常感谢你！当我发布这篇文章时，我没有测试它。很抱歉但我想你明白了。如果您能用更好的代码更新答案，那就太好了：）