如何在flutter_osm_plugin中添加带不同标记图标的多个静态地理点

在Osm Flutter里，你需要通过Marker类的markerIcon属性来给每个地理位置标记设置自定义图标，具体做法如下：

• 先准备好所需图标资源（比如放在assets/icons/目录下），将图标转为BitmapDescriptor对象（不同版本API可能有差异，以插件当前版本为准）。
• 创建多个Marker实例：代表用户位置的标记单独指定用户图标对应的markerIcon；其余标记分别设置各自的专属图标。

举个代码示例：

// 预加载图标
final userIcon = await BitmapDescriptor.fromAssetImage(
  ImageConfiguration(size: Size(48, 48)),
  'assets/icons/user_location.png',
);
final shopIcon = await BitmapDescriptor.fromAssetImage(
  ImageConfiguration(size: Size(40, 40)),
  'assets/icons/shop.png',
);
final restaurantIcon = await BitmapDescriptor.fromAssetImage(
  ImageConfiguration(size: Size(40, 40)),
  'assets/icons/restaurant.png',
);

// 构建标记列表
List<Marker> markers = [
  Marker(
    markerId: MarkerId('user'),
    position: GeoPoint(latitude: 37.7749, longitude: -122.4194),
    markerIcon: userIcon, // 用户位置用专属图标
  ),
  Marker(
    markerId: MarkerId('shop'),
    position: GeoPoint(latitude: 37.7750, longitude: -122.4195),
    markerIcon: shopIcon,
  ),
  Marker(
    markerId: MarkerId('restaurant'),
    position: GeoPoint(latitude: 37.7751, longitude: -122.4196),
    markerIcon: restaurantIcon,
  ),
];

// 传入OsmFlutter组件
OsmFlutter(
  markers: markers,
  // 其他配置项...
);

如果是插件自带的实时用户位置显示（非手动添加的Marker），可以通过userLocationMarker属性自定义用户图标：

OsmFlutter(
  userLocationMarker: UserLocationMaker(
    personMarker: MarkerIcon(
      icon: await BitmapDescriptor.fromAssetImage(
        ImageConfiguration(),
        'assets/icons/user.png',
      ),
    ),
    directionArrowMarker: MarkerIcon(
      icon: await BitmapDescriptor.fromAssetImage(
        ImageConfiguration(),
        'assets/icons/direction_arrow.png',
      ),
    ),
  ),
  markers: markers, // 其他自定义标记
  // 其他配置项...
);

核心逻辑就是给每个标记（用户位置或其他地点）通过对应属性指定不同图标，以此区分展示。

内容的提问来源于stack exchange，提问作者Goutham