javascript - 使用 json 文件中的 extjs 绘制饼图

Question

我已经通过ajax调用成功地使用带有json值的extjs绘制了一个饼图。但我无法通过从名为myjson.json的 json 文件中检索 json 值来绘制相同的方法，

谁能告诉我如何通过使用以下代码从 json 文件（ myjson.json ）中检索 json 值来绘制饼图

我的代码如下

Ext.onReady(function() { 
    var getResources,getResources1;
    var flag=0;
    Ext.Ajax.request({
        dataType : "json",
        url: 'getHSEXmatrix.action',
        params: {
        },
        success: function(response){
         getResources = Ext.decode(response.responseText);
        createChart3(getResources);
     }
    });


var createChart3 = function(resources) {
    var store = Ext.create('Ext.data.JsonStore', {
       fields: ['name', 'data'],
       data: resources
    });
    Ext.create('Ext.chart.Chart', {
        renderTo: 'myExample3',
        width: 500,
        height: 300,
        animate: true,
        store: store,
        axes: [{
            type: 'Numeric',
            position: 'bottom',
            fields: ['data'],
            label: {
                renderer: Ext.util.Format.numberRenderer('0,0')
            },
            title: 'No of actions',
            grid: true,
            minimum: 0
        }, {
            type: 'Category',
            position: 'left',
            fields: ['name'],
            title: 'Exclation Matrix'
        }],
        series: [{
            type: 'bar',
            axis: 'bottom',
            highlight: true,
            tips: {
                trackMouse: true,
                width: 140,
                height: 28,
                renderer: function (storeItem, item) {
                    this.setTitle(storeItem.get('name') + ': ' + storeItem.get('data') + ' views');
                }
            },
            label: {
                display: 'insideEnd',
                field: 'data',
                renderer: Ext.util.Format.numberRenderer('0'),
                orientation: 'horizontal',
                color: '#333',
                'text-anchor': 'middle'
            },
            xField: 'name',
            yField: 'data'
        }]
    });
}
});

Answer 1

看看这些东西https://stackoverflow.com/questions/10203872/cant-get-json-datastore-into-extjs-sencha-touch-chart-displays-error-cannot

1. 在 Web 服务器上运行示例，因为从文件系统加载 JSON 文件有时会导致问题。

2. 如下构造json数据

   {
       "data": [
           {
               "School": "Dukes",
               "wins": "3"
           },
           {
               "School": "Emmaus",
               "wins": "10"
           },
           {
               "School": "Maryland",
               "wins": "5"
           },
           {
               "School": "Virginia",
               "wins": "2"
           }
       ]
   }
   

3. 使用以下数据存储

   window.store1 = new Ext.data.Store({
       model: 'Details',
       proxy: {
           type: 'ajax',
           url: 'GetDataset.json',
           reader: {
               root: 'data',
               type: 'json'
           }
       },
       autoLoad: true
   });