mapbox - 在 Mapbox GL JS draw 中显示多边形的长度

我是 javascript 等编码的新手。我的背景是 Python 的一些知识。

我正在关注这个示例https://docs.mapbox.com/mapbox-gl-js/example/mapbox-gl-draw/如何在 Mapbox 中绘制多边形，然后显示多边形的区域。

我还想做的是显示多边形每个绘制边的长度，并能够向用户显示它，而不仅仅是区域。

如果可以在地图中多边形的每一侧旁边显示长度标签，那就太好了。有关如何执行此操作的任何提示？我将不胜感激，谢谢！

标签： mapboxmapbox-gl-jsturfjs

我建议你使用库turf，它对这种地理操作有非常有用的帮助方法，巧合的是（或不是），你提到的例子也使用它来计算面积。

因此，您需要做的是提取形成多边形后的 4 个或更多点data（将具有 geojson 多边形的形式）。然后，将这些点作为输入并使用辅助长度，您可以检索多边形每一边的长度。

如果您想在多边形的每条相应线的中点上方显示这些长度，您可以使用辅助中点来获取可以使用该信息创建标记的坐标。要创建标记，您可以检查此示例（尽管在您的情况下，您可能希望将标志设置draggeable为 false）。

希望这可以帮助：）