OpenLayers + GeoExt2: Karte in div anzeigen

Hallo Leute!

Ich bin momentan dabei OpenLayers und geoext2 zu kombinieren.

Ich bekomme auch schon eine Karte angezeigt, die jedoch nicht im div liegt. Ich kann die Karte auch nur außerhalb des div’s “anfassen” und panen. Die controls funktionieren auch nicht:(

Kann mir evt. jemand auf die Sprünge helfen.

Hier der Code:

Die loader.js wird im head geladen.

<div id="mapdiv"> 
 <script  type="text/javascript"> 

Ext.require([
   'Ext.container.Viewport',
   'Ext.window.MessageBox',
   'GeoExt.panel.Map'
			]);



Ext.application({
	name: 'Beispielkarte',
	launch: function(){
            var mappanel = Ext.create('GeoExt.panel.Map', {
            title: 'Beispiel-Map',
            map: [ new OpenLayers.Map('mapdiv', {
		projection: "EPSG:3857",
		controls: [
		new OpenLayers.Control.Attribution(),
		new OpenLayers.Control.PanZoomBar(),
		new OpenLayers.Control.MousePosition(),
		new OpenLayers.Control.Navigation(),
		new OpenLayers.Control.LayerSwitcher(),
		new OpenLayers.Control.ScaleLine({className: 'ol-scale-line'}),
		new OpenLayers.Control.OverviewMap(),
           ],
		numZoomLevels: 30
		})],
	        id: 'mapdiv',
		renderTo: 'mapdiv',
		width:870,
		height:740,
		layers: [new OpenLayers.Layer.OSM()],
		center: [10, 54],
		zoom: 7
		
        });

                  Ext.create('Ext.container.Viewport', {
                  layout: 'fit',
                  items: [mappanel]
        });

					}
			});

</script>
</div>

Gruss Stefan

Ich habe keine Ahnung von geoext2, darum nur mal so geraten: Verwendest Du “mapdiv” zu oft? Das ist die ID deines divs, aber auch die ID des mappanel.

Ich rate auch mal mit: Könnte daran liegen, daß Deine div keine Größe hat. Versuchs mal mit einem style mit absoluter Positionierung und ein paar festen Angaben in px an der div.

bye, Nop