我使用 sfmaps 插件覆盖多个地图图块，但我想添加一个标记，用于显示位置并在设备位置更改时动态更改位置。我已经使用标记来绘制路线。
我不能在一个 MapTileLayer 中放置 2 个标记并跟踪当前位置。
怎么做？
这是我的代码：
import 'package:flutter/material.dart';
import 'package:navizfront/src/data/models/user_location_model.dart';
import 'package:navizfront/src/data/services/geolocation_service.dart';
import 'package:syncfusion_flutter_maps/maps.dart';
class MapView extends StatefulWidget {
const MapView({Key? key}) : super(key: key);
@override
State<StatefulWidget> createState() => _MapViewState();
}
class _MapViewState extends State<MapView> {
late List<MapLatLng> polylinePoints;
@override
void initState() {
polylinePoints = [
MapLatLng(43.11530920069449, 5.933847321082877),
MapLatLng(43.115261054447515, 5.929955942235698),
MapLatLng(43.11078328790601, 5.919996650609866),
MapLatLng(43.090219874511284, 5.918545627963981),
MapLatLng(43.0925799610869, 5.934671765752776),
MapLatLng(43.08858220973042, 5.96504430756706),
MapLatLng(43.089599529170826, 5.96937366430741),
MapLatLng(43.07436555855097, 5.983248750601318),
MapLatLng(43.04579576940066, 6.042443112262576),
MapLatLng(43.010541904963965, 6.122069930874775),
MapLatLng(43.013699826556994, 6.160343124591151),
MapLatLng(43.01587760895141, 6.18193695013048),
MapLatLng(43.00906433023288, 6.194657581312996),
MapLatLng(43.00394697581921, 6.198069366778356),
MapLatLng(43.00328301244045, 6.199697341166668),
];
super.initState();
}
@override
Widget build(BuildContext context) {
final _zoomPanBehavior = MapZoomPanBehavior(
zoomLevel: 14,
focalLatLng: MapLatLng(userLocation.latitude!, userLocation.longitude!),
);
return Scaffold(
body: SfMaps(
layers: [
MapTileLayer(
initialFocalLatLng: MapLatLng(userLocation.latitude!, userLocation.longitude!),
urlTemplate: "https://tile.openstreetmap.org/{z}/{x}/{y}.png",
zoomPanBehavior: _zoomPanBehavior,
sublayers: [
MapPolylineLayer(
polylines: {MapPolyline(
points: polylinePoints,
)},
),
],
initialMarkersCount: 2,
markerBuilder: (context, index) {
if (index == 0) {
return MapMarker(
iconColor: Colors.white,
iconStrokeColor: Colors.blue,
iconStrokeWidth: 2,
latitude: polylinePoints[index].latitude,
longitude: polylinePoints[index].longitude);
}
return MapMarker(
iconColor: Colors.white,
iconStrokeColor: Colors.blue,
iconStrokeWidth: 2,
latitude: polylinePoints[polylinePoints.length - 1].latitude,
longitude: polylinePoints[polylinePoints.length - 1].longitude);
},
),
MapTileLayer(
urlTemplate:
'https://tiles.openseamap.org/seamark/{z}/{x}/{y}.png',
zoomPanBehavior: _zoomPanBehavior,
),
],
));
}
}