Using agm-overlay to bound an image over google map

i am attempting to have a custom image on top of my google maps map. I am running angular and implementing the following code

        <agm-overlay [latitude]="latitude" [longitude]="longitude">           <img style="width: 100.5rem; height: 52rem; position: absolute; opacity: 50%; top: 7.5rem; left: -17.5rem" [src]="mapURL" alt="world-map" />         </agm-overlay>       </agm-map> 

this is sadly resulting in the image not being able to be zoomed into, and when i scroll around the map the image jumps all over the place. i need the image to stay put, covering the entire google map, and be able to be zoomed into. basically the angular and typescript equivalent to the javascript USGSOverlay tutorial found here: https://developers.google.com/maps/documentation/javascript/examples/overlay-simple#all

Add Comment
0 Answer(s)

Your Answer

By posting your answer, you agree to the privacy policy and terms of service.