Extjs Ext.Window.Window中的地图未完全显示

我创建了扩展的Ext.Panel.Panel组件，其中包含通过openlayers显示的地图，该组件位于Ext.Window.Window中。 但在加载页面后，地图仅部分显示：

app.js：

Ext.application(
{
    requires: ['Ext.container.Viewport'],
    name: 'MA',
    appFolder: 'app',
    controllers:
        [
            'Map'
        ],
    launch: function()
    {
        Ext.create('Ext.window.Window',
            {
                layout:
                {
                    type: 'vbox'
                },
                items:
                    [
                        {
                            xtype: 'openlayerspanel'
                        },
                        {
                            xtype: 'button',
                            text: 'Load',
                        }
                    ]
            }).show();
    }
});

调整浏览器大小时，贴图将刷新并正常显示。

---

有什么办法可以让它工作？

如果除了调整大小外没有其他方法可以工作，请尝试以编程方式调整大小：

//inside window listeners
show: function(){
  this.setWidth(this.getWidth() + 1); // or height
}

或使用“定义映射-在显示窗口后创建映射”的超时： 不是afterrender，而是show

show: function(){
  setTimeout(function(){
    // init map here
    }, 100)
}

或使用以下代码：

function ShowMapWindow() {
    Ext.create('Ext.window.Window', {
        width: 400,
        height: 300,
        items: [{
            loader: {
                loadMask: { showMask: true },
                renderer: 'frame',
                url: 'http://www.openstreetmap.org/export/embed.html?bbox=37.314,55.568,38.031,55.927&layer=mapnik'
            }
        }],
        layout: "fit",
        listeners: {
            close: function () {
                this.remove(true);
            }
        },
        modal: true
    }).show();
}

---

如果先缩放（），然后再缩放（）。或者将初始缩放设置为11，然后在地图居中后调用zoomIn（）。

我正面临着这个问题，而第一个解决方案的人使用了精美的屏幕截图是错误的。这与调整大小完全无关，因为如果您使用谷歌地图而不是OSM，它将非常有效。问题在于缺少贴图属性，如SRS、BBOX等。。检查OpenLayers属性的文档，它将起作用。

如果调整Ext.Window.Window的大小-地图无更改，如果调整浏览器的大小-地图刷新。但是$（window）.resize（）映射也不会改变。

function ShowMapWindow() {
    Ext.create('Ext.window.Window', {
        width: 400,
        height: 300,
        items: [{
            loader: {
                loadMask: { showMask: true },
                renderer: 'frame',
                url: 'http://www.openstreetmap.org/export/embed.html?bbox=37.314,55.568,38.031,55.927&layer=mapnik'
            }
        }],
        layout: "fit",
        listeners: {
            close: function () {
                this.remove(true);
            }
        },
        modal: true
    }).show();
}