在 Flutter 中，如何通过点击屏幕或单击按钮在 openstreetmap 上添加标记？答案

【问题标题】：In Flutter, how to add a marker on openstreetmap by tapping a screen or clicking a button?在 Flutter 中，如何通过点击屏幕或单击按钮在 openstreetmap 上添加标记？
【发布时间】：2021-03-01 12:02:39
【问题描述】：

应该很简单，但我似乎找不到怎么做。

在 Flutter / openstreetmap 中，我需要： (1) 通过点击地图和/或单击按钮在地图上放置标记； (2) 将其中两个标记用一条线连接起来。

任何想法都将不胜感激。

【问题讨论】：

您想要获取两点之间的道路方向，还是想要两点之间的直线？
我想要一条直线。最后，我想让用户构建一个任意多边形并在其中找到标记。

标签： flutter openstreetmap marker

【解决方案1】：

1) 用于添加标记：

List<Marker> markers = [];

内部构建方法：

          FlutterMap(
            mapController: _mapController,
            options: MapOptions(
                center: LatLng(41.238250, 69.342939),
                zoom: 9.6,
                onTap: (latlng) {
                  setState(() {
                    markers.add(
                      Marker(
                        width: 150.0,
                        height: 150.0,
                        point: latlng,
                        builder: (ctx) => const Icon(
                          Icons.location_on,
                          color: Colors.red,
                          size: 35.0,
                        ),
                      ),
                    );
                  });
                }),
            layers: [
              MarkerLayerOptions(
                markers: [
                  for (int i = 0; i < markers.length; i++) markers[i]
                ],
              ),
            ],
          ),

2) 如果您想查询两点之间的路线，您可以使用此服务，它是免费的。 http://project-osrm.org

我用来获取两点之间路线的链接。

https://api.openrouteservice.org/v2/directions/driving-car?api_key=$OSRM_API_KEY&start=${origin.longitude},${origin.latitude}&end=${destination.longitude},${destination.latitude}

需要，API Key 和起点 lat-long 和终点 lat-long。

响应为您提供多个经纬度点，如果您将这些点提供给地图的 polyLine 参数，它将在两点之间为您绘制一条道路线

如果您需要对我的回答的某些部分进行任何澄清，请告诉我

【讨论】：

是的，列出标记 = [];我更新了答案
是的，(1) 有效！极好的！我继续。我的任务是构建一个多边形/折线并让用户查看其中的标记，正如我在这里写的：stackoverflow.com/questions/66374167/…
@kokserek 我还不知道怎么处理它/