2014-09-30 44 views
0

我想繪製兩個系列和兩個Y軸 的柱形圖,但它在右側顯示四個標題。我期望顯示兩個標題數據和數據2。
請幫我解決這個問題帶2個Y軸和標題的ExtJS柱形圖

類似的東西: http://jsfiddle.net/7sstvj84

Ext.onReady(function() { 
    var store = Ext.create('Ext.data.JsonStore', { 
     fields: ['name', 'data','data2'], 
     data: [{ 
      'name': 'metric one', 
      'data': 20, 
      'data2': 2 
     }, { 
      'name': 'metric two', 
      'data': 7, 
      'data2': 20 
     }, { 
      'name': 'metric three', 
      'data': 5, 
      'data2': 17 
     }] 
    }); 

    Ext.create('Ext.chart.Chart', { 
     renderTo: Ext.getBody(), 
     width: 500, 
     height:300, 
     animate: true, 
     store: store, 
     legend: { 
       position: 'right' 
      }, 
     axes: [{ 
      type: 'Numeric', 
      position: 'left', 
      fields: ['data'], 
      title: true, 
      title: 'Sample Values', 
      grid: true, 
      minimum: 0 
     }, { 
      type: 'Numeric', 
      position: 'right', 
      fields: ['data2'], 
      title: true, 
      title: 'Values', 
      grid: false, 
      minimum: 0 
     },{ 
      type: 'Category', 
      position: 'bottom', 
      fields: ['name'], 
      title: 'Sample Metrics' 
     }], 
     series: [{ 
      type: 'column', 
      axis: 'left', 
      highlight: true, 
      xField: 'name', 
      yField: ['data','name'] 
     },{ 
      type: 'column', 
      axis: 'right', 
      highlight: true, 
      xField: 'name', 
      yField: ['name','data2'] 
     }] 
    }); 
}); 

回答

0

看起來缺少必要的文件!

Ext.require([ 
     'Ext.data.JsonStore', 
'Ext.chart.Chart', 
'Ext.chart.series.Column', 
'Ext.chart.axis.Numeric', 
'Ext.chart.axis.Category' 
    ]); 

我想你的代碼,並只包括上面的代碼,使其工作。 如果您要在Web應用程序中使用代碼,您可以考慮創建一個類並設置您的名稱空間。