Google maps api 3 使谷歌地图标记在单击时显示特定的div

我对javascript还很陌生，我一直在学习，如果这很简单，我很抱歉

我在地图上显示了一堆标记，它们是从数组中加载的，并用函数显示。我想做的是弹出一个特定的div，它与单击的标记相关。单击另一个标记时，上一个div关闭，新div打开

，了解我在做什么

我想我会写一个函数，上面写着。。。“如果单击了‘标记A’，则打开‘分区A’，如果在‘标记A’打开时单击了‘标记B’，则关闭‘分区A’并打开‘分区B’

这是我的javascript

 var markers = [
['Saving Grace', 43.652659,-79.412284],
['Starving Artist', 43.660281,-79.443570]
];

  // Standard google maps function
    function initialize() {
    var myLatlng = new google.maps.LatLng(43.655826,-79.383116);
    var image = 'http://www.brunchtoronto.com/images/marker-blue.png';
    var myOptions = {
        zoom: 13,
        center: myLatlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    }

    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);


    // Current Toggle function which displays Feature Box when marker is clicked
    function opendiv() {
        var ele = document.getElementById("div-feature");
                    ele.style.display = "block";                            
            } 


    var infowindow = new google.maps.InfoWindow();
    var marker, i;


    for (i = 0; i < markers.length; i++) {  
    marker = new google.maps.Marker({
    position: new google.maps.LatLng(markers[i][1], markers[i][2]),
    map: map,
    icon: image
    });


    google.maps.event.addListener(marker, 'click', (function(marker, i) {
        return function() {
            map.panTo(marker.getPosition());
            infowindow.setContent(markers[i][0]);
            infowindow.open(map, marker);
            opendiv();
            }   
        })(marker, i));
    }



}

var标记=[
[《拯救恩典》，43.652659，-79.412284]，
[《饥饿的艺术家》，43.660281，-79.443570]
];
//标准谷歌地图功能
函数初始化（）{
var mylatng=new google.maps.LatLng（43.655826，-79.383116）；
var图像处理http://www.brunchtoronto.com/images/marker-blue.png';
变量myOptions={
缩放：13，
中心：myLatlng，
mapTypeId:google.maps.mapTypeId.ROADMAP
}
map=new google.maps.map（document.getElementById（“map_canvas”），myOptions）；
//当前切换功能，单击标记时显示功能框
函数opendiv（）{
var ele=document.getElementById（“div特性”）；
ele.style.display=“块”；
} 
var infowindow=new google.maps.infowindow（）；
var标记，i；
对于（i=0；i

还有我的HTML

<!-- Featued Window -->

    <div class="featured_window" id="div-feature" style="display: none">

                Stuff to display

    </div>

<!-- Saving Grace -->

    <div class="featured_window" id="div-sg" style="display: none">

        Stuff to display

    </div>

要展示的东西
要展示的东西

您需要在标记和div之间建立关系，目前没有任何关系

代替像

div sg

这样的ID，这可以是例如

div0

，其中数字表示标记的索引

那么访问div就没有问题了：

   //access the node
 var content=document.getElementById('div'+i)
   //create a copy of the node
 .cloneNode(true);
   //remove the id to avoid conflicts
 content.removeAttribute('id');
   //make it visible  
 content.style.display='block';
   //apply the content  and open the infoWindow 
 infowindow.setContent(content);
 infowindow.open(map, marker);

---

您在哪里有关于标记的信息？地图标记和要显示的信息之间的链接是什么？您可能希望将标记Id传递给openDiv函数，并从中显示相应的信息，具体取决于单击的标记。使用相同的div-只需更新其内容。谢谢，这是mak我现在可以让它们打开和关闭正确的div。我遇到的问题是创建一条语句，告诉我打开的div在单击另一个标记时关闭，而不是打开新的相应标记。对此有什么见解吗？我不知道您当前的代码，但当您使用我在中发布的代码时，不需要r还有一句话。只有一个infoWindow，当它打开时，单击另一个标记，它将再次打开，并更新内容和位置。是的，但我希望外部DIV的行为与infoWindow一样，当您单击另一个标记时，当前DIV将隐藏，新DIV将显示。您的代码运行得非常好，the它唯一做不到的就是隐藏单击新标记时打开的当前DIV。我在哪里包括content.style.display='none'；？Craig Morrison：如果您需要只更新地图之外的DIV，只需使用infowindow内容更新DIV即可。