Repost: Google Maps marker custom icon with custom border like the Leafly Dispensaries page

Job ID: 34012581

Budget: $30 – $250 USD

Please post "Stoner" before your post to weed out bots.
This is a repost as the previous interested parties haven't been responding for the past few weeks.
------
I have a page where I use javascript google maps api. I have the latitude/longitude coords of each marker and I use a custom image for each of them that I also have stored in the database for the listings in my database.

Currently: On the browser they are ugly square personalized thumbnail images on the map, and if several of them overlap, which is often the case, you can't see much of the other icons.

What I'd like: I have noticed that another site, Leafly, has the same looking google map, but their custom markers look better with smaller or larger background for the marker and if you mouseover the hidden markers, they temporarily rise above the other markers so you can see their marker thumbnail.

Thats it. I'll attach some images showing what it looks like currently, as well as what I would prefer them to look like, along with when one marker has a mouseover.

I don't need any backend coding, I am just looking for some frontend code that I can switch out my background dynamically generated data with, so really just a sample like on Codepen or something.

Thanks

Please only bid if you have experience with this sort of thing because
Related categories: PHP JavaScript jQuery / Prototype Google Maps API JSON