首页 > 技术文章 > vue项目引入echarts

lvlv11 2021-07-22 11:51 原文

1.项目根目录执行下载echarts,命令:npm install echarts --save

 

2.在main.js中全局引入echarts

 代码 :

    import * as echarts from "echarts"
    Vue.prototype.$echarts = echarts

 

3.在对应页面使用echarts

 代码:

    HTML :  <div id="main" class="my_chart"></div>

 

    JS:  
      methods: {
         // 初始化echarts实例
            var myChart = this.$echarts.init(document.getElementById("main"))
         // 绘制图表
            myChart.setOption({})
      }

    Css: my_chart:设置宽高

推荐阅读