我试图向Flutter Google添加一个标记,但无法添加图标。我正在共享代码,我得到的错误是,"mapMarker";不能为null
它实际上在没有"Uint8List"的情况下工作,但图标太大了,所以我需要调整它的大小。添加小资产不是一个选项,因为质量越来越差。
我正在运行这个代码:
class _Harita extends State<Harita> {
Completer<GoogleMapController> _controller = Completer();
Set<Marker> _markers = {};
BitmapDescriptor? mapMarker;
BitmapDescriptor? mapMarker1;
void initState() {
setCustomMarker();
super.initState();
}
static final CameraPosition _kGooglePlex = CameraPosition(
target: LatLng(41.6018963, 36.0805428),
zoom: 12.06,
);
Future<Uint8List> getBytesFromAsset(
{required String path, required int width}) async {
ByteData data = await rootBundle.load(path);
ui.Codec codec = await ui.instantiateImageCodec(data.buffer.asUint8List(),
targetWidth: width);
ui.FrameInfo fi = await codec.getNextFrame();
return (await fi.image.toByteData(format: ui.ImageByteFormat.png))!
.buffer
.asUint8List();
}
void setCustomMarker() async {
final Uint8List customMarker = await getBytesFromAsset(
path: ('assets/images/golmarker.png'), width: 200);
setState(() {
mapMarker = BitmapDescriptor.fromBytes(customMarker);
});
}
void _onMapCreated(GoogleMapController controller) {
sleep(Duration(seconds: 5));
setState(() {
_markers.add(
Marker(
markerId: MarkerId('1'),
icon: mapMarker!,
position: LatLng(41.566743, 36.093695),
infoWindow: InfoWindow(
title: 'Uzun Göl',
snippet: 'Kızılırmak Deltasındaki Acı Göller İçerisindedir.')),
);
_controller.complete(controller);
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: Stack(
children: <Widget>[
GoogleMap(
markers: _markers,
onMapCreated: _onMapCreated,
mapType: MapType.normal,
initialCameraPosition: _kGooglePlex,
/*onMapCreated: (GoogleMapController controller) {
_controller.complete(controller);
},*/
),
Positioned(
top: 60,
left: 20,
child: InkWell(
child: Container(
height: 40,
width: 40,
decoration: BoxDecoration(
color: Colors.white, shape: BoxShape.circle),
child: Icon(
Icons.close,
size: 25,
),
),
onTap: () {
Navigator.pop(context);
},
),
),
],
),
floatingActionButtonLocation: FloatingActionButtonLocation.centerFloat,
floatingActionButton: Padding(
padding: const EdgeInsets.all(8.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
FloatingActionButton.extended(
backgroundColor: Color.fromRGBO(74, 112, 217, 2),
heroTag: "qrcodefalanbruh",
onPressed: () {
Navigator.pushReplacement(
context,
MaterialPageRoute(
builder: (BuildContext context) => super.widget));
},
icon: Icon(Icons.location_searching, color: Colors.white),
label:
Text('Ortalama', style: TextStyle(color: Colors.white))),
],
),
));
}
}
我通过将变量放入Marker List中来修复它。
void _onMapCreated(GoogleMapController controller) async {
final Uint8List customMarker = await getBytesFromAsset(
path: ('assets/images/golmarker.png'), width: 200);
mapMarker = BitmapDescriptor.fromBytes(customMarker);
setState(() {
_markers.add(
Marker(
markerId: MarkerId('1'),
icon: mapMarker!,
position: LatLng(41.566743, 36.093695),
infoWindow: InfoWindow(
title: 'Uzun Göl',
snippet: 'Kızılırmak Deltasındaki Acı Göller İçerisindedir.')),
);
_controller.complete(controller);
});
如果你找到了你的解决方案,这里有一个在谷歌地图中添加标记的解决方案。然后它将在未来的中帮助其他人
final _pickMarkerId = const MarkerId('start');
final Map<MarkerId, Marker> _locationMarkers = <MarkerId, Marker>{};
await _getPickIcon();
_locationMarkers[_pickMarkerId] = Marker(
markerId: _pickMarkerId,
position: _start,
icon: _pickIcon ?? BitmapDescriptor.defaultMarker,
);
_getPickIcon() async {
if (_pickIcon != null) {
return _pickIcon;
}
return _pickIcon = await convertIcon(put here your image);
}
Future<BitmapDescriptor?> convertIcon(image) async {
ByteData data = await rootBundle.load(image);
ui.Codec codec = await ui.instantiateImageCodec(data.buffer.asUint8List(), targetWidth: 120);
ui.FrameInfo fi = await codec.getNextFrame();
Uint8List? bytes = (await fi.image.toByteData(format: ui.ImageByteFormat.png))?.buffer.asUint8List();
return BitmapDescriptor.fromBytes(bytes!);
}
在谷歌地图标记中使用这一行
GoogleMaps(
marker:locationMarkers.values.toSet()