所需的输出就像图像一样。
您可以借助此代码创建这些类型的标记。
Set<Marker> markers = Set();
@override
void initState() {
addMarkers();
super.initState();
}
addMarkers() async {
String imgurl = "https://www.fluttercampus.com/img/car.png";
Uint8List bytes = (await NetworkAssetBundle(Uri.parse(imgurl))
.load(imgurl))
.buffer
.asUint8List();
markers.add(
Marker( //add start location marker
markerId: MarkerId(carLocation.toString()),
position: carLocation, //position of marker
infoWindow: InfoWindow( //popup info
title: 'Car Point ',
snippet: 'Car Marker',
),
icon: BitmapDescriptor.fromBytes(bytes), //Icon for Marker
)
);
setState(() {
//refresh UI
});
}
现在在地图中添加此标记
GoogleMap( //Map widget from google_maps_flutter package
zoomGesturesEnabled: true, //enable Zoom in, out on map
initialCameraPosition: CameraPosition( //innital position in map
target: startLocation, //initial position
zoom: 14.0, //initial zoom level
),
markers: markers, //markers to show on map
mapType: MapType.normal, //map type
onMapCreated: (controller) { //method called when map is created
setState(() {
mapController = controller;
});
},
)
这里是在地图中将网络图像显示为谷歌标记的示例,您也可以自定义它。 在初始化状态下或加载 GoogleMap 之前初始化 Uint8List
Uint8List bytes = (await NetworkAssetBundle(Uri.parse(imageUrl))
.load(imageUrl))
.buffer
.asUint8List();
CameraPosition iniCameraPosition= CameraPosition(target: currentPosition, zoom: 17.0);
GoogleMap(
initialCameraPosition: iniCameraPosition,
markers: {
Marker(
icon: BitmapDescriptor.bytes(bytes,// add your bytes image here
width:
40,height: 40,),
draggable: false,
markerId: const MarkerId('Sydney'),
position: currentPosition,
)
},
)