From 68ed8f5710eff2b6e96864da03df27ab8cc33c7d Mon Sep 17 00:00:00 2001 From: xuhuihui <3548508071@qq.com> Date: Mon, 28 Feb 2022 09:28:10 +0800 Subject: [PATCH] commit --- 04.系统编码/Frontend/index.html | 5 +- 04.系统编码/Frontend/package-lock.json | 14 +- 04.系统编码/Frontend/package.json | 2 +- 04.系统编码/Frontend/public/favicon.ico | Bin 9662 -> 4286 bytes .../src/components/MicrowaveRadiation.vue | 474 ++++++- .../Frontend/src/components/RamanLidar.vue | 1115 +++++++++++------ .../src/components/SystemManagement.vue | 2 +- 04.系统编码/Frontend/src/index.less | 35 +- .../Frontend/src/model/constant.ts | 3 + .../Frontend/src/model/high-chart-create.ts | 14 +- .../Frontend/src/uilts/box-drawer.ts | 6 +- 11 files changed, 1174 insertions(+), 496 deletions(-) diff --git a/04.系统编码/Frontend/index.html b/04.系统编码/Frontend/index.html index 796b397..82d9ad3 100644 --- a/04.系统编码/Frontend/index.html +++ b/04.系统编码/Frontend/index.html @@ -2,12 +2,13 @@ - + 南京生态环境评估决策平台
- + + diff --git a/04.系统编码/Frontend/package-lock.json b/04.系统编码/Frontend/package-lock.json index 10c2ab2..c3a027c 100644 --- a/04.系统编码/Frontend/package-lock.json +++ b/04.系统编码/Frontend/package-lock.json @@ -13,7 +13,7 @@ "crypto-js": "^4.1.1", "echarts": "^5.2.2", "element-plus": "^1.2.0-beta.4", - "highcharts": "^9.3.2", + "highcharts": "^9.3.3", "js-md5": "^0.7.3", "jsencrypt": "3.0.0-rc.1", "moment": "^2.29.1", @@ -1652,9 +1652,9 @@ "dev": true }, "node_modules/highcharts": { - "version": "9.3.2", - "resolved": "https://registry.npmjs.org/highcharts/-/highcharts-9.3.2.tgz", - "integrity": "sha512-I/48gNMvs3hZxZnPRUqLbnlrGZJJ7YPPVr1+fYeZ35p4pSZAOwTmAGbptrjBr7JlF52HmJH9zMbt/I4TPLu9Pg==" + "version": "9.3.3", + "resolved": "https://registry.npmjs.org/highcharts/-/highcharts-9.3.3.tgz", + "integrity": "sha512-QeOvm6cifeZYYdTLm4IxZsXcOE9c4xqfs0z0OJJ0z7hhA9WG0rmcVAyuIp5HBl/znjA/ayYHmpYjBYD/9PG4Fg==" }, "node_modules/http-assert": { "version": "1.5.0", @@ -5055,9 +5055,9 @@ "dev": true }, "highcharts": { - "version": "9.3.2", - "resolved": "https://registry.npmjs.org/highcharts/-/highcharts-9.3.2.tgz", - "integrity": "sha512-I/48gNMvs3hZxZnPRUqLbnlrGZJJ7YPPVr1+fYeZ35p4pSZAOwTmAGbptrjBr7JlF52HmJH9zMbt/I4TPLu9Pg==" + "version": "9.3.3", + "resolved": "https://registry.npmjs.org/highcharts/-/highcharts-9.3.3.tgz", + "integrity": "sha512-QeOvm6cifeZYYdTLm4IxZsXcOE9c4xqfs0z0OJJ0z7hhA9WG0rmcVAyuIp5HBl/znjA/ayYHmpYjBYD/9PG4Fg==" }, "http-assert": { "version": "1.5.0", diff --git a/04.系统编码/Frontend/package.json b/04.系统编码/Frontend/package.json index 8415147..6fb5d08 100644 --- a/04.系统编码/Frontend/package.json +++ b/04.系统编码/Frontend/package.json @@ -11,7 +11,7 @@ "crypto-js": "^4.1.1", "echarts": "^5.2.2", "element-plus": "^1.2.0-beta.4", - "highcharts": "^9.3.2", + "highcharts": "^9.3.3", "js-md5": "^0.7.3", "jsencrypt": "3.0.0-rc.1", "moment": "^2.29.1", diff --git a/04.系统编码/Frontend/public/favicon.ico b/04.系统编码/Frontend/public/favicon.ico index 4a45747c25205f2f2cdc2f65a20f680bd48979f2..92dc57c2d7d6175e81c7204a0949b4822feef763 100644 GIT binary patch literal 4286 zcmb7Hd303u6@Jk_dRk9QPd)bZ98ay+A}Pc==un+KP)Cwa)a65hM{rs-pP;k(bq45M~7>8wwlIq%l; z@^aq`7cLxhI-REG=H|NA*4Fx#mX;<;71z$x)z$4SD=S-+mzVc5gCX4~BO~Lx6TfR!)~|lYHVyQqaIIveLYG`OF>&uQBi@~+FI1q)TsY*ucM=5fX|jxS66Sz z&(FUtaNj;H&0x5WmTNDUl$2;WIXOS#z8f1F8fxg<6#Ye7S{gDlGhr|oaQN_H==Eu^ zTCE5V4+nh(^?|-CyV}~?CTVXaZS>E|%DTy%Z@#v&8LQk^qb|)-Y`K$hj&-?QW4XDx zNKH+Jk^3j7q$nL_mLk+umc#9+RfoO8hU&@+n6k3eVK5pIA0H3qLgL|JUZM*N3va8e zsMK+;cTg605)I`R&~~Ki^^klpe_$*?ztY79#_NjG8CSB-XYX@39Hj*X z1uCaSMMY?rck?q~cz+#YSICvv@yV@_GFDaTHQ_S9=@EqQ6AK8;fvy z{WFO1n}^UvcTd}}i;die*S*M`u_>KSDsYyX{{*2#f}bicXumH zFb1H1A(^Jk9~2cADH}>kOSBhPEcYSS{>hk6NUrt7SxciE`Csit*t7RQ_wp0d`d^xd zxV29q;mv2M`wvLmyaZ=9F2<=>|BSO+mNFjmm5p-$8`>x9tyVK!Za0F1gOQz`ExGUz zlWT}g%|e_{$Gzk}>TVSLhK7d1&Uz}>9Yff2_aNfM-zk4X7Tm?(_aY-`1DsjsaLHYV zq3(+qzSM<*i_K`SC`MuMK4srGiyu&S$UE_`FGQQ&1}m}17{g|>fx0S*g*&CrmM>f8 zLwp{fJqm9Ucef=6k-iVp_g|}ciXF12HS#D%2l^l~H8llKUk|#Sc4dpKPfbo@u(KT( z(&Lc-A=|V z5dU{7`&z7d=y5w#O@xGmsJdusYRqR}xTUn&a?WonqB4h6cn7{Y{d7r(`Q{f;o)Ja@x81$t6V21C*vHC zblR_;=X*V_3(99X)g(u%dKhSL!Z>~IYi>XuZ83kbNBNrd$vepYbSHIwu5cmm2p-B$ z9alIO{M4I`D7KWS{yj7_BzZVP-1SaOOrWx|5+-9h5;iZziKp&B+OF3w=X<2T7pDDh zqqnJEwpAjzwx`4h5HU71pkgr4-b@S}f-UAN?_;cy4kWzw96}b%hV^tPvf0n2zm1NL z!tHifNuTwK#5!&FYltHDOw8Bh_?WsS^_BUrEf70IWIgxDyXda3R=;PS`WYXI#g)8y zR4dKGKADKU^dj1ErM=_vO+w|%AR9g;(@Nd1a_#(!9@MFczgcl}lVW7zB3*i*dX z&Nr$V(`qXq&IVO1N+Ui)^0pNy4*5i3PIQ-ieHi6&C%msgYENoddY8K(vBCJ; z8#v!3|6VCL7KD?}{0iT^@Eg|7M)Wk;)h)r2)VA@%x0K(qIK}roz1=Dw?Ufc~dwJaP z%dwZbkRB28%xunxN73cDlCN>rEb*5@{&HeuWV)}&o=rt2gfDqW%@gV4DLeg8eDVMq zxh~S>s8T)WlB-T(Pu3*Hg`CT^sXF;dn`>1Z^t)bF{WEmo9HcR>mtq^)qkZ21qB7+^*7$Y(H(CQgZHVP zFEdT-m%aL0T$kUMxVM!T5`WpM7f3Ed#0KLBZ>sqx^IGhPT)O~U-dvA>fB@C|Z*MQQZ{LoUD_3Iwz98s>Hu2rNR4qm>e;6SP?^1o$>!a*(EvYjm zsF(={kUEMcH_#o~hc#>0VfE_OioZ#|$xq)M8XTOSzr~gZ+S}V(g?mUJ>>yVe>}W;$ zduyq8j+*~btlt>&0O2-+oo$zM@3lc{)Nwvh&0pb0;Y;TdM-QT!v!c7ZOZD7{hzJY} z41k=yj`Mf6%-<4=MTfHHU_aKqGM_x-dCv65RUM@UtcK<5 zLke#)6RMLUrhClt->Z3ldfn5AU-uMj@nIPI787Ep)H&lkM*gvhKeb}&77;#1o_n*? z=}eZsC?YfZ*s);5Mn#}3_Bi6!{7vZ>ULgE0YUQJ=_x2)?~b7@g06_1ne z1Fs0?$u;80Lw;znT+IQ62hooE*%L~|2Axg^e}8}M*trwz5$J7nz!n>f^FbStNX{j^ zOJZ_%%M!$sA4-oC-r&mBqsi&O+grC{-n@AT3=CBLR`%pRx#XI&$+4B+Gf&x>CXL@Y z!hz?qFY=L6Y}>XCk&%&*UL_)Xw745kSCWs;x=K~&(o?$XD$rD01y_SpJtuJ%9_i=j zhnScc2;MknbLroMWo5RRYOlIZOHb2iqr_njbCJjznGo*k6|Ujv(WBVE|6_@xcbWE0 z@!Kd}aVzhl%oy@2kav%h^Trky6y9d9v1>-7@hY9y`XQXyY&QR-#%>Q_T{wjwh)8|- z`ubwS269l^;+3SNB&=GsO2tan#DC8BDRSK!^1Q7%Ik~eK*K4V|?wTRpphZW=_%L5{ z$WuOM%~a7J5A9d{VQ_HJs~+-=Cf|UpY3XYo&NLgZKP(`}{r;?*w3O7;>+1Qg8}bd! z?|~cmUHNm?&58!6^N3)SIy!ma+oRL%a^*Yf9f!!TefjLIy4Yx+)YR#3=>MeydwejZ zX@L`(Hh)CZe$lIGvs{|?J(H&0xM%wC;rnv@zv8op@A0_N#KXlsWpB|TxV?87taRJDsKDw4Kg$rnT*-?R2In39A8I5M00o zM8LY^MqP>^6tO^n>|<7)L^2+Mo%G2Ra8QKM@|!th=$X>>oAGUhUuGWK%6$9~o&jl9?;43Bb*(b!sD zckBIy>i0;-zz=`zMJ>DM)6>Fm4>#NcHRq$6bCYm1Cyuztt(tg^Tlf6GxS}PGxI=5_ zxue^XUG?5vccOTm_2av<+>y;ITxsqcx8uX{E^p>Pxbz3V=n{tYa+1+1S=%J@N%cW- z(O%SYt?eh(-j|?+k?O;|0qUb=w=L>zspCH9*1z^+cW}*YS9iF`wKdnfNbBfu?XAtO zt);(a(%UT!HLh}NlG`9#B;R`}dNgXTKWNTxWKZ(E6(7^5R>;q_ zju%VT&wRV|ayirQu=(4X8w_{jiE>xA_Iz9=qgdOdq%Uk-v5y z{q~oxeElNVRCB~+wKkk`hw|pS%qRcWCB#Ijn@{~n^Y>BzlN#g25B+p~NWM~)H2M;^ z_5D$4?DL#yx4DCvvt4uDag$wJu~WMJ zw@Z|s(xFl^?@PGHyI3~4pe7uidSAWwu&$?4#tv}%lAo2&*13-MHg{~tO1JKX@4Cbh zecVTH{mSiLG1aArUoHr{bX+;%YFC{8lFOa(_mMS98rj$3W7T_dY@alrKJJPZKjM-{ zUy2SVC3~!{7pb4O!7*=%i#7gN!d{&U_LS$e7n{sqS>Kft{>tV}7#3w*!Q@V-Efzh?Zl`q8htij7OmPHjzf;eQh0Lyt|f<5qE1(_SBN1 zWp^L@w>7>v`QFdC;1mk9sBE?CaB7GQ)sTk21` z?H@eQ?Hy#NJ@5r_+M6~n{7|&?G5L~WhhmK64%Qfpn`i65+Ngg~W73F0+ZWz%oCr_s zOMTuY$6jXhfdSuyzmF8gyT+QsE_eF36tntDH;Yf_^riTrvi}V1f5PN*f3~jZfX|`> z{@PN1!fkrz*WtK0Vf-9eJGX?P!al_7C0Ub&uXXKn-*Js6%4|O!62F+;g&XeN@cK_= z_j&GA*;eV-AX;yC^~d%b2X0#s>-$$^jf78so6fRH>bL=J^SgJuR`~{diu=S7+RKdT z^bUWs4sb24?#LeF3dv~_#&KEWZI4D&&@*h$+8ju`|1T6jQ|-N~ovRdEzijhoOupWg z7kpr`2fRl%FL$Ra_t<^KhCf)GZ55XjbMqCG*dO2q$1(BZFu9S$|>%2 zm0J>}<0*IgXt9k4FMNP);9%k~`++NKLkt6l@RhtXF~Rsp&v>3Sj?pkC-WZHYQh`)g-?o$6{Ue zUb}u94&Nt4d;PUu>BPeFf<-njevvflV#|RKZ(8PR%eQMEbmsUdS1{{`u0eX%A3NYy zJu)z|2Q#0%$<cZJy+ej+wv3v|Gz*l)Cw ztheL?7h%UG>X)eBE`7?@Jbr^~s4g?!-T3Cuo$@A&?fAg{m9u2~UM35_SwHJPjdPH9 z`dG2@86Q76KKW=0VD)R5(>RwLk=T;|(hrosgFn{f;8SJ!3(Plip1Iu}%AM=;5BAp_ zU?MjlKjI#_)&uN27e8!y6!V;&KXe|O{@|A^zQF$>A8`$NeNVzO;XZs_@8w~a$}I_q zwH#eOW%IMva33)|^hJD{JSF6xFn?fvVjb&iIg(^_#Xiya2!4YL&xv1hSUY6ln;DY^ zMdoII(}*|3J;_fN)^hlY*n)o*&KYXh!MkSi4aR@)S1{i9N3iKEOC0v`Uu(W`Y)85~ zx;;(%-r|heh}>nzqVcvaC0TFVIi!TuVR^= z*Tdg+hjk`WT*-gw`!<#}Aa6LXoc8#hY~v!HMdlHH&MqN-;@NS@JPBOjOXCeN4_(bRG+KM7SuZd9|Biid&^Z1RDS8Do_pNIIla@OU% zZLvGlE3gy$-1Zmu(lyNM*nePvPxGFo*5KbG&+v=iJCxUwKW%vJE@2P3*|!_M%6ggq z2X^D#0`a!tFW(XFu@idU%pM^pBcELRn}0roUl`DhGfHXpyWKf4(8Jb4V|T|-RSY>~ z`zBl~<_-Ps4E}11Lsg2;oT15S!!>0rwWH8)$*XwAyW}tAyKq3-{h!B1rRtUBAovu% z#ktz%46xzD=I7O=cD4?2Mdk~}@eZ+pc*nJ~jBqT^Li=y~{W#-vYD47(3w2iPXF4FC z_(NPLzawYjeV)U=v}4Ns0$$xH-SXLcN4NVq^R8u2bn$cMRemw~1ey-Wk%x4#ajEbqnLe7;l;0nG2W0ZT4IK z!U$K|+``3rk_WMmv!~wDMP`T(`=pOo+$k+Iz6#ep{GDqz{K9I!p?5ov<80G-vO@9v z=Ez(YzXBWYiGMou$yfBAg_z&`_wl$&*B@Lr}T_7WUOk0V7L0L-Y=mJ4v*6I zBuwj>YiyoD%JXKJ&1*_NQmmO{a}dM8!I}Tmp+e)ivLXBKl7ES->M#I%Y}c*aI0TUkq&L>OkJCG*uQF)c&rD$46&Z$ik4fpX6NFGR&T?;DPu18*Fkc8U3%Mh4)}sR!fFKa8R}HjEXncU zi7j)**NU;4FH0Es?$)g(MqACFy?m#7X^QHdoOf6QWS~QkbDS4*7oCKYH9wf~hVfBp z&buya>R|KljK{ue=Q{GYnvzW}d)nWbZp3=H0e^3AX)+$61|&=slKs8-5%P6m?Wyri zblFh*MmJ3Msb$T59a?QK7N=2zzT&*T+yy`DW4}+6y@^br_SadLG~U z0-qtrc~Kb15&opccy)9hsp}#5p0gNyHueO02Kf$i(x?-__0;w_uk-B` zzQfPx{7p@WI#P-98_rhL+G%hc-@2)<1>YIkG*_USAefT}sFlnE_S>%y){x)5MZ`jm`$(N|JQs<1s2H)m0CI6aC)y9`;?oX<% zkgVm=_AT~y=`mY+lu5S^atCS?oMAb45GUbs@*loa<73ns`L;+sjqhmWd3>87rXWLj z%OvwH?a@0lPakadX*JbAJoP@B^A^p?{|Aww`6|>~^tbIx>Q`_fbtS&-kuSsRi6gCU z4CZF_GL27{jETrv?#ukNV0V+tcYXCJ%{@TebuTv2TNVxqi!5 ze@FcR-QT9(KY553m3((M@fZBSInT4+X^J;uOzo

区域选择

- 江宁 + 江宁 + 六合 + 浦口 + 高淳 + 溧水
@@ -93,51 +101,96 @@
-
+
+
-

{{ titleStartTime }}~{{ titleEndTime }}温度原始数据

+

质控前

-
-

{{ titleStartTime }}~{{ titleEndTime }}温度异常值标记

- -
-
-

{{ titleStartTime }}~{{ titleEndTime }}温度野点插补结果

+ + + + + + + +
+

质控后

-
+
+ + +
-
-
-

{{ titleStartTime }}~{{ titleEndTime }}BP反演温度

+
+
+

BP反演温度

-
-

{{ titleStartTime }}~{{ titleEndTime }}BP反演相对湿度

+
+

BP反演相对湿度

-
-

{{ titleStartTime }}~{{ titleEndTime }}BP反演水汽密度

+
+

BP反演水汽密度

-
-

{{ BPTitleTime }}温度、相对湿度、水汽密度廓线

-
+
+ +
+

温度廓线

+
+
+ +
+

相对湿度廓线

+
+
+ +
+

水汽密度廓线

+
+
-
-
-

{{ titleStartTime }}~{{ titleEndTime }}对流有效位能CAPE

-
+
+
+

对流有效位能CAPE

+
+
+ +
+

K指数

+
-

{{ titleStartTime }}~{{ titleEndTime }}对流抑制势能CIN

+

对流抑制势能CIN

+
+

沙式指数

+
+
+
+

LCL气压

+
+
+
+

850hpa和500hpa温差

+
+
+
+

0度层高度

+
+
+
+

-20度层高度

+
+
@@ -162,13 +215,31 @@ export default { setup() { let timer = null; let creates: { - verticalProfile: HighChartCreate + // verticalProfile: HighChartCreate + verticalProfileTemp: HighChartCreate + verticalProfileVaporDensity: HighChartCreate + verticalProfileRelativeHumidity: HighChartCreate convectiveIndexProfileTimeChartCAPE: HighChartCreate convectiveIndexProfileTimeChartCIN: HighChartCreate + kIndexChart: HighChartCreate + sandIndex: HighChartCreate + airPressure: HighChartCreate + deltaT: HighChartCreate + zeroHeight: HighChartCreate + NegativeTwentyHeight: HighChartCreate } = { - verticalProfile: null, + //verticalProfile: null, + verticalProfileTemp: null, + verticalProfileVaporDensity: null, + verticalProfileRelativeHumidity: null, convectiveIndexProfileTimeChartCAPE: null, - convectiveIndexProfileTimeChartCIN: null + convectiveIndexProfileTimeChartCIN: null, + kIndexChart: null, + sandIndex: null, + airPressure: null, + deltaT: null, + zeroHeight: null, + NegativeTwentyHeight: null } let options = reactive({ @@ -195,6 +266,7 @@ export default { // onPitchTime: 0, BPTitleTime: null, highChartXAxis: [], + specialStartTime: null }); let drawers = { @@ -224,34 +296,81 @@ export default { } const initEcharts = (name) => { - if (name === 'kuoxian') - verticalProfileInit() - else if (name === 'shixu') { + if (name === 'kuoxian') { + // verticalProfileInit() + verticalProfileTempInit() + verticalProfileVaporDensityInit() + verticalProfileRelativeHumidityInit() + } + else if (name === 'shixu') { convectiveIndexProfileTimeChartInitCAPE() convectiveIndexProfileTimeChartInitCIN() + kIndexChartInit() + sandIndexInit() + airPressureInit() + deltaTInit() + zeroHeightInit() + NegativeTwentyHeightInit() } } - const verticalProfileInit = () => { - creates.verticalProfile = new HighChartCreate('container'); - creates.verticalProfile.setChart(true); - creates.verticalProfile.setXAxis('高度(km)', false); - creates.verticalProfile.setYAxis('温度T(degree)', 10, -40, 10, 6, true); - creates.verticalProfile.setYAxis('相对湿度RH(%)', 100, 0, 10, 6); - creates.verticalProfile.setYAxis('水汽密度Q(g/kg)', 10, 0, 1, 11); - creates.verticalProfile.setLegend(); - creates.verticalProfile.setTooltip('{point.category} KM: {point.y}'); - creates.verticalProfile.setSeries('温度', 0, '℃', '#F49927'); - creates.verticalProfile.setSeries('相对湿度', 1, '%', '#3534FD'); - creates.verticalProfile.setSeries('水汽密度', 2, 'g/Kg', '#6AB312'); - creates.verticalProfile.init(); + // const verticalProfileInit = () => { + // creates.verticalProfile = new HighChartCreate('container'); + // creates.verticalProfile.setChart(true); + // creates.verticalProfile.setXAxis('高度(km)', false); + // creates.verticalProfile.setYAxis('温度T(degree)', 10, -40, 10, 6, true); + // creates.verticalProfile.setYAxis('相对湿度RH(%)', 100, 0, 10, 6); + // creates.verticalProfile.setYAxis('水汽密度q(g/kg)', 10, 0, 1, 11); + // creates.verticalProfile.setLegend(); + // creates.verticalProfile.setTooltip('{point.category} KM: {point.y}'); + // creates.verticalProfile.setSeries('温度', 0, '℃', '#F49927'); + // creates.verticalProfile.setSeries('相对湿度', 1, '%', '#3534FD'); + // creates.verticalProfile.setSeries('水汽密度', 2, 'g/Kg', '#6AB312'); + // creates.verticalProfile.init(); + // } + + //垂直廓线温度数据图 + const verticalProfileTempInit = () => { + creates.verticalProfileTemp = new HighChartCreate('verticalProfileTemp'); + creates.verticalProfileTemp.setChart(true); + creates.verticalProfileTemp.setXAxis('高度(km)', false); + creates.verticalProfileTemp.setYAxis('温度T(degree)', 10, -40, 10, 6); + creates.verticalProfileTemp.setLegend(); + creates.verticalProfileTemp.setTooltip('{point.category} KM: {point.y}'); + creates.verticalProfileTemp.setSeries('温度', 0, '℃', '#F49927'); + creates.verticalProfileTemp.init(); + } + + //垂直廓线水汽密度数据图 + const verticalProfileVaporDensityInit = () => { + creates.verticalProfileVaporDensity = new HighChartCreate('verticalProfileVaporDensity'); + creates.verticalProfileVaporDensity.setChart(true); + creates.verticalProfileVaporDensity.setXAxis('高度(km)', false); + creates.verticalProfileVaporDensity.setYAxis('水汽密度q(g/kg)', 10, 0, 1, 11); + creates.verticalProfileVaporDensity.setLegend(); + creates.verticalProfileVaporDensity.setTooltip('{point.category} KM: {point.y}'); + creates.verticalProfileVaporDensity.setSeries('水汽密度', 0, 'g/Kg', '#6AB312'); + creates.verticalProfileVaporDensity.init(); + } + + //垂直廓线相对湿度数据图 + const verticalProfileRelativeHumidityInit = () => { + creates.verticalProfileRelativeHumidity = new HighChartCreate('verticalProfileRelativeHumidity'); + creates.verticalProfileRelativeHumidity.setChart(true); + creates.verticalProfileRelativeHumidity.setXAxis('高度(km)', false); + creates.verticalProfileRelativeHumidity.setYAxis('相对湿度RH(%)', 100, 0, 10, 6); + creates.verticalProfileRelativeHumidity.setLegend(); + creates.verticalProfileRelativeHumidity.setTooltip('{point.category} KM: {point.y}'); + creates.verticalProfileRelativeHumidity.setSeries('相对湿度', 0, '%', '#498DF0'); + creates.verticalProfileRelativeHumidity.init(); } const convectiveIndexProfileTimeChartInitCAPE = () => { creates.convectiveIndexProfileTimeChartCAPE = new HighChartCreate('convectiveHighChartCAPE'); creates.convectiveIndexProfileTimeChartCAPE.setChart(); creates.convectiveIndexProfileTimeChartCAPE.setXAxis( '时间（时/分）', false); - creates.convectiveIndexProfileTimeChartCAPE.setYAxis('CAPE(J/kg)', 500, 0, 100,6); + creates.convectiveIndexProfileTimeChartCAPE.setYAxis('CAPE(J/kg)', 800, 0, 100,9); + creates.convectiveIndexProfileTimeChartCAPE.setLegend(); creates.convectiveIndexProfileTimeChartCAPE.setTooltip('{point.category}: {point.y}(J/kg)'); creates.convectiveIndexProfileTimeChartCAPE.setSeries('CAPE') creates.convectiveIndexProfileTimeChartCAPE.init(); @@ -261,12 +380,85 @@ export default { creates.convectiveIndexProfileTimeChartCIN = new HighChartCreate('convectiveHighChartCIN'); creates.convectiveIndexProfileTimeChartCIN.setChart(); creates.convectiveIndexProfileTimeChartCIN.setXAxis( '时间（时/分）', false); - creates.convectiveIndexProfileTimeChartCIN.setYAxis('CIE(J/kg)', 500, 0, 100,6); + creates.convectiveIndexProfileTimeChartCIN.setYAxis('CIN(J/kg)', 800, 0, 100,9); + creates.convectiveIndexProfileTimeChartCIN.setLegend(); creates.convectiveIndexProfileTimeChartCIN.setTooltip('{point.category}: {point.y}(J/kg)'); creates.convectiveIndexProfileTimeChartCIN.setSeries('CIN') creates.convectiveIndexProfileTimeChartCIN.init(); } + //绘制K指数 + const kIndexChartInit = () => { + creates.kIndexChart = new HighChartCreate('kIndexChart'); + creates.kIndexChart.setChart(); + creates.kIndexChart.setXAxis( '时间（时/分）', false); + creates.kIndexChart.setYAxis('K（℃）', 40, -40, 10,9); + creates.kIndexChart.setLegend(); + creates.kIndexChart.setTooltip('{point.category}: {point.y}(℃)'); + creates.kIndexChart.setSeries('K指数') + creates.kIndexChart.init(); + } + + //绘制沙式指数 + const sandIndexInit = () => { + creates.sandIndex = new HighChartCreate('sandIndexChart'); + creates.sandIndex.setChart(); + creates.sandIndex.setXAxis( '时间（时/分）', false); + creates.sandIndex.setYAxis('SI（℃）', 30, 0, 3,11); + creates.sandIndex.setLegend(); + creates.sandIndex.setTooltip('{point.category}: {point.y}(℃)'); + creates.sandIndex.setSeries('沙式指数') + creates.sandIndex.init(); + } + + //绘制LCl气压 + const airPressureInit = () => { + creates.airPressure = new HighChartCreate('airPressureChart'); + creates.airPressure.setChart(); + creates.airPressure.setXAxis( '时间（时/分）', false); + creates.airPressure.setYAxis('LCL气压（hPa)', 1000, 300, 100,8); + creates.airPressure.setLegend(); + creates.airPressure.setTooltip('{point.category}: {point.y}(hPa)'); + creates.airPressure.setSeries('LCL气压') + creates.airPressure.init(); + } + + //绘制850hpa和500hpa温差 + const deltaTInit = () => { + creates.deltaT = new HighChartCreate('deltaTChart'); + creates.deltaT.setChart(); + creates.deltaT.setXAxis( '时间（时/分）', false); + creates.deltaT.setYAxis('deltaT（℃）', 1000, 300, 100,8); + creates.deltaT.setLegend(); + creates.deltaT.setTooltip('{point.category}: {point.y}(℃)'); + creates.deltaT.setSeries('deltaT') + creates.deltaT.init(); + } + + //绘制0度层高度 + const zeroHeightInit = () => { + creates.zeroHeight = new HighChartCreate('zeroHeightChart'); + creates.zeroHeight.setChart(); + creates.zeroHeight.setXAxis( '时间（时/分）', false); + creates.zeroHeight.setYAxis('hgt_0(m)', 10, 0, 1,11); + creates.zeroHeight.setLegend(); + creates.zeroHeight.setTooltip('{point.category}: {point.y}(m)'); + creates.zeroHeight.setSeries('hgt_0') + creates.zeroHeight.init(); + } + + //绘制-20度层高度 + const NegativeTwentyHeightInit = () => { + creates.NegativeTwentyHeight = new HighChartCreate('NegativeTwentyHeightChart'); + creates.NegativeTwentyHeight.setChart(); + creates.NegativeTwentyHeight.setXAxis( '时间（时/分）', false); + creates.NegativeTwentyHeight.setYAxis('hgt_-20(m)', 20, -20, 5,9); + creates.NegativeTwentyHeight.setLegend(); + creates.NegativeTwentyHeight.setTooltip('{point.category}: {point.y}(m)'); + creates.NegativeTwentyHeight.setSeries('hgt_-20') + creates.NegativeTwentyHeight.init(); + } + const onRegionClick = (region) => { options.currentRegion = region; } @@ -282,6 +474,7 @@ export default { changeColor() }, 0) } + reloadChangeData() } //初始化时间轴 @@ -319,9 +512,11 @@ export default { } const onTimeClick = (time, index) => { + options.currentHour = time.hour.substring(0, 2) options.currentTime = time.date; options.titleStartTime = moment(time.date).add(options.apiTimeLength, 'h').add(options.apiTimeInterval, 'm').format('YYYY-MM-DD HH:mm:ss') options.titleEndTime = time.date + options.date = moment(time.date).format('YYYY-MM-DD') reloadChangeData() } @@ -388,6 +583,12 @@ export default { } else if (options.currentTab === 'shixu') { convectiveIndexCAPEData() convectiveIndexCINData() + kIndexApi() + sandIndexApi() + airPressureApi() + deltaTApi() + zeroHeightApi() + NegativeTwentyHeightApi() } } @@ -410,19 +611,24 @@ export default { clearBoxDrawer(drawers.abnormalDrawer); if (response.code != 200 || response.data.radar_data.length === 0) { createEmptyCanvas('original-data-canvas', 1500, 500); - createEmptyCanvas('abnormal-canvas', 1500, 500); + // createEmptyCanvas('abnormal-canvas', 1500, 500); return; } drawers.originalDrawer = new BoxDrawer(1500, 500, prepareTmpOriginalColors(), response.data, 'original-data-canvas', '℃'); - drawers.abnormalDrawer = new BoxDrawer(1500, 500, prepareTmpOriginalColors(), response.data, 'abnormal-canvas', '℃'); + // drawers.abnormalDrawer = new BoxDrawer(1500, 500, prepareTmpOriginalColors(), response.data, 'abnormal-canvas', '℃'); // options.contrast.noQCImgUrl = drawers.originalDrawer.base64Image; // options.contrast.checkImgUrl = drawers.abnormalDrawer.base64Image; }) } const reloadQualityInterpolation = () => { - const startTime = moment(options.currentTime).add(options.apiTimeLength, 'h').add(options.apiTimeInterval, 'm').format('YYYY-MM-DD HH:mm:00'); - const params = prepareApiParams(401, startTime, options.titleEndTime); + options.specialStartTime = moment(options.currentTime).add(options.apiTimeLength, 'h').add(options.apiTimeInterval, 'm').format('YYYY-MM-DD HH:mm:00'); + if (options.currentTab==='shixu_BPFY') { + if (options.currentElement === 'six-minute') { + options.specialStartTime = moment(options.currentTime).add(-8, 'h').add(options.apiTimeInterval, 'm').format('YYYY-MM-DD HH:mm:00'); + } + } + const params = prepareApiParams(401, options.specialStartTime, options.titleEndTime); get('/njplatform/radardata/getBpRangeData', params, Constant.baseUrl).then((response: any) => { clearBoxDrawer(drawers.interpolateDrawer); if (response.code != 200 || response.data.radar_data.length === 0) { @@ -439,10 +645,14 @@ export default { // options.contrast.fillingImgUrl = drawers.interpolateDrawer.base64Image; }) } + //BP反演相对湿度 const reloadBPRelativeHumidity = () => { - const startTime = moment(options.currentTime).add(options.apiTimeLength, 'h').add(options.apiTimeInterval, 'm').format('YYYY-MM-DD HH:mm:00'); - const params = prepareApiParams(404, startTime, options.titleEndTime); + options.specialStartTime = moment(options.currentTime).add(options.apiTimeLength, 'h').add(options.apiTimeInterval, 'm').format('YYYY-MM-DD HH:mm:00'); + if (options.currentElement === 'six-minute') { + options.specialStartTime = moment(options.currentTime).add(-8, 'h').add(options.apiTimeInterval, 'm').format('YYYY-MM-DD HH:mm:00'); + } + const params = prepareApiParams(404, options.specialStartTime, options.titleEndTime); get('/njplatform/radardata/getBpRangeData', params, Constant.baseUrl).then((response: any) => { clearBoxDrawer(drawers.BPRelativeHumidity); if (response.code != 200 || response.data.radar_data.length === 0) { @@ -453,10 +663,14 @@ export default { // options.contrast.fillingImgUrl = drawers.interpolateDrawer.base64Image; }) } + //水汽密度 const reloadBPVaporDensity = () => { - const startTime = moment(options.currentTime).add(options.apiTimeLength, 'h').add(options.apiTimeInterval, 'm').format('YYYY-MM-DD HH:mm:00'); - const params = prepareApiParams(402, startTime, options.titleEndTime); + options.specialStartTime = moment(options.currentTime).add(options.apiTimeLength, 'h').add(options.apiTimeInterval, 'm').format('YYYY-MM-DD HH:mm:00'); + if (options.currentElement === 'six-minute') { + options.specialStartTime = moment(options.currentTime).add(-8, 'h').add(options.apiTimeInterval, 'm').format('YYYY-MM-DD HH:mm:00'); + } + const params = prepareApiParams(402, options.specialStartTime, options.titleEndTime); get('/njplatform/radardata/getBpRangeData', params, Constant.baseUrl).then((response: any) => { clearBoxDrawer(drawers.BPVaporDensity); if (response.code != 200 || response.data.radar_data.length === 0) { @@ -472,7 +686,8 @@ export default { const startTime = moment(options.currentTime).add(options.apiTimeLength, 'h').add(options.apiTimeInterval, 'm').format('YYYY-MM-DD HH:mm:00'); const params = prepareApiParams(401, startTime, options.titleEndTime); get('/njplatform/radardata/getBpRangeData', params, Constant.baseUrl).then((response: any) => { - creates.verticalProfile.updateSeries(0, getVerticalProfileResponseData(response)); + // creates.verticalProfile.updateSeries(0, getVerticalProfileResponseData(response)); + creates.verticalProfileTemp.updateSeries(0,getVerticalProfileResponseData(response)) }) } @@ -480,7 +695,8 @@ export default { const startTime = moment(options.currentTime).add(options.apiTimeLength, 'h').add(options.apiTimeInterval, 'm').format('YYYY-MM-DD HH:mm:00'); const params = prepareApiParams(402, startTime, options.titleEndTime); get('/njplatform/radardata/getBpRangeData', params, Constant.baseUrl).then((response: any) => { - creates.verticalProfile.updateSeries(2, getVerticalProfileResponseData(response)); + // creates.verticalProfile.updateSeries(2, getVerticalProfileResponseData(response)); + creates.verticalProfileVaporDensity.updateSeries(0, getVerticalProfileResponseData(response)); }) } @@ -488,17 +704,22 @@ export default { const startTime = moment(options.currentTime).add(options.apiTimeLength, 'h').add(options.apiTimeInterval, 'm').format('YYYY-MM-DD HH:mm:00'); const params = prepareApiParams(404, startTime, options.titleEndTime); get('/njplatform/radardata/getBpRangeData', params, Constant.baseUrl).then((response: any) => { - creates.verticalProfile.updateSeries(1, getVerticalProfileResponseData(response)); + // creates.verticalProfile.updateSeries(1, getVerticalProfileResponseData(response)); + creates.verticalProfileRelativeHumidity.updateSeries(0,getVerticalProfileResponseData(response)) }) } + const getVerticalProfileResponseData = (response) => { if (response.code != 200 || response.data == null || response.data.radar_data.length === 0) { options.BPTitleTime = null; verify(); return []; } - creates.verticalProfile.updateXAxis(response.data.radar_info.map(r => r.col_factor)); + // creates.verticalProfile.updateXAxis(response.data.radar_info.map(r => r.col_factor)); + creates.verticalProfileTemp.updateXAxis(response.data.radar_info.map(r => r.col_factor)) + creates.verticalProfileVaporDensity.updateXAxis(response.data.radar_info.map(r => r.col_factor)) + creates.verticalProfileRelativeHumidity.updateXAxis(response.data.radar_info.map(r => r.col_factor)) // verticalProfileHighChart.xAxis[0].setCategories(response.data.radar_info.map(r => r.col_factor)); response.data.radar_data.sort((x, y) => { return moment(x.data_time).isBefore(moment(y.data_time)); @@ -531,6 +752,71 @@ export default { creates.convectiveIndexProfileTimeChartCIN.updateXAxis(data[1], 0) }) } + //K-index + const kIndexApi = () => { + const startTime = moment(options.currentTime).add(options.apiTimeLength, 'h').add(options.apiTimeInterval, 'm').format('YYYY-MM-DD HH:mm:00'); + const params = prepareApiParams('K', startTime, options.titleEndTime); + get('/njplatform/radardata/getBpRangeData', params, Constant.baseUrl).then((response) => { + let data = convectiveIndexResponseData(response); + creates.kIndexChart.updateSeries(0,data[0]) + creates.kIndexChart.updateXAxis(data[1], 0) + }) + } + + //沙式指数 + const sandIndexApi = () => { + const startTime = moment(options.currentTime).add(options.apiTimeLength, 'h').add(options.apiTimeInterval, 'm').format('YYYY-MM-DD HH:mm:00'); + const params = prepareApiParams('SI', startTime, options.titleEndTime); + get('/njplatform/radardata/getBpRangeData', params, Constant.baseUrl).then((response) => { + let data = convectiveIndexResponseData(response); + creates.sandIndex.updateSeries(0,data[0]) + creates.sandIndex.updateXAxis(data[1], 0) + }) + } + + //LCL气压 + const airPressureApi = () => { + const startTime = moment(options.currentTime).add(options.apiTimeLength, 'h').add(options.apiTimeInterval, 'm').format('YYYY-MM-DD HH:mm:00'); + const params = prepareApiParams('LCL_pres', startTime, options.titleEndTime); + get('/njplatform/radardata/getBpRangeData', params, Constant.baseUrl).then((response) => { + let data = convectiveIndexResponseData(response); + creates.airPressure.updateSeries(0,data[0]) + creates.airPressure.updateXAxis(data[1], 0) + }) + } + + //850hpa和500hpa温差 + const deltaTApi = () => { + const startTime = moment(options.currentTime).add(options.apiTimeLength, 'h').add(options.apiTimeInterval, 'm').format('YYYY-MM-DD HH:mm:00'); + const params = prepareApiParams('LCL_pres', startTime, options.titleEndTime); + get('/njplatform/radardata/getBpRangeData', params, Constant.baseUrl).then((response) => { + let data = convectiveIndexResponseData(response); + creates.deltaT.updateSeries(0,data[0]) + creates.deltaT.updateXAxis(data[1], 0) + }) + } + + //绘制0度层高度 + const zeroHeightApi = () => { + const startTime = moment(options.currentTime).add(options.apiTimeLength, 'h').add(options.apiTimeInterval, 'm').format('YYYY-MM-DD HH:mm:00'); + const params = prepareApiParams('hgt_0', startTime, options.titleEndTime); + get('/njplatform/radardata/getBpRangeData', params, Constant.baseUrl).then((response) => { + let data = convectiveIndexResponseData(response); + creates.zeroHeight.updateSeries(0,data[0]) + creates.zeroHeight.updateXAxis(data[1], 0) + }) + } + + //绘制-20度层高度 + const NegativeTwentyHeightApi = () => { + const startTime = moment(options.currentTime).add(options.apiTimeLength, 'h').add(options.apiTimeInterval, 'm').format('YYYY-MM-DD HH:mm:00'); + const params = prepareApiParams('hgt_-20', startTime, options.titleEndTime); + get('/njplatform/radardata/getBpRangeData', params, Constant.baseUrl).then((response) => { + let data = convectiveIndexResponseData(response); + creates.NegativeTwentyHeight.updateSeries(0,data[0]) + creates.NegativeTwentyHeight.updateXAxis(data[1], 0) + }) + } const convectiveIndexResponseData = (response) => { if (response.code != 200 || response.data == null || response.data.radar_data.length === 0) { @@ -626,32 +912,84 @@ export default { diff --git a/04.系统编码/Frontend/src/components/SystemManagement.vue b/04.系统编码/Frontend/src/components/SystemManagement.vue index 51329a9..6bab266 100644 --- a/04.系统编码/Frontend/src/components/SystemManagement.vue +++ b/04.系统编码/Frontend/src/components/SystemManagement.vue @@ -92,7 +92,7 @@ import {post} from "../uilts/axios"; import {ElMessage} from 'element-plus' import {format} from '../uilts/String'; -import { decrypt, encrypt } from '../uilts/Coder'; + import { decrypt, encrypt } from '../uilts/Coder'; export default { name: 'SystemManagement', diff --git a/04.系统编码/Frontend/src/index.less b/04.系统编码/Frontend/src/index.less index 983bf6a..68e8e7e 100644 --- a/04.系统编码/Frontend/src/index.less +++ b/04.系统编码/Frontend/src/index.less @@ -168,7 +168,7 @@ img { position: relative; .toolbar { - //padding-top: 0.25rem; + margin: 0 0.25rem; display: flex; align-items: center; @@ -178,10 +178,7 @@ img { display: flex; margin-right: 0.2rem; align-items: center; - padding-bottom: 0.12rem; - //border-left: 1px solid #666666; - //border-right: 1px solid #666666; - //background-color: #ECF4FF; + padding-bottom: 0.07rem; div:first-child { span:last-child { border-radius: 0.05rem 0 0 0.05rem; @@ -250,17 +247,6 @@ img { } } } - - //.first-hour::before, .time-item .time::before { - // content: ''; - // width: 1px; - // height: 100%; - // display: block; - // position: absolute; - // left: -1px; - // bottom: 0; - // background-color: #666666; - //} } .halfHour { @@ -298,6 +284,7 @@ img { } .date-picker { + width: 1.44rem; height: 0.33rem; line-height: normal; @@ -384,8 +371,7 @@ img { .times { .time-item { .time { - line-height: 0.46rem; - + //line-height: 0.46rem; } } } @@ -427,13 +413,14 @@ img { //} .picture-container { + height: 100%; display: flex; - flex-direction: column; + //flex-direction: column; justify-content: center; - + align-content: center; .picture { - height: 100%; + //height: 100%; //.el-image { // height: 100%; @@ -442,9 +429,9 @@ img { } .picture { - //width: 100%; - //height: calc(~"100% - 1.1rem"); - //margin: 0 auto; + width: 100%; + height: calc(~"100% - 1.1rem"); + margin: 0 auto; display: flex; align-items: center; justify-content: center; diff --git a/04.系统编码/Frontend/src/model/constant.ts b/04.系统编码/Frontend/src/model/constant.ts index aea9397..c1cedc4 100644 --- a/04.系统编码/Frontend/src/model/constant.ts +++ b/04.系统编码/Frontend/src/model/constant.ts @@ -1,3 +1,6 @@ export class Constant{ public static readonly baseUrl: string = 'http://rdp.nagr.com.cn:18080'; +} +export class ConstantRamanLidar{ + public static readonly baseUrl: string = 'http://112.124.40.88:5511/'; } \ No newline at end of file diff --git a/04.系统编码/Frontend/src/model/high-chart-create.ts b/04.系统编码/Frontend/src/model/high-chart-create.ts index a27975c..9bac4b5 100644 --- a/04.系统编码/Frontend/src/model/high-chart-create.ts +++ b/04.系统编码/Frontend/src/model/high-chart-create.ts @@ -31,7 +31,8 @@ export class HighChartCreate { text: text, style: { color: '#000000', - fontSize: '18px' + fontSize: '14px', + fontFamily: 'Verdana' } }, categories: [], @@ -46,7 +47,8 @@ export class HighChartCreate { text: text, style: { color: '#000000', - fontSize: '18px' + fontSize: '14px', + fontFamily: 'Verdana' } }, max: max, @@ -58,11 +60,12 @@ export class HighChartCreate { }); } - public setLegend(){ + public setLegend(enabled: boolean = false){ this.legend = { layout: 'vertical', align: 'right', - verticalAlign: 'middle' + verticalAlign: 'middle', + enabled: enabled } } @@ -125,4 +128,5 @@ export class HighChartCreate { public updateXAxis(categories: Array, index: number = 0){ this.highChart.xAxis[index].setCategories(categories); } -} \ No newline at end of file +} + diff --git a/04.系统编码/Frontend/src/uilts/box-drawer.ts b/04.系统编码/Frontend/src/uilts/box-drawer.ts index 86e5181..648e019 100644 --- a/04.系统编码/Frontend/src/uilts/box-drawer.ts +++ b/04.系统编码/Frontend/src/uilts/box-drawer.ts @@ -75,7 +75,7 @@ export class BoxDrawer{ let startY = this.paddingTop + this.verticalScaleLine + heightInterval; let interval = (this.borderHeight - heightInterval) / (this.colorChart.colors.length) - this.canvasContext.font = "normal 20px Verdana"; + this.canvasContext.font = "normal 24px Verdana"; this.canvasContext.fillStyle = "#000000"; for(let lastLen = this.colorChart.colors.length - 1, index = lastLen; index >= 0; index --){ @@ -300,7 +300,7 @@ export class BoxDrawer{ this.canvasContext.stroke(); if (flag){ - this.canvasContext.font = "normal 20px Verdana"; + this.canvasContext.font = "normal 30px Verdana"; this.canvasContext.fillStyle = "#000000"; const text = moment(this.values.radar_data[index].data_time).format("HH:mm"); this.canvasContext.fillText(text, _x - this.canvasContext.measureText(text).width / 2, startY + yInterval + this.borderHeight + 36); @@ -330,7 +330,7 @@ export class BoxDrawer{ this.canvasContext.stroke(); if (flag) { - this.canvasContext.font = "normal 20px Verdana"; + this.canvasContext.font = "normal 30px Verdana"; this.canvasContext.fillStyle = "#000000"; const text = this.values.radar_info[index].col_factor; this.canvasContext.fillText(text, startX - this.canvasContext.measureText(text).width - this.horizontalScaleLine, _y + 10);