xzzn/SIPAIIS_WMS_JSSW
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

大屏静态数据

Browse Source
This commit is contained in:
Rue Ji
2026-02-06 16:30:47 +08:00
parent 14c9bd8ce0
commit 580606c267
8 changed files with 117 additions and 93 deletions
Download Patch File Download Diff File Expand all files Collapse all files

78
src/main/webapp/jsp/bigScreen3.jsp
View File

@ -4,6 +4,8 @@
<head>
<meta charset="UTF-8">
<title>排污户大屏展示</title>
<!-- <script type="text/javascript" src="../../node_modules/jquery/dist/jquery.min.js"></script> -->
<!-- <script type="text/javascript" src="../../JS/echarts3.0.js"></script> -->
<script type="text/javascript" src="<%=request.getContextPath()%>/node_modules/jquery/dist/jquery.min.js"></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/JS/echarts3.0.js"></script>
<style>
@ -20,6 +22,7 @@
width: 6500px;
height: 1800px;
background-image: url('<%=request.getContextPath()%>/IMG/screen3.png');
/* background-image: url('../../IMG/screen3.png'); */
background-size: 100% 100%;
background-repeat: no-repeat;
position: relative;
@ -446,18 +449,15 @@
// Process Max Data (Top 10 High)
currentMaxData.forEach((item, index) => {
maxNames.push(item.name);
var isHighlighted = (index === currentFocusIndex);
var colorStart = isHighlighted ? '#ffffff' : '#ffaa00';
var colorEnd = isHighlighted ? '#cccccc' : '#ff5500';
maxValues.push({
value: item.value,
itemStyle: {
normal: {
color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
offset: 0, color: colorStart
offset: 0, color: '#ff5500'
}, {
offset: 1, color: colorEnd
offset: 1, color: '#ffb700'
}])
}
}
@ -472,9 +472,9 @@
itemStyle: {
normal: {
color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
offset: 0, color: '#00eaff'
offset: 0, color: '#00aa00'
}, {
offset: 1, color: '#0055ff'
offset: 1, color: '#00ff00'
}])
}
}
@ -483,26 +483,28 @@
var option = {
title: [{
text: '近30天排污量最大 Top 10',
left: 'center',
text: '近30日排污量 TOP 10 (最大)',
left: '25%',
top: '2%',
textStyle: { color: '#ffaa00', fontSize: 24, fontWeight: 'bold' }
textAlign: 'center',
textStyle: { color: '#ffffff', fontSize: 30, fontWeight: 'bold' }
}, {
text: '近30天排污量最小 Top 10',
left: 'center',
top: '52%',
textStyle: { color: '#00eaff', fontSize: 24, fontWeight: 'bold' }
text: '近30日排污量 TOP 10 (最小)',
left: '75%',
top: '2%',
textAlign: 'center',
textStyle: { color: '#ffffff', fontSize: 30, fontWeight: 'bold' }
}],
grid: [{
top: '10%',
left: '5%',
right: '10%',
bottom: '53%',
top: '12%',
left: '2%',
right: '52%',
bottom: '5%',
containLabel: true
}, {
top: '60%',
left: '5%',
right: '10%',
top: '12%',
left: '52%',
right: '2%',
bottom: '5%',
containLabel: true
}],
@ -519,7 +521,7 @@
type: 'category',
data: maxNames,
inverse: true,
axisLabel: { color: '#fff', fontSize: 18 },
axisLabel: { color: '#fff', fontSize: 20 },
axisLine: { show: false },
axisTick: { show: false },
gridIndex: 0
@ -527,7 +529,7 @@
type: 'category',
data: minNames,
inverse: true,
axisLabel: { color: '#fff', fontSize: 18 },
axisLabel: { color: '#fff', fontSize: 20 },
axisLine: { show: false },
axisTick: { show: false },
gridIndex: 1
@ -538,36 +540,42 @@
xAxisIndex: 0,
yAxisIndex: 0,
data: maxValues,
barWidth: 30,
barWidth: 45,
showBackground: true,
backgroundStyle: {
color: 'rgba(255, 255, 255, 0.1)',
barBorderRadius: [0, 22, 22, 0]
},
label: {
normal: {
show: true,
position: 'right',
textStyle: { color: '#ffaa00', fontSize: 18, fontWeight: 'bold' },
formatter: '{c} m³'
textStyle: { color: '#ffffff', fontSize: 20 },
formatter: '{c}'
}
},
itemStyle: { normal: { barBorderRadius: [0, 15, 15, 0] } },
animationDuration: 1000,
animationDurationUpdate: 1000
itemStyle: { normal: { barBorderRadius: [0, 22, 22, 0] } },
}, {
name: 'Min',
type: 'bar',
xAxisIndex: 1,
yAxisIndex: 1,
data: minValues,
barWidth: 30,
barWidth: 45,
showBackground: true,
backgroundStyle: {
color: 'rgba(255, 255, 255, 0.1)',
barBorderRadius: [0, 22, 22, 0]
},
label: {
normal: {
show: true,
position: 'right',
textStyle: { color: '#00eaff', fontSize: 18, fontWeight: 'bold' },
formatter: '{c} m³'
textStyle: { color: '#ffffff', fontSize: 20 },
formatter: '{c}'
}
},
itemStyle: { normal: { barBorderRadius: [0, 15, 15, 0] } },
animationDuration: 1000,
animationDurationUpdate: 1000
itemStyle: { normal: { barBorderRadius: [0, 22, 22, 0] } },
}]
};