How to Display Marker on an Network Image in given co-ordinates (x,y) in Flutter?

35 Views Asked by At

I'm making a mobile app using Flutter where I display an image from a website (URL). This image serves as a base map. On top of this image, I want to add a marker at specific locations (x, y) that can be dragged around.

Additionally, I want to allow users to zoom in on the image using the InteractiveViewer widget. However, when the user zooms in, the marker's location should still be accurate relative to the zoomed image. I've already figured out how to display the image from the URL using the Image.network() widget.

But I'm not sure how to overlay a marker on it at a specific (x, y) position. I also don't know how to make sure the marker's position is still correct when the user zooms in using the InteractiveViewer widget. The marker can be a simple icon or any custom design.

I have tried CustomPaint to draw image but not sure about the putting another icon or custom design on top of it as marker in give coordinates (x,y).

0

There are 0 best solutions below