Mapbox 显示 Lat 和 Lng 并缩放，然后将它们放在文本框中

【问题标题】：Mapbox Display Lat and Lng and Zoom then putting them inside a textboxMapbox 显示 Lat 和 Lng 并缩放，然后将它们放在文本框中
【发布时间】：2020-11-18 18:10:38
【问题描述】：

enter image description here

我想知道如何在 mapbox 样式生成器上的图片示例中实际获取 lat 和 lng 以及缩放值，而不是通过鼠标单击或鼠标移动，而只是在 div 中获取整个地图。

所以详细解释一下，我想知道是否有一种方法可以获取地图坐标并根据 mapbox 在工作室编辑器中的功能进行显示。他们计算整个地图的 lat 和 lng 以及缩放级别，当用户在地图上滚动时，lat 和 lng 会发生变化，并会显示带有缩放级别的新坐标。我需要获取这些值并将它们放在一个文本框中。

【问题讨论】：

标签： javascript coordinates mapbox

【解决方案1】：

您对此有几个示例。

how to get the coords of a point
how to create a draggable marker
how to get the coords of cursor

如果您也需要缩放，只需将map.getZoom() 添加到正在绘制lngLat.lng 和lngLat.lat 的方法中

【讨论】：

是的，我已经采用了这些示例并尝试制作类似的东西，但我无法像 Map box studios 在示例中那样根据整个地图位置获取坐标。
但是这些示例准确地显示了您的要求，到目前为止您编码了什么？
map.on('mousemove', function() { document.getElementById('info').innerHTML = // e.point 是相对于 // 的 mousemove 事件的 x、y 坐标地图左上角 // e.lngLat 为事件的经纬度地理位置 map.getCenter().lngLat; map.getZoom(); });我试图让 lat 和 lng 显示在地图本身的中心，而不是点击或鼠标移动。
为此您只需要使用var center = map.getCenter();