我想知道如何扭转这个
$(function(){
$('#test1').gmap3({
map:{
options:{
center:[46.578498,2.457275],
zoom: 5
}
},
marker:{
values:[
{latLng:[48.8620722, 2.352047], data:"Paris !"},
{address:"86000 Poitiers, France", data:"Poitiers : great city !"},
{address:"66000 Perpignan, France", data:"Perpignan ! <br> GO USAP !", options:{icon: "http://maps.google.com/mapfiles/marker_green.png"}}
],
options:{
draggable: false
},
events:{
mouseover: function(marker, event, context){
var map = $(this).gmap3("get"),
infowindow = $(this).gmap3({get:{name:"infowindow"}});
if (infowindow){
infowindow.open(map, marker);
infowindow.setContent(context.data);
} else {
$(this).gmap3({
infowindow:{
anchor:marker,
options:{content: context.data}
}
});
}
},
mouseout: function(){
var infowindow = $(this).gmap3({get:{name:"infowindow"}});
if (infowindow){
infowindow.close();
}
}
}
}
});
});
通过 ajax 加载标记的地方?我还需要保留这些事件,因为我需要提取的数据(不仅仅是“大城市”)太大并且需要满足需求
我猜在服务器端我需要类似的东西
public class Marker
{
public string Title { get; set; }
public double Lat { get; set; }
public double Lng { get; set; }
}
最佳答案
一个简单但(我认为)完全可用的解决方案是将 map 初始化逻辑抽象为一个函数,我们称之为 initMap
,它采用一个 array
标记作为参数:
function initMap(markers) {
$('#test1').gmap3({
map:{
options:{
center:[46.578498,2.457275],
zoom: 5
}
},
marker:{
values: markers || [], // Pass it an empty array if no markers are specified
options:{
draggable: false
}
..............
}
您现在可以在文档就绪时(使用默认标记数据或不使用默认标记数据)以及在 AJAX 调用的成功处理程序中初始化 map :
$('button').on('click', function() {
$.ajax({
url: 'marker.json'
}).done(function(data) {
// Re-initialise the map with loaded marker data
initMap(data);
});
});
您希望服务器输出 JSON。类似于以下静态示例(您可以愉快地使用它来测试,直到设置后端):
[
{
"latLng":[48.8620722, 2.352047],
"data":"Paris !" },
{
"address":"86000 Poitiers, France",
"data":"Poitiers : great city !"
},
{
"address":"66000 Perpignan, France",
"data":"Perpignan ! <br> GO USAP !",
"options": {
"icon": "http://maps.google.com/mapfiles/marker_green.png"
}
}
]
您可以考虑更原子地更新标记,因为我确信该插件将允许您在初始化后添加/删除标记,但是我概述的解决方案可能足以满足您的目的。
关于jquery - Gmap 3-如何使用Ajax Json请求标记+有点击事件?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19867716/