Google Maps infoWindow 仅加载标记上的最后一条记录 [英] Google Maps infoWindow only loading last record on markers

问题描述

我正在尝试加载带有动态标记和动态 infoWindows 的谷歌地图以配合它们.基本上我已经让标记工作了.infoWindows 是可点击和可关闭的，但是它们没有正确的内容.似乎每个 infoWindow 的内容都是在查询循环中找到的最后一条记录.你会看到发生了什么这里代码如下:

I'm trying to load a google map with dynamic markers and dynamic infoWindows to go with them. Basically I've got the markers working. The infoWindows are clickable and closable, however they do not have the correct content. It seems that the content for every infoWindow is the last record that is found in the query loop. You will see whats happening here Here's the code:

<script type="text/javascript"> 


//Load the Google Map with Options//
  function initialize() {
    var myLatlng = new google.maps.LatLng(42.48019996901214, -90.670166015625);
    var myOptions = {
      zoom: 6,
      center: myLatlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

    //Begin query loop to set the markers and infoWindow content//

    <cfoutput query="GetCoord">
    var LatLng = new google.maps.LatLng(#Client_Lat#, #Client_Lng#);

    var marker = new google.maps.Marker({
        position: LatLng,
        map: map,
        title: "#Client_Company#"
    });   

    var contentString = '<p><b>#Client_Company#</b><br>'+
                        '#Client_Address#<br>'+
                        '#Client_City#,&nbsp; #Client_State# &nbsp; #Client_Zip#<br>'+
                        '<a href="member_detail.cfm?ID=#Client_ID#">View Details</a>';

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

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

     });
    </cfoutput>
    //End query loop
    }

</script>

关于为什么会发生这种情况的任何想法?

Any ideas on why this is happening?

推荐答案

在您的代码中，您可以使用

In your code you statically set the infowindow content on load with

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

然后当你的标记被点击时，你只是打开了那个信息窗口

Then when your markers are clicked you are just opening that infowindow

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

这将为每个标记显示相同的内容，您不希望这样.<小时>你想要做的是只创建一个没有内容的信息窗口(在你的标记循环之前).然后当点击标记时，将内容附加到信息窗口...然后打开信息窗口.这将节省代码行并导致信息窗口自动关闭.

this will display the same content for every marker, you do not want this.

---

what you want to do is create only one infowindow with no content (before your marker loop). then when a marker is clicked attach the content to the info window... then open the infowindow. This will save lines of code and cause the infowindow to close automatically.

在创建标记之前(使用循环)添加这个

before creating your markers (with the loop) add this

infowindow = new google.maps.InfoWindow();

在您的标记代码中添加 infowindow.setContent 调用

in your marker code add the infowindow.setContent call

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

 });

这篇关于Google Maps infoWindow 仅加载标记上的最后一条记录的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！