0

我试图将数字 y 轴显示为整数......没有运气，总是显示小数。

如果你找到了一种方法来回复我，请回复我。您可以在这里找到代码以便于测试：http: //jsfiddle.net/adriansky/4uY7H/

var store1 = Ext.create('Ext.data.Store', {
    fields: ['name', {name: 'people', type: 'integer' }],
    data:[
        {"name":"jan",  "people":13},
        {"name":"feb",  "people":12},
        {"name":"mar",  "people":12},
        {"name":"apr",  "people":13},
        {"name":"may",  "people":12},
        {"name":"june", "people":13}
    ]
});

var chart = Ext.create('Ext.chart.Chart', {
    renderTo: Ext.getBody(),
    width: '80%',
    height: '80%',
    store: store1,
    axes: [{
        type: 'Numeric',
        position: 'left',
        fields: ['people'],
    }, {
        type: 'Category',
        position: 'bottom',
        fields: ['name'],
    }],
    series: [{
        type: 'line',
        axis: 'left',
        xField: 'name',
        yField: 'people',
    }]
});
4

4 回答 4

0

我做了这个，花了我一段时间

您必须重新定义整个 y 轴，重新计算主要单位等。

假设您的图表名为 monkeyChart，

建立图表后，只需调用 monkeyChart.setYAxis(..)

monkeyChart.setYAxis(createNumericAxis(min, max, optCfg));



createNumericAxis: function(start, end, optCfg) {
    var cfg = {
        majorUnit: calculateMajorUnit(start, end)
    };
    Ext.apply(cfg, optCfg)
    return new Ext.chart.NumericAxis(cfg);
},

calculateMajorUnit: function(min, max){
    if(min == undefined) min = 0;
    if(max == undefined) max = 20;
    var dif = max - min;
    var interval = dif / 20;
    var intervals = [1,2,5,10,20,50,100,200,500];
    for (var i = 0; i < intervals.length; i++) {
        if(interval <= intervals[i]){
            interval = intervals[i];
            break;
        }
    }
    return interval;
},

当然，您必须根据需要调整数字，例如您想要查看的间隔（我这样做是为了根据值有不同的密度）

另外，如果您不知道 min 和 max 之前，您可以为两者传递 undefined ，并将一个空对象作为 optCfg

试试看，我很久以前写的我现在可能错过了一些东西

于 2013-10-25T16:43:00.040 回答
0

我之前的回答是针对 ext js 3.4

在你的情况下，如果你同时使用

majorTickSteps: 1,
minimum: 0,

似乎工作

http://jsfiddle.net/alezx/vu5pL/

于 2013-11-05T09:25:13.057 回答
0

尝试在您的Numeric轴上添加以下内容：

label: {
    renderer: function (v) {
        return v.toFixed(0); 
    }
}

然后，您还可以为该轴添加最小和最大配置。例子：

minimum : 0

或在控制器上：

myChart.axes.items[0].maximum = NaN;
myChart.axes.items[0].minimum = 0;

值取决于您的数据或您的显示偏好。

于 2013-10-25T01:15:53.383 回答
-1

你可以试试这个：

http://jsfiddle.net/4uY7H/2/

axes: [{
    type: 'Numeric',
    position: 'left',
    fields: ['people'],
    decimals: 0,
    majorTickSteps: 1,
}, {
    type: 'Category',
    position: 'bottom',
    fields: ['name'],
}],

检查 Ext.chart.axis.Numeric 和 Ext.chart.axis.Axis 的文档

http://docs.sencha.com/extjs/4.2.2/#!/api/Ext.chart.axis.Axis

于 2013-10-25T01:14:32.113 回答