// 二维数组
const data = [
[
{
concentration: 2.41,
createTime: '2022-08-04 09:27',
levelName: '二级泄露',
type: 1,
deviceName: '11sse',
deviceNumber: 'test001'
},
{
concentration: 3.6,
createTime: '2022-08-04 09:27',
levelName: '二级泄露',
type: 1,
deviceName: '11sse',
deviceNumber: 'test001'
},
{
concentration: 3.9,
createTime: '2022-08-04 09:27',
levelName: '二级泄露',
type: 1,
deviceName: '11sse',
deviceNumber: 'test001'
},
{
concentration: 3.8,
createTime: '2022-08-04 09:27',
levelName: '二级泄露',
type: 1,
deviceName: '11sse',
deviceNumber: 'test001'
},
{
concentration: 2.41,
createTime: '2022-08-04 09:28',
levelName: '二级泄露',
type: 1,
deviceName: '11sse',
deviceNumber: 'test001'
},
{
concentration: 2.41,
createTime: '2022-08-04 09:29',
levelName: '二级泄露',
type: 1,
deviceName: '11sse',
deviceNumber: 'test001'
}
],
[
{
concentration: 2.41,
createTime: '2022-08-04 09:28',
levelName: '二级泄露',
type: 1,
deviceName: '12sse',
deviceNumber: 'test002'
},
{
concentration: 2.45,
createTime: '2022-08-04 09:28',
levelName: '二级泄露',
type: 1,
deviceName: '12sse',
deviceNumber: 'test002'
},
{
concentration: 2.49,
createTime: '2022-08-04 09:28',
levelName: '二级泄露',
type: 1,
deviceName: '12sse',
deviceNumber: 'test002'
},
{
concentration: 2.41,
createTime: '2022-08-04 09:29',
levelName: '二级泄露',
type: 1,
deviceName: '12sse',
deviceNumber: 'test002'
}
],
[
{
concentration: 2.41,
createTime: '2022-08-04 09:29',
levelName: '二级泄露',
type: 1,
deviceName: '133sse',
deviceNumber: 'test003'
},
{
concentration: 2.41,
createTime: '2022-08-04 09:30',
levelName: '二级泄露',
type: 1,
deviceName: '133sse',
deviceNumber: 'test003'
}
]
]
// 时间数组
let timeArr = []
data.forEach((itemArr, index) => {
itemArr.forEach(item => {
timeArr.push(item.createTime)
})
})
timeArr = [...new Set(timeArr)]
console.log('时间线数组', timeArr)
// 组装数组
let series = [
{
name: '1',
type: 'line',
smooth: true,
lineStyle: {
width: 0
},
areaStyle: {},
data: []
},
{
data: []
}
]
const colorData = {
//颜色配置
0: '#70b603', //正常
1: '#f59a23', //预警
2: '#d9001b', //报警
3: '#7f7f7f' //离线
}
// 把二维数组重新组装成series，每个data的长度和时间保持一直，没有时间点的直接push({时间,value:0})
series = data.map(item => {
const hasNumItem = item.find(d => d.deviceName)
if(hasNumItem === -1) return
const temp = Array(timeArr.length).fill({
value: 0,
itemStyle: {
color: '#7f7f7f'
},
name: '设备离线',
deviceNumber: hasNumItem.deviceNumber,
deviceName: hasNumItem.deviceName
})
item.forEach(item => {
const index = timeArr.indexOf(item.createTime)
if (index === -1) {
return
}
temp[index] = {
value: item.concentration,
itemStyle: {
color: colorData[item.concentration === 0 ? 3 : item.type] //根据等级来确定颜色
},
name: item.concentration === 0 ? `设备离线` : item.levelName,
deviceNumber: item.deviceNumber,
deviceName: item.deviceName
}
})
return {
type: 'line',
smooth: true,
lineStyle: {
width: 0
},
areaStyle: {},
data: temp
}
})
console.log(series)
