“图表”无法同时将X轴和Y轴都指定为类型:值

问题描述

我使用Apache Echarts,但在使用类型时遇到问题:“值”在X轴的情况下有效。

我的代码You can try here

option = {
xAxis: {
    type: 'value',data: [1.12,2.19,3.84,3.47,5.75,6.76,9.141],},yAxis: {
    type: 'value'
},series: [{
    data: [820,932,901,934,1290,1330,1320],type: 'line'
}]

};

根据api文档

xAxis。输入

“类别”类别轴,适用于离散的类别数据。

“值”数字轴,适用于连续数据。

X-axis type: documentation

当我使用“类别”作为类型时:对于x轴,它给了我期望的曲线,但是x轴的间距不均匀。

Expected curve type with improper x-axis spacing corresponding to values

但是我必须绘制传感器的大约10,000点连续数据,就像x轴数据一样。 API建议对此类数据使用xAxis.type:'value'。 当我设置xAxis.type:'value'时,渲染看起来像这样。

Unexpected result

如果有人可以帮助我并告诉我我哪里出问题了或者这是一个实际的错误,那就太好了。

解决方法

当两种轴类型均为值时,数据应采用以下格式,以便正确映射x和y值。

data = [
        [1.12,820],[2.19,932],[3.84,901],//xaxis value is not in order
        [3.47,934],//xaxis value is not in order
        [5.75,1290],[6.76,1330],[9.141,1320]
    ];

如果轴值不按顺序排列,则可以对其进行排序以相应显示。

//sort data by xaxis values to plot the values in order
data.sort(function(a,b){return a[0] - b[0]}) 

然后将数据设置为图表

option = {
        xAxis: {
            type: 'value',},yAxis: {
            type: 'value'
        },series: [{
            data: data,type: 'line'
        }]
    };

Echarts with value type axis