Sencha觸控圖表無法渲染

我對sencha觸控和sencha觸控圖表頗爲陌生，在我的一個觀點中，我有一點小小的麻煩。我可能在這裏錯過了很明顯的東西。這裏是我如何設置chart變量。Sencha觸控圖表無法渲染

var chart2 = new Ext.chart.Chart({ 
    width: 500, 
    height: 300, 
    animate: true, 
    store: testStore, 
    theme: 'Base:gradients', 
    series: [{ 
     type: 'pie', 
     angleField: 'data1', 
     label: { 
      field: 'name', 
      display: 'rotate', 
      contrast: true, 
      font: '18px Arial' 
     } 
    }] 
});

一個簡單的餅圖加載其數據存儲從

var testStore = new Ext.data.JsonStore({ 
fields: ['name', 'data1', 'data2', 'data3', 'data4', 'data5'], 
data: [ 
    {'name':'metric one', 'data1':10, 'data2':12, 'data3':14, 'data4':8, 'data5':13}, 
    {'name':'metric two', 'data1':7, 'data2':8, 'data3':16, 'data4':10, 'data5':3}, 
    {'name':'metric three', 'data1':5, 'data2':2, 'data3':14, 'data4':12, 'data5':7}, 
    {'name':'metric four', 'data1':2, 'data2':14, 'data3':6, 'data4':1, 'data5':23}, 
    {'name':'metric five', 'data1':27, 'data2':38, 'data3':36, 'data4':13, 'data5':33} 
] 
});

這裏是我的ChartViewPanel

SS.views.chartView = Ext.extend(Ext.Panel, { 

fullscreen: true, 
initComponent: function() { 

    console.log("Initializing Chart View"); 

    this.refreshButton = new Ext.Button({ 
     text: 'Refresh', 
     ui: 'action', 
     handler: function() { 
      console.log("Refresh button is clicked"); 
     }, 
     scope: this 
    }); 

    this.topToolbar = new Ext.Toolbar({ 
     title: 'Chart View', 
     items: [ 
      { xtype: 'spacer'}, 
      this.refreshButton 
     ] 
    }); 

    this.dockedItems = [this.topToolbar]; 

    this.items = [chart2]; 

    console.log(chart); 

    SS.views.chartView.superclass.initComponent.call(this); 
} 
});

頂欄被渲染，但不圖表。 javascript控制檯也不會顯示任何錯誤。我哪一點錯了？非常感謝

來源

2011-11-29 Kaung Htet Zaw