mapbox - How can I show the popup on bottom middle of the page when clicking MapboxGL marker?

Question

I want to show a popup on the bottom middle of the page when clicking a marker.

I have used the following code

 new mapboxgl.Popup({ anchor: 'top' })

This shows popup on the bottom of the marker. But I want to show the popup at the bottom middle of the page

Answer 1

弹出窗口更多地用于在某个纬度/经度处附加到地图，如果您想根据单击触发某些内容以显示/隐藏，我将创建一个单独的 div，然后适当地显示/隐藏它并根据需要设置它的文本。

map.on('click', 'mylayer', function (e) { 
  // show or hide your div
  // feature that was clicked would be e.features[0]
} );

对于“显示或隐藏您的 div”部分，您可以参考： 单击按钮时如何隐藏/显示 div？