CODEWITHSUNDEEP
javascriptgoogle-maps-api-3extjssencha-touch-2
tomjerry
tomjerry

Reputation: 105

Google Maps JavaScript : Uncaught Error: Invalid value for property <map>: [object Object]

I am trying to use Google maps. I have map loaded onto the panel.

I have one overlay window, in which I am asking for source and destionation for showing the directions on the map. I am getting that reference to the map via Ext.getCmp('GMap');

But, when I run it on chrome and check console window, I get this error.

Uncaught Error: Invalid value for property <map>: [object Object]

Sample Code snippet for click handler of overlay window

listeners : {
   tap : function() {
      function showDirections(res) {
         var directionsService = new google.maps.DirectionsService();
         var directionsDisplay = new google.maps.DirectionsRenderer();

         var map = Ext.getCmp('GMap');
         directionsDisplay.setMap(map);
         directionsService.route(request, function(response, status) {
         if (status == google.maps.DirectionsStatus.OK) {
              directionsDisplay.setDirections(response);
         }
    });
  }
 }
}

Upvotes: 2

Views: 1699

Answers (1)

robrich
robrich

Reputation: 13205

jQuery does this too. When you grab $("#GMap"), you're returning an array where the real element is [0]. Shim the results of getCmp() to be the actual dom element. http://www.sencha.com/forum/showthread.php?122684-accessing-component-property-from-variable-dom-element-or-Ext.getCmp() seems similar.

Upvotes: 1

Related Questions