A line chart can be displayed when dataY is attached, but not tems, where tems and dataY data formats are the same.
< template >
<div>
<Mheader></Mheader>
<div id="echarts" :style="{height:height,width:width}"></div>
</div>< / template >
< script >
import Mheader from "../base/Mheader.vue"
import echarts from "echarts"
import {getHum,getTem,getAlldata,getIllsum} from "../api"
export default {
data() {
return {tems:[],hums:[],illsums:[], dataY:["5","10", "15", "30", "14"]}
},
props: {
height: {
type: String,
"default": "300px"
},
width: {
type: String,
"default": "100%"
}
},
mounted() {
this.draw();
},
created(){
this.getTems();
this.getHums();
this.getIllsums();
},
methods: {
async getTems(){
let tems=await getTem();
this.tems=tems;
console.log(tems);
},
async getHums(){
let hums=await getHum();
this.hums=hums;
}
,async getIllsums(){
let illsums=await getIllsum();
this.illsums=illsums;
},
draw: function(){
let echart = echarts.init(document.getElementById("echarts"));
var option = ({
title: { text: "" },
tooltip: {},
xAxis: {
data:["5","4","3","2",""]
},
yAxis: {},
series: [{
name: "",
type: "line",
color:["red"],
data:[]
}]
});
for(var i = 0; i < 5;iPP){/ / option.series [0] .data [I] = this.tems [I]; cannot
option.series[0].data[i]=this.dataY[i];
}
echart.setOption(option);
}
},
computed: {
},
components: {
Mheader
}
} < / script >
< style scoped lang= "less" >
-sharpecharts{
margin: 0 auto;
margin-top: 40px;}< / style >