2010-03-16 72 views
16

我只知道一个办法:如何删除Google地图上的标记?

单击鼠标右键,然后单击“删除我”

我还能如何删除谷歌地图的标记?

现在这是我的代码:

GEvent.addListener(marker, 'mousedown', function(e) { 
    alert(e) 
    if (e.button == 2){ 
    alert('sss') 
    map.removeOverlay(marker); 
} 

当我用鼠标右键单击,它提醒(40.23141543543321,114.3214121421);当我在看的API,我看到:

mousedown(latlng:GLatLng) 

所以我觉得e不是一个事件,而是一个“的GLatLng”

如果我使用“singlerightclick”,没有任何反应,当我的权利-Click。

这是我的全码:

<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" > 
    <head> 
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
     <meta name="viewport" content="width=device-width,minimum-scale=0.3,maximum-scale=5.0,user-scalable=yes"> 

    </head> 
<body onload="initialize()" onunload="GUnload()"> 

<style type="text/css"> 
*{ 
    margin:0; 
    padding:0; 
    } 
#head{ 
    height:70px; 
    background:#a00; 
    } 
#logo{ 
color:white; 
font-weight:bold; 
line-height:70px; 
margin-left:100px; 
    } 
#main{ 
position:relative; 
margin-top:1px; 
    } 
#left{ 
border:1px solid red; 
height:700px; 
margin-right:202px; 
    } 
#top{ 
font-weight:bold; 
line-height:70px; 
margin-left:120px; 
    } 
#map_canvas{ 
height:630px; 
    } 
#right{ 
background:#ff0; 
float:right; 
height:702px; 
position:absolute; 
right:0; 
top:0; 
width:200px; 
    } 

.container{ 
border:5px solid red; 
height:50px; 
margin-left:50px; 
padding:17px 0 0 20px; 
width:85%; 
    } 
.b{ 
    background:url(img/xr.png) right no-repeat; 
    } 
.b > div{ 
    width:30px; 
    height:31px; 
    background:url(img/xpinIcon.png) 0 0 no-repeat; 
    } 
.c{ 
    background:url(img/xr.png) right no-repeat; 
    margin-left:60px; 
    } 
.c > div{ 
    width:30px; 
    height:31px; 
    background:url(img/xlineIcon.png) 0 0 no-repeat; 
    } 
</style> 
<!--<div style="width:100px;height:100px;background:blue;"> </div>--> 
<div id=head> 
    <div id=logo>logo</div> 
</div> 
<div id=main> 
    <div id=left> 
     <div id=top>search 
     <input type="text" name="" id="" style="width:80%"/> 
     </div> 
     <div id="map_canvas" ></div> 
    </div> 
    <div id=right ></div> 
</div> 


<script src="jquery-1.4.2.js" type="text/javascript"></script> 
<script src="jquery-ui-1.8rc3.custom.min.js" type="text/javascript"></script> 
<script type="text/javascript" src="nicEdit.js"></script> 
    <script src="http://ditu.google.cn/maps?file=api&amp;v=2&amp;sensor=false&amp;key=ABQIAAAA-7cuV3vqp7w6zUNiN_F4uBRi_j0U6kJrkFvY4-OX2XYmEAa76BSNz0ifabgugotzJgrxyodPDmheRA" type="text/javascript"></script> 

<script type="text/javascript"> 
var aFn; 
//********** 
function initialize() { 
    if (GBrowserIsCompatible()) { 

     //************ 
     function a() { 
     } 
     //if(GControl) 
     a.prototype = new GControl(); 
     a.prototype.initialize = function(map) { 
      var container = document.createElement("div"); 
      var a=''; 
      for(i=0;i<2;i++){ 
       a+='<div class=b style="position:absolute;"><div></div></div>' 
       } 
      for(i=0;i<2;i++){ 
       a+='<div class=c style="position:absolute;"><div></div></div>' 
       } 
      $(container).addClass('container'); 
      $(map.getContainer()).append($(container).append(a)); 
      return container; 
     } 
     a.prototype.getDefaultPosition = function() { 
      return new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(7, 7)); 
     } 

     //************ 
       var map = new GMap2(document.getElementById("map_canvas")); 
       map.addControl(new a()); 
       map.enableScrollWheelZoom(); 
       var center=new GLatLng(39.9493, 116.3975); 
       map.setCenter(center, 13); 


     aFn=function(x,y){ 

      var point =new GPoint(x,y) 
      point = map.fromContainerPixelToLatLng(point); 
      var marker = new GMarker(point,{draggable:true}); 

      var a=$(
      '<form method="post" action="" style="height:100px;overflow:hidden;width:230px;">'+ 
       '<textarea id="area1" cols="22" rows="5" style="border:none">cilck edit</textarea>'+ 
      '</form>') 

      var once; 
      a.click(function(){ 
       if(!once)var area1=new nicEditor({buttonList : ['bold','fontSize','left','center','right','forecolor']}).panelInstance('area1') 
     once=1; 
     }) 
      GEvent.addListener(marker, "click", function(){ 
       marker.openInfoWindowHtml(a[0]); 
     }); 


      map.addOverlay(marker); 
     GEvent.addListener(marker, 'singlerightclick', function(point, source, overlay) { 
      alert('sss') 
      map.removeOverlay(marker); 
      }); 

      } 
     $(".b").draggable({ 
      revert: true, 
      revertDuration: 0 
      }); 
     $('.container').droppable({greedy: true}); 

     $("#map_canvas").droppable({ 
     drop: function(event,ui) { 
      aFn(event.pageX-$("#map_canvas").offset().left,event.pageY-$("#map_canvas").offset().top); 
      //} 
      } 
     }); 
     } 
} 
//************* 
</script> 
</body> 
</html> 

我想我想通了这一点:

GEvent.addListener(map, 'singlerightclick', function(point, source, overlay) { 
    map.removeOverlay(marker); 
     }); 

却没有,这无论删除标记其中我在地图上点击。

,我认为我有现在:

GEvent.addListener(map, 'singlerightclick', function(pixel,tile, marker) { 
    if(marker) 
    map.removeOverlay(marker); 
     }); 
+0

更新我的答案。 – 2010-03-16 10:26:02

+0

@ zjm1126请更新“答案” – Korayem 2011-11-08 16:04:53

回答

8
var marker = new GMarker(latlng); 
map.addOverlay(marker); 

GEvent.addListener(marker, 'singlerightclick', function(point, source, overlay) { 
    this.setMap(null); 
}); 
+0

嗨Björn,感谢您的代码,但尚未成功,查看更新。 – zjm1126 2010-03-16 10:21:38

+0

嗨Björn,还没有成功,更新了我的问题。 – zjm1126 2010-03-16 12:27:05

+0

从Korayem下面的答案为我工作。我在谷歌地图api v3 – 2012-02-10 01:49:13

46

根据这一link你可以简单地做

marker.setMap(null); 
+2

这是唯一的工作对我来说! – igordcard 2011-05-03 17:02:55

+0

然后请:) – Korayem 2011-08-29 04:55:17

+1

@ zjm1126请更新“回答” – Korayem 2011-11-08 16:04:44

3

它看起来并不像removeOverlay()是第3版API中。谢谢你,Korayem!

+0

你好:) – Korayem 2012-02-04 19:31:34

1

任何使用V3 API可以通过做一个Marker无形:

marker.setVisible(false);

0

添加 '右击' 事件侦听器,谷歌覆盖

google.maps.event.addListener(overlay, 'rightclick', function (event) { 
})