From e8656ef494a48d9df7227fb8bc507865ab0d710d Mon Sep 17 00:00:00 2001 From: cwjbxqmz <1134865194@qq.com> Date: 星期五, 08 十二月 2023 08:51:54 +0800 Subject: [PATCH] Merge branch 'master' of http://101.37.171.70:10101/r/TV.kanbanUI --- img/bj4.jpg | 0 GlobalSituation3.html | 520 ++++++++++++++++++++++++++++++++++++++++----------------- 2 files changed, 363 insertions(+), 157 deletions(-) diff --git a/GlobalSituation3.html b/GlobalSituation3.html index 333e656..84a2faa 100644 --- a/GlobalSituation3.html +++ b/GlobalSituation3.html @@ -19,7 +19,7 @@ <script src="js/jquery.qrcode.min.js"></script> <script src="js/webConfig.js"></script> <style> - + body { padding: 0px; font-family: KaiTi; @@ -28,7 +28,7 @@ } .bj { - background: url(../KanBanUI/img/bj3.jpg) no-repeat center center; /*鍔犺浇鑳屾櫙鍥撅細鍥剧墖鍦板潃 涓嶅钩閾� */ + background: url(../KanBanUI/img/bj4.jpg) no-repeat center center; /*鍔犺浇鑳屾櫙鍥撅細鍥剧墖鍦板潃 涓嶅钩閾� */ background-size: cover; /*璁╄儗鏅浘鍩轰簬瀹瑰櫒澶у皬浼哥缉 */ background-attachment: fixed; height: 100%; @@ -49,7 +49,7 @@ } .col2-1-p { - padding-right:2%; + padding-right: 2%; width: 50%; height: 100%; /*background-color: #0d5974;*/ @@ -92,25 +92,128 @@ font-family: 'BebasNeueRegular', Arial, Helvetica, sans-serif; text-shadow: 0 0 0px #00c6ff; } + .tr1 { height: 1000px; /*background-color: #e5b2b26b;*/ width: 22%; float: left; } + .tr1-k { height: 1000px; /*background-color: #e5b1b26b;*/ width: 5.5%; float: left; } - + .tr1-1 { height: 28%; /*background-color: #e5c6b26b;*/ width: 94.5%; float: left; + color: aqua; } + + .tr1-1-k { + height: 38%; + width: 100%; + /*background-color: #cc9393ad;*/ + } + + .tr1-1-cen { + height: 18%; + width: 100%; + /*background-color: #cc9223ad;*/ + } + + .tr1-1-cenk { + height: 100%; + width: 10%; + /*background-color: #9d202099;*/ + float: left; + } + + .tr1-1-cen-left { + height: 100%; + width: 39%; + /*background-color: #9d909099;*/ + float: left; + } + + .tr1-1-cen-left p { + text-align: center; + font-size: 30px; + height: 100%; + width: 100%; + /*background-color: #9d909099;*/ + } + + .tr1-1-cen-right { + height: 100%; + width: 35%; + /*background-color: #9d329099;*/ + float: left; + } + + .tr1-1-cen-right p { + text-align: center; + font-size: 30px; + height: 100%; + width: 100%; + /*background-color: #9d909099;*/ + } + + .tr1-1-cen-k { + height: 14%; + width: 100%; + /*background-color: #cc9393ad;*/ + } + + .tr1-1-btm { + height: 30%; + width: 100%; + /*background-color: #9d909099;*/ + float: left; + } + + .tr1-1-btm-k { + height: 100%; + width: 10%; + /*background-color: #9d909099;*/ + float: left; + } + + .tr1-1-btm-left { + height: 100%; + width: 37%; + /*background-color: #9d303099;*/ + float: left; + } + + .tr1-1-btm-left p { + text-align: center; + font-size: 30px; + height: 100%; + width: 100%; + /*background-color: #9d909099;*/ + } + + .tr1-1-btm-right { + height: 100%; + width: 42%; + /*background-color: #9d909099;*/ + float: left; + } + + .tr1-1-btm-right p { + text-align: center; + font-size: 30px; + height: 100%; + width: 100%; + /*background-color: #9d909099;*/ + } + .tr1-2 { height: 23%; /*background-color: #dd9393ad;*/ @@ -118,39 +221,59 @@ float: left; color: aqua; } + .tr1-2-k { - height: 34%; + height: 38%; width: 100%; /*background-color: #cc9393ad;*/ } + .tr1-2-cen { - height: 20%; + height: 18%; width: 100%; /*background-color: #cc9223ad;*/ } + .tr1-2-cenk { height: 100%; - width: 10%; + width: 5%; /*background-color: #9d202099;*/ float: left; } + .tr1-2-cen-left { height: 100%; - width: 39%; + width: 30%; /*background-color: #9d909099;*/ float: left; } .tr1-2-cen-left p { - text-align:center; + text-align: center; font-size: 30px; height: 100%; width: 100%; /*background-color: #9d909099;*/ } + + .tr1-2-cen-cen { + height: 100%; + width: 30%; + /*background-color: #9d909099;*/ + float: left; + } + + .tr1-2-cen-cen p { + text-align: center; + font-size: 30px; + height: 100%; + width: 100%; + /*background-color: #9d909099;*/ + } + .tr1-2-cen-right { height: 100%; - width: 35%; + width: 30%; /*background-color: #9d329099;*/ float: left; } @@ -162,32 +285,51 @@ width: 100%; /*background-color: #9d909099;*/ } + .tr1-2-cen-k { - height: 21%; + height: 22%; width: 100%; /*background-color: #cc9393ad;*/ } + .tr1-2-btm { - height: 27%; + height: 22%; width: 100%; /*background-color: #9d909099;*/ float: left; } + .tr1-2-btm-k { height: 100%; - width: 10%; + width: 5%; /*background-color: #9d909099;*/ float: left; } + .tr1-2-btm-left { height: 100%; - width: 37%; + width: 30%; /*background-color: #9d303099;*/ float: left; } .tr1-2-btm-left p { - text-align:center; + text-align: center; + font-size: 30px; + height: 100%; + width: 100%; + /*background-color: #9d909099;*/ + } + + .tr1-2-btm-cen { + height: 100%; + width: 30%; + /*background-color: #9d303099;*/ + float: left; + } + + .tr1-2-btm-cen p { + text-align: center; font-size: 30px; height: 100%; width: 100%; @@ -196,18 +338,19 @@ .tr1-2-btm-right { height: 100%; - width: 42%; + width: 30%; /*background-color: #9d909099;*/ float: left; } - .tr1-2-btm-right p { - text-align:center; - font-size: 30px; - height: 100%; - width: 100%; - /*background-color: #9d909099;*/ - } + .tr1-2-btm-right p { + text-align: center; + font-size: 30px; + height: 100%; + width: 100%; + /*background-color: #9d909099;*/ + } + .tr1-3 { margin-left: 2%; height: 20%; @@ -215,6 +358,7 @@ width: 90.5%; float: left; } + .tr1-4 { margin-left: 2%; margin-top: 9%; @@ -223,58 +367,68 @@ width: 88%; float: left; } + .tr2 { height: 966px; /*background-color: #7e7474a3;*/ width: 56%; float: left; } + .tr2-k { height: 12%; /*background-color: #7e3374a3;*/ width: 100%; } + .tr2-1 { height: 14%; /*background-color: #7e3323a3;*/ width: 100%; } + .tr2-1-k { height: 100%; /*background-color: #7e6623a3;*/ width: 8%; - float:left; + float: left; } + .tr2-1-1 { height: 100%; /*background-color: #7e8426c3;*/ width: 9%; float: left; } + .tr2-1-1-k { height: 100%; /*background-color: #7e6623a3;*/ width: 13.5%; float: left; } + .tr2-1-2 { height: 100%; /*background-color: #7e8426c3;*/ width: 9%; float: left; } + .tr2-1-2-k { height: 100%; /*background-color: #7e6623a3;*/ width: 14%; float: left; } + .tr2-1-3 { height: 100%; /*background-color: #7e8426c3;*/ width: 9%; float: left; } + .tr2-1-3-k { height: 100%; /*background-color: #7e6623a3;*/ @@ -288,39 +442,46 @@ width: 9%; float: left; } + .tr2-k-1 { height: 12%; /*background-color: #7e3374a3;*/ width: 100%; } + .tr3 { height: 966px; /*background-color: #99d7c799;*/ width: 22%; float: left; } + .tr3-1 { height: 36%; /*background-color: #99d7c799;*/ width: 100%; } + .tr3-2 { height: 26%; /*background-color: #99f6a799;*/ width: 100%; color: aqua; } + .tr3-2-k { height: 40%; /*background-color: #99f6a799;*/ width: 100%; } + .tr3-2-l-k { height: 20%; /*background-color: #99f3e399;*/ width: 6%; float: left; } + .tr3-2-l { height: 20%; /*background-color: #99f3e399;*/ @@ -328,6 +489,7 @@ float: left; padding-top: 1%; } + .tr3-2-l p { text-align: center; font-size: 22px; @@ -335,6 +497,7 @@ width: 100%; /*background-color: #9d909099;*/ } + .tr3-2-c { height: 20%; /*background-color: #99f3e399;*/ @@ -350,6 +513,7 @@ width: 100%; /*background-color: #9d909099;*/ } + .tr3-2-r { height: 20%; /*background-color: #99f3e399;*/ @@ -365,11 +529,13 @@ width: 100%; /*background-color: #9d909099;*/ } + .tr3-2-2-k { height: 39%; /*background-color: #99f6a799;*/ width: 100%; } + .tr3-2-2 { height: 20%; /*background-color: #99f3e399;*/ @@ -384,6 +550,7 @@ width: 100%; /*background-color: #9d332359;*/ } + .tr3-2-3 { height: 20%; /*background-color: #99f3e399;*/ @@ -406,7 +573,6 @@ /*background-color: #99f6a733;*/ width: 88%; } - </style> <script type="text/javascript"> $(document).ready(function () { @@ -434,13 +600,13 @@ var mychart1 = echarts.init(document.getElementById('mychart1')); var mychart2 = echarts.init(document.getElementById('mychart2')); var mychart3 = echarts.init(document.getElementById('mychart3')); - var mychart4 = echarts.init(document.getElementById('mychart4')); + //var mychart4 = echarts.init(document.getElementById('mychart4')); var mychart5 = echarts.init(document.getElementById('mychart5')); - Chart(mychart1, mychart2, mychart3, mychart4, mychart5); + Chart(mychart1, mychart2, mychart3, mychart5); setInterval(function () { - Chart(mychart1, mychart2, mychart3, mychart4, mychart5); + Chart(mychart1, mychart2, mychart3, mychart5); }, 60000); @@ -450,7 +616,7 @@ mychart1.resize(); mychart2.resize(); mychart3.resize(); - mychart4.resize(); + mychart5.resize(); } }); @@ -458,7 +624,7 @@ - function Chart(mychart1, mychart2, mychart3, mychart4, mychart5) { + function Chart(mychart1, mychart2, mychart3, mychart5) { //鎵�鏈夊伐搴忓湪鍒� 鐢熶骇鏁伴噺 get_Proc(); //褰撳墠鐘舵�� @@ -468,8 +634,9 @@ //鏌辩姸鍥� get_Histogram(mychart2); //浠〃鐩� - get_Dashboard(mychart4); get_Dashboard_2(mychart5); + //鍦ㄥ埗鐘舵�� + get_ZZSate(); } //褰撳墠鐘舵�� @@ -485,10 +652,29 @@ for (var i = 0; i < PubRes.data[0].length; i++) { HQty += PubRes.data[0][i].InHQty; } - $("#jh").text(res.data[0][0]["HQty"].toLocaleString()); - $("#wc").text(res.data[1][0]["HQty"].toLocaleString()); - $("#zz").text(HQty.toLocaleString()); - $("#dd").text(res.data[2][0]["HQty"].toLocaleString()); + $("#jh").text(parseInt(res.data[0][0]["HQty"]).toLocaleString()); + $("#wc").text(parseInt(res.data[1][0]["HQty"]).toLocaleString()); + $("#zz").text(parseInt(HQty).toLocaleString()); + $("#dd").text(parseInt(res.data[2][0]["HQty"]).toLocaleString()); + } + }) + } + + //鍦ㄥ埗鐘舵�� + function get_ZZSate() { + $.ajax({ + url: GetWEBURL() + "/loaddata/get_ZZSate", + dataType: "JSON", + async: false,//浣跨敤鍚屾鐨勬柟寮�,true涓哄紓姝ユ柟寮� + type: "Get", + data: { "LineCode": "1" }, + success: function (res) { + $("#lrc").text(res.data[0][0]["lrc"].toLocaleString()); + $("#lhzyh").text(res.data[1][0]["lhzyh"].toLocaleString()); + $("#lhzeh").text(res.data[2][0]["lhzeh"].toLocaleString()); + $("#lhzsh").text(res.data[3][0]["lhzsh"].toLocaleString()); + $("#ltz").text(res.data[4][0]["ltz"].toLocaleString()); + $("#lbpwf").text(res.data[5][0]["lbpwf"].toLocaleString()); } }) } @@ -546,9 +732,9 @@ } } //鎵撳寘鍏ュ簱 - $("#cps_12").text(res.data[1][0].HQty.toLocaleString()); + //$("#cps_12").text(res.data[1][0].HQty.toLocaleString()); //鏌撳巶鍦ㄥ埗鏁伴噺 - $("#zzp1_2").text((res.data[2].length == 0 ? 0 : res.data[2][0].HQty.toLocaleString())); + //$("#zzp1_2").text((res.data[2].length == 0 ? 0 : res.data[2][0].HQty.toLocaleString())); } }) } @@ -561,37 +747,37 @@ var optionData = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0]; for (var i = 0; i < res.data[0].length; i++) { if (res.data[0][i].HProcID == 191) {//缂稿巶 - optionData[0] = (res.data[0][i].OutHQty / 1000).toFixed(2); + optionData[0] = (res.data[0][i].OutHQty / 1000).toFixed(0); } else if (res.data[0][i].HProcID == 193) {//鐑樺共瀹氬瀷 - optionData[1] = (res.data[0][i].OutHQty / 1000).toFixed(2); + optionData[1] = (res.data[0][i].OutHQty / 1000).toFixed(0); } else if (res.data[0][i].HProcID == 194) {//涓婃祮瀹氬瀷 - optionData[2] = (res.data[0][i].OutHQty / 1000).toFixed(2); + optionData[2] = (res.data[0][i].OutHQty / 1000).toFixed(0); } else if (res.data[0][i].HProcID == 198) {//鑹插澂鐑厜 - optionData[3] = (res.data[0][i].OutHQty / 1000).toFixed(2); + optionData[3] = (res.data[0][i].OutHQty / 1000).toFixed(0); } else if (res.data[0][i].HProcID == 204) {//棰勭儷鍓� - optionData[4] = (res.data[0][i].OutHQty / 1000).toFixed(2); + optionData[4] = (res.data[0][i].OutHQty / 1000).toFixed(0); } else if (res.data[0][i].HProcID == 197) {//琛ュ埛 - optionData[5] = (res.data[0][i].OutHQty / 1000).toFixed(2); + optionData[5] = (res.data[0][i].OutHQty / 1000).toFixed(0); } else if (res.data[0][i].HProcID == 201) {//鍗版瘺灏� - optionData[6] = (res.data[0][i].OutHQty / 1000).toFixed(2); + optionData[6] = (res.data[0][i].OutHQty / 1000).toFixed(0); } else if (res.data[0][i].HProcID == 200) {//鎷夊箙瀹氬瀷 - optionData[7] = (res.data[0][i].OutHQty / 1000).toFixed(2); + optionData[7] = (res.data[0][i].OutHQty / 1000).toFixed(0); } else if (res.data[0][i].HProcID == 206) {//鐭嚎鐑� - optionData[8] = (res.data[0][i].OutHQty / 1000).toFixed(2); + optionData[8] = (res.data[0][i].OutHQty / 1000).toFixed(0); } else if (res.data[0][i].HProcID == 205) {//闀跨嚎鐑� - optionData[9] = (res.data[0][i].OutHQty / 1000).toFixed(2); + optionData[9] = (res.data[0][i].OutHQty / 1000).toFixed(0); } } //鎵撳寘鍏ュ簱 - optionData[10] = (res.data[1][0].HQty / 1000).toFixed(2); + optionData[10] = (res.data[1][0].HQty / 1000).toFixed(0); var option = { xAxis: { @@ -699,7 +885,7 @@ success: function (res) { for (var i = 0; i < res.data[0].length; i++) { dateData.push(res.data[0][i]["HDate"]); - OptionData.push((res.data[0][i]["HQty"] / 1000).toFixed(2)); + OptionData.push((res.data[0][i]["HQty"] / 1000).toFixed(0)); } } }) @@ -804,33 +990,33 @@ for (var i = 0; i < res.data[0].length; i++) { if (res.data[0][i].HProcID == 191) {//缂稿巶 - optionData[0] = (res.data[0][i].HQty / 1000).toFixed(2); + optionData[0] = (res.data[0][i].HQty / 1000).toFixed(0); } else if (res.data[0][i].HProcID == 193) {//鐑樺共瀹氬瀷 - optionData[1] = (res.data[0][i].HQty / 1000).toFixed(2); + optionData[1] = (res.data[0][i].HQty / 1000).toFixed(0); } else if (res.data[0][i].HProcID == 194) {//涓婃祮瀹氬瀷 - optionData[2] = (res.data[0][i].HQty / 1000).toFixed(2); + optionData[2] = (res.data[0][i].HQty / 1000).toFixed(0); } else if (res.data[0][i].HProcID == 198) {//鑹插澂鐑厜 - optionData[3] = (res.data[0][i].HQty / 1000).toFixed(2); + optionData[3] = (res.data[0][i].HQty / 1000).toFixed(0); } else if (res.data[0][i].HProcID == 204) {//棰勭儷鍓� - optionData[4] = (res.data[0][i].HQty / 1000).toFixed(2); + optionData[4] = (res.data[0][i].HQty / 1000).toFixed(0); } else if (res.data[0][i].HProcID == 197) {//琛ュ埛 - optionData[5] = (res.data[0][i].HQty / 1000).toFixed(2); + optionData[5] = (res.data[0][i].HQty / 1000).toFixed(0); } else if (res.data[0][i].HProcID == 201) {//鍗版瘺灏� - optionData[6] = (res.data[0][i].HQty / 1000).toFixed(2); + optionData[6] = (res.data[0][i].HQty / 1000).toFixed(0); } else if (res.data[0][i].HProcID == 200) {//鎷夊箙瀹氬瀷 - optionData[7] = (res.data[0][i].HQty / 1000).toFixed(2); + optionData[7] = (res.data[0][i].HQty / 1000).toFixed(0); } else if (res.data[0][i].HProcID == 206) {//鐭嚎鐑� - optionData[8] = (res.data[0][i].HQty / 1000).toFixed(2); + optionData[8] = (res.data[0][i].HQty / 1000).toFixed(0); } else if (res.data[0][i].HProcID == 205) {//闀跨嚎鐑� - optionData[9] = (res.data[0][i].HQty / 1000).toFixed(2); + optionData[9] = (res.data[0][i].HQty / 1000).toFixed(0); } } } @@ -898,95 +1084,11 @@ mychart2.setOption(option); } - //浠〃鐩� 鍒舵垚鐜� - function get_Dashboard(mychart4) { - var zcl = 0; - //鍒舵垚鐜� - $.ajax({ - url: GetWEBURL() + "/loaddata/Dashboard", - dataType: "JSON", - async: false,//浣跨敤鍚屾鐨勬柟寮�,true涓哄紓姝ユ柟寮� - type: "Get", - data: { "LineCode": "1" }, - success: function (res) { - zcl = res.data[1][0]["鍒舵垚鐜�"].toFixed(2); - } - }) - - var option = { - series: [ - {//鍙充华琛ㄧ洏 - // name: '涓氬姟鎸囨爣', - type: 'gauge', - detail: { - formatter: '{value}%', - offsetCenter: ['10%', '90%'] - }, - radius: "80%", // 鍙傛暟:number, string銆� 浠〃鐩樺崐寰�,榛樿 75% 锛屽彲浠ユ槸鐩稿浜庡鍣ㄩ珮瀹戒腑杈冨皬鐨勪竴椤圭殑涓�鍗婄殑鐧惧垎姣旓紝涔熷彲浠ユ槸缁濆鐨勬暟鍊笺�� - center: ["50%", "60%"], - startAngle: 225,//浠〃鐩樿捣濮嬭搴︺�傛鍙虫墜渚т负0搴︼紝姝d笂鏂逛负90搴︼紝姝e乏鎵嬩晶涓�180搴︺�� - endAngle: -45,//浠〃鐩樼粨鏉熻搴� - clockWise: true, - min: 0, - max: 100, - splitNumber: 10, // 浠〃鐩樺埢搴︾殑鍒嗗壊娈垫暟,榛樿 10銆� - axisTick: { // 鍒诲害(绾�)鏍峰紡銆� - show: true, // 鏄惁鏄剧ず鍒诲害(绾�),榛樿 true銆� - splitNumber: 5, // 鍒嗛殧绾夸箣闂村垎鍓茬殑鍒诲害鏁�,榛樿 5銆� - length: 15, // 鍒诲害绾块暱銆傛敮鎸佺浉瀵瑰崐寰勭殑鐧惧垎姣�,榛樿 8銆� - lineStyle: { // 鍒诲害绾挎牱寮忋�� - color: "auto", //绾跨殑棰滆壊,榛樿 #eee銆� - opacity: 1, //鍥惧舰閫忔槑搴︺�傛敮鎸佷粠 0 鍒� 1 鐨勬暟瀛楋紝涓� 0 鏃朵笉缁樺埗璇ュ浘褰€�� - width: 1, //绾垮害,榛樿 1銆� - type: "solid", //绾跨殑绫诲瀷,榛樿 solid銆� 姝ゅ杩樻湁 dashed,dotted - // shadowBlur: 10, //(鍙戝厜鏁堟灉)鍥惧舰闃村奖鐨勬ā绯婂ぇ灏忋�傝灞炴�ч厤鍚� shadowColor,shadowOffsetX, shadowOffsetY 涓�璧疯缃浘褰㈢殑闃村奖鏁堟灉銆� - // shadowColor: "#fff", //闃村奖棰滆壊銆傛敮鎸佺殑鏍煎紡鍚宑olor銆� - }, - }, - axisLine: { // 浠〃鐩樿酱绾�(杞粨绾�)鐩稿叧閰嶇疆銆� - show: true, // 鏄惁鏄剧ず浠〃鐩樿酱绾�(杞粨绾�),榛樿 true銆� - lineStyle: { // 浠〃鐩樿酱绾挎牱寮忋�� - color: [[0.2, '#fc3333'], [0.8, '#17cee3'], [1, '#01e878']], //浠〃鐩樼殑杞寸嚎鍙互琚垎鎴愪笉鍚岄鑹茬殑澶氭銆傛瘡娈电殑 缁撴潫浣嶇疆(鑼冨洿鏄痆0,1]) 鍜� 棰滆壊 鍙互閫氳繃涓�涓暟缁勬潵琛ㄧず銆傞粯璁ゅ彇鍊硷細[[0.2, '#91c7ae'], [0.8, '#63869e'], [1, '#c23531']] - // opacity: 1, //鍥惧舰閫忔槑搴︺�傛敮鎸佷粠 0 鍒� 1 鐨勬暟瀛楋紝涓� 0 鏃朵笉缁樺埗璇ュ浘褰€�� - width: 10, //杞寸嚎瀹藉害,榛樿 30銆� - // shadowBlur: 20, //(鍙戝厜鏁堟灉)鍥惧舰闃村奖鐨勬ā绯婂ぇ灏忋�傝灞炴�ч厤鍚� shadowColor,shadowOffsetX, shadowOffsetY 涓�璧疯缃浘褰㈢殑闃村奖鏁堟灉銆� - // shadowColor: "#fff", //闃村奖棰滆壊銆傛敮鎸佺殑鏍煎紡鍚宑olor銆� - } - }, - splitLine: { // 鍒嗛殧绾挎牱寮忋�� - show: true, // 鏄惁鏄剧ず鍒嗛殧绾�,榛樿 true銆� - length: 15, // 鍒嗛殧绾跨嚎闀裤�傛敮鎸佺浉瀵瑰崐寰勭殑鐧惧垎姣�,榛樿 30銆� - lineStyle: { // 鍒嗛殧绾挎牱寮忋�� - color: "auto", //绾跨殑棰滆壊,榛樿 #eee銆� - opacity: 1, //鍥惧舰閫忔槑搴︺�傛敮鎸佷粠 0 鍒� 1 鐨勬暟瀛楋紝涓� 0 鏃朵笉缁樺埗璇ュ浘褰€�� - width: 2, //绾垮害,榛樿 2銆� - type: "solid", //绾跨殑绫诲瀷,榛樿 solid銆� 姝ゅ杩樻湁 dashed,dotted - // shadowBlur: 10, //(鍙戝厜鏁堟灉)鍥惧舰闃村奖鐨勬ā绯婂ぇ灏忋�傝灞炴�ч厤鍚� shadowColor,shadowOffsetX, shadowOffsetY 涓�璧疯缃浘褰㈢殑闃村奖鏁堟灉銆� - // shadowColor: "#fff", //闃村奖棰滆壊銆傛敮鎸佺殑鏍煎紡鍚宑olor銆� - } - }, - title: { - fontSize: 20, - color: '#55bcd5',//鏍囬棰滆壊 - offsetCenter: ['0', '60%']//璁剧疆瀹屾垚鐜囦綅缃� - }, - data: [{ - value: zcl, - name: '鍒舵垚鐜�', - }] - } - ] - - }; - - // 浣跨敤鍒氭寚瀹氱殑閰嶇疆椤瑰拰鏁版嵁鏄剧ず鍥捐〃銆� - mychart4.setOption(option); - } - - //浠〃鐩� 鍚堟牸鐜� + //浠〃鐩� 鍚堟牸鐜� 鍒舵垚鐜� function get_Dashboard_2(mychart5) { var hgl = 0; - //鍒舵垚鐜� + var zcl = 0; + //鍒舵垚鐜� 鍚堟牸鐜� $.ajax({ url: GetWEBURL() + "/loaddata/Dashboard", dataType: "JSON", @@ -995,20 +1097,89 @@ data: { "LineCode": "1" }, success: function (res) { hgl = res.data[0][0]["鍚堟牸鐜�"].toFixed(2); + zcl = res.data[1][0]["鍒舵垚鐜�"].toFixed(2); } }) var option = { series: [ - {//鍙充华琛ㄧ洏 + {//宸﹁竟浠〃鐩� // name: '涓氬姟鎸囨爣', type: 'gauge', detail: { formatter: '{value}%', - offsetCenter: ['10%', '90%'] + //offsetCenter: ['10', '70%'], //鐩稿浜庝华琛ㄧ洏涓績鐨勫亸绉讳綅缃紝鏁扮粍绗竴椤规槸姘村钩鏂瑰悜鐨勫亸绉伙紝绗簩椤规槸鍨傜洿鏂瑰悜鐨勫亸绉汇�傚彲浠ユ槸缁濆鐨勬暟鍊硷紝涔熷彲浠ユ槸鐩稿浜庝华琛ㄧ洏鍗婂緞鐨勭櫨鍒嗘瘮 + fontSize: 25, //鏂囧瓧鐨勫瓧浣撳ぇ灏� + offsetCenter: ['10%', '100%'] }, - radius: "80%", // 鍙傛暟:number, string銆� 浠〃鐩樺崐寰�,榛樿 75% 锛屽彲浠ユ槸鐩稿浜庡鍣ㄩ珮瀹戒腑杈冨皬鐨勪竴椤圭殑涓�鍗婄殑鐧惧垎姣旓紝涔熷彲浠ユ槸缁濆鐨勬暟鍊笺�� - center: ["55%", "55%"], + radius: "50%", // 鍙傛暟:number, string銆� 浠〃鐩樺崐寰�,榛樿 75% 锛屽彲浠ユ槸鐩稿浜庡鍣ㄩ珮瀹戒腑杈冨皬鐨勪竴椤圭殑涓�鍗婄殑鐧惧垎姣旓紝涔熷彲浠ユ槸缁濆鐨勬暟鍊笺�� + center: ["26%", "60%"], + startAngle: 235, + endAngle: 25, + clockWise: true, + min: 0, + max: 100, + splitNumber: 10, // 浠〃鐩樺埢搴︾殑鍒嗗壊娈垫暟,榛樿 10銆� + axisTick: { // 鍒诲害(绾�)鏍峰紡銆� + show: true, // 鏄惁鏄剧ず鍒诲害(绾�),榛樿 true銆� + splitNumber: 5, // 鍒嗛殧绾夸箣闂村垎鍓茬殑鍒诲害鏁�,榛樿 5銆� + length: 15, // 鍒诲害绾块暱銆傛敮鎸佺浉瀵瑰崐寰勭殑鐧惧垎姣�,榛樿 8銆� + lineStyle: { // 鍒诲害绾挎牱寮忋�� + color: "auto", //绾跨殑棰滆壊,榛樿 #eee銆� + opacity: 1, //鍥惧舰閫忔槑搴︺�傛敮鎸佷粠 0 鍒� 1 鐨勬暟瀛楋紝涓� 0 鏃朵笉缁樺埗璇ュ浘褰€�� + width: 1, //绾垮害,榛樿 1銆� + type: "solid", //绾跨殑绫诲瀷,榛樿 solid銆� 姝ゅ杩樻湁 dashed,dotted + // shadowBlur: 10, //(鍙戝厜鏁堟灉)鍥惧舰闃村奖鐨勬ā绯婂ぇ灏忋�傝灞炴�ч厤鍚� shadowColor,shadowOffsetX, shadowOffsetY 涓�璧疯缃浘褰㈢殑闃村奖鏁堟灉銆� + // shadowColor: "#fff", //闃村奖棰滆壊銆傛敮鎸佺殑鏍煎紡鍚宑olor銆� + }, + }, + axisLine: { // 浠〃鐩樿酱绾�(杞粨绾�)鐩稿叧閰嶇疆銆� + show: true, // 鏄惁鏄剧ず浠〃鐩樿酱绾�(杞粨绾�),榛樿 true銆� + lineStyle: { // 浠〃鐩樿酱绾挎牱寮忋�� + color: [ + [0.2, '#fc3333'], + [0.8, '#17cee3'], + [1, '#01e878'] + ], //浠〃鐩樼殑杞寸嚎鍙互琚垎鎴愪笉鍚岄鑹茬殑澶氭銆傛瘡娈电殑 缁撴潫浣嶇疆(鑼冨洿鏄痆0,1]) 鍜� 棰滆壊 鍙互閫氳繃涓�涓暟缁勬潵琛ㄧず銆傞粯璁ゅ彇鍊硷細[[0.2, '#91c7ae'], [0.8, '#63869e'], [1, '#c23531']] + // opacity: 1, //鍥惧舰閫忔槑搴︺�傛敮鎸佷粠 0 鍒� 1 鐨勬暟瀛楋紝涓� 0 鏃朵笉缁樺埗璇ュ浘褰€�� + width: 10, //杞寸嚎瀹藉害,榛樿 30銆� + // shadowBlur: 20, //(鍙戝厜鏁堟灉)鍥惧舰闃村奖鐨勬ā绯婂ぇ灏忋�傝灞炴�ч厤鍚� shadowColor,shadowOffsetX, shadowOffsetY 涓�璧疯缃浘褰㈢殑闃村奖鏁堟灉銆� + // shadowColor: "#fff", //闃村奖棰滆壊銆傛敮鎸佺殑鏍煎紡鍚宑olor銆� + } + }, + splitLine: { // 鍒嗛殧绾挎牱寮忋�� + show: true, // 鏄惁鏄剧ず鍒嗛殧绾�,榛樿 true銆� + length: 15, // 鍒嗛殧绾跨嚎闀裤�傛敮鎸佺浉瀵瑰崐寰勭殑鐧惧垎姣�,榛樿 30銆� + lineStyle: { // 鍒嗛殧绾挎牱寮忋�� + color: "auto", //绾跨殑棰滆壊,榛樿 #eee銆� + opacity: 1, //鍥惧舰閫忔槑搴︺�傛敮鎸佷粠 0 鍒� 1 鐨勬暟瀛楋紝涓� 0 鏃朵笉缁樺埗璇ュ浘褰€�� + width: 2, //绾垮害,榛樿 2銆� + type: "solid", //绾跨殑绫诲瀷,榛樿 solid銆� 姝ゅ杩樻湁 dashed,dotted + // shadowBlur: 10, //(鍙戝厜鏁堟灉)鍥惧舰闃村奖鐨勬ā绯婂ぇ灏忋�傝灞炴�ч厤鍚� shadowColor,shadowOffsetX, shadowOffsetY 涓�璧疯缃浘褰㈢殑闃村奖鏁堟灉銆� + // shadowColor: "#fff", //闃村奖棰滆壊銆傛敮鎸佺殑鏍煎紡鍚宑olor銆� + } + }, + title: { + fontSize: 20, + color: '#55bcd5',//鏍囬棰滆壊 + offsetCenter: ['20%', '60%']//璁剧疆瀹屾垚鐜囦綅缃� + }, + data: [{ + value: zcl, + name: '鍒舵垚鐜�', + }], + + }, + {//鍙充华琛ㄧ洏 + // name: '涓氬姟鎸囨爣', + type: 'gauge', + detail: { + fontSize: 25, //鏂囧瓧鐨勫瓧浣撳ぇ灏� + formatter: '{value}%', + offsetCenter: ['10%', '110%'] + }, + radius: "55%", // 鍙傛暟:number, string銆� 浠〃鐩樺崐寰�,榛樿 75% 锛屽彲浠ユ槸鐩稿浜庡鍣ㄩ珮瀹戒腑杈冨皬鐨勪竴椤圭殑涓�鍗婄殑鐧惧垎姣旓紝涔熷彲浠ユ槸缁濆鐨勬暟鍊笺�� + center: ["67%", "55%"], startAngle: 225,//浠〃鐩樿捣濮嬭搴︺�傛鍙虫墜渚т负0搴︼紝姝d笂鏂逛负90搴︼紝姝e乏鎵嬩晶涓�180搴︺�� endAngle: -45,//浠〃鐩樼粨鏉熻搴� clockWise: true, @@ -1031,7 +1202,11 @@ axisLine: { // 浠〃鐩樿酱绾�(杞粨绾�)鐩稿叧閰嶇疆銆� show: true, // 鏄惁鏄剧ず浠〃鐩樿酱绾�(杞粨绾�),榛樿 true銆� lineStyle: { // 浠〃鐩樿酱绾挎牱寮忋�� - color: [[0.2, '#fc3333'], [0.8, '#17cee3'], [1, '#01e878']], //浠〃鐩樼殑杞寸嚎鍙互琚垎鎴愪笉鍚岄鑹茬殑澶氭銆傛瘡娈电殑 缁撴潫浣嶇疆(鑼冨洿鏄痆0,1]) 鍜� 棰滆壊 鍙互閫氳繃涓�涓暟缁勬潵琛ㄧず銆傞粯璁ゅ彇鍊硷細[[0.2, '#91c7ae'], [0.8, '#63869e'], [1, '#c23531']] + color: [ + [0.2, '#fc3333'], + [0.8, '#17cee3'], + [1, '#01e878'] + ], //浠〃鐩樼殑杞寸嚎鍙互琚垎鎴愪笉鍚岄鑹茬殑澶氭銆傛瘡娈电殑 缁撴潫浣嶇疆(鑼冨洿鏄痆0,1]) 鍜� 棰滆壊 鍙互閫氳繃涓�涓暟缁勬潵琛ㄧず銆傞粯璁ゅ彇鍊硷細[[0.2, '#91c7ae'], [0.8, '#63869e'], [1, '#c23531']] // opacity: 1, //鍥惧舰閫忔槑搴︺�傛敮鎸佷粠 0 鍒� 1 鐨勬暟瀛楋紝涓� 0 鏃朵笉缁樺埗璇ュ浘褰€�� width: 10, //杞寸嚎瀹藉害,榛樿 30銆� // shadowBlur: 20, //(鍙戝厜鏁堟灉)鍥惧舰闃村奖鐨勬ā绯婂ぇ灏忋�傝灞炴�ч厤鍚� shadowColor,shadowOffsetX, shadowOffsetY 涓�璧疯缃浘褰㈢殑闃村奖鏁堟灉銆� @@ -1053,7 +1228,7 @@ title: { fontSize: 20, color: '#55bcd5',//鏍囬棰滆壊 - offsetCenter: ['0', '60%']//璁剧疆瀹屾垚鐜囦綅缃� + offsetCenter: ['0', '70%']//璁剧疆瀹屾垚鐜囦綅缃� }, data: [{ value: hgl, @@ -1092,8 +1267,33 @@ <div class="tr1"> <div class="tr1-k"> </div> - <div class="tr1-1" id="mychart4"> + <div class="tr1-1"> + <div class="tr1-1-k"> + </div> + <div class="tr1-1-cen"> + <div class="tr1-1-cenk"> + </div> + <div class="tr1-1-cen-left"> + <p id="jh">0</p> + </div> + <div class="tr1-1-cen-right"> + <p id="wc">0</p> + </div> + </div> + <div class="tr1-1-cen-k"> + + </div> + <div class="tr1-1-btm"> + <div class="tr1-1-btm-k"> + </div> + <div class="tr1-1-btm-left"> + <p id="zz">0</p> + </div> + <div class="tr1-1-btm-right"> + <p id="dd">0</p> + </div> + </div> </div> <div class="tr1-2"> <div class="tr1-2-k"> @@ -1103,10 +1303,13 @@ <div class="tr1-2-cenk"> </div> <div class="tr1-2-cen-left"> - <p id="jh">0</p> + <p id="lrc">0</p> + </div> + <div class="tr1-2-cen-cen"> + <p id="lhzyh">0</p> </div> <div class="tr1-2-cen-right"> - <p id="wc">0</p> + <p id="lhzeh">0</p> </div> </div> <div class="tr1-2-cen-k"> @@ -1116,10 +1319,13 @@ <div class="tr1-2-btm-k"> </div> <div class="tr1-2-btm-left"> - <p id="zz">0</p> + <p id="lhzsh">0</p> + </div> + <div class="tr1-2-btm-cen"> + <p id="ltz">0</p> </div> <div class="tr1-2-btm-right"> - <p id="dd">0</p> + <p id="lbpwf">0</p> </div> </div> </div> diff --git a/img/bj4.jpg b/img/bj4.jpg new file mode 100644 index 0000000..caeb609 --- /dev/null +++ b/img/bj4.jpg Binary files differ -- Gitblit v1.9.1