如何显示特定于标记的infowindow中的内容？

我根据搜索结果创建了带有标记数量的Google地图（api v3）。当我点击一个标记时，它会打开一个infowindow。让infowindow显示与其标记相关的信息的最佳方式是什么？与所有标记相关的信息位于我从ajax请求接收的json对象中。如何显示特定于标记的infowindow中的内容？

for (i=0; i < result.point.length; i++) { 
        var latLng = new google.maps.LatLng(result.proint[i].Latitude,result.point[i].Longitude);          
        var marker = new google.maps.Marker({ 
         position: latLng, 
         title: i.toString() 
         //map: map 
        }); 
        markersArray.push(marker); 

        var infowindow = new google.maps.InfoWindow({ 
         content: 'specific information associated to the marker clicked' 
        }); 

        google.maps.event.addListener(markersArray[i], 'click', function(event) { 
         infowindow.open(map, this); 
        });

来源

2012-03-08 S D

链接到居住码将是有价值的。 – andresf 2012-03-08 23:40:40

你想要多个信息窗口还是只有一个？您的代码现在的方式是为每个标记创建一个新的信息窗口，但是只会显示最后一个创建的信息窗口。如果你的意图是只有一个，那么你应该把它的创建移出for循环。 – puckhead 2012-03-08 23:52:26

我同意更多的代码会有帮助，至少是JSON对象。 – puckhead 2012-03-09 00:01:25

-1

不完全确定你在做什么。您尝试加载哪个/哪些内容？

google.maps.event.addListener(marker, 'click', (function(event, index) { 
    return function(){ 
    infowindow.content = markersArray[index].yourcontent; 
    // or 
    infowindow.content = yourcontentarray[index]; 
    infowindow.open(map,this); 
    } 
})(marker,i));

请确保您在函数外声明了标记和infowindow变量。

来源

2012-03-09 02:55:15

这段代码有几个缺陷。首先，** event **是IIFE的一个参数，它应该是返回函数的参数。这里的事件实际上等于传入的标记，而不是事件。标记甚至不需要传入。接下来，您应该使用infowindow的setContent方法，而不是直接设置content属性。虽然设置属性将起作用，但它会绕过MVCObject的KVO优势。例如，使用setContent将触发infowindow的content_changed事件，直接设置该属性不会。 – puckhead 2012-03-09 16:21:29

您的例子一些错别字（proint）在你循环的顶部：

for (i=0; i < result.point.length; i++) { 
    var info_window_content = result.point[i].Latitude + '<br />'; 
    info_window_content += result.point[i].Longitue + '<br />'; 
    // etc for any value in you json object 
    // create your marker as is. 
    ... 
    var infowindow = new google.maps.InfoWindow({ 
        content: info_window_content 
       }); 
    // etc, etc.

你确实需要一个事件监听添加到每个标记，因为你在做什么。我没有看到任何问题。除了我会使用infoWindow.open（地图，标记）与此。

有可能是一个更有效的方法来做到这一点，即infoWindow.open（）;之后; infoWindow.setContent（info_window_content）

来源

2012-03-09 00:49:07

谢谢埃里克！我首先使用了'this'，这样infowindow就会根据标记进行定位。我实施了您的解决方案，但可能会因为内容保持不变而出错。寻找加载与标记关联的内容的方法。 – 2012-03-09 01:28:23

首先，您应该将forWindow的创建从for循环移出。

下一页下，更改附加click事件到这一点：

google.maps.event.addListener(markersArray[i], 'click', function(content) { 
    return function(event){ 
     infowindow.setContent(content); 
     infowindow.open(map, this); 
    } 
}(WHATEVER_THE_CONTENT_SHOULD_BE_FOR_THIS_MARKER));

你想用，而不是这标记。这个将引用事件发生的对象，而标记将引用创建的最后一个标记。

来源

2012-03-09 02:00:27 puckhead

以下链接由其他人发布。这是我想要实现的一个完美例子。 http://updates.orbitz.com/ – 2012-03-09 02:30:10

上面应该得到你想要的。如果不是，你能提供更新的代码吗？另外，以JavaScript格式代替PHP的JSON示例会更有帮助。 – puckhead 2012-03-09 02:49:33

它最终奏效！ synthax错误... Shane，傻瓜，我非常感谢你的帮助。 – 2012-03-09 03:08:24

如上建议只创建1个infoWindow。

标记内的内容存储：

var marker = new google.maps.Marker({ 
         position: latLng, 
         title: i.toString(), 
         //set your content here 
         content:'your specific content' 
         //map: map 
        });

窗口的开放：

google.maps.event.addListener(markersArray[i], 'click', function(event) { 
         infoWindow.setContent(this.content); 
         infowindow.open(map, this); 
        });

来源

2012-03-09 08:44:23

试试这个，它的工作原理我测试了它已经

// Add markers 

    for (i=0; i < result.point.length; i++) { 
        var latLng = new google.maps.LatLng(result.proint[i].Latitude, result.point[i].Longitude);          
        var marker = new google.maps.Marker({ 
         position: latLng, 
         title: i.toString() 
         //map: map 
        });      

    // marker info start 
        var infowindow = new google.maps.InfoWindow(); 

    (function (marker, result.point[i]) { 
        // add click event 
        google.maps.event.addListener(marker, 'click', function() { 
        var infoContent: "specific information associated to the marker clicked" 
        }); 
     infoWindow.setContent(infoContent); 
         infowindow.open(map, marker); 
        }); 

    // selected marker 4 infowindow 
    (marker, result.point[i]); 

     markersArray.push(marker); 
     }

来源

2013-05-29 17:44:24

如何显示特定于标记的infowindow中的内容？

回答

相关问题