颗粒折线图 #4
@ -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() {
|
||||||
|
@ -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 }) {
|
||||||
|
@ -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)
|
||||||
|
Loading…
Reference in New Issue
Block a user