如何让用户在开放的街道地图上构建多边形? [英] How to let the user to build a polygon on the open street map?

问题描述

UPD:完成.看看这个美丽的多边形.

UPD: Done. Look at this beautiful polygon.

UPD:在Flutter/openstreetmap中，我想让用户通过点击地图和/或单击按钮来绘制多边形.多边形不应该被填充.我需要一个非常简单的示例，以了解其工作原理.

UPD: In Flutter / openstreetmap, I want to let users draw a polygon by tapping a map and/or clicking a button. The polygon should be not filled. I need a very simple example just to get an idea of how it works.

最后的任务是:

我正在开发一种Flutter应用程序，该应用程序应使用户能够获取有关地图上特定区域内的标记的信息.我使用osm.通过按下按钮，用户可以启动任意多边形的构造，该多边形的每个角都在下一次按下按钮的位置形成.多边形的构造完成后，将显示多边形内的对象，其余的对象将被隐藏或不建立.之后，通过清除地图结束循环.

I am making a flutter application that should give the user the ability to get information about markers located within a certain area on the map. I use osm. By pressing the button, the user initiates the construction of an arbitrary polygon, each corner of which is formed at the place of the next pressing of the button. When the construction of the polygon is completed, the objects inside the polygon are shown, the rest are hidden or not built. After that, the cycle ends by clearing the map.

我还没有找到任何针对osm的解决方案.我将不胜感激任何帮助.我还没有任何代码)

I haven't found any solution for osm. I would appreciate any help. I don't have any code yet)

推荐答案

您可以使用 flutter_map 库，我确定您可以理解该文档以及如何进行设置.

You can use the flutter_map library, I'm sure you can understand the documentation and how to set it up.

然后使用 PolygonLayerOptions(polygons:[Polygon(points:polygonList)])作为OSM层之上的一层.然后设置列表 polygonList 并使用 FlutterMap()的 onTap 回调获取用户点击的位置并添加 LatLng 到 polygonList 列表. Polygon()构造函数中还有多个其他配置选项，可以通过IntelliSense或类似方式找到这些配置选项.要没有填充，只需将颜色设置为透明即可.

Then use PolygonLayerOptions(polygons: [Polygon(points: polygonList)]) as a layer on top of the OSM layer. Then set up the list polygonList and use the FlutterMap()'s onTap callback to get the position at which the user tapped and add the LatLng to the polygonList list. There are multiple other configuration options within the Polygon() constructor, and those can be found through IntelliSense or similar. To have no fill, just set the color to transparent.

我在我的应用中使用了这种方法(或一种非常类似的方法)，该方法允许用户下载地图区域.用户点击要下载的矩形区域的左上角和右下角，通过代码计算出右上角和左下角，然后绘制一个多边形以向用户显示他们实际点击的位置.确保使用 setState()或类似名称.

I use this method (or a very similar one) for my app which lets users download areas of map. The user taps the top left and bottom right of a rectangular area they want to download, by code calculates the top right and bottom left, and a polygon is drawn to show the user exactly where they tapped. Make sure to use setState() or similar.

这篇关于如何让用户在开放的街道地图上构建多边形?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！