How to use Map as a part of the page in Sencha touch framework?

[easwaramoorthy]

I am using the Sencha Touch framework for the development of my iPad application.
I am in need of using Map as a part of the screen(say half a page). When I try to do put a map component into my page, its covering the full page overlapping the previous components.
Please share your suggestions.
Thanks in advance,
Easwar

[mitchellsimoens]

Sencha Touch 1 or Sencha Touch 2?

[easwaramoorthy]

Hi, Thanks for your reply. I am doing with sencha touch 1. Actually can you say how to place a map on the page, as a part of it.

[sissonb]

My guess is that you have the fullscreen property attached to the map component.

Here is a simple example that shows 2 maps each taking up 50% of the container.

Ext.setup({
            onReady: function() {
                new Ext.Panel({
                    layout:'hbox',
                    fullscreen:true,
                    items:[
                        {
                            xtype:'map',
                            flex:1
                        },
                        {
                            xtype:'map',
                            flex:1
                        }
                    ]
                });
            }
        });

change hbox to vbox if you want to stack the components.