I am trying to create a bmp icon for my google map markers. I need to add dynamically different background pictures to fit the circle in the loop. Not really sure how to approach this since im new to flutter, is there actually any way I can preview the mapbitdescriptor while trying to do this? Basically I need a circle in that loop that takes an image as a background.
Future<BitmapDescriptor> customBitMap(String imageUrl) async {
final myImage = await Image(image: AssetImage('assets/images/icon.png'));
final pictureRecorder = ui.PictureRecorder();
final canvas = Canvas(pictureRecorder);
final recordedPicture = pictureRecorder.endRecording();
final img = await recordedPicture.toImage(20, 20);
final data = await img.toByteData(format: ui.ImageByteFormat.png);
return BitmapDescriptor.fromBytes(data!.buffer.asUint8List());
}
What I understood from your question is you want a display an image inside the circle of that marker.
For that, you can use Stack widget. You have to put both your marker image and the image you want to display inside Stack and position them accordingly.
Look at this example, I have tried using Stack
Check Output Here
You can adjust the height,width and position according to your need!