百度地图给map添加右键菜单(判断是否为marker)_javascript技巧

废话不多说了,直接给大家贴代码了。

js:

var s;//经度
var w;//纬度
map.addEventListener("rightclick",function(e){
if(e.overlay){//判断右键单击的是否是marker
}else{
s = e.point.lng;//经度
w = e.point.lat;//维度
RightClick();//右键单击map出现右键菜单事件
}
});
//右键单击map出现右键菜单事件
function RightClick(){
//alert('你点击的是地图');
var createMarker = function(map){//右键更新站名
if (confirm("要新建站点吗?")){
if(true){
$(".AllSetMassage").show();
}
}
};
var markerMenu=new BMap.ContextMenu();
markerMenu.addItem(new BMap.MenuItem('新建站点',createMarker.bind(map)));
map.addContextMenu(markerMenu);//给标记添加右键菜单
} 

效果:

右键单击map(非marker)

右键单击marker:

PS:百度地图给多个marker添加右键菜单(删除、更新)

js:

$.getJSON("./GetStationPlaceServlet",function(json){
for(var i=;i<json.length;i++){
var obj = eval(json);
//获取经纬度
fStationlon = parseFloat(obj[i].Stationlon);
fStationlat = parseFloat(obj[i].Stationlat);
var pt = new BMap.Point(fStationlon,fStationlat);
var myIcon = new BMap.Icon("photo/station.png",new BMap.Size(,),{ anchor: new BMap.Size(, ) });
var marker = new BMap.Marker(pt,{icon:myIcon}); // 创建标注
map.addOverlay(marker); //将标注添加到地图中
var strRes = parseFloat(obj[i].StationId);
addClickHandler(strRes,marker);//左键单击marker事件
RightClickHandler(strRes,marker);//右键单击marker出现右键菜单事件
RightClick();//右键地图出现右键菜单事件
}
});
//右键单击marker出现右键菜单事件
function RightClickHandler(stationId,marker){
var removeMarker = function(e,ee,marker){//右键删除站点
var json={
"StationId":stationId,
};
if (confirm("要删除站点"+stationId+"吗?")){
if(true){
$.getJSON("./DeleteStationServlet",{json:JSON.stringify(json)},function(json){
if(json.result==true){
alert("删除站点"+stationId+"成功!");
map.removeOverlay(marker); //将地图中的标记删除
}
});
}
}
};
var updateMarker = function(marker){//右键更新站名
if (confirm("要修改站点"+stationId+"的站名吗?")){
if(true){
$(".AllUpdateMassage").show();
$("#stationId").val(stationId);
}
}
};
var markerMenu=new BMap.ContextMenu();
markerMenu.addItem(new BMap.MenuItem('删除站点',removeMarker.bind(marker)));
markerMenu.addItem(new BMap.MenuItem('修改站名',updateMarker.bind(marker)));
marker.addContextMenu(markerMenu);//给标记添加右键菜单
}
//鼠标左键单击marker事件
function addClickHandler(stationId,marker){
marker.addEventListener("click",function(e){
var p = marker.getPosition(); //获取marker的位置
var staId={
"StationId":stationId,
};
$.getJSON("./GetStationInfoServlet",{json:JSON.stringify(staId)},function(json){
for(var i=;i<json.length;i++){
var obj = eval(json);
stationName = obj[i].stationName;
var content = "站点编号:"+stationId+"<br/>"+ "站点名称:"+stationName;
openInfo(content,e);
}
});
});
}
//左键单击marker弹出窗口事件
function openInfo(content,e){
var p = e.target;
var point = new BMap.Point(p.getPosition().lng, p.getPosition().lat);
var infoWindow = new BMap.InfoWindow(content,opts); // 创建信息窗口对象
map.openInfoWindow(infoWindow,point); //开启信息窗口
}
//修改站点站名
function update(){
var stationId=$("#stationId").val();//编号
var stationName=$(".AllUpdateMassage_name").val();//名字
var json={
"StationId":stationId,
"StationName":stationName
};
$.getJSON("./UpdateStationServlet",{json:JSON.stringify(json)},function(json){
if(json.result==true){
alert("站点"+stationId+"站名修改成功!");
$(".AllUpdateMassage").hide();
}
else{
alert("失败!");
}
});
}

效果图:

地图上和数据库中都已删除此点信息:

我在实现这个时,发现有人只能在一个marker上添加右键菜单。我这个不存在这个问题。原理好像是关于闭包啥的,我也是新手不是很清楚,望懂得人不惜指教。

以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索右键菜单
百度地图map_marker
javascript右键菜单、google map 右键菜单、mapcontrol右键菜单、google map marker、fa map marker,以便于您获取更多的相关知识。

时间: 2024-09-29 18:05:51

百度地图给map添加右键菜单(判断是否为marker)_javascript技巧的相关文章

