I am having a tab panel with three tabs. Third tab is to display map. I am getting map with required controls but it is not centered. Point is toward more north west than center of tab. So I have to drag the map to bring the point to center of Tab.
Tab panel code
var infoPanel = new Ext.tab.Panel({
id: 'guestTabPan',
xtype: 'tabpanel',
title: 'Site Information',
autoDestroy: false,
items:[
{
id: 'siteTab',
title:'Site',
items:[
....
]
},{
title: 'Pressure',
id: 'pressureTab',
items:[
.....
]
},{
title: 'Map',
id: 'mapTab',
items:[
{
xtype: "panel",
id: 'mapTabPanel',
height: 1000,
layout: 'fit',
items:[
]
}
]
}
]
});
Map code
var smallGoogleMap = {xtype: 'gmappanel',id :'gSmallSiteMap',width:'100%',height:1000,
zoomLevel:10,
gmapType: 'map',
mapConfOpts: ['enableScrollWheelZoom','enableDoubleClickZoom','enableDragging'],
mapControls: ['GSmallMapControl','GMapTypeControl','NonExistantControl'],
setCenter: {
lat: SiteLat,
lng: SiteLng,
marker:{ title: SiteTitle}
}
};
Ext.getCmp('mapTabPanel').add(smallGoogleMap);
any guess?
If you call this.getMap().setcenter of GMapPanel.js on activation of the tab that helps centered your map. It works for me. Now setCenter is not the separate method at least not the js file I have so, I added center point of map on activate event of Map Tab as below,