Get Map view zoom value

I would like to get the zoom value every time a user changes the zoom on their Google map. I am using the Google Maps Extended element, and I do set the initial zoom, but assuming that the user may change the zoom as they look at the map, how can I get the new zoom value every time the zoom changes? There is a lot of javascript online that resolves this problem online, but I cannot figure out how to apply any of the javascript code I find to the map object. I am comfortable using the javascript to bubble plugin, but I cannot figure out how to use it in conjunction with a map object.

To provide a little bit of context, I plan to use the zoom value to calculate changes in the radius from the center of the map to the top border. The radius provides me the ability to measure the area of a circle around my center point that would increase or decrease as the user zooms in or out.

Just a bit more context. I have a map element called “MapA” in my application. I did not create the map object with code, but rather I pulled it from the “elements” section in Bubble Editor. So, I found some javascript in Stack that I would like to use with the map object in order to get any zoom updates produced as a result of a user changing the zoom on the map. For example, the map starts out with a zoom of 12, but if the user zooms in then the value I get from the map changes to 13 or 14, etc.

The script I found is:


This is my first question: My map element has an id of “MapA”, as I mentioned above, but what is my “mapObject”?
Second question: whatever the mapObject that I plug into my script, if I add “MapA” in the “ID Attribute” at the bottom of the HTML element, can I expect to see the correct zoom value in my console log upon adding something like console.log() directly after the mapObject.getZoom()?

1 Like

This topic was automatically closed after 70 days. New replies are no longer allowed.