v-charts是基于 Vue2.0 和 echarts 封装的图表组件,使用起来很简单很方便。
最近做了个项目:
1.使用v-charts的showLine配置项为柱状图生成折线图在这里插入图片描述
2.想设置图表高亮时显示label,参考echarts配置项发现需要配置series中的emphasis,此时就需要对v-charts中的extend进行配置
在这里插入图片描述
3.配置完成后发现显示没问题,但是控制台会报错Uncaught Error: series.type should be specified
在这里插入图片描述
在这里插入图片描述
4.报错的意思是系列series需要添加一个type,如果我3个series都是同一个type时就简单了,直接添加type: 'bar’即可,但是由于我用了v-charts的showLine,第三条为折线,所以此方法行不通。如果把series设置成数组,改用echarts的配置方法时,还需重新遍历data,想想就很麻烦,遂放弃。后来查阅v-charts文档时发现了钩子函数after-set-option,大胆尝试了一下,居然成功了!
只需两步:
第一步:绑定钩子函数
在这里插入图片描述
第二步:设置methods方法
在这里插入图片描述
5.至此就已完成了,当然也可以修改其他配置项
在这里插入图片描述

Logo

前往低代码交流专区

更多推荐