最后 Google 个地图标记的信息窗口无论单击哪个标记都会打开
Infowindow for last Google Maps marker opens no matter which one clicked
我正在尝试 运行 google 映射 api 在 ASP.NET MVC 项目中,我正在尝试添加带有信息的标记 windows 在每个标记上。不幸的是,当我点击一个标记时,无论我点击哪个标记,最后添加的标记上的信息 window 都会打开。
这是我的代码:
<script>
var map;
function initMap() {
map = new google.maps.Map(document.getElementById('map'), {
center: { lat: 39.5, lng: -98.35 },
zoom: 3
});
@foreach (var item in Model) {
<text>
var marker = new google.maps.Marker({
map: map,
position: { lat: @item.Lat, lng: @item.Lng },
title: '@item.Name'
});
marker.info = new google.maps.InfoWindow({
content: `<div id="content"> <h1 id="firstHeading" class="firstHeading">Test</h1> <div id="bodyContent">Test </div> </div>`
});
marker.addListener('click', function () {
marker.info.open(map, marker);
});
</text>
}
}
</script>
抱歉删除了之前的答案..
我只记得我相信当我在做我的项目时,我必须创建一个 createWindow(marker, content)
函数并从循环中调用它,而不是直接在循环中实际创建我的 window
重要的是你的事件监听器也是在这个方法中创建的,而不是在循环中
我正在尝试 运行 google 映射 api 在 ASP.NET MVC 项目中,我正在尝试添加带有信息的标记 windows 在每个标记上。不幸的是,当我点击一个标记时,无论我点击哪个标记,最后添加的标记上的信息 window 都会打开。
这是我的代码:
<script>
var map;
function initMap() {
map = new google.maps.Map(document.getElementById('map'), {
center: { lat: 39.5, lng: -98.35 },
zoom: 3
});
@foreach (var item in Model) {
<text>
var marker = new google.maps.Marker({
map: map,
position: { lat: @item.Lat, lng: @item.Lng },
title: '@item.Name'
});
marker.info = new google.maps.InfoWindow({
content: `<div id="content"> <h1 id="firstHeading" class="firstHeading">Test</h1> <div id="bodyContent">Test </div> </div>`
});
marker.addListener('click', function () {
marker.info.open(map, marker);
});
</text>
}
}
</script>
抱歉删除了之前的答案..
我只记得我相信当我在做我的项目时,我必须创建一个 createWindow(marker, content)
函数并从循环中调用它,而不是直接在循环中实际创建我的 window
重要的是你的事件监听器也是在这个方法中创建的,而不是在循环中