search

xkjyeah / vue-google-maps

Google maps component for vue with 2-way data binding
https://xkjyeah.github.io/vue-google-maps/
1.88k stars 475 forks source link

Problem with vue2-google-maps with custom marker and icon resize, misplaced on zoom out #738

Open bensonsbc opened 4 years ago

bensonsbc commented 4 years ago

Hi !

I have read a lot and did not found a solution for this case...

When creating a custom marker if use the "size" and "scaledSize" properties the icon is misplaced, the more you zoom out, the more it gets misplaced.

the object used is: { url:"https://i.ibb.co/bdykLz4/test.png", size: { width: 100, height: 100, f: "px", b: "px" }, scaledSize: { width: 50, height: 50, f: "px", b: "px" } }

If I use the same width and height for both "size" and "scaledSize" there is no problem

Here is a JSFiddle for test, keep the "resize" checkbox checked and zoom out, you will see the icon goes to the ocean, the uncheck the checkbox and see it go to the correct place.

https://jsfiddle.net/5dw83v7g/3/

eregnier commented 4 years ago

hey, crop your image to make the red cross centered, this will have the desired behavior I guess.