这张图有什么问题？

Question

我有以下代码来制作图表。但图表显示错误。

这是代码

Ext.onReady(function(){
Ext.define('FinancialRatio',{
    extend: 'Ext.data.Model',
    fields: ['year','revenue']
});

var FinancialRatioStore = Ext.create('Ext.data.Store',{
    model: 'FinancialRatio',
    autoLoad:true,
    proxy:{
        type: 'ajax',
        url: 'http://localhost/FinancialRatio.php',
        reader:{
            type: 'xml',
            record: 'ratio'
        }
    }
});

var revenue = Ext.create('Ext.Window',{
    width: 400,
    height:300,
    renderTo: Ext.getBody(),
    hidden: false,
    maximizable: true,
    title: 'Revenue',
    layout: 'fit',
    items:{
        xtype: 'chart',
        style: 'background:#fff',
        store: FinancialRatioStore,
        animate: true,
        axes:[{
            title: 'Revenue',
            type: 'Numeric',
            position: 'left',
            fields: ['revenue']
        },{
            title: 'Year',
            type: 'Category',
            position: 'bottom',
            fields: ['year']

        }],
        series:[{
            type: 'line',
            xField: 'year',
            yField: 'revenue'

        }]
    }

});

这是结果

但实际数据如下（我写了网格代码来显示这些数据）

根据数据，图表显示错误。但我无法弄清楚我做错了什么。你能帮帮我吗？

另外，轴上的“字段”和串联的“xfield”和“yfield”之间有什么区别？

谢谢

Answer 1

我猜这个问题是因为你没有在你的模型中设置字段类型。试试这个：

Ext.define('FinancialRatio',{
    extend: 'Ext.data.Model',
    fields: ['year', //when no type specified, it defaults to 'string'
    {
       name: 'revenue',
       type: 'int'
    }]
});

轴可以包含许多字段，以便您可以针对它们绘制多个系列。例如，如果您想绘制收入和利润，您可能希望拥有轴字段['revenue', 'profit']，并且您将定义多个系列：

series: [{
   type: 'line',
   xField: 'year',
   yField: 'revenue'
}, {
   type: 'line',
   xField: 'year',
   yField: 'profit'
}]