如何在Echarts中将xAxis设置为TIME类型，格式为{hh:mm}？

Question

我想设置 xAxis 为 TIME 类型，格式为 {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"，还是不行。

Answer 1

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

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

Answer 2

如上所述，您需要使用 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;
      })
    }
}],

Answer 3

我让你的演示工作。我已经像这样更改了 value：

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

请看这张截图：

如何在Echarts中将xAxis设置为TIME类型，格式为{hh:mm}？

How to set xAxis in TIME type and formatted like {hh:mm} in Echarts?

echarts