html和vue的echarts使用步骤（大白话）

一、 html页面

1. 在官网上下载echarts.min.js文件
   1. https://cdn.jsdelivr.net/npm/echarts@5.4.0/dist/echarts.min.js
2. 在html页面 《script src="" /》引入
3. 创建一个div盒子，里面什么都不要写，定义好宽高以及位置
4. 获取这个div盒子

   1. var dom1 = document.querySelector(".top_box_r");

5.  对dom1初始化

   1. var mydom1 = echarts.init(dom1)

6. 写入你想要的echarts所呈现效果的对象(官网有)

   1. var options1={...}

7. 设置options1，达到实现

   1. mydom1.setOption(options1);

二、 vue

1. 下载     npm install echarts --save
2. 在页面引入  import * as echarts from "echarts";
3. 在vue页面的methods里放置一个方法，在mounted里面调用
4. 方法里面写 
   1. 获取元素 var dom1 = document.querySelector(".top_box_r");
   2. 初始化   var mydom1 = echarts.init(dom1)
   3. 实例化  mydom1.setOption(options1);
5. data数据里面写  options1:{数据内容}