如何在Google map V3中同时打开单个Info窗口？ [英] How to keep single Info window open at the same time in Google map V3?

问题描述

我知道这是一个重复的问题，

我在我的Django基于web的应用程序上使用google map v3。我在哪里使用标记，Infowindow和折线。一切正常，除了当我点击一个标记来显示内容的信息窗口，前一个打开的信息窗口没有关闭。

我发布了我的地图代码（只有脚本部分或哪些是有用的）：

  var marker = add_marker（flightPlanCoordinates [i] [0]，flightPlanCoordinates [i] [1]，Event Detail，myHtml）; 
  

这里 myHtml 是一个变量，它包含信息窗口内容。我没有在这里定义变量。所以不理睬它。

  marker.setMap（map）; 
} 
 
 var flightPath = new google.maps.Polyline（{
 path：flightPlanCoordinatesSet，
 strokeColor：＃FF0000，
 strokeOpacity：1.0 ，
 strokeWeight：2 
}）; 
 flightPath.setMap（map）; 
 
 $ b $ function add_marker（lat，lng，title，box_html）{
 var infowindow = new google.maps.InfoWindow（{$ b $ content：box_html 
}）; 
 
 var marker = new google.maps.Marker（{
 position：new google.maps.LatLng（lat，lng），
 map：map，
 title ：title 
}）; 
 
 google.maps.event.addListener（marker，'click'，function（）{
 infowindow.open（map，this）; 
}）; 
 
返回标记; 
 
  

解决方案

一个例子。

单击标记时，先关闭infoWindow，然后设置新内容并打开infoWindow。

<$
{
//创建infoWindow的全局实例
if（！window.infowindow）
{
window.infowindow = new google.maps.InfoWindow（）;


var marker = new google.maps.Marker（{
position：new google.maps.LatLng（lat，lng），
map：map，
title：title
}）;

google.maps.event.addListener（marker，'click'，function（）{
infowindow.close（）;
infowindow.setContent（box_html）;
infowindow.open（map，this）
}）;

返回标记;
}

aI know that this one is repeated question,

I am using google map v3 on my Django web based applicaiton. Where i am using Markers, Infowindow and polyline. Everything works fine, except the one when i click on a marker to show the content by Info window, the previous opened info window didn't closed.

I am posting the my map code(only the script part or which are the useful):

var marker = add_marker(flightPlanCoordinates[i][0], flightPlanCoordinates[i][1],"Event Detail",myHtml);

Here myHtml is a variable which contains the Info window content. I didn't define the variable here. SO ignore it.

    marker.setMap(map);
    }

    var flightPath = new google.maps.Polyline({
                 path: flightPlanCoordinatesSet,
                 strokeColor: "#FF0000",
                 strokeOpacity: 1.0,
                 strokeWeight: 2
                  });
    flightPath.setMap(map);
}

function add_marker(lat,lng,title,box_html) {
var infowindow = new google.maps.InfoWindow({
    content: box_html
});

var marker = new google.maps.Marker({
      position: new google.maps.LatLng(lat,lng),
      map: map,
      title: title
});

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

return marker;
}

解决方案

Instead of multiple infoWindows use only one instance.

When clicking on a marker, first close the infoWindow, then set the new content and open the infoWindow.

function add_marker(lat,lng,title,box_html) 
{
  //create the global instance of infoWindow 
  if(!window.infowindow)
  {
    window.infowindow=new google.maps.InfoWindow();
  } 

  var marker = new google.maps.Marker({
      position: new google.maps.LatLng(lat,lng),
      map: map,
      title: title
  });

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

  return marker;
}

这篇关于如何在Google map V3中同时打开单个Info窗口？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！