深入探讨JavaScript、JQuery屏蔽网页鼠标右键菜单及禁止选择复制_javascript技巧

我记得在刚开始接触动态HTML及JavaScript时就接触过关于鼠标右键屏蔽的脚本代码,当时这些代码很多会用在防止浏览者未经允许的复制网页上的文字或者其他内容,后来的实际应用证明这种做法是不符合用户体验的,而且破解的方法也有很多,比如我曾经写过一篇文章讲解如何解除网页禁止复制的办法. 由此可见,限制右键及复制是不明智的做法,但是今天我仍然要谈谈关于禁止网页复制.右键菜单的事儿,因为随着网页APP技术的发展,网页应用和桌面应用之间的界限越来越模糊,有一些桌面程序实际上是由网页配合JavaScri

通过百度地图获取公交线路的站点坐标的js代码_javascript技巧

最近做百度地图的模拟数据,需要获取某条公交线路沿途站点的坐标信息,貌似百度没有现成的API,因此做了一个模拟页面,工具而已,IE6/7/8不支持 复制代码 代码如下: <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>获取公交站点坐标</title> <style type="text/css"> html,b

一个轻量级的XHTML右键菜单[支持IE和firefox]_javascript技巧

adadad大王大王 adadad大王大王 adadad大王大王 adadad大王大王 adadad大王大王 adadad大王大王 adadad大王大王 adadad大王大王 adadad大王大王 adadad大王大王 adadad大王大王 adadad大王大王 adadad大王大王 adadad大王大王 adadad大王大王 adadad大王大王 adadad大王大王 adadad大王大王 adadad大王大王 adadad大王大王 adadad大王大王 adadad大王大王 awdddddd

怎么在win7系统中添加右键菜单

  我们平时都会使用鼠标右键深度系统的桌面空白处,然后在右键菜单中快速打开某一些程序,这是非常快捷的一个启动程序方法,能够让我们的电脑操作更加便捷,工作效率也有一定的提高.所以今天小编就来和大家介绍下怎么在win7系统中添加右键菜单. 步骤一:使用鼠标的右键在win7系统桌面的空白位置点击,打开右键菜单后选择"新建"然后选择子菜单中的"文本文档". 步骤二:然后按照下面图中所显示的代码输入到win7系统文本文件中. 步骤三:输入完这段代码之后,把这个新建文本文档另存

popupwindow-如何为百度地图的覆盖物添加详细信息

问题描述 如何为百度地图的覆盖物添加详细信息 通过定位,然后获取了周边的加油站,并为这些加油站添加了覆盖物,当我点击其中一个覆盖物的时候,想在旁边跳出一个popupwindow来显示该加油战的详细信息,我改如何做? 解决方案 百度地图API如何给自定义覆盖物添加事件百度地图覆盖物在android百度地图上添加自定义覆盖物

c++-关于注册表添加右键菜单的测试。涉及Windows shell编程

问题描述 关于注册表添加右键菜单的测试.涉及Windows shell编程 关于注册表添加右键菜单的测试. 我在win7 64位 日语系统里面发现很奇怪的结论. 不知道是不是我弄错了. 1: [HKEY_CLASSES_ROOTDirectoryBackgroundshelltest] 1)右键桌面空白区域 有效果 2)右键文件夹 无效果 2 [HKEY_CLASSES_ROOTDirectoryBackgroundshellexTest] 1)右键桌面空白区域 无效果 2)右键文件夹 无效果

候 怎么为你的网页添加右键菜单啊

问题描述 asp.net中做web开发的时候怎么为你的网页添加右键菜单啊都说用contextmenu可是为什么我得工具箱里面没有那个控件呢 解决方案 解决方案二:http://labs.abeautifulsite.net/archived/jquery-contextMenu/demo/http://www.abeautifulsite.net/blog/2008/09/jquery-context-menu-plugin/解决方案三:<!DOCTYPEHTMLPUBLIC"-//W3C

flash cs3添加右键菜单

flash cs3添加右键菜单 flash cs3的右键菜单 ContextMenu 对象附加到特定的按钮.影片剪辑或文本字段对象,也可以附加到整个影片级别. 所以这里设置一个背景影片剪辑st,然后添加如下代码:var menuItem:ContextMenuItem = new ContextMenuItem("浪子设计"); menuItem.addEventListener(ContextMenuEvent.MENU_ITEM_SELECT,gotoAuthorPage); va

listview-Qt5怎么在ListView中添加右键菜单?

问题描述 Qt5怎么在ListView中添加右键菜单? 之前看过有说QListViewItem类的,但是5中没有这个类,请问怎么实现右键菜单,多谢 解决方案 http://blog.163.com/zhao_yunsong/blog/static/3405930920118163368768/ 解决方案二: qt 添加右键菜单Qt添加右键菜单Qt添加右键菜单