修改bug

This commit is contained in:
‘937886381’
2024-03-27 17:02:44 +08:00
parent f025a2b77b
commit 53526b5f78
9 changed files with 434 additions and 245 deletions

View File

@@ -87,8 +87,17 @@ export default {
// console.log('1111', dataList);
// console.log(1)
this.chart = echarts.init(document.getElementById(this.id))
// if (dataList.length !== 0) {
// this.$set(this.series, "data", dataList);
if (!nameList && !dataList) {
// 隐藏echarts图表
this.chart.clear(); // 清空图表
this.chart.setOption({ // 设置空的option
title: {
show: false
},
series: []
});
} else {
// 显示echarts图表
this.series = [{
type: 'bar',
data: dataList,
@@ -111,90 +120,94 @@ export default {
},
barWidth: 12,
}]
// }
// if (nameList.length !== 0) {
// }
// if (nameList.length !== 0) {
this.nameList = nameList
// }
this.chart.setOption({
tooltip: {
trigger: 'axis',
axisPointer: {
// 坐标轴指示器,坐标轴触发有效
type: 'shadow' // 默认为直线,可选为:'line' | 'shadow'
}
},
grid: { top: 90, right: 60, bottom: 20, left: 90 },
// legend: {
// itemWidth: 10,
// itemHeight: 10,
// // right: '20px',
// data: nameList,
// textStyle: {
// fontSize: 12 * this.beilv,
// color: '#ced1d5'
// }
// },
xAxis: {
type: 'category',
axisLine: {
lineStyle: {
type: 'solid',
color: '#25528f', // 左边线的颜色
width: '1' // 坐标线的宽度
// }
this.chart.setOption({
tooltip: {
trigger: 'axis',
axisPointer: {
// 坐标轴指示器,坐标轴触发有效
type: 'shadow' // 默认为直线,可选为:'line' | 'shadow'
}
},
axisLabel: {
color: "#fff",
fontSize: 12,
// formatter: '{value}'
grid: { top: 90, right: 60, bottom: 20, left: 90, containLabel: true },
// legend: {
// itemWidth: 10,
// itemHeight: 10,
// // right: '20px',
// data: nameList,
// textStyle: {
// fontSize: 12 * this.beilv,
// color: '#ced1d5'
// }
// },
xAxis: {
type: 'category',
axisLine: {
lineStyle: {
type: 'solid',
color: '#25528f', // 左边线的颜色
width: '1' // 坐标线的宽度
}
},
axisLabel: {
color: "#fff",
fontSize: 12,
// formatter: '{value}'
},
splitLine: {
lineStyle: {
color: '#25528f'
}
},
data: this.nameList
},
splitLine: {
lineStyle: {
color: '#25528f'
yAxis: {
name: '单位kwh',
nameTextStyle: {
color: '#fff',
fontSize: 10,
align: 'right',
},
type: 'value',
axisLabel: {
color: "#fff",
fontSize: 12,
// formatter: '{value}/kwh'
},
axisLine: {
show: true,
lineStyle: {
color: "#25528f",
},
},
splitLine: {
lineStyle: {
color: "#25528f",
},
}
},
data: this.nameList
},
yAxis: {
name: '单位kwh',
nameTextStyle: {
color: '#fff',
fontSize: 10,
align: 'right',
},
type: 'value',
axisLabel: {
color: "#fff",
fontSize: 12,
// formatter: '{value}/kwh'
},
axisLine: {
show: true,
lineStyle: {
color: "#25528f",
},
},
splitLine: {
lineStyle: {
color: "#25528f",
},
}
},
// legend: {
// itemHeight: 10,
// itemWidth: 10,
// x: 'center', // 可设定图例在左、右、居中
// y: 'top', // 可设定图例在上、下、居中
// show: this.showLegend,
// data: this.dataList,
// right: '1%',
// textStyle: {
// fontSize: 12 * this.beilv,
// color: '#ced1d5'
// }
// },
series: this.series
})
// legend: {
// itemHeight: 10,
// itemWidth: 10,
// x: 'center', // 可设定图例在左、右、居中
// y: 'top', // 可设定图例在上、下、居中
// show: this.showLegend,
// data: this.dataList,
// right: '1%',
// textStyle: {
// fontSize: 12 * this.beilv,
// color: '#ced1d5'
// }
// },
series: this.series
})
}
// if (dataList.length !== 0) {
// this.$set(this.series, "data", dataList);
}
}
}