为 flutter google 地图动态添加标记
Adding markers dynamically to flutter google map
我正在使用 Flutter 制作一个使用地图的移动应用程序。我们决定使用 Google map,我们使用的 flutter 插件是:
google_maps_flutter: ^0.5.7
我知道在地图上添加标记是这样的:
Map<MarkerId, Marker> markers = <MarkerId, Marker>{};
Marker _marker = new Marker(
icon: BitmapDescriptor.defaultMarker,
markerId: _markerId,
position: LatLng(34.024441,-5.0310968),
infoWindow: InfoWindow(title: "userMarker", snippet: '*'),
);
GoogleMap _map;
@override
void initState(
markers[_markerId] = _marker;
_map = new GoogleMap(
/* other properties irrelevant to this prob */
markers: Set<Marker>.of(_markers.values),
);
);
上面的代码片段确实有效,我在地图上看到了标记。但是修改标记或尝试添加另一个标记(如下面的代码片段)是行不通的。
FloatingActionButton(
onPressed: () {
setState(() {
_marker = new Marker(
icon: BitmapDescriptor.defaultMarker,
markerId: _markerId,
position: LatLng(currentLocation.latitude, currentLocation.longitude),
infoWindow: InfoWindow(title: "userMarker", snippet: '*'),
onTap: () {
debugPrint("Marker Tapped");
},
);
markers[_markerId] = _marker; // What I do here is modify the only marker in the Map.
});
markers.forEach((id,marker) { // This is used to see if the marker properties did change, and they did.
debugPrint("MarkerId: $id");
debugPrint("Marker: [${marker.position.latitude},${marker.position.longitude}]");
});
});
)
我的目的是使用另一个插件 (geoLocator) 来获取用户的位置数据并更改我拥有的唯一标记,以便它可以跟踪他的移动。 debugPrint 显示数据确实在变化,但我在地图上看不到任何变化(我更改的初始标记使用的位置与我测试时使用的位置不同)。
如果没有特定原因需要您使用 Map 数据结构,这就是我过去所做的。
我的 State
中有 Set
个 Marker
Set<Marker> markers = Set();
将其提供给地图小部件。标记:标记
GoogleMap(
onMapCreated: _onMapCreated,
myLocationEnabled: true,
initialCameraPosition:
CameraPosition(target: LatLng(0.0, 0.0)),
markers: markers,
)
然后在 setState 方法中将我使用搜索结果构建的标记和您将使用用户位置构建的标记添加到标记集。
// Create a new marker
Marker resultMarker = Marker(
markerId: MarkerId(responseResult.name),
infoWindow: InfoWindow(
title: "${responseResult.name}",
snippet: "${responseResult.types?.first}"),
position: LatLng(responseResult.geometry.location.lat,
responseResult.geometry.location.lng),
);
// Add it to Set
markers.add(resultMarker);
编辑:我刚刚注意到您在 initState
中使用了 GoogleMap 小部件,您需要将其移至 build
方法,如果你想每次都用新的状态值重建它。
我正在使用 Flutter 制作一个使用地图的移动应用程序。我们决定使用 Google map,我们使用的 flutter 插件是:
google_maps_flutter: ^0.5.7
我知道在地图上添加标记是这样的:
Map<MarkerId, Marker> markers = <MarkerId, Marker>{};
Marker _marker = new Marker(
icon: BitmapDescriptor.defaultMarker,
markerId: _markerId,
position: LatLng(34.024441,-5.0310968),
infoWindow: InfoWindow(title: "userMarker", snippet: '*'),
);
GoogleMap _map;
@override
void initState(
markers[_markerId] = _marker;
_map = new GoogleMap(
/* other properties irrelevant to this prob */
markers: Set<Marker>.of(_markers.values),
);
);
上面的代码片段确实有效,我在地图上看到了标记。但是修改标记或尝试添加另一个标记(如下面的代码片段)是行不通的。
FloatingActionButton(
onPressed: () {
setState(() {
_marker = new Marker(
icon: BitmapDescriptor.defaultMarker,
markerId: _markerId,
position: LatLng(currentLocation.latitude, currentLocation.longitude),
infoWindow: InfoWindow(title: "userMarker", snippet: '*'),
onTap: () {
debugPrint("Marker Tapped");
},
);
markers[_markerId] = _marker; // What I do here is modify the only marker in the Map.
});
markers.forEach((id,marker) { // This is used to see if the marker properties did change, and they did.
debugPrint("MarkerId: $id");
debugPrint("Marker: [${marker.position.latitude},${marker.position.longitude}]");
});
});
)
我的目的是使用另一个插件 (geoLocator) 来获取用户的位置数据并更改我拥有的唯一标记,以便它可以跟踪他的移动。 debugPrint 显示数据确实在变化,但我在地图上看不到任何变化(我更改的初始标记使用的位置与我测试时使用的位置不同)。
如果没有特定原因需要您使用 Map 数据结构,这就是我过去所做的。
我的 State
Set
个 Marker
Set<Marker> markers = Set();
将其提供给地图小部件。标记:标记
GoogleMap(
onMapCreated: _onMapCreated,
myLocationEnabled: true,
initialCameraPosition:
CameraPosition(target: LatLng(0.0, 0.0)),
markers: markers,
)
然后在 setState 方法中将我使用搜索结果构建的标记和您将使用用户位置构建的标记添加到标记集。
// Create a new marker
Marker resultMarker = Marker(
markerId: MarkerId(responseResult.name),
infoWindow: InfoWindow(
title: "${responseResult.name}",
snippet: "${responseResult.types?.first}"),
position: LatLng(responseResult.geometry.location.lat,
responseResult.geometry.location.lng),
);
// Add it to Set
markers.add(resultMarker);
编辑:我刚刚注意到您在 initState
中使用了 GoogleMap 小部件,您需要将其移至 build
方法,如果你想每次都用新的状态值重建它。