在vue中使用Echarts

• 第一步：安装echarts

npm i echarts -S

• 在需要的组件中引入Echarts

// 引入echarts
import * as Echarts from 'echarts'

• 第三步：创建一个div容器并创建化图表对象

html:
  //创建一个div容器
	<div ref="box" style="width: 900px; height: 400px"></div>
    
JS:
 //创建化图表对象
 let myChart = Echarts.init(this.$refs.box);

注：如果想在create里面操作dom就需要：

create:{
this.$nextTick(()=>{
//要操作的dom
})
}

• 第四步：指定配置项

  const option=await getEchartsAPI()
 //合并图表初始数据和从接口返回的数据
   let optionData={...this.initData,...option}

• 第五步：将配置项指定给某个图表对象

 //指定配置给myChart图表对象
      myChart.setOption(optionData)