ICode9

精准搜索请尝试: 精确搜索
首页 > 系统相关> 文章详细

javascript – Google Maps API V3 infoWindow – 显示相同内容的所有infoWindows

2019-09-26 15:34:37  阅读:248  来源: 互联网

标签:infowindow javascript google-maps google-maps-api-3


在我的页面中,纬度,经度和信息窗口内容存在于名为obj的对象数组中.

因此,如果我需要第一个对象的属性的纬度,我可以调用obj [0] .latitude.

每个对象的infoWindow内容存储在obj [i] .text中.

我正在使用下面的循环来遍历lat& long值并显示标记和infoWindows.

  for (x=1; x<=obj.length; x++)
  {
      var latlng1 = new google.maps.LatLng(obj[x].latitude, obj[x].longitude);

  var marker2  = new google.maps.Marker({
    position : latlng1,
    map  : map,
    icon     : prevIcon
    });

  infowindow = new google.maps.InfoWindow();

  info = obj[x].text;

   google.maps.event.addListener(marker2, 'mouseover', function() {
       infowindow.setContent(info);
       infowindow.open(map, this);
      });

}

上面的代码有效,但所有的infoWindows都显示了最后一个obj [i] .text的内容.

如何仅将特定infoWindow(obj [x] .text)的infoWindow内容与该infoWindow实例相关联?

如果有人可以在不使用jQuery或任何其他外部库的情况下指出解决方案,那会更好.

谢谢,

解决方法:

应该让你走很长的路.

function attachMarker( data ) {

    var latLng = new google.maps.LatLng( data.latitude, data.longitude );

    var marker = new google.maps.Marker({
        position : latLng,
        map      : map, // global variable?
        icon     : prevIcon // global variable?
    });

    google.maps.event.addListener(marker, 'mouseover', function() {
       infowindow.setContent( data.text );
       infowindow.open(map, this);
    });

    // add marker here.

}

// afaik, you only need 1 instance of InfoWindow if you only change content.
var infowindow = new google.maps.InfoWindow();

var i = obj.length;
while ( i-- ) {
    attachMarker( obj[ i ] );
}

标签:infowindow,javascript,google-maps,google-maps-api-3
来源: https://codeday.me/bug/20190926/1820450.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有