Sencha Touch的谷歌地圖

Question

我想在我的Sencha Touch應用程序中擁有地圖。我在index.html中加載了腳本，我可以看到它處於活動狀態，因爲瀏覽器正在查找我的實際位置。

問題是，所有從視圖加載，但我可以看到沒有地圖。

我的看法是這樣的：

Ext.define('RMA-App.view.ActivityMap', { 
    extend: 'Ext.form.Panel', 
    alias: 'widget.activitymap', 

    initialize: function() { 
     this.callParent(arguments); 

     var backButton = { 
      xtype: 'button', 
      ui: 'back', 
      text: 'Zurück', 
      handler: this.onBackButtonTap, 
      scope: this 
     }; 

     var topToolbar = { 
      xtype: 'toolbar', 
      docked: 'top', 
      title: 'Ort der Aktivität', 
      items: [ 
       backButton, 
       { 
        xtype: 'spacer' 
       } 
      ] 
     }; 

     var map = { 
      xtype: 'map', 
      useCurrentLocation: true 
     }; 

     this.add([ 
      topToolbar, 
      map 
     ]); 
    }, 

    onBackButtonTap: function() { 
     console.log('backToActivityEditorCommand'); 
     this.fireEvent('backToActivityEditorCommand', this); 
    } 
}); 

Answer 1

嘗試給一個佈局的父容器。根據我的經驗，視圖上的默認佈局不能正確地將地圖渲染爲小孩。

Ext.define('RMA-App.view.ActivityMap', { 
    extend: 'Ext.form.Panel', 
    alias: 'widget.activitymap', 
    config: { 
     layout: { 
      type: 'fit' 
     } 
    }, 

    ... 

順便說一句，請注意Ext.map從Ext.container繼承，所以，如果你正在做的是增加一個工具欄，你可以把它添加到地圖容器本身並刪除嵌套的水平。