vue+echart实现双柱状图 vue+echart实现双柱状图

本文实例为大家分享了vue+echart实现双柱状图的具体代码，供大家参考，具体内容如下
效果图：

文章图片

一、安装
【vue+echart实现双柱状图】版本号建议安装"echarts": "^4.8.0”，其它版本init会报错
1、首先需要安装echarts依赖包

npm install --save echarts@4.8.0

2、或者使用国内的淘宝镜像：

npm install -g cnpm --registry=https://registry.npm.taobao.org

.echarts_con {width: 100%; margin: 0 auto; margin-top: 8px; border-radius: 20px; background: #fff; padding-bottom: 35px; }.echarts_main {width: 100%; margin: 0 auto; padding-top: 20px; margin-bottom: -32px; margin-right: 20px; margin-left: 20px; }.bottom {width: 90%; margin: 0 auto; background: #fef8e1; border-radius: 6px; height: 100%; margin-top: 16px; }.bottom_con {width: 90%; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; height: 34px; line-height: 34px; }.bottom_text {height: 34px; line-height: 34px; font-size: 13px; font-family: PingFang, PingFang-SC; font-weight: SC; text-align: left; color: #fa5d1d; }.right_close {width: 13px; height: 13px; }

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。