visual.js 19 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605
  1. $(window).load(function () {
  2. $(".loading").fadeOut()
  3. })
  4. var map, layer, markerlayer, marker,
  5. url = "http://192.168.3.228:8090/iserver/services/map-dili/rest/maps/dili@dili";
  6. var sT = "";
  7. var eT = "";
  8. var fyT = "";
  9. var fyres = null;
  10. var res = null;
  11. var markerList = [];
  12. var mesList = [];
  13. $(function () {
  14. var oTime = new Date();
  15. console.log(changeDate(oTime));
  16. $("#dateend").val(changeDate(oTime));
  17. $("#datefy").val(changeDate(oTime));
  18. $("#datestart").val(changeDate(addDate(oTime, -2)));
  19. init();
  20. })
  21. function init() {
  22. map = new SuperMap.Map("map", {
  23. controls: [
  24. new SuperMap.Control.Zoom(),
  25. new SuperMap.Control.Navigation()
  26. ]
  27. });
  28. layer = new SuperMap.Layer.TiledDynamicRESTLayer("World", url, null, { maxResolution: "auto" });
  29. markerlayer = new SuperMap.Layer.Markers("markerLayer");
  30. layer.events.on({ "layerInitialized": addLayer });
  31. searchjindu();
  32. searchfangyi();
  33. }
  34. function addLayer() {
  35. map.addLayers([layer, markerlayer]);
  36. //显示地图范围
  37. map.setCenter(new SuperMap.LonLat(126.37, 46.05), 1);
  38. }
  39. function searchfangyi() {
  40. if (fyT != $("#datefy").val()) {
  41. fyT = $("#datefy").val();
  42. var datajs = { datefy: $("#datefy").val() };
  43. $.ajax({
  44. url: "https://www.hmedi02.net:802/qiangxian/platform/qiangxianxinxi/qiangxianxinxi/dataFangyi",
  45. type: "GET",
  46. async: false,
  47. contentType: "application/json;charset=utf-8",
  48. data: datajs,
  49. success: function (result) {
  50. fyres = result;
  51. if ($("#biaoduan").val() == "合计") {
  52. echarts_1(result.zhengchangAll, result.yichangAll);
  53. } else if ($("#biaoduan").val() == "一标段") {
  54. echarts_1(result.zhengchang1, result.yichang1);
  55. } else if ($("#biaoduan").val() == "二标段") {
  56. echarts_1(result.zhengchang2, result.yichang2);
  57. }
  58. },
  59. error: function (e) {
  60. console.log(e.status);
  61. console.log(e.responseText);
  62. }
  63. });
  64. } else {
  65. if ($("#biaoduan").val() == "合计") {
  66. echarts_1(fyres.zhengchangAll, fyres.yichangAll);
  67. } else if ($("#biaoduan").val() == "一标段") {
  68. echarts_1(fyres.zhengchang1, fyres.yichang1);
  69. } else if ($("#biaoduan").val() == "二标段") {
  70. echarts_1(fyres.zhengchang2, fyres.yichang2);
  71. }
  72. }
  73. }
  74. function searchjindu() {
  75. if (sT != $("#datestart").val() || eT != $("#dateend").val()) {
  76. if (markerList.length > 0) {
  77. for (var i = 0; i < markerList.length; i++) {
  78. markerlayer.removeMarker(markerList[i]);
  79. }
  80. markerList = [];
  81. }
  82. sT = $("#datestart").val();
  83. eT = $("#dateend").val();
  84. var datajs = { datestart: $("#datestart").val(), dateend: $("#dateend").val() };
  85. $.ajax({
  86. url: "https://www.hmedi02.net:802/qiangxian/platform/qiangxianxinxi/qiangxianxinxi/dataDaping",
  87. type: "GET",
  88. async: false,
  89. contentType: "application/json;charset=utf-8",
  90. data: datajs,
  91. success: function (result) {
  92. console.log(result);
  93. res = result;
  94. mesList = result.mapList;
  95. echarts_2(result.mapList);
  96. if ($("#biaoduan").val() == "合计") {
  97. echarts_3(result.xZhou, result.zuoyerenAll, result.zuoyecheAll, result.icecarAll, result.watercarAll, result.jinduAll);
  98. table1(result.table, result.table2);
  99. echarts_5(result.xZhou, result.fangyirenAll);
  100. } else if ($("#biaoduan").val() == "一标段") {
  101. echarts_3(result.xZhou, result.zuoyeren1, result.zuoyeche1, result.icecar1, result.watercar1, result.jindu1);
  102. table1(result.table, result.table2);
  103. echarts_5(result.xZhou, result.fangyiren1);
  104. } else if ($("#biaoduan").val() == "二标段") {
  105. echarts_3(result.xZhou, result.zuoyeren2, result.zuoyeche2, result.icecar2, result.watercar2, result.jindu2);
  106. table1(result.table, result.table2);
  107. echarts_5(result.xZhou, result.fangyiren2);
  108. }
  109. },
  110. error: function (e) {
  111. console.log(e.status);
  112. console.log(e.responseText);
  113. }
  114. });
  115. } else {
  116. if ($("#biaoduan").val() == "合计") {
  117. echarts_3(res.xZhou, res.zuoyerenAll, res.zuoyecheAll, res.icecarAll, res.watercarAll, res.jinduAll);
  118. table1(res.table, res.table2);
  119. echarts_5(res.xZhou, res.fangyirenAll);
  120. } else if ($("#biaoduan").val() == "一标段") {
  121. echarts_3(res.xZhou, res.zuoyeren1, res.zuoyeche1, res.icecar1, res.watercar1, res.jindu1);
  122. table1(res.table, res.table2);
  123. echarts_5(res.xZhou, res.fangyiren1);
  124. } else if ($("#biaoduan").val() == "二标段") {
  125. echarts_3(res.xZhou, res.zuoyeren2, res.zuoyeche2, res.icecar2, res.watercar2, res.jindu2);
  126. table1(res.table, res.table2);
  127. echarts_5(res.xZhou, res.fangyiren2);
  128. }
  129. }
  130. }
  131. function addDate(date, days) {
  132. var d = new Date(date);
  133. d.setDate(d.getDate() + days);
  134. return d;
  135. }
  136. function changeDate(dateT) {
  137. var year = dateT.getFullYear(); //获取完整的年份(4位,1970-????)
  138. var month = dateT.getMonth() + 1; //获取当前月份(0-11,0代表1月)
  139. var day = dateT.getDate(); //获取当前日(1-31)
  140. if (month < 10) {
  141. month = "0" + month;
  142. }
  143. if (day < 10) {
  144. day = "0" + day;
  145. }
  146. var dateString = year + "-" + month + "-" + day;
  147. return dateString
  148. }
  149. function echarts_1(zc, yc) {
  150. var myChart = echarts.init(document.getElementById('echart1'));
  151. var datajs = [
  152. { value: zc, name: '体温正常' },
  153. { value: yc, name: '体温异常' },
  154. ]
  155. var option = {
  156. color: ['#2ef4ab', '#ffe074'],
  157. tooltip: {
  158. trigger: 'item',
  159. formatter: "{b} : {c} 人 ({d}%)"
  160. },
  161. legend: {
  162. bottom: '3%',
  163. itemGap: 10,
  164. icon: 'circle',
  165. textStyle: {
  166. color: 'rgba(255,255,255,.6)',
  167. fontSize: 12
  168. },
  169. data: ['体温正常', '体温异常']
  170. },
  171. calculable: true,
  172. series: [
  173. {
  174. name: ' ',
  175. type: 'pie',
  176. radius: [30, 50],
  177. center: ['50%', '40%'],
  178. //roseType: 'radius',
  179. label: {
  180. normal: {
  181. show: true
  182. },
  183. emphasis: {
  184. show: true
  185. }
  186. },
  187. lableLine: {
  188. normal: {
  189. show: true
  190. },
  191. emphasis: {
  192. show: true
  193. }
  194. },
  195. data: datajs
  196. },
  197. ]
  198. };
  199. myChart.setOption(option);
  200. window.addEventListener("resize", function () {
  201. myChart.resize();
  202. });
  203. }
  204. function echarts_2(mList) {
  205. if (mList.length > 0) {
  206. for (var i = 0; i < mList.length; i++) {
  207. var size = new SuperMap.Size(44, 33);
  208. var offset = new SuperMap.Pixel(-(size.w / 2), -size.h);
  209. var icon = new SuperMap.Icon('images/marker.png', size, offset);
  210. marker = new SuperMap.Marker(new SuperMap.LonLat(mList[i].longitude2, mList[i].latitude2), icon);
  211. marker.events.on({
  212. "id": mList[i].id,
  213. "click": openInfoWin,
  214. "scope": marker
  215. });
  216. markerList.push(marker);
  217. }
  218. for (var i = 0; i < markerList.length; i++) {
  219. markerlayer.addMarker(markerList[i]);
  220. }
  221. }
  222. }
  223. function openInfoWin() {
  224. var marker = this;
  225. var lonlat = marker.getLonLat();
  226. console.log(lonlat.lon);
  227. console.log(lonlat.lat);
  228. for (var i = 0; i < mesList.length; i++) {
  229. console.log(mesList[i]);
  230. if (ec(lonlat.lon, mesList[i].longitude2, lonlat.lat, mesList[i].latitude2)) {
  231. $("#sbrq").html(mesList[i].addtime);
  232. $("#fkrs").html(mesList[i].fangyiren);
  233. $("#yctw").html(mesList[i].yichangren);
  234. $("#zyrs").html(mesList[i].zuoyeren);
  235. $("#zycs").html(mesList[i].zuoyeche);
  236. $("#ybcc").html(mesList[i].icecar);
  237. $("#xwcc").html(mesList[i].watercar);
  238. $("#wcl").html(mesList[i].jindu);
  239. $("#bcsm").html(mesList[i].remark2);
  240. $("#sfyc").html(mesList[i].shifouyichang);
  241. $("#ycqk").html(mesList[i].yichangxinxi);
  242. if (mesList[i].fujianid == "") {
  243. $("#xczp").html("暂无现场照片");
  244. } else {
  245. $("#xczp").html("<button style=\"height:24px;width:100px;color: #000000\" data-toggle=\"modal\" data-target=\"#myModal\">查看现场照片</button>");
  246. var tList = mesList[i].fujianid.split(";");
  247. var imgHtml = "";
  248. for (var j = 0; j < tList.length; j++) {
  249. if (tList != "") {
  250. imgHtml += "<img src='" + tList[j] + "' /></br>";
  251. }
  252. }
  253. $("#myModalLabel").html(imgHtml);
  254. }
  255. if (mesList[i].yichangfujian == "") {
  256. $("#yczp").html("暂无异常照片");
  257. } else {
  258. $("#yczp").html("<button style=\"height:24px;width:100px;color: #000000\" data-toggle=\"modal\" data-target=\"#myModal2\">查看异常照片</button>");
  259. var tList = mesList[i].yichangfujian.split(";");
  260. var imgHtml = "";
  261. for (var j = 0; j < tList.length; j++) {
  262. if (tList != "") {
  263. imgHtml += "<img src='" + tList[j] + "' /></br>";
  264. }
  265. }
  266. $("#myModalLabel2").html(imgHtml);
  267. }
  268. return;
  269. }
  270. }
  271. }
  272. function ec(lon1, lon2, lat1, lat2) {
  273. var l1 = left(lon1 + " ", 14);
  274. var l2 = left(lon2 + " ", 14);
  275. var l3 = left(lat1 + " ", 14);
  276. var l4 = left(lat2 + " ", 14);
  277. if (l1 == l2 && l3 == l4) {
  278. return true;
  279. }
  280. return false;
  281. }
  282. function left(mainStr, lngLen) {
  283. if (lngLen > 0) { return mainStr.substring(0, lngLen) }
  284. else { return null }
  285. }
  286. function echarts_3(dtLisT, zyrList, zycList, ybcList, xwcList, jdList) {
  287. var myChart = echarts.init(document.getElementById('echart3'));
  288. var option = {
  289. legend: {
  290. left: 'center',
  291. textStyle: {
  292. color: "rgba(255, 255, 255, 1)"
  293. }
  294. },
  295. color: ['#1921ff', '#01c3dd', '#008198', '#2ef4ab', '#ffe074'],
  296. textStyle: {
  297. color: 'rgba(255, 255, 255, 1)'
  298. },
  299. tooltip: {
  300. textStyle: {
  301. align: 'left'
  302. },
  303. trigger: 'axis',
  304. formatter: "{b0} " + $("#biaoduan").val() + ":</br>{a0} : {c0} 人</br>{a1} : {c1} 辆</br>{a2} : {c2} 次</br>{a3} : {c3} 次</br>{a4} : {c4} 平方米"
  305. },
  306. dataZoom: {
  307. start: 0,
  308. end: 100,
  309. bottom: 0,
  310. fillerColor: 'rgba(33,114,176,0.2)',
  311. textStyle: {
  312. color: 'rgba(255,255,255,.7)'
  313. },
  314. borderColor: {
  315. color: 'rgba(33,114,176,0.2)'
  316. },
  317. handleStyle: {
  318. color: {
  319. type: 'linear',
  320. x: 0,
  321. y: 0,
  322. x2: 0,
  323. y2: 1,
  324. colorStops: [{
  325. offset: 0, color: '#fbf320'
  326. }, {
  327. offset: 1, color: '#00b4e3'
  328. }],
  329. global: false
  330. }
  331. }
  332. },
  333. grid: {
  334. left: '3%',
  335. right: '5%',
  336. top: '8%',
  337. bottom: '5%',
  338. containLabel: true
  339. },
  340. xAxis: [
  341. {
  342. type: 'category',
  343. axisTick: { show: false },
  344. boundaryGap: false,
  345. axisLabel: {
  346. textStyle: {
  347. color: 'rgba(33,114,176,0.7)',
  348. fontSize: '12'
  349. },
  350. lineStyle: {
  351. color: 'rgba(33,114,176,0.2)',
  352. }
  353. },
  354. data: dtLisT
  355. }
  356. ],
  357. yAxis: {
  358. type: 'value',
  359. axisLabel: {
  360. textStyle: {
  361. color: 'rgba(33,114,176,0.7)',
  362. fontSize: '10',
  363. }
  364. },
  365. axisLine: {
  366. lineStyle: {
  367. color: 'rgba(33,114,176,0.2)',
  368. }
  369. },
  370. splitLine: {
  371. lineStyle: {
  372. color: 'rgba(33,114,176,0.2)',
  373. }
  374. },
  375. },
  376. series: [
  377. {
  378. name: '作业人数',
  379. lineStyle: {
  380. color: '#1921ff',
  381. },
  382. type: 'line',
  383. areaStyle: {
  384. normal: {
  385. type: 'default',
  386. color: new echarts.graphic.LinearGradient(0, 0, 0, 0.8, [{
  387. offset: 0,
  388. color: 'rgba(129,197,255,.6)'
  389. }, {
  390. offset: 1,
  391. color: 'rgba(129,197,255,.0)'
  392. }], false)
  393. }
  394. },
  395. smooth: true,
  396. itemStyle: {
  397. normal: { areaStyle: { type: 'default' } }
  398. },
  399. label: {
  400. show: true,
  401. position: 'top'
  402. },
  403. data: zyrList
  404. },
  405. {
  406. name: '作业车数',
  407. lineStyle: {
  408. color: '#01c3dd',
  409. },
  410. type: 'line',
  411. areaStyle: {
  412. normal: {
  413. type: 'default',
  414. color: new echarts.graphic.LinearGradient(0, 0, 0, 0.8, [{
  415. offset: 0,
  416. color: 'rgba(129,197,255,.6)'
  417. }, {
  418. offset: 1,
  419. color: 'rgba(129,197,255,.0)'
  420. }], false)
  421. }
  422. },
  423. smooth: true,
  424. itemStyle: {
  425. normal: { areaStyle: { type: 'default' } }
  426. },
  427. label: {
  428. show: true,
  429. position: 'top'
  430. },
  431. data: zycList
  432. },
  433. {
  434. name: '运冰车次',
  435. lineStyle: {
  436. color: '#008198',
  437. },
  438. type: 'line',
  439. areaStyle: {
  440. normal: {
  441. type: 'default',
  442. color: new echarts.graphic.LinearGradient(0, 0, 0, 0.8, [{
  443. offset: 0,
  444. color: 'rgba(129,197,255,.6)'
  445. }, {
  446. offset: 1,
  447. color: 'rgba(129,197,255,.0)'
  448. }], false)
  449. }
  450. },
  451. smooth: true,
  452. itemStyle: {
  453. normal: { areaStyle: { type: 'default' } }
  454. },
  455. label: {
  456. show: true,
  457. position: 'top'
  458. },
  459. data: ybcList
  460. },
  461. {
  462. name: '吸污车次',
  463. lineStyle: {
  464. color: '#2ef4ab',
  465. },
  466. type: 'line',
  467. areaStyle: {
  468. normal: {
  469. type: 'default',
  470. color: new echarts.graphic.LinearGradient(0, 0, 0, 0.8, [{
  471. offset: 0,
  472. color: 'rgba(129,197,255,.6)'
  473. }, {
  474. offset: 1,
  475. color: 'rgba(129,197,255,.0)'
  476. }], false)
  477. }
  478. },
  479. smooth: true,
  480. itemStyle: {
  481. normal: { areaStyle: { type: 'default' } }
  482. },
  483. label: {
  484. show: true,
  485. position: 'top'
  486. },
  487. data: xwcList
  488. },
  489. {
  490. name: '完成量',
  491. lineStyle: {
  492. color: '#ffe074',
  493. },
  494. type: 'line',
  495. areaStyle: {
  496. normal: {
  497. type: 'default',
  498. color: new echarts.graphic.LinearGradient(0, 0, 0, 0.8, [{
  499. offset: 0,
  500. color: 'rgba(129,197,255,.6)'
  501. }, {
  502. offset: 1,
  503. color: 'rgba(129,197,255,.0)'
  504. }], false)
  505. }
  506. },
  507. smooth: true,
  508. itemStyle: {
  509. normal: { areaStyle: { type: 'default' } }
  510. },
  511. label: {
  512. show: true,
  513. position: 'top'
  514. },
  515. data: jdList
  516. }
  517. ]
  518. };
  519. myChart.setOption(option);
  520. window.addEventListener("resize", function () {
  521. myChart.resize();
  522. });
  523. }
  524. function echarts_5(dtLisT, fkrList) {
  525. var myChart = echarts.init(document.getElementById('echart5'));
  526. var option = {
  527. color: ['#ffe074'],
  528. textStyle: {
  529. color: 'rgba(255, 255, 255, 1)'
  530. },
  531. tooltip: {
  532. textStyle: {
  533. align: 'left'
  534. },
  535. trigger: 'axis',
  536. formatter: "{b} " + $("#biaoduan").val() + ":</br>{a} : {c} 人"
  537. },
  538. xAxis: {
  539. type: 'category',
  540. data: dtLisT
  541. },
  542. yAxis: {
  543. type: 'value'
  544. },
  545. series: [{
  546. name: "防疫人数",
  547. data: fkrList,
  548. type: 'bar'
  549. }]
  550. };
  551. myChart.setOption(option);
  552. window.addEventListener("resize", function () {
  553. myChart.resize();
  554. });
  555. }
  556. function table1(t1, t2) {
  557. $("#td1").html(t1[0]);
  558. $("#td2").html(t1[1]);
  559. $("#td3").html(t1[2]);
  560. $("#td4").html(t1[3]);
  561. $("#td5").html(t1[4]);
  562. $("#td6").html(t1[5]);
  563. $("#td7").html(t1[6]);
  564. $("#td8").html(t1[7]);
  565. $("#td9").html(t1[8]);
  566. $("#td10").html(t1[9]);
  567. $("#td11").html(t1[10]);
  568. $("#td12").html(t1[11]);
  569. $("#td13").html(t1[12]);
  570. $("#td14").html(t1[13]);
  571. $("#td15").html(t1[14]);
  572. $("#td16").html(t1[15]);
  573. $("#td17").html(t1[16]);
  574. $("#td18").html(t1[17]);
  575. $("#td19").html(t1[18]);
  576. $("#td20").html(t1[19]);
  577. $("#td21").html(t1[20]);
  578. $("#td22").html(t1[21]);
  579. $("#td23").html(t1[22]);
  580. $("#td24").html(t1[23]);
  581. $("#td25").html(t2[0]);
  582. $("#td26").html(t2[1]);
  583. $("#td27").html(t2[2]);
  584. }