Extjs圖表挑選錯誤的商店？

Question

我想繪製兩個並排的圖表，通過傳遞不同的參數來使用相同的商店，但兩個圖表都使用第二商店的價值。我可以在Chrome控制檯中看到響應，這對兩個請求和不同的響應是正確的;下面是我的代碼。

Ext.define('testUtility.view.BarChart', { 
    extend: 'Ext.chart.Chart', 
    alias: 'widget.barChart', 
    renderTo: Ext.getBody(), 
    store: Ext.create('Ext.data.Store', { 
    fields: ['name', 'data'], 
    autoLoad: false, 
    proxy: { 
     type: 'ajax', 
     url: 'data/store1', 
     reader: { 
     type: 'json', 
     root: 'Data' 
     }, 
     filterParam: undefined, 
     groupParam: undefined, 
     pageParam: undefined, 
     startParam: undefined, 
     sortParam: undefined, 
     limitParam: undefined 
    } 
    }), 
    axes: [{ 
    type: 'Numeric', 
    position: 'left', 
    fields: ['data'], 
    label: { 
     renderer: Ext.util.Format.numberRenderer('0,0') 
    }, 
    title: 'Values', 
    grid: true, 
    minimum: 0 
    }, { 
    type: 'Category', 
    position: 'bottom', 
    fields: ['name'], 
    title: 'Master' 
    }], 
    series: [{ 
    type: 'column', 
    axis: 'left', 
    highlight: true, 
    tips: { 
     trackMouse: true, 
     width: 100, 
     height: 28, 
     renderer: function(storeItem, item) { 
     this.setTitle(storeItem.get('name') + ': ' + storeItem.get('data') + ' $'); 
     } 
    }, 
    label: { 
     display: 'insideEnd', 
     'text-anchor': 'middle', 
     field: 'data', 
     renderer: Ext.util.Format.numberRenderer('0'), 
     orientation: 'vertical', 
     color: '#333' 
    }, 
    xField: 'name', 
    yField: 'data' 
    }] 
}); 

從取其以後加載存儲app.js

Ext.application({ 
    requires: [ 
    'Ext.container.Viewport' 
    ], 

    name: 'BAR Chart ', 
    launch: function() { 

    var chart1 = Ext.create('testUtility.view.BarChart', { 
     id: 'chart1', 
     height: 300, 
     width: '50%' 
    }); 

    var store1 = chart1.getStore(); 
    store1.proxy.extraParams = { 
     id: chart1.id 
    }; 
    store1.load(); 
    var chart2 = Ext.create('testUtility.view.BarChart', { 
     id: 'chart2', 
     height: 300, 
     width: '50%' 
    }); 

    var store2 = chart2.getStore(); 
    store2.proxy.extraParams = { 
     id: chart2.id 
    }; 
    store2.load(); 
    } 
}); 

這兩個圖表顯示數據。

Answer 1

當您在自己的定義中給他們打電話時，兩個商店都是同一個商店。

var chart1 = Ext.create('testUtility.view.BarChart', { 
    id: 'chart1', 
    height: 300, 
    width: '50%', 
    store: store1 
}); 

這是很好的做法，定義自己的店：

Ext.define('testUtility.store.BarChart', { 
    extend: 'Ext.data.Store', 
    ... 
}); 

然後的第一部分之前只用它創建類的，像這樣的情況時，你應該叫商店代碼：

var store1 = Ext.create('testUtility.store.BarChart', { options }); 

您的options包括extraparams，2店的不同。