可能重复:
Google Maps JS API v3 - Simple Multiple Marker Example
在我的项目中,您可以在地图上创建标记,然后打开信息窗以放置一些信息然后保存在数据库上,但是当您创建标记,然后另一个标记时,如果您单击第一个标记它打开了第二个标记的信息窗口。
有什么不对?这是我的代码: (这是一个简化的代码,完整代码access here)
var marker;
var infoWindow;
function goma()
{
google.maps.event.addDomListener(teste, 'click', function()
{
doMark = true;
doMark2 = false;
});
markNow()
function markNow(){
//Marker1
google.maps.event.addListener(map, "click", function(event)
{
if (doMark == true && doMark2 == false){
marker = new google.maps.Marker({
position: event.latLng,
map: map, icon: 'Imagens/Oficina.png',
shadow: 'Imagens/Oficinasombra.png',
draggable : true,
animation: google.maps.Animation.DROP});
google.maps.event.addListener(marker,'click',showWindow);
doMark = false;
}
//Marker2
else if (doMark2 == true && doMark == false){
marker = new google.maps.Marker({
position: event.latLng,
map: map, icon: 'Imagens/Lojas.png',
shadow: 'Imagens/Oficinasombra.png',
draggable : true,
animation: google.maps.Animation.DROP});
google.maps.event.addListener(marker,'click',showWindow);
doMark2 = false;
}
}
);
var html = "<table>" +
"<tr><td>Nome:</td> <td><input type='text' id='name'/> </td> </tr>" +
"<tr><td>Endereco:</td> <td><input type='text' id='address'/></td> </tr>" +
"<tr><td>Tipo:</td> <td><select id='type'>" +
"<option value='oficina' SELECTED>oficina</option>" +
"<option value='restaurante'>restaurante</option>" +
"</select> </td></tr>" +
"<tr><td></td><td><input type='button' value='Salvar' onclick='saveData()'/> </td></tr>";
}
function showWindow(event)
{
infoWindow.setContent(html);
infoWindow.open(map,marker);
}
答案 0 :(得分:3)
调用infowindow.open(map, marker)
会调用您看到的最后一个标记。您需要识别点击的标记以将信息附加到此。
将infowindow.open(map, marker);
更改为infowindow.open(map, this);
由于您指示的页面无效,我不得不使用旧版本来运行演示。 这是我的markNow()
代码function markNow(){
google.maps.event.addListener(map, "click", function(event)
{
if (doMark == true){
alert("Marker 1 Chosen");
marker = new google.maps.Marker({
position: event.latLng,
map: map,
icon: 'Imagens/Oficina.png',
});
}
if (doMark2 == true){
alert("Marker 2 Chosen");
marker = new google.maps.Marker({
position: event.latLng,
map: map,
icon: 'Imagens/Lojas.png',
});
}
//if (doMark ==1)
google.maps.event.addListener(marker, "click", function()
{
infowindow.open(map, this);
}
);
}
);
var html = "<table>" +
"<tr><td>Nome:</td> <td><input type='text' id='name'/> </td> </tr>" +
"<tr><td>Ensdereco:</td> <td><input type='text' id='address'/></td> </tr>" +
"<tr><td>Tipo:</td> <td><select id='type'>" +
"<option value='oficina' SELECTED>oficina</option>" +
"<option value='restaurante'>restaurante</option>" +
"</select> </td></tr>" +
"<tr><td></td><td><input type='button' value='Salvar' onclick='saveData()'/> </td></tr>";
infowindow = new google.maps.InfoWindow({content: html});
}
答案 1 :(得分:2)
实际上,应该在函数markNow() -
中的每个标记上附加一个单独的侦听器 marker = new google.maps.Marker({
position: event.latLng,
map: map, icon: 'Imagens/Oficina.png',
shadow: 'Imagens/Oficinasombra.png',
draggable : true,
animation: google.maps.Animation.DROP});
google.maps.event.addListener(marker,'click',showWindow);
然后 -
function showWindow(event)
{
infoWindow.setContent(html);
infoWindow.open(map,marker);
}
答案 2 :(得分:0)
这是一个闭包问题,因为你的循环变量总是引用最后一个值。