npm 下载
npm install echarts --save
main.js 导入
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>
