Note that there are some explanatory texts on larger screens.

plurals
  1. POGoogle Maps JS API v3: Need to access Marker Object from inside the Event Handler
    text
    copied!<p>I've created a MapObject that is handling my Google Mapping functionality. The object collects all the Markers on the map into an Array. (I'm using the Prototype JS Library.) As the Markers are created their Click event is mapped to a function on the MapObject. Everything works as expected except once I'm in the Click event I can no longer access the Marker that fired the event. If I bind the Marker to the event handler then I can't access the methods and properties of the MapObject. Here's some sample code to show what is going on.</p> <pre><code>MappingObject = Class.create({ initialize: function() { try { this.geocoder = new google.maps.Geocoder(); this.trucks = $A(); this.truckPic = "Images/TruckIcon.jpg"; } catch (ex) { this.sendToConsole("FAIL! " + ex.toString()); } }, putTruckOnMapWithLatLong: function(latitude, longitude, title) { var marker = this.getNewTruck(this.getNewLatLong(latitude, longitude)); try { marker.setTitle(title); google.maps.event.addListener(marker, "click", this.truckClickHandler); this.trucks.push(marker); } catch (ex) { this.sendToConsole(ex.toString()); } }, truckClickHandler: function(event) { $("dashboardmessage").update(this.getTitle()); this.setIcon("Images/small_smiley.jpeg"); }}) </code></pre> <p>The getNewTruck() function just returns a Google Marker Object. The problem is that the "this" in the truckClickHandler can refer to the MapObject but then I can't access the marker object. If I bind the marker object like such...</p> <pre><code>google.maps.event.addListener(marker, "click", this.truckClickHandler.bind(marker)); </code></pre> <p>Then I can't access the functions in the MapObject anymore. I'd appreciate any help I could get. Thanks!</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload