vue+echarts 后台获取数据_前端学习Vue+ECharts--数据对比折线图

1、创建ID

2、在组建里面引入

import echarts from "echarts";

3、在data里定义chartLine为null

chartLine:null,

public_data:[],  //定义X轴

data1:[],  //y轴上周数据

data2:[],  //y轴本周数据

4、在methods：{}获取ID并获取接口数据及调用

methods:{

drawLineChart() {

this.chartLine= echarts.init(document.getElementById("chartLine"));

this.chartLine.setOption({

backgroundColor: "#0f3c42",//背景色

title: {

textStyle: { color: "#65eacc" },

text: "进水瞬时流量"

},

tooltip: {

trigger: "axis"

},

legend: {

x: "right", // 'center' | 'left' | {number},

y: "top", // 'center' | 'bottom' | {number}

padding: 10, // [5, 10, 15, 20]

itemGap: 20,

textS