传单中的标记,单击事件

时间:2013-06-04 21:28:15

标签: javascript leaflet

var map = L.map('map');
var marker = L.marker([10.496093,-66.881935]).on('click', onClick);
function onClick(e) {alert(e.latlng);}
marker.addTo(map)

当我点击标记时,警告信息为:undefined

但如果我把它放在变量图中,它就可以了! (显示纬度和经度)

map.on('click', onClick); 

有人知道为什么它在标记中不起作用吗?

5 个答案:

答案 0 :(得分:56)

接受的答案是正确的。但是,我需要更清晰一些,所以如果其他人也这样做了:

Leaflet允许事件在您在地图上执行的任何操作上触发,在本例中为标记。

所以你可以创建一个标记,如上面的问题所示:

L.marker([10.496093,-66.881935]).addTo(map).on('mouseover', onClick);

然后创建onClick函数:

function onClick(e) {
    alert(this.getLatLng());
}

现在,只要您将鼠标悬停在该标记上,它就会触发当前纬度/经度的警报。

但是,您可以使用'点击',' dblclick'等来代替' mouseover'而不是警告lat / long,你可以使用onClick的主体做你想做的任何事情:

L.marker([10.496093,-66.881935]).addTo(map).on('click', function(e) {
    console.log(e.latlng);
});

以下是文档:http://leafletjs.com/reference.html#events

答案 1 :(得分:16)

我找到了解决方案:

function onClick(e) {alert(this.getLatLng());}

使用标记

的方法getLatLng()

答案 2 :(得分:16)

这是一个带函数调用的jsfiddle: https://jsfiddle.net/8282emwn/

var marker = new L.Marker([46.947, 7.4448]).on('click', markerOnClick).addTo(map);

function markerOnClick(e)
{
  alert("hi. you clicked the marker at " + e.latlng);
}

答案 3 :(得分:12)

其他相关信息: 常见的需求是将标记所代表的对象的ID传递给某个ajax调用,以便从服务器获取更多信息。

似乎我们这样做:

marker.on('click', function(e) {...

e指向MouseEvent,它不允许我们到达标记对象。但是有一个内置的this对象奇怪地要求我们使用this.options来到options对象,让我们传递任何我们需要的东西。在上面的例子中,我们可以在一个选项中传递一些ID,让我们说objid然后在上面的函数中,我们可以通过调用来获取值:this.options.objid

答案 4 :(得分:-4)

派对有点晚,在寻找标记点击事件的示例时发现了这一点。原始海报得到的未定义错误是因为onClick函数在它被定义之前被引用。交换第2行和第3行它应该可以工作。