Hello there, I'm new to Sencha Touch and I'm trying hard to get my first app working

There's one problem driving me mad, hope you can help me!! Here's what happens:

My app has a TabPanel, containing 4 tabs. In one of them I need to display an image representing a map of a campus, which needs to be panned/scrolled around by the user.
I would like the map to appear centered within its container Panel, instead of appearing sticked to the bottom left corner. I searched the forum for some advice: found something but it isn't working for me...

mapp.views.Map = new Ext.Panel({
   layout: "fit",
         scroll: 'both',
         width: 1000,
         height: 792,
         html:'<img src="img/map.png" width="1000" height="792" border="0" usemap="#Map" />',
               afterrender: function(thisPanel) {
                  var d = thisPanel.body.dom;
                  d.scrollTop = (d.scrollHeight - d.offsetHeight)/2;							
I also tried to bind the "scroll" event on the map Panel to track down the "scrollTop" value of that panel, but it always remains 0.
What am I doing wrong?

Thanks for your help!