javascript - 如何使用asp.net mvc中的ajax从谷歌地图的数据库中加载信息窗口中的数据?
问题描述
我正在尝试使用信息窗口加载多个标记,包括来自数据库的数据。问题是它不显示来自 的任何数据db
,而是显示带有空信息窗口的标记。
控制器
public JsonResult GetAllLocation()
{
var data = db.tb_freeslot.ToList();
return Json(data, JsonRequestBehavior.AllowGet);
}
看法
<div id="map"></div>
<script>
var map;
function initMap(zoomeLevel, latDb, longDb) {
map = new google.maps.Map(document.getElementById('map'), {
center: { lat: latDb != null ? latDb : 10.523900, lng: longDb != null ? longDb : 76.212250 },
zoom: zoomeLevel != null ? zoomeLevel : 15
});
}
$.ajax({
url: '/user/GetAllLocation',
type: 'GET',
success: function (data) {
var markers = [];
$.each(data, function (index, item) {
var marker = {};
marker["title"] = item.slotinfree_name;
marker["lat"] = item.Lat_infree;
marker["lng"] = item.Long_infree;
marker["description"] = item.car_freeslot;
markers.push(marker);
})
initializeMap(markers);}});
var infoWindow = new google.maps.InfoWindow();
var map = new google.maps.Map(document.getElementById("map"), GoogleMapOptions);
for (i = 0; i < markers.length; i++) {
var data = markers[i]
var myLatlng = new google.maps.LatLng(data.lat, data.lng);
var marker = new google.maps.Marker({
position: myLatlng,
map: map,
title: data.title
});
(function (marker, data) {
google.maps.event.addListener(marker, "click", function (e) {
infoWindow.setContent(data.title);
infoWindow.open(map, marker);
});
})(marker, data);}}
</script>
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBNKM7UFRBfd6BfD3UwfRQRRpSgu2TsiU&callback=initmap"
async="" defer="defer" ></script>
解决方案
推荐阅读
- javascript - 无法创建 Vue.js 轮播
- asp.net - Windows Process Activation Service 错误2:系统找不到指定的文件
- ruby-on-rails - 我正在尝试完成在数据组中迭代的表
- python - Matplotlib:3D trisurf图中的ax.format_coord() - 返回(x,y,z)而不是(方位角,仰角)?
- html - 将注册表单数据卷曲到 MailChimp
- java - IntelliJ:构建 > 重建项目菜单项与 Maven 全新安装
- php - Symfony2 控制台,按位选项,使用可选的 --no 前缀?
- javascript - 检查 getElementsByTagName() 是否包含类属性 | 香草 JavaScript
- java - java 8 流中的一个简单 list.parallelStream() 似乎无法窃取?
- node.js - Google 代码实验室的 Ubuntu 配置错误