echarts官网有对x轴type的说明:

之前常用的是category,最近需要用time显示。
先看看x轴的显示设置:给一个初始时间值,一个结束时间值,然后给个最小间隔,echarts会自实现显示x轴的值:

然后发现有时候在Chrome上没有问题,结果到了IE上发现x轴不显示了。
上图中,如果max/min是时间戳,那么x轴的显示在Chrome和IE都是没有问题的。
如果是max/min是 new Date(timeString),timeString如果是 “2020/09/04 11:01:23” 这种格式,x轴的显示在Chrome和IE 也都是没有问题的。
timeString如果是 "2020-09-04 11:01:23" 这种格式,x轴的显示在Chrome没有问题,但在IE,是不行的。
为什么会这样呢?


看出来了吧:
new Date(‘2020/09/04 11:01:23’)在Chrome和IE都能生效,但是new Date(‘2020-09-04 11:01:23’)在Chrome没问题,在IE就不行。
所以解决办法是:
- 让后台返回时间戳,这样前端可以直接拿来用,不用做处理
- 前端自己处理一下拿到的这种字符串:‘2020-09-04 11:01:23’,改成’2020/09/04 11:01:23’
let a = '2020-09-04 11:01:23';
let b = a.replace(/\-/g, '/');
console.log(b); // 2020/09/04 11:01:23

希望本文对你有所帮助!

在使用Echarts时遇到x轴显示时间的问题,发现在Chrome中正常,但IE下出现异常。问题出在newDate()函数解析时间字符串格式不一致。'2020-09-04 11:01:23'的格式在IE中不被接受,而'2020/09/04 11:01:23'则兼容性更好。解决方案是确保时间戳从后台返回或者前端将'2020-09-04 11:01:23'转换为'2020/09/04 11:01:23'的格式。
5078

被折叠的 条评论
为什么被折叠?



