1. npm install echarts@4.8.0 --save
2. 在main.js中全局导入
import echarts from ‘echarts‘
Vue.prototype.$echarts = echarts
3. 在使用的组件中
在html中：
<div id="main" style="width: 600px; height: 400px"></div>
在js中：
drawChart () {
// 基于准备好的dom，初始化echarts实例
var myChart = this.$echarts.init(document.getElementById(‘main‘));
// 指定图表的配置项和数据
var option = {
title: {
// text: ‘折线图堆叠‘
},
tooltip: {
trigger: ‘axis‘
},
grid: {
top: ‘20%‘,
left: ‘3%‘,
right: ‘4%‘,
bottom: ‘3%‘,
containLabel: true
},
xAxis: {
type: ‘category‘,
boundaryGap: false,
data: [‘现在‘, ‘11点‘, ‘14点‘, ‘17点‘, ‘20点‘, ‘23点‘, ‘02点‘, ‘05点‘, ‘08点‘],
},
yAxis: {
type: ‘value‘
},
series: [
{
name: ‘温度‘,
type: ‘line‘,
stack: ‘总量‘,
data: [8, 9, 9, 8, 8, 5, 4, 4, 4]
},
]
};
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);
// 跟着缩放
window.addEventListener(‘resize‘, function () {
// 让我们的图表调用 resize这个方法
myChart.resize();
});
}
在vue中使用echarts
原文：https://www.cnblogs.com/panstarry/p/14123908.html
