CODEWITHSUNDEEP
google-mapsgoogle-maps-api-3
Paul Etienney
Paul Etienney

Reputation: 445

How to get the google map linked to a div?

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.

Upvotes: 5

Views: 7444

Answers (3)

Luxian
Luxian

Reputation: 676

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.

Upvotes: 7

Chad Killingsworth
Chad Killingsworth

Reputation: 14411

The API doesn't work that direction. You must retain a reference to the object in javascript when you create it. You cannot lookup the map object from the DOM reference.

Upvotes: 1

Paco Valdez
Paco Valdez

Reputation: 1975

well, you can't do that, you can declare a global variable and save in that variable the reference to the map object. Look at the sample in the google documentation.

      var map;
      function initialize() {
        var myOptions = {
          zoom: 8,
          center: new google.maps.LatLng(-34.397, 150.644),
          mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        map = new google.maps.Map(document.getElementById('map_canvas'),
            myOptions);
      }

      google.maps.event.addDomListener(window, 'load', initialize);

Also here is a Javascript tutorial:

https://developer.mozilla.org/en/JavaScript/Guide

Upvotes: 2

Related Questions