Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Page 2 of 2 FirstFirst 12
Results 16 to 20 of 20
  1. #16
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,458
    Thanks
    76
    Thanked 4,373 Times in 4,338 Posts
    Do you not have *SOME* debugger???

    Just running your page on Firefox using the Firebug debugger immediately pinpoints the problem:
    Code:
     infowindow.open( map, which );
    "map is not defined".

    And indeed it isn't.

    You do
    Code:
      var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    in your initialize() function so the variable map is *NOT* available outside that function (except when you pass it as an argument to the setMarkers() function).

    So...

    Simply move the *declaration* of the variable to global scope:
    Code:
    var map = null; 
    function initialize() {
      var myOptions = {
        zoom: 10,
        center: new google.maps.LatLng(32.75542,-117.13433),
        mapTypeId: google.maps.MapTypeId.ROADMAP
      }
      // notice that the var keyword is removed!
      map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
     
      setMarkers(map, MarkersArray);
    }
    Will this be the last problem? I dunno. But if you would use Firebug you'd be better equipped to find out for yourself. Please?
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  2. Users who have thanked Old Pedant for this post:

    flashdave (06-30-2010)

  3. #17
    New to the CF scene
    Join Date
    Jun 2010
    Posts
    9
    Thanks
    3
    Thanked 0 Times in 0 Posts
    I got it!!

    thank you soo much!

    I had to make a few edits, but it is working now.

    small new problem, but I guess I will deal with it.

    thanks again!

  4. #18
    New to the CF scene
    Join Date
    Sep 2011
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I once posted a detailed explanation to my blog:
    Google Maps API v3 Multiple InfoWindows

    This should give you a pretty good clue how it works.

  5. #19
    New to the CF scene
    Join Date
    May 2012
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Try this

    I have had and resolved your exact problem. The issue is that in Javascript for loops, the real variables are not used, but rather only copies of them. So, if you want to change the value of an external or passed variable, you have to make a function call OUTSIDE the loop to do the job. Here's my code:

    Code:
    function setMarkers() {
      // Add markers to the map
      for (var i = 0; i < _offices.length; i++) {
        var office = _offices[i];
        var myLatLng = new google.maps.LatLng(office[1], office[2]);
        var contentString = 
            '<div class="infoWindow">'+
            '<h3 class="heading">'+office[0]+'</h3>'+
            '<p>'+office[4]+'</p>'+
            '</div>';
        var marker = new google.maps.Marker({
            position: myLatLng,
            map: _map,
            title: office[0],
            zIndex: office[3],
            clickable: true
        });
        addInfoWindow(marker, contentString);
        _markers.push(marker);
      }
    }
    function addInfoWindow(marker, message) {
      var info = message;
      var infoWindow = new google.maps.InfoWindow({
          content: message,
          size: new google.maps.Size(200,50)
      });
      _infoWindows.push(infoWindow);
      google.maps.event.addListener(marker, 'click', function () {
          closeAllMarkers();
          infoWindow.open(_map, this);
      });
    }
    Note the call to addInfoWindow inside the for loop. Believe it or not, putting the code in the called function INSIDE the for loop will not work. Only the last item referenced, according to the length of the variable "offices" will be left to use. Putting the code for addInfoWindow OUTSIDE the for loop will produce the results you want. I'm definitely not an expert on this, but I have battered my brains out over it and appear to have won.
    Last edited by owltech; 05-12-2012 at 03:22 AM.

  6. #20
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,458
    Thanks
    76
    Thanked 4,373 Times in 4,338 Posts
    You have described the phenomenon correctly but you don't understand the cause.

    Look into JavaScript closures for the reason your solution worked.

    Only the last item referenced, according to the length of the variable "offices" will be left to use.
    And even it wouldn't be available if you didn't have a global variable that held a reference to it.
    Last edited by Old Pedant; 05-12-2012 at 05:42 AM.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.


 
Page 2 of 2 FirstFirst 12

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •