Reputation: 3476
I would like to have a panel with a google map using google's javascript api.
I have successfully created an ExtJS Window with a google map in it by passing The window's DOM object to the google-map constructor. However when I try this with a Panel (just replace Panel where Window is below). It tells me that 'body' is undefined. What am I doing wrong?
Thanks!
var window = new Ext.Window({ ... });
window.show(); //hack to get the dom built.
var d = window.body.dom; // <-- This line doesn't work for a Panel. Why???
var map = new GMap2(d); // Google Map takes the dom from the ExtJS Object.
Upvotes: 0
Views: 1305
Reputation: 2072
It sounds like you're trying to access the element before it's actually been created. I'd try adding a listener to the afterrender event to your Window component, then calling a handler function which then accesses the element.
So add this type of thing to your panel config:
listeners: {
afterrender: {
fn: setupWindow,
scope: this
}
}
And then a function similar to this:
function setupWindow(obj) {
var windowBodyHtmlElement;
windowBodyHtmlElement = obj.body.dom;
// ...do your stuff.
}
Hope that helps.
Upvotes: 1