v-charts有不同series时报错series.type should be specified的解决方法

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.至此就已完成了,当然也可以修改其他配置项
在这里插入图片描述

  • 4
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值