Question

我正在试图生成包含动态数据的图表。

MODEL

Ext.define('App.mdlGraficaDE', {
    extend: 'Ext.data.Model',
    fields: [
    ]   
});

商品

Ext.define('App.strGraficaDE', {
    extend: 'Ext.data.Store',
    model:  'App.mdlGraficaDE',
    autoLoad: false,
    proxy: {
        type: 'ajax', 
        api: {
            read: './data/php/Tmc_GraficaDE.php'
        },
        reader: {
                    type: 'json',
                    root: 'data',
                    totalProperty: 'total'
        }
    }
});

查看对象视图

var almacenGraficaDE = Ext.create('App.strGraficaDE');
var graficaDE = Ext.create('Ext.chart.Chart',{
    style: 'background:#fff',
    itemId:'graficaDE',
    margin:'10 10 10 10',
    animate: true,
    shadow: true,
    store: almacenGraficaDE,
    legend: {
        position: 'right'
    },
    axes:[
          {
              type:'Category',
              position:'bottom',
              fields:['Referencia'],
              title: 'Referencia'
          },
          {
              type:'Numeric',
              position:'left',
              fields:[],
              minimum:0,
              grid:true,
              title:'Precio Unitario'
          }
    ],
    series:[
            {
                type: 'column',
                axis: 'bottom',
                xField:'',
                yfield:[]
            }
    ]
});

我希望获得类似下一张图片的内容：

但是我不知道我必须以什么方式从php返回数据，如果我需要在store.load动作的回调部分进行一些配置来配置带有接收数据的图表的axys和系列

Answer 1

图片中显示的分组图表无法生成，但Extjs提供了堆积的条形图，我认为这符合您的要求
对于php中的数据，只需在下面的小提琴中获取数据并管理轴并存储fiels
Try this fiddle

Extjs 4.2使用动态数据对条形图进行分组

1 个答案: