|
|
|
@ -58,11 +58,11 @@ |
|
|
|
</div> |
|
|
|
<div class="picture-view"> |
|
|
|
<div class="picture-container raman-picture-container" v-show="currentTab === 'boundary-layer-height'"> |
|
|
|
<div class="picture"> |
|
|
|
<h2 class="title-watervapor">水汽</h2> |
|
|
|
<div class="picture special-picture"> |
|
|
|
<h2 class="title special-title">水汽</h2> |
|
|
|
<div v-loading="loadingWaterVaporSingleStatus" |
|
|
|
style="width: 100%;" |
|
|
|
custom-class="loading" |
|
|
|
custom-class="special-loading" |
|
|
|
element-loading-text="加载中"> |
|
|
|
<canvas id='watervapor_single_chart'></canvas> |
|
|
|
</div> |
|
|
|
@ -165,8 +165,6 @@ |
|
|
|
<h2 class="title" style="left: 2.4rem;">水汽</h2> |
|
|
|
<div v-loading="loadingWaterVaporStatus" |
|
|
|
style="width: 100%" |
|
|
|
custom-class="loading" |
|
|
|
|
|
|
|
element-loading-text="加载中"> |
|
|
|
<canvas id='watervapor_chart'></canvas> |
|
|
|
</div> |
|
|
|
@ -519,7 +517,7 @@ export default { |
|
|
|
}) |
|
|
|
let interval = ( 24 / prepareData.length ); |
|
|
|
let data = []; |
|
|
|
for (let i = 0 , len = prepareData.length ; i < len ; i++) { |
|
|
|
for (let i = 0, len = prepareData.length; i < len; i++) { |
|
|
|
data.push([parseFloat((interval * i).toFixed(2)), prepareData[i]]) |
|
|
|
} |
|
|
|
return data; |
|
|
|
@ -1095,22 +1093,15 @@ export default { |
|
|
|
.raman-picture-container { |
|
|
|
width: calc(~"100% - 1rem"); |
|
|
|
margin: 0 auto; |
|
|
|
.special-picture { |
|
|
|
:deep(.el-loading-mask) { |
|
|
|
top: 64px!important; |
|
|
|
} |
|
|
|
} |
|
|
|
.picture { |
|
|
|
position: relative; |
|
|
|
margin-top: 30px; |
|
|
|
:deep(.loading) { |
|
|
|
:deep(.el-loading-mask) { |
|
|
|
top: 39px!important; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.title-watervapor { |
|
|
|
position: absolute; |
|
|
|
left: 50%; |
|
|
|
margin-left: -10px; |
|
|
|
top: 0px; |
|
|
|
width: 100%; |
|
|
|
} |
|
|
|
#watervapor_single_chart { |
|
|
|
transform: scale(0.8,0.4) translateX(50%); |
|
|
|
} |
|
|
|
@ -1118,10 +1109,11 @@ export default { |
|
|
|
transform: scale(0.5,0.8) translateX(-40%); |
|
|
|
} |
|
|
|
#pm2_5_chart { |
|
|
|
transform: scale(0.5,0.4) translate(-311px, 444px); |
|
|
|
transform: scale(0.5,0.4) translate(-316px, 415px); |
|
|
|
} |
|
|
|
#pm10_chart { |
|
|
|
transform: scale(0.5,0.4) translate(-314px, -475px); |
|
|
|
|
|
|
|
} |
|
|
|
#backscatter_chart { |
|
|
|
transform: scale(0.6,0.85) translateX(-260px); |
|
|
|
@ -1140,11 +1132,14 @@ export default { |
|
|
|
top: 0.30rem; |
|
|
|
z-index: 100; |
|
|
|
} |
|
|
|
|
|
|
|
.special-title { |
|
|
|
left: 48%; |
|
|
|
} |
|
|
|
.pblh-image { |
|
|
|
width: 50%; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
