vue中echarts调用接口_在Vue中使用echarts的两种方式

方式一、直接引入echarts

npm install echarts --save

开发：

main.js

import myCharts from './comm/js/myCharts.js'Vue.use(myCharts)

myCharts.js

import echarts from 'echarts'const install= function(Vue) {

Object.defineProperties(Vue.prototype, {

$chart: {

get() {return{//画一条简单的线

line1: function(id) {this.chart =echarts.init(document.getElementById(id));this.chart.clear();

const optionData={

xAxis: {

type:'category',

data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']

},

yAxis: {

type:'value'},

series: [{

data: [820, 932, 901, 934, 1290, 1330, 1320],

type:'line',

smooth:true}]

};this.chart.setOption(optionData);

},

}

}

}

})

}

exportdefault{

install

}

HelloWorld.vue