Vue项目中使用Echarts完成图标引入

效果图

第一步

打开终端使用 npm install echarts --save 下载获取 echarts
我用的是 yarn 哈哈哈哈

第二步

在绘图前我们需要为 ECharts 准备一个具备高宽的 DOM 容器。
HTML部分

<template>
  <div class="home">
    <div id="main" style="width: 600px; height: 400px"></div>
  </div>
</template>

第三步

我们可以直接在Vue的生命周期函数里也就是mounted里进入页面加载图表
写完之后就可以打开页面展示出来图表啦！

<script>
var echarts = require("echarts");
export default {
   
  data() {
   
    return {
   };
  },
  mounted() {
   
    var myChart = echarts.init(document.getElementById("main"));

    var option = {
   
      title