Question

我拥有它，因此在地图上单击可以在该点创建一个标记。我正在尝试向标记添加事件，当单击标记时将返回lnglat。问题是我无法单击标记，地图只是继续创建新标记。

map.on('click', function(e){
    let marker = new mapboxgl.Marker().setLngLat(e.lngLat).addTo(map);
    marker.on('click', function(){
        console.log('hello');
    });
});

Answer 1

标记是简单的HTML元素，因此您可以通过在其DOM节点上调用addEventListener直接向它们添加事件侦听器：

map.on('click', function(e){
  var el = document.createElement('div');
  el.className = 'marker';
  el.style.height = '20px';
  el.style.width = '20px';
  el.style.backgroundColor = 'black';

  el.addEventListener('click', function(e){
    // Prevent the `map.on('click')` from being triggered
    e.stopPropagation();
    console.log('hello');
  });

  let marker = new mapboxgl.Marker(el).setLngLat(e.lngLat).addTo(map);
});

https://codepen.io/eddydg/pen/gZpbRj?editors=1010

单击标记图框

1 个答案: