npm 下載

npm install echarts --save

main.js 導(dǎo)入

import echarts from echarts

Vue.prototype.$echarts = echarts

app.vue 使用

<template>

  <div id="app">

    <div style="height:500px;" id="echarts"></div>

  </div>

</template>

<script>

export default {

  name: "App",

  data() {

    return {

      option: {

        title: {

          text: "ECharts 入門示例"

        },

        tooltip: {},

        xAxis: {

          data: ["襯衫", "羊毛衫", "雪紡衫", "褲子", "高跟鞋", "襪子"]

        },

        yAxis: {},

        series: [

          {

            name: "銷量",

            type: "bar",

            data: [5, 20, 36, 10, 10, 20]

          }

        ]

      }

    };

  },

  mounted() {

    this.initCharts();

  },

  methods: {

    initCharts() {

      var myChart = this.$echarts.init(document.getElementById("echarts"));

      myChart.setOption(this.option);

    }

  }

};

</script>

<style>

#app {

  font-family: "Avenir", Helvetica, Arial, sans-serif;

  -webkit-font-smoothing: antialiased;

  -moz-osx-font-smoothing: grayscale;

  text-align: center;

  color: #2c3e50;

  margin-top: 60px;

}

</style>