MapBox GL JS：从通过代码设置的字符串地址获取经纬度坐标

Posted 2023-04-14

【中文标题】MapBox GL JS：从通过代码设置的字符串地址获取经纬度坐标

【英文标题】：MapBox GL JS: Get lat and long coordinates from string Address that is set through code

【发布时间】：2021-05-13 11:25:57

【问题描述】：

我正在使用 Mapbox GL JS 来显示地图上标记的特定位置。 我需要通过 JavaScript 代码设置位置，我不知道经纬度坐标，我只有一个字符串形式的地址（例如：“地址、城市、国家”或一些类似的格式）。

我在互联网上搜索了很多，但我发现在 Mapbox GL JS 中执行此操作的唯一方法是使用 Geocoder 输入控件，但我不想通过它输入位置，我希望通过代码设置地址，然后在地图加载时将其标记在地图上。

是否可以在 Mapbox GL 中执行此操作不知道经纬度坐标？我该怎么做？

提前致谢！最好的问候！

【参考方案1】：

您可以在没有地理编码器控件的情况下使用Mapbox Geocoding API。您必须编写您的网址（并对其进行编码）。 始终考虑您可能会在 featureCollection 响应中获得多个结果，具体取决于您的参数，因此最后您必须使用一些允许的属性来优化结果，例如 proximity 和 limit。一开始是个试错题，但经过一段时间的练习，还是很准确的。

这里有一个地址 123 Main St Boston MA 02111 的示例 url，仅在美国过滤结果。

https://api.mapbox.com/geocoding/v5/mapbox.places/123%20Main%20St%20Boston%20MA.json?country=US&access_token=pk.eyJ1IjoianNjYXN0cm8iLCJhIjoiY2s2YzB6Z25kMDVhejNrbXNpcmtjNGtpbiJ9.28ynPf1Y5Q8EyB_moOHylw

这将返回马萨诸塞州的 5 条街道。

我建议您阅读forward geocoding 中的文档，以及address geocoding format 上的部分以正确撰写网址。

【讨论】：

非常感谢您的回答！我之前尝试过这样做，但我不确定我应该在代码中的哪个属性设置这个 URL...你知道我应该在代码中的哪个位置设置它吗？

非常感谢！我刚刚使用 Axios（我当然使用了我的 API 密钥）向类似的 URL 发出了一个 GET 请求，它完成了工作。最好的问候！

您也可以使用简单的 javascript fetch API 对 URL 进行异步请求