效果图
重点属性
- X轴为时间轴,type类型为time
- markArea用来区分后面背景颜色(markArea写在serize里面,想要几个色块,serize下面就有几个对象)
- 图片中的正常异常文字是markArea的label
- 当有一个轴为时间轴的时候,数据要按时间排序,否则存在潜在问题(折线图会有问题)
- 如果使用时间轴,尽量设置时间轴的最大时间和最小时间,该表max和min为时间戳
- Y轴等分存在问题,看到下面这个博客解决问题点击我直达
- 等分问题:该表中2等分,使用的数值为60
代码(放在官方示例就可以运行的)
官方示例页面链接:点击我
使用方法:删除原来所有代码,将下面代码CV操作即可
let data = [
{
xxt:'2020-08-03 6:38:08', value:['2020-08-04 1:10:08', '40']},
{
xxt:'2020-08/03 6:38:08', value:['2020/08/04 2:03:09', '20']},
{
xxt:'2020-08/03 6:38:08', value:['2020/08/04 3:56:10', '39']},
{
xxt:'2020-08/03 6:38:08', value:['2020/08/04 4:08:11', '50']},
{
xxt:'2020-08/03 6:38:08', value:['2020/08/04 5:38:12', '37']},
{
xxt:'2020-08/03 6:38:08', value:['2020/08/04 6:38:13', '42']},
{
xxt:'2020-08/03 6:38:08', value:['2020/08/04 7:38:14', '46']},
{
xxt:'2020/08/03 6:38:08', value:['2020/08/05 8:38:15', '32']},
{
xxt:'2020/08/03 6:38:08', value:['2020/08/05 10:38:17', '23']},
{
xxt:'2020/08/03 6:38:08', value:['2020/08/05 11:17:16', '26']},
];
let timestamp = (new Date()).getTime