Adding OverviewMap Make The Map hidden

[zkrami]

Hi I'm a bit new to geoext3
I saw the example of making OverviewMap and I tried to make one like it
but whenever I add the overviewmap the main map disappear
here's my code
(the sample is working fine on my device)

Ext.require([
    'GeoExt.component.Map',
    'Ext.panel.Panel',
    'Ext.Viewport' , 
    'GeoExt.component.OverviewMap'
]);

var olMap;
var mapComponent;
var mapPanel;

Ext.application({
    name: 'MapComponent',
    launch: function() {
        var description;
       
        var projection = new ol.proj.Projection({
            code: 'urn:x-ogc:def:crs:EPSG:2000',
            units: 'm',
            axisOrientation: 'neu',
            global: false
        });

        olMap = new ol.Map({
            layers: [
                new ol.layer.Image({
                    source: new ol.source.ImageWMS({
                        ratio: 1,
                        url: 'http://localhost:8080/geoserver/wms',
                        params: {
                            'FORMAT': 'image/png',
                            'VERSION': '1.1.1',
                            STYLES: '',
                            LAYERS: 'Syria'
                        }  
                    })
                })
            ],
            view: new ol.View({
                projection: projection
            })
        });
        
        mapComponent = Ext.create('GeoExt.component.Map', {
            map: olMap
        });

        mapPanel = Ext.create('Ext.panel.Panel', {
            title: 'GeoExt.component.Map Example',
            region: 'center',
            layout: 'fit',
            border:false ,            
            items: [mapComponent]
        });

        description = Ext.create('Ext.panel.Panel', {
            contentEl: 'description',
            title: 'Description',
            region: 'east',
            width: 300,
            border: true,
            bodyPadding: 5
        });
        
      var overviewMap = Ext.create('GeoExt.component.OverviewMap', {
            parentMap: olMap
        });
        
        var ovMapPanel1 = Ext.create('Ext.panel.Panel', {
            title: 'OverviewMap (default)',
            flex: 1,
            layout: 'fit',
            items: overviewMap
        });
        
        Ext.create('Ext.Viewport', {
            layout: 'border',
            items: [
                mapPanel ,
                {
                    xtype: 'panel',
                    region: 'east',
                    width: 400,
                    border: false,
                    layout: {
                        type: 'vbox',
                        align: 'stretch'
                    },
                    items: [
                        description 
                  //      ,ovMapPanel1 
                        
                        
                    ]
                }
            ]
        });
        
        var bounds = [-50, -50,
                50, 50];
       olMap.getView().fit(bounds, olMap.getSize());
    }
});

[marcjansen]

Does the mapPanel alone render?

[zkrami]

Actually I don't know , how can I check that ?

[marcjansen]

Try this:

        Ext.create('Ext.Viewport', {
            layout: 'border',
            items: [
                mapPanel 
            ]
        });

[chrismayer]

Any news on this?

[marcjansen]

Closing due to inactivity.