Google-maps – How to get the google map linked to a div

google mapsgoogle-maps-api-3

I have set a google maps (api v3) on div.
Then I want to retrieve the map via the div.

Doing something like

theMap = $('.myDiv').theGoogleMap;

I can't find this simple info. Thank you for your help.

Best Answer

Maybe this it's too late for the original poster, but might helpful for others. I also spent some time searching before solving it by myself. Turns out to be really simple.

Assuming the div that holds the map looks like this:

<div id="myMap"></div>

When creating the map, add a reference to map object as a property to the document element that holds the map:

// Create the map
originalMapObject = new google.maps.Map('myMap', map_options);

// Get the DOM Element
var element = document.getElementById('myMap');

// Create a random property that reference the map object
element.gMap = originalMapObject;

When you need the map object again, just do something like this

gmap = document.getElementById('myMap').gMap

Hope it helps.

Related Solutions

Javascript – Google Map API v3 — set bounds and center

Yes, you can declare your new bounds object.

 var bounds = new google.maps.LatLngBounds();

Then for each marker, extend your bounds object:

bounds.extend(myLatLng);
map.fitBounds(bounds);

API: google.maps.LatLngBounds

Jquery – How to disable mouse scroll wheel scaling with Google Maps API

In version 3 of the Maps API you can simply set the scrollwheel option to false within the MapOptions properties:

options = $.extend({
    scrollwheel: false,
    navigationControl: false,
    mapTypeControl: false,
    scaleControl: false,
    draggable: false,
    mapTypeId: google.maps.MapTypeId.ROADMAP
}, options);

If you were using version 2 of the Maps API you would have had to use the disableScrollWheelZoom() API call as follows:

map.disableScrollWheelZoom();

The scrollwheel zooming is enabled by default in version 3 of the Maps API, but in version 2 it is disabled unless explicitly enabled with the enableScrollWheelZoom() API call.

Best Answer

Related Solutions

Javascript – Google Map API v3 — set bounds and center

Jquery – How to disable mouse scroll wheel scaling with Google Maps API

Related Topic