Javascript ASP.NET MVC视图中从数据库到google地图的多个地图标记问题
我在从数据库加载视图中的多个地图标记时遇到问题,问题是它只显示数据库中的最后一个地图标记,我不确定问题是什么 视图模型代码:Javascript ASP.NET MVC视图中从数据库到google地图的多个地图标记问题,javascript,jquery,asp.net-mvc,google-maps,Javascript,Jquery,Asp.net Mvc,Google Maps,我在从数据库加载视图中的多个地图标记时遇到问题,问题是它只显示数据库中的最后一个地图标记,我不确定问题是什么 视图模型代码: public int NpoID { get; set; } public string NpoName { get; set; } public string VerificationStatus { get; set; } public double Longitude { get; set; } public double Latitude { get; set;
public int NpoID { get; set; }
public string NpoName { get; set; }
public string VerificationStatus { get; set; }
public double Longitude { get; set; }
public double Latitude { get; set; }
控制器代码:
public static List<DonatorUserViewModel> MapMarkerList = new List<DonatorUserViewModel>();
public JsonResult GetMarkers()
{
//Map marker section
var DynamicMapMarkers = db.tblNpo.Include(zz => zz.tblVerification);
DonatorUserViewModel MapMarkers = new DonatorUserViewModel();
//Set map marker values
foreach (var item in DynamicMapMarkers)
{
MapMarkers.NpoID = item.npo_id;
MapMarkers.NpoName = item.npo_name;
MapMarkers.VerificationStatus = item.tblVerification.description;
MapMarkers.Longitude = Convert.ToDouble(item.longitude);
MapMarkers.Latitude = Convert.ToDouble(item.latitude);
MapMarkerList.Add(MapMarkers);
}
var json = MapMarkerList;
return Json(json, JsonRequestBehavior.AllowGet);
}
publicstaticlist映射标记列表=newlist();
公共JsonResult GetMarkers()
{
//地图标记部分
var DynamicMapMarkers=db.tblNpo.Include(zz=>zz.tblVerification);
DonatorUserViewModel MapMarkers=新的DonatorUserViewModel();
//设置地图标记值
foreach(DynamicMarkers中的var项)
{
mapmarks.NpoID=item.npo\u id;
MapMarkers.NpoName=item.npo_name;
MapMarkers.VerificationStatus=item.tblVerification.description;
mapmarks.Longitude=Convert.ToDouble(item.Longitude);
mapmarks.Latitude=Convert.ToDouble(item.Latitude);
添加(地图标记);
}
var json=MapMarkerList;
返回Json(Json,JsonRequestBehavior.AllowGet);
}
查看代码(谷歌地图api的Javascript):
函数myMap(){
var mapProp={
中心:新google.maps.LatLng(-25.754549,28.231448),
缩放:11,
disableDefaultUI:true,
fullscreenControl:true
};
var map=new google.maps.map(document.getElementById(“googleMap”),mapProp);
$.get(“@Url.Action(“GetMarkers”,“Donator”)”,函数(json,状态){
//所有标记都将重用的全局信息窗口对象
var infoWindow=new google.maps.infoWindow();
var标记,数据;
//循环浏览json数据
for(var i=0;i
因此,为了更清楚,比如说,我的数据库中有3行不同的数据,每行都有自己的经度和纬度,我想要的结果是,在我的谷歌地图上,这三行都意味着3个不同的地图标记,但是现在发生的是,只有最后一行在地图上得到了一个标记,而不是所有的3个。任何帮助都可以非常感谢。其中一个原因似乎是,最后一个值覆盖了其他值。是的,如果我在控制台中显示它,出于某种原因,所有3个对象都具有相同的值,而这似乎是我控制器中的一个问题。我正在试着看看问题可能是什么。是的,正确,您必须在for循环中写入这一行。DonatorUserViewModelMapMarkers=new DonatorUserViewModel();是的,我也注意到了这一点,非常感谢您解决了这个问题。
function myMap() {
var mapProp = {
center: new google.maps.LatLng(-25.754549, 28.231448),
zoom: 11,
disableDefaultUI: true,
fullscreenControl: true
};
var map = new google.maps.Map(document.getElementById("googleMap"), mapProp);
$.get("@Url.Action("GetMarkers","Donator")", function (json, status) {
//Global infoWindow object that will be reused by all markers
var infoWindow = new google.maps.InfoWindow();
var marker, data;
//Loop through the json data
for (var i = 0; i < json.length; i++) {
data = json[i];
LatLng = new google.maps.LatLng(data.Latitude, data.Longitude)
//Creating marker and putting it on the map
marker = new google.maps.Marker({
position: LatLng,
map: map,
title: data.NpoName
});
// Creating a closure to retain the correct data, notice how I pass the current data in the loop into the closure (marker, data)
(function (marker, data) {
// Attaching a click event to the current marker
google.maps.event.addListener(marker, "click", function (e) {
infoWindow.setContent(data.NpoName);
infoWindow.open(map, marker);
});
})(marker, data);
};
};