Hi,
how can I add a Map in a Tab Panel?
Here is my code:
Code:
Ext.create("Ext.tab.Panel", {
fullscreen: true,
tabBarPosition: 'bottom',
items: [
{
title: 'Home',
iconCls: 'home',
cls: 'home',
scrollable: true,
html: [
'<center><br>Welcome!</center>'
].join("")
},
{
title: 'Map',
iconCls: 'maps',
scrollable: true,
html: [
'<center><br>Map here...<br></center>'
].join("")
},
{
xtype: 'nestedlist',
title: 'Steps',
iconCls: 'star',
displayField: 'title',
store: {
type: 'tree',
fields: [
'title', 'content',
{name: 'leaf', defaultValue: true}
],
root: {
leaf: false
},
proxy: {
type: 'ajax',
url: 'steps.json',
reader: {
type: 'json',
rootProperty: 'steps'
}
}
},
detailCard: {
xtype: 'panel',
scrollable: true,
styleHtmlContent: true
},
listeners: {
itemtap: function(nestedList, list, index, element, post) {
this.getDetailCard().setHtml(post.get('content'));
}
}
}
]
});
I need to insert a Map with markers in the second tab of my Panel.
Thanks in advance!