<template>
<div ref="history" class="echarts"></div>
</template>
<script>
export default{
data () {
return {};
},
methods: {
history(){
let myChart = this.$echarts.init(this.$refs.history);
// 绘制图表
myChart.setOption({
textStyle: {
color: '#fff' // 设置文字颜色为白色
},
title: {
text: '载重',
textStyle: {
color: '#fff' // 设置标题颜色为红色
}
},
legend: {
data: ['载重'],
textStyle: {
color: '#fff' // 设置标题颜色
}
},
tooltip: {},
xAxis: {
type: 'category',
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
axisLine: {
lineStyle: {
color: '#fff' // 设置 x 轴轴线颜色
}
},
},
yAxis: {
type: 'value',
axisLine: {
lineStyle: {
color: '#fff' // 设置 x 轴轴线颜色
}
},
},
series: [
{
name:"载重",
data: [820, 932, 901, 934, 1290, 1330, 1320],
type: 'line',
color: '#ff0000', // 设置线段的颜色
smooth: true
}
]
});
},
},
mounted () {
this.history();
}
}
</script>
<style scoped>
.echarts{
width: 100%;
height: 100%;
}
</style>
