安装echarts
npm install echarts -S
代码示例
<!-- Echarts组件 -->
<template>
<div class="container">
<div id="echart"></div>
</div>
</template>
<script>
import echarts from 'echarts'
export default {
methods: {
drawLine() {
// 初始化echarts实例
let echart = echarts.init(document.getElementById('echart'))
// 绘制图表
echart.setOption({
title: { text: '2020年09月21日蔬菜价格' },
tooltip: {},
xAxis: {
data: ["萝卜", "生菜", "茄子", "黄瓜", "韭黄", "白菜"]
},
yAxis: {},
series: [{
name: '价格',
type: 'bar',
data: ['4.95', '1.68', '2.58', '4.98', '8.88', '1.50']
}]
});
}
},
mounted() {
this.drawLine();
}
}
</script>
<style>
#echart {
width: 600px;
height: 300px;
}
</style>