Web/admin-govern
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

修改echart

Browse Source
This commit is contained in:
GGJ
2024-09-13 18:35:02 +08:00
parent 5e847decc3
commit e4997e4b63
4 changed files with 79 additions and 41 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
src/components/echarts/MyEchart.vue
View File

@@ -54,12 +54,12 @@ const initChart = () => {
fontSize: 16 fontSize: 16
} }
}, },
// textStyle: { textStyle: {
color: '#fff', color: '#fff',
fontStyle: '14px', fontStyle: 'normal',
opacity: 0.35, opacity: 0.35,
fontSize: 14, fontSize: 14
// }, },
backgroundColor: 'rgba(0,0,0,0.35)', backgroundColor: 'rgba(0,0,0,0.35)',
borderWidth: 0, borderWidth: 0,
...(props.options?.tooltip || null) ...(props.options?.tooltip || null)

84
src/views/govern/device/control/detail.vue
View File

@@ -95,8 +95,8 @@ const loading = ref(true)
onMounted(() => { onMounted(() => {
if (props.dataLevel == 'Secondary') { if (props.dataLevel == 'Secondary') {
form.dataLevel = 'Primary' form.dataLevel = 'Primary'
}else{ } else {
form.dataLevel=props.dataLevel form.dataLevel = props.dataLevel
} }
init() init()
}) })
@@ -115,6 +115,13 @@ const init = () => {
dataLevel: form.dataLevel, dataLevel: form.dataLevel,
statMethod: form.statMethod statMethod: form.statMethod
}).then(res => { }).then(res => {
console.log(
123,
res.data.map((item: any[]) => {
return item[0].anotherName
})
)
if (res.data.length && res.data[0].length) { if (res.data.length && res.data[0].length) {
let arr: any[] = [] let arr: any[] = []
res.data.forEach((item: any[]) => { res.data.forEach((item: any[]) => {
@@ -131,9 +138,14 @@ const init = () => {
}, },
series: res.data.map((item: any) => { series: res.data.map((item: any) => {
return { return {
data: item.map((item: any) => { data: item.map((item: any, i: any) => {
return item.statisticalData return [res.data[0][i].time, item.statisticalData]
}), }),
// data: [
// [1584086222000, '573'],
// [1584086342000, '57'],
// [1584086462000, '56']
// ],
markPoint: { markPoint: {
symbol: 'circle', symbol: 'circle',
symbolSize: 8, symbolSize: 8,
@@ -152,6 +164,23 @@ const init = () => {
} }
}) })
}, },
tooltip: {
axisPointer: {
type: 'cross',
label: {
color: '#fff',
fontSize: 16
}
},
textStyle: {
color: '#fff',
fontStyle: 'normal',
opacity: 0.35,
fontSize: 14
},
backgroundColor: 'rgba(0,0,0,0.35)',
borderWidth: 0
},
legend: { legend: {
data: res.data.map((item: any[]) => { data: res.data.map((item: any[]) => {
return item[0].anotherName return item[0].anotherName
@@ -164,29 +193,38 @@ const init = () => {
show: true show: true
}, },
minInterval: 0.1, minInterval: 0.1,
min: 0, min: parseFloat(
max: parseInt( arr
( .map(item => item.statisticalData)
arr .sort((a, b) => {
.map(item => item.statisticalData) return a - b
.sort((a, b) => { })[0] / 1.5
return b - a ).toFixed(0),
})[0] * 1.5 max: parseFloat(
).toFixed(0) arr
) .map(item => item.statisticalData)
.sort((a, b) => {
return b - a
})[0] * 1.2
).toFixed(1)
}, },
xAxis: { xAxis: {
type: 'category', type: 'time'
data: res.data[0].map((item: any) => { // data: res.data[0].map((item: any) => {
return item.time // return item.time
}), // }),
axisLabel: {
formatter: function (value: string) { // axisLabel: {
return value.split(' ').join('\n') // formatter: function (value: string) {
} // return value.split(' ').join('\n')
} // }
// }
} }
} }
if ((echartsData.value.legend = ['A相', 'B相', 'C相'])) {
echartsData.value.color = ['#FFCC00', '#009900', '#CC0000']
}
} else { } else {
echartsData.value = null echartsData.value = null
} }

18
src/views/govern/device/control/tabs/components/waveFormAnalysis.vue
View File

@@ -255,7 +255,7 @@ const init = () => {
itemStyle: { itemStyle: {
// normal: { // normal: {
barBorderRadius: [3, 3, 0, 0], barBorderRadius: [3, 3, 0, 0],
color: '#00CC99' color: '#FFCC00'
// }e // }e
}, },
data: yDataList1, data: yDataList1,
@@ -270,7 +270,7 @@ const init = () => {
// normal: { // normal: {
barBorderRadius: [3, 3, 0, 0], barBorderRadius: [3, 3, 0, 0],
color: '#FF9900' color: '#009900'
// } // }
}, },
data: yDataList2, data: yDataList2,
@@ -284,7 +284,7 @@ const init = () => {
itemStyle: { itemStyle: {
// normal: { // normal: {
barBorderRadius: [3, 3, 0, 0] barBorderRadius: [3, 3, 0, 0]
// color: '#FF9900' // color: '#CC0000'
// } // }
}, },
data: yDataList3, data: yDataList3,
@@ -380,7 +380,7 @@ const init = () => {
itemStyle: { itemStyle: {
// normal: { // normal: {
barBorderRadius: [3, 3, 0, 0], barBorderRadius: [3, 3, 0, 0],
color: '#00CC99' color: '#FFCC00'
// }e // }e
}, },
data: yDataList1 data: yDataList1
@@ -392,7 +392,7 @@ const init = () => {
itemStyle: { itemStyle: {
// normal: { // normal: {
barBorderRadius: [3, 3, 0, 0], barBorderRadius: [3, 3, 0, 0],
color: '#FF9900' color: '#009900'
// } // }
}, },
data: yDataList2 data: yDataList2
@@ -404,7 +404,7 @@ const init = () => {
itemStyle: { itemStyle: {
// normal: { // normal: {
barBorderRadius: [3, 3, 0, 0] barBorderRadius: [3, 3, 0, 0]
// color: '#FF9900' // color: '#CC0000'
// } // }
}, },
data: yDataList3 data: yDataList3
@@ -498,7 +498,7 @@ const init = () => {
itemStyle: { itemStyle: {
// normal: { // normal: {
barBorderRadius: [3, 3, 0, 0], barBorderRadius: [3, 3, 0, 0],
color: '#00CC99' color: '#FFCC00'
// }e // }e
}, },
data: yDataList1 data: yDataList1
@@ -511,7 +511,7 @@ const init = () => {
// normal: { // normal: {
barBorderRadius: [3, 3, 0, 0], barBorderRadius: [3, 3, 0, 0],
color: '#FF9900' color: '#009900'
// } // }
}, },
data: yDataList2 data: yDataList2
@@ -523,7 +523,7 @@ const init = () => {
itemStyle: { itemStyle: {
// normal: { // normal: {
barBorderRadius: [3, 3, 0, 0] barBorderRadius: [3, 3, 0, 0]
// color: '#FF9900' // color: '#CC0000'
// } // }
}, },
data: yDataList3 data: yDataList3

6
src/views/govern/device/control/tabs/realtime.vue
View File

@@ -215,21 +215,21 @@ const initRadioCharts = () => {
value: 180, value: 180,
name: 'A相', name: 'A相',
itemStyle: { itemStyle: {
color: '#A5292A' color: '#FFCC00'
} }
}, },
{ {
value: 90, value: 90,
name: 'B相', name: 'B相',
itemStyle: { itemStyle: {
color: '#DAA521' color: '#009900'
} }
}, },
{ {
value: 30, value: 30,
name: 'C相', name: 'C相',
itemStyle: { itemStyle: {
color: '#2F8A57' color: '#CC0000'
} }
} }
] ]