1)安装echarts插件

npm install echarts --save

2)在main.js中种引入，作为全局变量

import echarts from 'echarts'Vue.prototype.$echarts = echarts;

3)在组件中使用

html代码<div class="myChart" ref="myChart" ></div>style代码.myChart{width:100%;height:300px;}

mounted(){this.echart_init()}methods:{echart_init(){//echart初始化let myChart = this.$echarts.init(this.$refs.myChart);let options={ tooltip:{ formatter:'{a}<br>{b}:{c}%' }, toolbox:{ feature:{ restore:{}, saveAsImage:{} } }, series:[ { name:'剩余率', type:'gauge', detail:{formatter:'{value}%'}, data:[{value:50,name:'剩余率'}] } ] }}myChart.setOption(options)}}

结果显示

免责声明：文章源自网络，版权归原作者所有，如有侵犯联系删除。