Question

当涉及到Javascript时，我是一个非常棒的人，但我正在为我的网站/学校项目尝试一些东西。

在地图上我想显示2个位置，每个位置都有一个标记和一个自己的信息窗口。 1显示我的位置+联系方式，第二个标记应显示公司的其他详细信息。

我已经设法在地图中显示2个标记以显示在我想要的位置，但下一个问题是为每个标记提供它自己的InfoWindow。

var Rafael = new google.maps.LatLng（52.341949,6.682236）; var Aandagt = new google.maps.LatLng（52.341949,6.782236）;

var myOptions = {
    zoom: 10,
    center: new google.maps.LatLng(52.341949,6.682236),
    streetViewControl: false,
    zoomControl: false,
    panControl: false,
    scaleControl: false,
    overviewMapControl: false,
    mapTypeControl: false,
    mapTypeId: google.maps.MapTypeId.TERRAIN
};

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

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

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

var infowindow = new google.maps.InfoWindow({
    content: '<h9><a href="http://www.aandagt.nl">AANDAGT Reclame & Marketing</a></h9><h10><br /><br />Einsteinstraat 8b<br />7601 PR Almelo<br /><br />Telefoon (0546) 85 03 69<br />Fax (0546) 45 53 31<br /><br /><a href="mailto:info@aandagt.nl">info@aandagt.nl</a></h10>'
})


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

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

任何帮助或建议如何添加和附加2个InfoWindows，1个用于标记'Rafael'，1个用于标记'Aandagt'将非常感谢。

查看我当前的地图：http://www.imrafaelhi.nl/stageverslag/?page_id=266

Answer 1

您已为名为Rafael的标记创建了2个具有不同位置值的标记和一个鼠标悬停侦听器。

我建议你将标记声明为：marker1和marker2。

然后为每个标记关联的每个信息窗创建2个内容字符串变量：content1，content2

为每个标记添加一个监听器（鼠标悬停）以显示内容字符串。添加一个监听器（mouseout）来关闭与标记关联的信息窗。

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

// assuming you also want to hide the infowindow when user mouses-out
google.maps.event.addListener(marker, 'mouseout', function() {
infowindow.close();
});

Answer 2

您可以为每个标记提供ID。并且可以使用其ID来访问这些标记：

var marker = new google.maps.Marker({
  position:mycenter,
  title:infoName,
  id: count++
  // animation:google.maps.Animation.BOUNCE
  });

 if(marker.id == count) //get access to marker id value..
 {
     //do what you want..
 }

Javascript中的多个标记InfoWindows

2 个答案: