extjs图表问题答案

【问题标题】：extjs chart problemextjs图表问题
【发布时间】：2010-09-29 10:06:07
【问题描述】：

我在浏览器中使用ext做图表，遇到一个问题：

我想在一张图表中画两条线，所以我使用了ColumnChart，这是我的数据：

var store = new Ext.data.JsonStore({
    fields:['name', 'visits', 'views'],
    data: [
        {name:'Jul 07', visits: 245, views: 3000000},
        {name:'Aug 07', visits: 240, views: 3500000},
        {name:'Sep 07', visits: 355, views: 4000000},
        {name:'Oct 07', visits: 375, views: 4200000},
        {name:'Nov 07', visits: 490, views: 4500000},
        {name:'Dec 07', visits: 495, views: 5800000},
        {name:'Jan 08', visits: 520, views: 6000000},
        {name:'Feb 08', visits: 620, views: 7500000}
    ]
});

因为访问数据远低于浏览量。

所以代表访问的线离xaxis太近了，有什么想法吗？

感谢您的回复，我决定将它们设为相同的比例。 BTW，我还有一个问题，希望你能给点建议：

【问题讨论】：

标签： extjs charts

【解决方案1】：

要在 ExtJs4 中创建具有不同比例的 yAxis，您可以使用左右轴。

xtype: 'chart',
width: 400,
height: 300,
store: myStore,
axes: [
    {
        //title: 'Size',
        type: 'Numeric',
        position: 'left',
        fields: ['sizeInBytes'],
        minimum: 0
    },{ /// NEW yAxis Scale ///
        //title: 'Run Time',
        type: 'Numeric',
        position: 'right',
        fields: ['runTimeMin'],
        minimum: 0
    },{
        //title: 'Date',
        type: 'Time',
        position: 'bottom',
        fields: ['startTime'],
        dateFormat: 'm/d/y h:i A'
    }
],
series: [
    {
        type: 'column',
        axis: 'left',
        xField: 'startTime',
        yField: 'sizeInBytes'
    },{ /// Specify the Axis and data field to use ///
        type: 'line',
        axis: 'right',// <----
        xField: 'startTime',
        yField: 'runTimeMin' // <----
    }
]

【讨论】：

【解决方案2】：

据我所知，有两种选择： 1.添加第二个Y轴，具有不同的比例 2.缩小较大的值

ExtJS 图表 - 据我所知 - 不提供添加第二个轴的功能，尽管有解决方法（请参阅 http://www.sencha.com/forum/showthread.php?72557-Ext-JS-Charts-Second-Y-Axis-Scale）

因此，最简单的方法是将较大的值简单地除以 10,000 以使两个刻度内联，然后记下它们以千为单位。

【讨论】：