vue项目中使用ECharts可视化图表

第一步：安装echarts

yarn add echarts

第二步：在main.js中引入图表

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

第三步：创建容器标签

.chartBox需要定义宽高

<div class="chartBox">
    <div ref="chart" style="width:100%; height:100%;"></div>
</div>

第四步：挂载后初始化并配置图表库

({})里是所需图表的配置项目,axios请求也在mounted里发送，图表才能获取到数据

mounted() {
   
    let myChart = this.$echarts.ini