how to add marker to image?

Question

I would like to add a marker to an image of a floorplan.

The image is able to be zoomed in and out. If the image is zoomed in the marker position needs to track the correct position.

I've been looking for solutions. It seems that I am only able to find ways to add markers to maps, not to track them as they pan and zoom.

Answer 1

Yeah, you can definitely do it. Using the combination of ZoomWidget, CustomPainter, GesturesDetector and yourImage.

1. Wrap the image with CustomPainter which will paint the markers in your provided coordinate.
2. Wrap CustomPainter with GesturesDetector and onTap, is should get the coordinates and pass it to CustomPainter.
3. Wrap it with ZoomWidget with actual width and height of your image.

And this should do the job. Let me know if it solves your problem. I have done this for a project couple days ago. If you need the code I can give it tomorrow..

ZoomWidget : https://pub.dev/packages/zoom_widget