Question

我在infowindow中为动态标记实现一些数据时遇到了一些麻烦，这些动态标记是我从解析中获得的一些地理位置。

 function initMap(arlat, arlon, arname, artel, ardesc, aradd, arithmisi) {

    var map = new google.maps.Map(document.getElementById('map'), {
                            zoom: 6,
                            center: {
                                lat: 37.58,
                                lng: 23.43
                            }
                        });
                        var iconBase = 'http://sourtouki.gr/';

                        for (j = 0; j < arithmisi; j++) {
                            var contentString = '<div id="content">' +
                                '<div id="siteNotice">' +
                                '</div>' +
                                arname[j] +
                                '<div id="bodyContent">' +
                                ardesc[j] + "<br>" + aradd[j] + "<br>" + artel[j] + "<br>" +
                                '</div>' +
                                '</div>';


                            var marker = new google.maps.Marker({
                                position: {
                                    lat: arlat[j],
                                    lng: arlon[j]
                                },
                                map: map,
                                icon: iconBase + 'sourtoukilogo.png',        
                                title: arname[j]
                            });        
                        }
                        var infowindow = new google.maps.InfoWindow({
                            content: contentString
                        });

                        marker.addListener('click', function() {
                            infowindow.open(map, marker);
                        });
                    }

因此，使用上面的代码，我将一些表中的一些数据推送到地图中。标记在必要时在位置创建，但每当我点击标记时，它只打开一个标记。它加载17个标记，但唯一打开的infowindow是第一个条目，无论我推动什么标记。此外，每个标记的标题都是正确的。

更新我在这张地图上有17个条目，17个地理点（lat，lng），17个名字，17个描述等。因此，通过上面的代码，我得到了所有的geoipoints，并将标记放在地图上的正确位置。当我点击一个标记来获取名称和地址并将其显示在infowindow时，我想要。但我想我在for循环中出错了。虽然我必须采用所有数据，但每个地点都有正确的名称等，但每当我点击一个标记时，只有第一个条目打开信息窗口，让我说我点击地图中的第三个标记第一个信息窗口将打开，如果我按下第12个标记也会发生。知道为什么会这样吗？

更新2

function initMap(arlat, arlon, arname, artel, ardesc, aradd, arithmisi) {



                    // console.log(arlat.length + arlon.lenght);

                    var map = new google.maps.Map(document.getElementById('map'), {
                        zoom: 6,
                        center: {
                            lat: 37.58,
                            lng: 23.43
                        }
                    });
                    var iconBase = 'http://sourtouki.gr/';

                    infowindow = new google.maps.InfoWindow();
                    for (j = 0; j < arithmisi; j++) {

                        var marker = new google.maps.Marker({
                            position: {
                                lat: arlat[j],
                                lng: arlon[j]
                            },
                            map: map,
                            icon: iconBase + 'sourtoukilogo.png',

                            title: arname[j]
                        });
                    var contentString = '<div id="content">' +
                            '<div id="siteNotice">' +
                            '</div>' +
                            arname[j] +
                            '<div id="bodyContent">' +
                            ardesc[j] + "<br>" + aradd[j] + "<br>" + artel[j] + "<br>" +
                            '</div>' +
                            '</div>';

                             google.maps.event.addListener(marker, 'click', function() {
                                    infowindow.setContent(contentString);
                                    infowindow.open(map,this);

                                 });


                    }


                }

在第二次更新时，我在for循环之外创建一个空的infowindow，在我调用内部的内容之后，现在它打开所有的infowindows，但内部具有相同的内容。

一般来说，我已经在stackoverflow中的其他问题中尝试了很多答案，并且没有任何修复可以用于我的案例，如果有人可以帮助我会感激不尽！

Answer 1

你的for循环仅用于标记，不用于infowindow和listener，因为这些循环尝试这种方式..但最重要的是你需要一个标记数组而不是单个标记这样

var markers = [];

for (j = 0; j < arithmisi; j++) {
    var contentString = '<div id="content">' +
        '<div id="siteNotice">' +
        '</div>' +
        arname[j] +
        '<div id="bodyContent">' +
        ardesc[j] + "<br>" + aradd[j] + "<br>" + artel[j] + "<br>" +
        '</div>' +
        '</div>';


    var marker = new google.maps.Marker({
        position: {
            lat: arlat[j],
            lng: arlon[j]
        },
        map: map,
        icon: iconBase + 'sourtoukilogo.png',        
        title: arname[j]
    });        

    k = markers.push(marker);

    var infowindow = new google.maps.InfoWindow({
      content: contentString
    });

    markers[k-1].addListener('click', function() {
      infowindow.open(map, marker);
    });
}

Answer 2

您的信息窗口的内容正在for循环之外设置。所以它总是被设置为contentString的最后一个值。

每个标记谷歌地图的信息窗口

2 个答案: