多个“InfoWindow”对于“标记”阵列来说，在Google地图上？ [英] Multiple "InfoWindow" for array of "markers" on Google Maps?

问题描述

使用Google Maps API为每个标记添加一个infoWindow。标记来自数组。

尽管infoWindow只显示第一个标记，而不显示其他标记。为什么？

$ p $ 函数set_markers（array）{
var mapOptions = {
zoom：13 $ b $ （var i = 0; i< array.length; i ++）{
var single_location = array [i];
var myLatLng = new google.maps.LatLng（single_location [1]，single_location [2]）;
var marker = new google.maps.Marker（{
position：myLatLng，
map：map，
title：single_location [0]
}）;
var infowindow = new google.maps.InfoWindow（{
content：
}）;
}

google.maps.event.addListener（marker，'click'，function（）{
infowindow.setContent（'< h3>'this.title +' < / h3>'）;
infowindow.open（map，this）;
}）;
}


解决方案

  var infowindow = new google.maps.InfoWindow（）; 
 
函数set_markers（array）{
 
 var mapOptions = {
 zoom：13 
}; 
 
 for（var i = 0; i< array.length; i ++）{
 
 var single_location = array [i]; 
 var myLatLng = new google.maps.LatLng（single_location [1]，single_location [2]）; 
 var marker = new google.maps.Marker（{
 position：myLatLng，
 map：map，
 title：single_location [0] 
}）; 
 
 google.maps.event.addListener（marker，'click'，function（）{
 infowindow.setContent（'< h3>'+ this.title +'< / h3> ;'）; 
 infowindow.open（map，this）; 
}）; 
 
 
 
 
 $ b 
这是未经测试的，因为你没有发布< a href =https://stackoverflow.com/help/mcve> MCVE 。
 
Using Google Maps API to add an infoWindow to each marker. Markers come from an array.

Although, infoWindow only shows up for the first marker, not the others. Why? Thanks.
function set_markers(array) {
    var mapOptions = {
        zoom: 13
    }
    for (var i = 0; i < array.length; i++) {
        var single_location = array[i];
        var myLatLng = new google.maps.LatLng(single_location[1], single_location[2]);
        var marker = new google.maps.Marker({
            position: myLatLng,
            map: map,
            title: single_location[0]
        });
        var infowindow = new google.maps.InfoWindow({
            content: ""
        });
    }

    google.maps.event.addListener(marker, 'click', function() {
        infowindow.setContent('<h3>'+this.title+'</h3>');
        infowindow.open(map,this);
    });
}

解决方案
var infowindow = new google.maps.InfoWindow();

function set_markers(array) {

    var mapOptions = {
        zoom: 13
    };

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

        var single_location = array[i];
        var myLatLng = new google.maps.LatLng(single_location[1], single_location[2]);
        var marker = new google.maps.Marker({
            position: myLatLng,
            map: map,
            title: single_location[0]
        });

        google.maps.event.addListener(marker, 'click', function () {
            infowindow.setContent('<h3>' + this.title + '</h3>');
            infowindow.open(map, this);
        });
    }
}
This is untested since you didn't post a MCVE.

                        
这篇关于多个“InfoWindow”对于“标记”阵列来说，在Google地图上？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！