|
|
@ -15,7 +15,7 @@ |
|
|
|
"> |
|
|
|
<div style="display: flex"> |
|
|
|
<ns-icon name="zongheshuju" size="30" style="margin-right: 3px" /> |
|
|
|
<span>设备状态</span> |
|
|
|
<span style="font-weight: bold">设备状态</span> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div style="width: 100%; height: 100%; padding-left: 10%; padding-right: 10%"> |
|
|
@ -73,7 +73,7 @@ |
|
|
|
"> |
|
|
|
<div style="display: flex"> |
|
|
|
<ns-icon name="zongheshuju" size="30" style="margin-right: 3px" /> |
|
|
|
<div style="height: 10%">平均值</div> |
|
|
|
<div style="height: 10%; font-weight: bold">平均值</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div style="display: flex; flex-wrap: wrap; width: 100%; height: 92%"> |
|
|
@ -144,7 +144,7 @@ |
|
|
|
"> |
|
|
|
<div style="width: 100%; display: flex; align-items: center"> |
|
|
|
<ns-icon name="zongheshuju" size="30" style="margin-right: 3px; margin-top: 8px" /> |
|
|
|
<div style="width: 20%">环境指数分析</div> |
|
|
|
<div style="width: 20%; font-weight: bold">环境指数分析</div> |
|
|
|
<div style="width: 80%; float: right; padding-right: 40px"> |
|
|
|
<a-select |
|
|
|
v-model:value="typeValue" |
|
|
@ -812,24 +812,110 @@ |
|
|
|
lineHeight: 20, |
|
|
|
}, |
|
|
|
}, |
|
|
|
// dataZoom: [ |
|
|
|
// { |
|
|
|
// show: true, |
|
|
|
// type: 'slider', |
|
|
|
// zoomLock: true, |
|
|
|
// startValue: 0, // 从头开始。 |
|
|
|
// endValue: 23, |
|
|
|
// bottom: 20, |
|
|
|
// height: 10, |
|
|
|
// showDetail: false, |
|
|
|
// }, |
|
|
|
// { |
|
|
|
// show: true, |
|
|
|
// type: 'inside', |
|
|
|
// xAxisIndex: 0, |
|
|
|
// zoomOnMouseWheel: false, // 滚轮是否触发缩放 |
|
|
|
// moveOnMouseMove: true, // 鼠标滚轮触发滚动 |
|
|
|
// moveOnMouseWheel: true, |
|
|
|
// }, |
|
|
|
// ], |
|
|
|
//滑块样式 |
|
|
|
dataZoom: [ |
|
|
|
{ |
|
|
|
show: true, |
|
|
|
type: 'slider', |
|
|
|
zoomLock: true, |
|
|
|
// backgroundColor: 'yellow', |
|
|
|
fillerColor: new echarts.graphic.LinearGradient( |
|
|
|
0, |
|
|
|
0, |
|
|
|
1, |
|
|
|
0, |
|
|
|
[ |
|
|
|
{ |
|
|
|
offset: 0, |
|
|
|
color: 'rgba(97, 134, 255, 1)', |
|
|
|
}, |
|
|
|
{ |
|
|
|
offset: 1, |
|
|
|
color: 'rgba(36, 186, 255, 1)', |
|
|
|
}, |
|
|
|
], |
|
|
|
false, |
|
|
|
), |
|
|
|
height: 12, // 设置slider的高度为15 |
|
|
|
// start: 0, |
|
|
|
// end: 100, |
|
|
|
startValue: 0, // 从头开始。 |
|
|
|
endValue: 23, |
|
|
|
bottom: 20, |
|
|
|
height: 10, |
|
|
|
showDetail: false, |
|
|
|
}, |
|
|
|
{ |
|
|
|
show: true, |
|
|
|
type: 'inside', |
|
|
|
xAxisIndex: 0, |
|
|
|
zoomOnMouseWheel: false, // 滚轮是否触发缩放 |
|
|
|
moveOnMouseMove: true, // 鼠标滚轮触发滚动 |
|
|
|
moveOnMouseWheel: true, |
|
|
|
right: 60, |
|
|
|
left: 60, |
|
|
|
bottom: 10, |
|
|
|
handleIcon: |
|
|
|
'path://M30.9,53.2C16.8,53.2,5.3,41.7,5.3,27.6S16.8,2,30.9,2C45,2,56.4,13.5,56.4,27.6S45,53.2,30.9,53.2z M30.9,3.5M36.9,35.8h-1.3z M27.8,35.8 h-1.3H27L27.8,35.8L27.8,35.8z', // 使用类似 axisPointer 的图标 |
|
|
|
handleSize: '140%', // 放大按钮 |
|
|
|
// borderColor: 'none', |
|
|
|
handleStyle: { |
|
|
|
color: new echarts.graphic.LinearGradient( |
|
|
|
0, |
|
|
|
0, |
|
|
|
1, |
|
|
|
0, |
|
|
|
[ |
|
|
|
{ |
|
|
|
offset: 0, |
|
|
|
color: 'rgba(97, 134, 255, 1)', |
|
|
|
}, |
|
|
|
{ |
|
|
|
offset: 1, |
|
|
|
color: 'rgba(36, 186, 255, 1)', |
|
|
|
}, |
|
|
|
], |
|
|
|
false, |
|
|
|
), |
|
|
|
borderWidth: 4, |
|
|
|
borderColor: new echarts.graphic.LinearGradient( |
|
|
|
0, |
|
|
|
0, |
|
|
|
0, |
|
|
|
1, |
|
|
|
[ |
|
|
|
{ |
|
|
|
offset: 0, |
|
|
|
color: 'rgba(255, 255, 255, 1)', |
|
|
|
}, |
|
|
|
{ |
|
|
|
offset: 1, |
|
|
|
color: 'rgba(204, 238, 255, 1)', |
|
|
|
}, |
|
|
|
], |
|
|
|
false, |
|
|
|
), |
|
|
|
shadowOffsetX: 0, // 阴影偏移x轴多少 |
|
|
|
shadowOffsetY: 0, // 阴影偏移y轴多少 |
|
|
|
}, |
|
|
|
// 显示的label的格式化器 |
|
|
|
// 20050101 变为 2005\n0101 |
|
|
|
// labelFormatter: function (index, value) { |
|
|
|
// const year = value.slice(0, 4); |
|
|
|
// const date = value.slice(4); |
|
|
|
// return year + '\n' + date; |
|
|
|
// }, |
|
|
|
// textStyle: { |
|
|
|
// fontStyle: 'italic', // 设置字体倾斜 |
|
|
|
// }, |
|
|
|
// showDataShadow: false, // 隐藏数据阴影 |
|
|
|
}, |
|
|
|
], |
|
|
|
visualMap: { |
|
|
|