安裝echarts 依賴
npm install echarts -S
全局引入
import echarts from 'echarts'
HTML部分
<div id="myChartId" style="height:500px;width:1000px"></div>
初始化echarts
created: function () { this.initChart(); },
chart數據
methods: { initChart() { this.chart = echarts.init(document.getElementById("myChartId")); // 把配置和數據放這裏 this.chart.setOption({ color: ['#3398DB'], tooltip: { trigger: 'axis', axisPointer: { // 座標軸指示器,座標軸觸發有效 type: 'shadow' // 默認爲直線,可選爲:'line' | 'shadow' } }, grid: { left: '3%', right: '4%', bottom: '3%', containLabel: true }, xAxis: [{ type: 'category', data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'], axisTick: { alignWithLabel: true } }], yAxis: [{ type: 'value' }], series: [{ name: '直接訪問', type: 'bar', barWidth: '60%', data: [10, 52, 200, 334, 390, 330, 220] }] }) } }