echarts基本使用

echart（基于vue开发下）

一、基础篇

1、首先在新建的template文件中创建一个具体宽高的dom容器

2、使用echarts基础步骤,这里使用的依赖是"echarts": “^4.9.0”,版本

<script>
// 第二步：引入echarts
import echarts from 'echarts'

export default {
  name: 'EchartsComponents',
  methods: {
    drawChart() {
       //第三步：使用echarts.init方法初始化一个echarts实例
      const myChart = echarts.init(document.getElementById(this.echarts))
      // 第四步：最后用setOption方法生成简单的图表
      myChart.setOption({
        title:{},   // 标题组件 
        color: [],  // 多种颜色组件
        tooltip: {}, // 提示框组件 
        legend: {},  // 图例组件，展现了不同系列的标记(symbol)，颜色和名字
        XAxis:{}, //直角坐标系 grid 中的 x 轴，单个 grid 组件最多只能放上下两个 x 轴
        yAxis:{}, //直角坐标系 grid 中的 y 轴，单个 grid 组件最多只能放左右两个 y 轴
        series: [{}] //系列列表。每个系列通过 type 决定自己的图表类型
      })
    }
  }
}
</script>

​ ‘’人一生会遇到很多朋友，能留下的都算幸运“