Question

当我尝试创建分散extjs图表时，我遇到了这样一个问题：类别轴名称未分组（具有相同名称的数组元素不会被视为相同）。看起来图表试图将其绘制为数学函数（每个x只有一个y元素）但我故意选择散点图来避免它。

试图在google中找到anser，但我发现的唯一结果就是接受......

这是代码：

window.store_direct = Ext.create('Ext.data.JsonStore', {
fields: ['id','line','bidder','data0','data1','data2','data3'],
data: [
{'line':1000.00,'id':0,'bidder':'Пок','data0':1000.00},

{'line':800.00,'id':1,'bidder':'Пок','data0':800.00},

{'line':950.00,'id':0,'bidder':'Брг','data1':950.00},

{'line':599.00,'id':1,'bidder':'Брг','data1':599.00},

{'line':1.00,'id':2,'bidder':'Брг','data1':1.00},

{'line':500.00,'id':0,'bidder':'КВВ','data2':500.00},

{'line':900.00,'id':0,'bidder':'Buy4','data3':900.00},

{'line':600.00,'id':1,'bidder':'Buy4','data3':600.00}
],

}）;

var chart = function () {
var win = Ext.create('Ext.Window', {
    renderTo: Ext.getBody(),
    width: 500,
    height: 300,
    animate: true,
    hidden: false,
    maximizable: true,
    title: 'Процесс торгов',
    layout: 'fit',
    items:{xtype: 'chart',style: 'background:#fff;',animate: true,store: store_direct,shadow: true,legend: {position: 'right'},
    axes: [{
        type: 'Numeric',
        position: 'left',
        fields: ['data0','data1','data2','data3'],
        label: {
            renderer: Ext.util.Format.numberRenderer('0,0')
        },
        title: 'Sample Values',
        grid: true,
        minimum: 0
    }, {
        type: 'Category',
        position: 'bottom',
        fields: ['bidder'],
        title: 'Sample Metrics'
    }],
    series: [
     {
        type: 'Scatter',
        highlight: {size: 7,radius: 7},
        axis: 'left',
        xField: 'bidder',
        yField: 'data0',
        markerConfig: {type: 'cross',size: 4,radius: 4,'stroke-width': 0}
    }
    , {
        type: 'Scatter',
        highlight: {size: 7,radius: 7},
        axis: 'left',
        xField: 'bidder',
        yField: 'data1',
        markerConfig: {type: 'cross',size: 4,radius: 4,'stroke-width': 0}
    }
    , {
        type: 'Scatter',
        highlight: {size: 7,radius: 7},
        axis: 'left',
        xField: 'bidder',
        yField: 'data2',
        markerConfig: {type: 'cross',size: 4,radius: 4,'stroke-width': 0}
    }
    , {
        type: 'Scatter',
        highlight: {size: 7,radius: 7},
        axis: 'left',
        xField: 'bidder',
        yField: 'data3',
        markerConfig: {type: 'cross',size: 4,radius: 4,'stroke-width': 0}
    }
             ]
    }
});

}

Answer 1

Ext JS chart的术语有点具体;在这种情况下，您需要配置您的系列。图表有一些很好的例子，请看一下：http://docs.sencha.com/ext-js/4-1/#!/example

Extjs 4类别轴分组

1 个答案: