单击按钮后删除标记-而是删除弹出窗口

时间:2020-05-02 14:58:16

标签: javascript reactjs mapbox-gl-js

我想在单击后删除标记,我在弹出窗口中创建了一个按钮,但是单击此按钮后,弹出窗口本身将被删除,标记仍然保留,有人可以帮助我解决此问题吗?

state = {
       newItems: [{Description: "opis...",  Name: "Pierwszy", X: 255,Y:100}],
}
  componentDidMount() {
 const map = new mapboxgl.Map({
      container: this.mapContainer,
      style: 'mapbox://styles/mapbox/streets-v11',
      center: [50, 100],
      zoom: 10,
    })

   for (const obj of newItems) {
      let myLatlng = new mapboxgl.LngLat(obj.X, obj.Y);
      new mapboxgl.Marker()
        .setLngLat(myLatlng)
        .setPopup(new mapboxgl.Popup({ offset: 25 })
          .setHTML('<h3>' + obj.Name + '</h3><p>' + obj.Description + '</p><button onclick=(function(){event.target.parentNode.remove})();>Remove Marker</button>'
          ))
        .addTo(map);
    }
    }
render() {

    return (
        <div ref={el => this.mapContainer = el}</div>
)}

0 个答案:

没有答案