PDA

View Full Version : Using Eext JS with Google Earth plugin



RiaanSA
19 Feb 2013, 10:42 PM
Hi,

Basically I am trying to put Google Earth into an Ext Window.


Ext.define('MyApp.view.main.GoogleEarthWindow' ,{
extend: 'Ext.window.Window',


title: 'GoogleEarth',
width: 500,
height: 500,
layout: 'fit',
collapsible: false,
maximizable : true,
closable: true,
modal: false,
bodyStyle: {
background: '#4c4c4c'
},
closeAction: 'hide',
id:'googleearth-window',

items: [{
xtype: 'panel',
id: 'GEmapPanel'
}],

afterRender: function(){
this.callParent(arguments);

myDivName = 'GEmapPanel-body';

// Create Google Earth panel
var earthPanel = new Ext.ux.GEarthPanel({
renderTo: myDivName,
width: 700,
height: 500,
earthLayers: {
LAYER_BUILDINGS: true,
LAYER_TERRAIN: true
},
earthOptions: {
setStatusBarVisibility: true,
setAtmosphereVisibility: true,
setMouseNavigationEnabled: true
}
});

// Fly to Oslo
earthPanel.on('earthLoaded', function(){
earthPanel.findLocation('Oslo');
});
}
});


What I am using the the GE plugin from GitHub (https://github.com/pymonger/ext-js-google-earth-api) but for some reason I am getting the following error in FireBug.


TypeError: Ext.tree is undefined



chrome://firebug/content/blank.gif
this.kmlTreePanel = new Ext.tree.TreePanel({






I have seen this error before somewhere else.

Please assist.

If there are a better way to use Google Earth in EXTJS please let me know. I am open for all ideas.

Thanks.

evant
19 Feb 2013, 10:50 PM
Well, the code you posted has no reference to trees at all, however that typically means you're missing a require() statement.

As for the code you posted, why are you using renderTo? You should just add it as a child item of the container.

RiaanSA
19 Feb 2013, 11:13 PM
Adding the code to the top did the trick thanks.


Ext.require([
'Ext.tree.Panel'
]);


To answer your question.

When I take out the "renderTo" it gives me a blank page.

It seems like in most examples it wants me to render the "GEarthPanel" to a "div" tag.

But I will appreciate it if you can show me what you mean or better way of rendering the panel.

Thanks for the help.