How can I get a reference to the javascript google map object in order to add a google.maps.GroundOverlay?

Ask the Community General Questions
1

Hello,

I need to add a ground overlay (image on top of map showing community that’s not built yet) using the google method Ground Overlays  |  Maps JavaScript API  |  Google Developers

The issue I’m having is I can’t get a reference to the elfsight widget google map object in order to add the ground overlay to it. Can you please let me know how I can get the reference to the current google map object.

Thanks!

3

Hello @Evan and we are happy to see you in the best place of the Earth :earth_africa:! Welcome to Elfsight Community :partying_face:!

I am glad to inform you that you can get the reference to the current google map object using window.google.maps

Could you please check it and let me know if it helped?

4

HI @Maksim

Thank you so much for your reply. Unfortunately I don’t think that gives the current instance of the google map object as I get this error: InvalidValueError: setMap: not an instance of Map

Here is my code that’s not working with the window.google.maps reference you provided to add the Ground Overlay. This same code works when I reference a manually created google map instance. I just need to get the correct reference to the google Map object created by your WordPress plugin.

const imageBounds = {
	north: 50.9215,
	south: 50.91,
	east: -113.893,
	west: -113.907,
};
mapOverlay = new google.maps.GroundOverlay("https://hotchkissdev.wpengine.com/wp-content/uploads/2022/08/hotchiss_community-map-illustration.png",imageBounds);
mapOverlay.setMap(window.google.maps);

Hopefully this makes sense and thank you so much for helping get this figured out.

Thanks,

Evan

5

Hi @Max,

I just posted a reply about the error I get and sample code but it’s disappeared and looks like it’s being moderated for some reason.

Using the window.google.maps reference you provided I get an error InvalidValueError: setMap: not an instance of Map. I’m not sure that’s a reference to the actual instance of the google map object created by the elfsight plugin. Can yo please check in to this again.

Thank you so much for your assistance.

Evan

6

Hello @Evan!

I am so sorry for the inconvenience it might have caused to you. We are going to take care of this for you.

To clarify things, we need a direct link to the webpage with the widget. Could you please provide me with it?

7

Hi Maksim,

Here’s the link to the page with the elfsight google map that I need to add the ground overlay image to.

Also here is a link to a manually created google map with the ground overlay added to it for reference.

Thanks!

8

Hello @Evan! Thank you for waiting!

I’ve consulted with our devs regarding your use case and they’ve confirmed that it’s a very specific customization.

I see that you’ve already opened a ticket #302016. Our support agent will contact you there and advise on your request.