javascript - re-sizing and re-centering a google map without access to a global variable "map" -

i have google maps implemented on page , want able resize , recenter after particular event. here code have found on internet:

var center = map.getcenter(); google.maps.event.trigger(map, "resize"); map.setcenter(center); 

now cool dont have access "map" global. instead have been able use jquery selector map-canvas dom so:

google.maps.event.trigger($("#map-canvas")[0], 'resize'); 

but using $("#map-canvas")[0]; doesnt work when try call getcenter() , setcenter(). ideas why?

thanks

your map variable instance of google map object, $("#map-canvas")[0] dom element, can't call method because google won't recognize it.

in case, may scope problem

why don't put map variable global , call everywhere e.g:

var map; // google map object  $(document).ready(function(){   var center = map.getcenter();   google.maps.event.trigger(map, "resize");   map.setcenter(center); }); 

and then, whenever call map.getcenter(); should return value (only if create google object, obviously)