flutter - 如何在 map 抖动中将网络图像(也可以自定义此图像)显示为标记

Question

我正在使用此代码，但这仅用于显示网络图像
但我还需要自定义图像，例如这样(我在上面添加了演示图像)。

链接-
https://stackoverflow.com/a/60201433/10253151

码-

import 'package:http/http.dart' as http;

          var iconurl ="your url";
          var dataBytes;
          var request = await http.get(iconurl);
          var bytes = await request.bodyBytes;

          setState(() {
            dataBytes = bytes;
          });

          LatLng _lastMapPositionPoints = LatLng(
              double.parse("22.7339"),
              double.parse("75.8499"));

            _markers.add(Marker(
              icon: BitmapDescriptor.fromBytes(dataBytes.buffer.asUint8List()),
              markerId: MarkerId(_lastMapPositionPoints.toString()),
              position: _lastMapPositionPoints,
              infoWindow: InfoWindow(
                title: "Delivery Point",
                snippet:
                "My Position",
              ),
            ));

Answer 1

Google Map Marker图标仅接受图标和位图图像。因此，首先您需要将url图像转换为Bitmap图像。

import 'dart:typed_data';
import 'package:flutter_cache_manager/flutter_cache_manager.dart';
import 'dart:io';
Map<String, Uint8List> userIdMarkerMap = {};
Future getMarkerImage() async
  {

    for(int j=0;j<userIdList.length;j++) {
      final File markerImageFile = await DefaultCacheManager().getSingleFile(imageURL);
      final Uint8List markerImageBytes = await markerImageFile.readAsBytes();


      ui.Codec codec = await ui.instantiateImageCodec(markerImageBytes, targetWidth: 50);
      ui.FrameInfo fi = await codec.getNextFrame();

      final Uint8List markerImage = (await fi.image.toByteData(format: ui.ImageByteFormat.png)).buffer.asUint8List();

      userIdMarkerMap[userIdList[j]] = markerImage;

    }

    setState(() {
      //call your function to build google map
    });

  }

那么您可以从Google map 标记中使用它。

      markers.add(Marker(
      markerId: MarkerId(userIdList[j]),
      position: LatLng(lat, lon),
      icon: userIdMarkerMap[userIdList[j]] != null ? BitmapDescriptor.fromBytes(userIdMarkerMap[userIdList[j]]) : BitmapDescriptor.defaultMarker,));