颗粒折线图 #4

Merged
juzi merged 1 commits from zjl into master 2023-02-14 11:03:08 +08:00
3 changed files with 76 additions and 43 deletions

View File

@ -64,18 +64,20 @@ export default {
} }
}, },
methods: { methods: {
init() {
console.log('init')
},
selectLine(val) { selectLine(val) {
this.form.proLineId = val this.form.proLineId = val
setAlarmValueGet({ id: val }).then((res) => { setAlarmValueGet({ id: val }).then((res) => {
this.form.adsorptionPadCeiling = res.data.adsorptionPadCeiling if (res.code === 0 && res.data) {
? res.data.adsorptionPadCeiling this.form.adsorptionPadCeiling = res.data.adsorptionPadCeiling
: null ? res.data.adsorptionPadCeiling
this.form.auxiliaryFrameCeiling = res.data.auxiliaryFrameCeiling : 0
? res.data.auxiliaryFrameCeiling this.form.auxiliaryFrameCeiling = res.data.auxiliaryFrameCeiling
: null ? res.data.auxiliaryFrameCeiling
: 0
} else {
this.form.adsorptionPadCeiling = 0
this.form.auxiliaryFrameCeiling = 0
}
}) })
}, },
submitForm() { submitForm() {

View File

@ -141,9 +141,6 @@ export default {
this.getList() this.getList()
} else { } else {
this.centervisible = true this.centervisible = true
this.$nextTick(() => {
this.$refs.alarmAdd.init()
})
} }
}, },
tableRowClassName({ row }) { tableRowClassName({ row }) {

View File

@ -79,12 +79,12 @@ export default {
let xlList = [] let xlList = []
let sumList = [] let sumList = []
let msg = {} let msg = {}
for (let i = 0; i < 100; i++) { for (let i = 0; i < 1000; i++) {
time.push(moment().add(1, 'days').format('YYYY-MM-DD HH:mm:ss')) time.push(moment().add(i, 'days').format('YYYY-MM-DD HH:mm:ss'))
sList.push(Math.floor(Math.random() * 80 + 10)) sList.push(Math.floor(Math.random() * 80 + 10))
mList.push(Math.floor(Math.random() * 80 + 20)) mList.push(Math.floor(Math.random() * 100 + 20))
lList.push(Math.floor(Math.random() * 80 + 30)) lList.push(Math.floor(Math.random() * 130 + 30))
xlList.push(Math.floor(Math.random() * 80 + 40)) xlList.push(Math.floor(Math.random() * 150 + 40))
sumList.push(sList[i] + mList[i] + lList[i] + xlList[i]) sumList.push(sList[i] + mList[i] + lList[i] + xlList[i])
} }
msg.time = time msg.time = time
@ -194,50 +194,84 @@ export default {
getChart(msg) { getChart(msg) {
console.log(msg) console.log(msg)
var option = { var option = {
color: ['#5AD8A6', '#5B8FF9', '#5D7092', '#F6BD16', '#E8684A'],
title: { title: {
text: 'Beijing AQI', text: '时间段玻璃颗粒数',
left: '1%' left: '1%'
}, },
tooltip: { tooltip: {
trigger: 'axis' trigger: 'axis'
}, },
legend: {
data: ['Total', 'M', 'L', 'S', 'XL'],
right: '4%'
},
grid: { grid: {
left: '5%', left: '4%',
right: '15%', right: '4%',
bottom: '10%' bottom: '10%'
}, },
xAxis: msg.time, xAxis: {
yAxis: {}, type: 'category',
toolbox: { boundaryGap: false,
right: 10, data: msg.time
feature: { },
dataZoom: { yAxis: {
yAxisIndex: 'none' type: 'value'
},
restore: {},
saveAsImage: {}
}
}, },
dataZoom: [ dataZoom: [
{ {
startValue: '2014-06-01' startValue: '2023-02-014'
}, },
{ {
type: 'inside' type: 'inside'
} }
], ],
visualMap: { series: [
top: 50, {
right: 10, name: 'Total',
outOfRange: { type: 'line',
color: '#999' data: msg.sumList,
markLine: {
show: false,
Symbol: 'none',
label: {
position: 'end',
formatter: '合格线\n' + this.maxLine
},
data: [
{
silent: false,
lineStyle: {
type: 'dashed',
color: '#0B58FF'
},
yAxis: this.maxLine
}
]
}
},
{
name: 'M',
type: 'line',
data: msg.mList
},
{
name: 'L',
type: 'line',
data: msg.lList
},
{
name: 'S',
type: 'line',
data: msg.sList
},
{
name: 'XL',
type: 'line',
data: msg.xlList
} }
}, ]
series: {
name: 'Beijing AQI',
type: 'line',
data: msg.sList
}
} }
option && this.chart.setOption(option) option && this.chart.setOption(option)