Google地图 - 多个InfoWindows [英] Google Maps- Multiple InfoWindows

问题描述

我有一个javascript代码如下

  var markers = response.d.split（'^^'）; 
 var latlng = new google.maps.LatLng（51.474634，-0.195791）; 
 var mapOptions1 = {
 zoom：14，
 center：latlng 
} 
 
 
 var map = new google.maps.Map（ document.getElementById（map-canvas），mapOptions1）; 
 for（i = 0; i  var data = markers [i]; 
 var lat = data.split（'__'）[0]; 
 var lng = data.split（'__'）[1]; 
 var addr = data.split（'__'）[2]; 
 var distance = data.split（'__'）[3]; 
 var newltlng = new google.maps.LatLng（lat，lng）; 
 map.setCenter（newltlng）; 
 var marker = new google.maps.Marker（{
 map：map，
 position：newltlng，
 title：addr 
}）; 
 var infowindow = new google.maps.InfoWindow（{content：distance}）; 
 google.maps.event.addListener（marker，'click'，（function（marker，i））{
 return function（）{
 infowindow.open（map，this）; 
} 
}）
（marker，i））; 
 
 
 $ / code> 

在调试代码并看到值之后，我的标记数组包含字符串项目如



  somelatitude1__somelongitude1__address1_distance1 
 somelatitude2__slonglongitude2__address2_distance2 
 somelatitude3__slonglongitude3__address3_distance3 
 somelatitude4__slonglongitude4__address4_distance4 
  

现在当标记包含4以上的值时，我为其绘制标记。但在 InfoWindow 中，由于其异步性质，我得到每个标记的最后一个元素距离数组。我不知道如何处理这个问题，并在相应的标记中显示正确的值。感谢。

解决方案将 infowindow 作为参数传递给返回的函数click-callback：

  google.maps.event.addListener（marker，'click'，（function（infowindow））{
返回函数（）{
 infowindow.open（map，this）; 
} 
}）（infowindow））; 
  

I have a javascript code as below

var markers = response.d.split('^^');
            var latlng = new google.maps.LatLng(51.474634, -0.195791);
            var mapOptions1 = {
                zoom: 14,
                center: latlng
            }


            var map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions1);
            for (i = 0; i < markers.length; i++) {
                var data = markers[i];
                var lat = data.split('__')[0];
                var lng = data.split('__')[1];
                var addr = data.split('__')[2];
                var distance = data.split('__')[3];
                var newltlng = new google.maps.LatLng(lat, lng);
                map.setCenter(newltlng);
                var marker = new google.maps.Marker({
                    map: map,
                    position: newltlng,
                    title: addr
                });
                var infowindow = new google.maps.InfoWindow({ content: distance });
                google.maps.event.addListener(marker, 'click', (function (marker, i) {
                    return function () {
                        infowindow.open(map, this);
                    }
                })
            (marker, i));

            }

After debugging code and seeing value, my markers array contains string item like

somelatitude1__somelongitude1__address1_distance1
somelatitude2__somelongitude2__address2_distance2
somelatitude3__somelongitude3__address3_distance3
somelatitude4__somelongitude4__address4_distance4

now when markers contain above 4 value I plotted markers for that. but in InfoWindow I am getting last element distance array for every marker because of its Asynchronous nature. I have no idea how to handle this and show proper values in corresponding markers. Thanks.

解决方案

pass the infowindow as argument to the function that returns the click-callback:

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

这篇关于Google地图 - 多个InfoWindows的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！