如何在TIME类型中设置xAxis并在Echarts中格式化为{hh:mm}?

时间:2016-08-31 09:27:02

标签: echarts

我想在TIME类型中设置xAxis,格式为{hh:mm},例如17:45。

在此demo中,配置有效:

xAxis: {
    type: "time",
},

value: [
    [now.getFullYear(), now.getMonth() + 1, now.getDate()].join('/'),
    Math.round(value)
]

但是这失败了,这是Echarts画廊中的my demo

xAxis: {
    type: "time",
},

value: [
    [now.getHours(), now.getMinutes()].join(":"),
    Math.round(value)
]

我尝试了type: "value",仍然无法正常工作。

3 个答案:

答案 0 :(得分:2)

使用xAxis.axisLabel.formatter。这可以是格式化程序字符串或函数。

将此作为参考:https://ecomfe.github.io/echarts-doc/public/en/option.html#xAxis.axisLabel.formatter

答案 1 :(得分:2)

我让您的演示工作了。 我这样更改了value

value: [
    [now.getFullYear(), now.getMonth() + 1, now.getDate()].join('/') + 'T' +
    [now.getHours(), now.getMinutes()].join(':'),
    Math.round(value)
]

请查看此屏幕截图:

Fixed image

答案 2 :(得分:0)

如上所述,您需要使用xAxis.axisLabel.formatter。

这是你的例子。

// Horizontal axis
xAxis: [{
    type: 'time', 
    axisLabel: {
      formatter: (function(value){
        let label;
        if (value.getMinutes() < 10){ 
          label = value.getHours() + ":0" +value.getMinutes();
        }
        else {
          label = value.getHours() + ":" +value.getMinutes();
        }
        return label;
      })
    }
}],