wpdetailchart.jsp 16 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725
  1. <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
  2. <%@include file="/pages/includes/taglibs.jsp"%>
  3. <head>
  4. <link rel="stylesheet" type="text/css" media="screen" href="<%=request.getContextPath() %>/resource/plugin/jqgrid/css/ui.jqgrid.css" />
  5. <link rel="stylesheet" type="text/css" href="<%=request.getContextPath()%>/resource/plugin/jqueryui/css/custom-theme/jquery-ui-1.9.2.custom.css" />
  6. <script src="<%=request.getContextPath() %>/resource/js/jquery-1.8.3.js" type="text/javascript"></script>
  7. <script src="<%=request.getContextPath() %>/resource/plugin/jqueryui/js/jquery-ui-1.9.2.custom.js" type="text/javascript"></script>
  8. <script src="<%=request.getContextPath()%>/resource/js/highcharts/highcharts.src.js" type="text/javascript"></script>
  9. <script src="<%=request.getContextPath()%>/resource/js/highcharts/highcharts-more.js"></script>
  10. <script src="<%=request.getContextPath()%>/resource/js/highcharts/modules/solid-gauge.src.js"></script>
  11. <script src="<%=request.getContextPath()%>/resource/js/datePicker/WdatePicker.js" type="text/javascript"></script>
  12. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  13. <title>风场日性能分析</title>
  14. <style type="text/css">
  15. body {
  16. margin-left: 0px;
  17. margin-top: 0px;
  18. margin-right: 0px;
  19. margin-bottom: 0px;
  20. }
  21. .Text {
  22. font-family: "Times New Roman", Times, serif;
  23. font-size: 12px;
  24. color: #333;
  25. }
  26. </style>
  27. <script type="text/javascript">
  28. var chart1;
  29. var chart2;
  30. var chart3;
  31. var chart4;
  32. var chart5;
  33. var chart6;
  34. var options1;
  35. var options2;
  36. var options3;
  37. var options4;
  38. var options5;
  39. var options6;
  40. Highcharts.setOptions({
  41. global : {
  42. useUTC : false
  43. }
  44. });
  45. String.prototype.endWith=function(oString){
  46. var reg=new RegExp(oString+"$");
  47. return reg.test(this);
  48. }
  49. $(document).ready(function(){
  50. options1 = {
  51. chart: {
  52. renderTo : 'rzdfs',
  53. height:300,width:480,
  54. polar: true,
  55. type: 'area'
  56. },
  57. title: {
  58. text: '',
  59. x: 0
  60. },
  61. pane: {
  62. size: '70%'
  63. },
  64. xAxis: {
  65. categories: ['北', '北北东', '北东', '东北东','东', '东南东',
  66. '南东', '南南东', '南','南南西', '南西',
  67. '西南西', '西', '西北西', '北西','北北西'
  68. ],
  69. tickmarkPlacement: 'on',
  70. lineWidth: 0
  71. },
  72. yAxis: {
  73. gridLineInterpolation: 'polygon',
  74. lineWidth: 0,
  75. min: 0
  76. },
  77. tooltip: {
  78. shared: true,
  79. pointFormat: '<span style="color:{series.color}"> <b>{point.y:,.0f}</b><br/>'
  80. },
  81. series: [{
  82. name: 'name1',
  83. data: [],
  84. pointPlacement: 'on'
  85. }]
  86. }
  87. /*******************************************************************/
  88. options2 = {
  89. chart: {
  90. renderTo : 'yzdfs',
  91. height:300,width:480,
  92. polar: true,
  93. type: 'area'
  94. },
  95. title: {
  96. text: '',
  97. x: 0
  98. },
  99. pane: {
  100. size: '70%'
  101. },
  102. xAxis: {
  103. categories: ['北', '北北东', '北东', '东北东','东', '东南东',
  104. '南东', '南南东', '南','南南西', '南西',
  105. '西南西', '西', '西北西', '北西','北北西'
  106. ],
  107. tickmarkPlacement: 'on',
  108. lineWidth: 0
  109. },
  110. yAxis: {
  111. gridLineInterpolation: 'polygon',
  112. lineWidth: 0,
  113. min: 0
  114. },
  115. tooltip: {
  116. shared: true,
  117. pointFormat: '<span style="color:{series.color}"> <b>{point.y:,.0f}</b><br/>'
  118. },
  119. series: [{
  120. name: 'name1',
  121. data: [],
  122. pointPlacement: 'on'
  123. }]
  124. }
  125. /*******************************************************************/
  126. options3 = {
  127. chart: {
  128. renderTo : 'nzdfs',
  129. height:300,width:480,
  130. polar: true,
  131. type: 'area'
  132. },
  133. title: {
  134. text: '',
  135. x: 0
  136. },
  137. pane: {
  138. size: '70%'
  139. },
  140. xAxis: {
  141. categories: ['北', '北北东', '北东', '东北东','东', '东南东',
  142. '南东', '南南东', '南','南南西', '南西',
  143. '西南西', '西', '西北西', '北西','北北西'
  144. ],
  145. tickmarkPlacement: 'on',
  146. lineWidth: 0
  147. },
  148. yAxis: {
  149. gridLineInterpolation: 'polygon',
  150. lineWidth: 0,
  151. min: 0
  152. },
  153. tooltip: {
  154. shared: true,
  155. pointFormat: '<span style="color:{series.color}"> <b>{point.y:,.0f}</b><br/>'
  156. },
  157. series: [{
  158. name: 'name1',
  159. data: [],
  160. pointPlacement: 'on'
  161. }]
  162. }
  163. /*******************************************************************/
  164. options4 = {
  165. chart: {
  166. renderTo : 'rfxpl',
  167. height:300,width:480,
  168. polar: true,
  169. type: 'area'
  170. },
  171. title: {
  172. text: '',
  173. x: 0
  174. },
  175. pane: {
  176. size: '70%'
  177. },
  178. xAxis: {
  179. categories: ['北', '北北东', '北东', '东北东','东', '东南东',
  180. '南东', '南南东', '南','南南西', '南西',
  181. '西南西', '西', '西北西', '北西','北北西'
  182. ],
  183. tickmarkPlacement: 'on',
  184. lineWidth: 0
  185. },
  186. yAxis: {
  187. gridLineInterpolation: 'polygon',
  188. lineWidth: 0,
  189. min: 0
  190. },
  191. tooltip: {
  192. shared: true,
  193. pointFormat: '<span style="color:{series.color}"> <b>{point.y:,.0f}</b><br/>'
  194. },
  195. series: [{
  196. name: 'name1',
  197. data: [],
  198. pointPlacement: 'on'
  199. }]
  200. }
  201. /*******************************************************************/
  202. options5 = {
  203. chart: {
  204. renderTo : 'yfxpl',
  205. height:300,width:480,
  206. polar: true,
  207. type: 'area'
  208. },
  209. title: {
  210. text: '',
  211. x: 0
  212. },
  213. pane: {
  214. size: '70%'
  215. },
  216. xAxis: {
  217. categories: ['北', '北北东', '北东', '东北东','东', '东南东',
  218. '南东', '南南东', '南','南南西', '南西',
  219. '西南西', '西', '西北西', '北西','北北西'
  220. ],
  221. tickmarkPlacement: 'on',
  222. lineWidth: 0
  223. },
  224. yAxis: {
  225. gridLineInterpolation: 'polygon',
  226. lineWidth: 0,
  227. min: 0
  228. },
  229. tooltip: {
  230. shared: true,
  231. pointFormat: '<span style="color:{series.color}"> <b>{point.y:,.0f}</b><br/>'
  232. },
  233. series: [{
  234. name: 'name1',
  235. data: [],
  236. pointPlacement: 'on'
  237. }]
  238. }
  239. /*******************************************************************/
  240. options6 = {
  241. chart: {
  242. renderTo : 'nfxpl',
  243. height:300,width:480,
  244. polar: true,
  245. type: 'area'
  246. },
  247. title: {
  248. text: '',
  249. x: 0
  250. },
  251. pane: {
  252. size: '70%'
  253. },
  254. xAxis: {
  255. categories: ['北', '北北东', '北东', '东北东','东', '东南东',
  256. '南东', '南南东', '南','南南西', '南西',
  257. '西南西', '西', '西北西', '北西','北北西'
  258. ],
  259. tickmarkPlacement: 'on',
  260. lineWidth: 0
  261. },
  262. yAxis: {
  263. gridLineInterpolation: 'polygon',
  264. lineWidth: 0,
  265. min: 0
  266. },
  267. tooltip: {
  268. shared: true,
  269. pointFormat: '<span style="color:{series.color}"> <b>{point.y:,.0f}</b><br/>'
  270. },
  271. series: [{
  272. name: 'name1',
  273. data: [],
  274. pointPlacement: 'on'
  275. }]
  276. }
  277. /*******************************************************************/
  278. chart1 = new Highcharts.Chart(options1);
  279. chart2 = new Highcharts.Chart(options2);
  280. chart3 = new Highcharts.Chart(options3);
  281. chart4 = new Highcharts.Chart(options4);
  282. chart5 = new Highcharts.Chart(options5);
  283. chart6 = new Highcharts.Chart(options6);
  284. //windtowerAjax();
  285. //window.setInterval(windtowerAjax, 60000);
  286. var wp='<s:property value="windfarm"/>';
  287. var wt='<s:property value="windturbineid"/>';
  288. var rd='<s:property value="recorddate"/>';
  289. $("#recorddate").val(rd);
  290. $("#windfarm").val(wp);
  291. $("#windturbineid").val(wt);
  292. nfxplchart();
  293. yfxplchart();
  294. rfxplchart();
  295. nzdfschart();
  296. yzdfschart();
  297. rzdfschart();
  298. });
  299. function queryData() {
  300. var recorddate = $("#recorddate").val();
  301. var windfarm = $("#windfarm").val();
  302. var windturbineid = $("#windturbineid").val();
  303. if ("" == windfarm) {
  304. alert("请选择风场!");
  305. return false;
  306. }
  307. if ("" == recorddate) {
  308. alert("请选择查询日期!");
  309. return false;
  310. }
  311. $("#f1").attr("action", "../wtgoodness/wpdetailindex.action").submit();
  312. }
  313. function rzdfschart() {
  314. var recorddate = $("#recorddate").val();
  315. var windfarm = $("#windfarm").val();
  316. url = "../wtgoodness/wprzdfs.action?windfarm="
  317. + windfarm + "&recorddate=" + recorddate;
  318. $.ajax( {
  319. url : url,
  320. type : "post",
  321. cache : false,
  322. dataType : "json",
  323. data : {},
  324. ifModified : false,
  325. success : function(result) {
  326. var data1 = [];
  327. var jfpl=result.jfpl;
  328. $.each(result.data, function(m, obj) {
  329. if (obj.data1 != null) {
  330. data1.push(parseFloat(obj.data1));
  331. }
  332. });
  333. if(null !=options1.series[0])
  334. {
  335. options1.series[0].data = data1;
  336. }
  337. options1.series[0].name = jfpl;
  338. chart1 = new Highcharts.Chart(options1);
  339. }
  340. });
  341. }
  342. function yzdfschart() {
  343. var recorddate = $("#recorddate").val();
  344. var windfarm = $("#windfarm").val();
  345. url = "../wtgoodness/wpyzdfs.action?windfarm="
  346. + windfarm + "&recorddate=" + recorddate;
  347. $.ajax( {
  348. url : url,
  349. type : "post",
  350. cache : false,
  351. dataType : "json",
  352. data : {},
  353. ifModified : false,
  354. success : function(result) {
  355. var data1 = [];
  356. var jfpl=result.jfpl;
  357. $.each(result.data, function(m, obj) {
  358. if (obj.data1 != null) {
  359. data1.push(parseFloat(obj.data1));
  360. }
  361. });
  362. if(null !=options2.series[0])
  363. {
  364. options2.series[0].data = data1;
  365. }
  366. options2.series[0].name = jfpl;
  367. chart2 = new Highcharts.Chart(options2);
  368. }
  369. });
  370. }
  371. function nzdfschart() {
  372. var recorddate = $("#recorddate").val();
  373. var windfarm = $("#windfarm").val();
  374. url = "../wtgoodness/wpnzdfs.action?windfarm="
  375. + windfarm + "&recorddate=" + recorddate;
  376. $.ajax( {
  377. url : url,
  378. type : "post",
  379. cache : false,
  380. dataType : "json",
  381. data : {},
  382. ifModified : false,
  383. success : function(result) {
  384. var data1 = [];
  385. var jfpl=result.jfpl;
  386. $.each(result.data, function(m, obj) {
  387. if (obj.data1 != null) {
  388. data1.push(parseFloat(obj.data1));
  389. }
  390. });
  391. if(null !=options3.series[0])
  392. {
  393. options3.series[0].data = data1;
  394. }
  395. options3.series[0].name = jfpl;
  396. chart3 = new Highcharts.Chart(options3);
  397. }
  398. });
  399. }
  400. function rfxplchart() {
  401. var recorddate = $("#recorddate").val();
  402. var windfarm = $("#windfarm").val();
  403. url = "../wtgoodness/wprfxpl.action?windfarm="
  404. + windfarm + "&recorddate=" + recorddate;
  405. $.ajax( {
  406. url : url,
  407. type : "post",
  408. cache : false,
  409. dataType : "json",
  410. data : {},
  411. ifModified : false,
  412. success : function(result) {
  413. var data1 = [];
  414. var jfpl=result.jfpl;
  415. $.each(result.data, function(m, obj) {
  416. if (obj.data1 != null) {
  417. data1.push(parseFloat(obj.data1));
  418. }
  419. });
  420. if(null !=options4.series[0])
  421. {
  422. options4.series[0].data = data1;
  423. }
  424. options4.series[0].name = jfpl;
  425. chart4 = new Highcharts.Chart(options4);
  426. }
  427. });
  428. }
  429. function yfxplchart() {
  430. var recorddate = $("#recorddate").val();
  431. var windfarm = $("#windfarm").val();
  432. url = "../wtgoodness/wpyfxpl.action?windfarm="
  433. + windfarm + "&recorddate=" + recorddate;
  434. $.ajax( {
  435. url : url,
  436. type : "post",
  437. cache : false,
  438. dataType : "json",
  439. data : {},
  440. ifModified : false,
  441. success : function(result) {
  442. var data1 = [];
  443. var jfpl=result.jfpl;
  444. $.each(result.data, function(m, obj) {
  445. if (obj.data1 != null) {
  446. data1.push(parseFloat(obj.data1));
  447. }
  448. });
  449. if(null !=options5.series[0])
  450. {
  451. options5.series[0].data = data1;
  452. }
  453. options5.series[0].name = jfpl;
  454. chart5 = new Highcharts.Chart(options5);
  455. }
  456. });
  457. }
  458. function nfxplchart() {
  459. var recorddate = $("#recorddate").val();
  460. var windfarm = $("#windfarm").val();
  461. url = "../wtgoodness/wpnfxpl.action?windfarm="
  462. + windfarm + "&recorddate=" + recorddate;
  463. $.ajax( {
  464. url : url,
  465. type : "post",
  466. cache : false,
  467. dataType : "json",
  468. data : {},
  469. ifModified : false,
  470. success : function(result) {
  471. var data1 = [];
  472. var jfpl=result.jfpl;
  473. $.each(result.data, function(m, obj) {
  474. if (obj.data1 != null) {
  475. data1.push(parseFloat(obj.data1));
  476. }
  477. });
  478. if(null !=options6.series[0])
  479. {
  480. options6.series[0].data = data1;
  481. }
  482. options6.series[0].name = jfpl;
  483. chart6 = new Highcharts.Chart(options6);
  484. }
  485. });
  486. }
  487. </script>
  488. <body style='overflow:scroll;'>
  489. <form action="" method="get" id="f1">
  490. <table width="1560" border="0" cellspacing="0" cellpadding="0">
  491. <tr>
  492. <td width="50" height="30" bgcolor="#EFF1F0">&nbsp;</td>
  493. <td width="1560" bgcolor="#EFF1F0"><span class="Text">
  494. 风场: <label for="textfield5"></label> <s:if test="u.wpId == null">
  495. <s:select list="wps" listKey="id" listValue="name" id="windfarm"
  496. name="windfarm" ></s:select>
  497. </s:if> <s:else>
  498. <s:select list="wps" listKey="id" listValue="name" id="windfarm"
  499. name="windfarm" ></s:select>
  500. </s:else>
  501. 日期: <s:textfield cssClass="Wdate"
  502. onFocus="WdatePicker({dateFmt:'yyyy-MM-dd',isShowWeek:true,readOnly:true})"
  503. id="recorddate" name="recorddate" title="开始日期" /> <input
  504. type="submit" name="button" id="button" onclick="queryData();"
  505. value="查询" />
  506. <s:hidden id="windturbineid" name="windturbineid"></s:hidden>
  507. </td>
  508. </span>
  509. </td>
  510. </tr>
  511. </table>
  512. <table width="1000" border="0" cellspacing="0" cellpadding="0">
  513. <tr>
  514. <td align="center" valign="top"><table
  515. border="0" cellspacing="0" cellpadding="0">
  516. <tr>
  517. <td><img
  518. src="<%=request.getContextPath()%>/resource/images/detailInfo/1.jpg"
  519. width="500" height="35" /></td>
  520. </tr>
  521. <tr>
  522. <td
  523. >
  524. <div id="rzdfs" ></div>
  525. </td>
  526. </tr>
  527. <tr>
  528. <td></td>
  529. </tr>
  530. </table>
  531. </td>
  532. <td align="center" valign="top"><table
  533. border="0" cellspacing="0" cellpadding="0">
  534. <tr>
  535. <td><img
  536. src="<%=request.getContextPath()%>/resource/images/detailInfo/2.jpg"
  537. width="500" height="35" /></td>
  538. </tr>
  539. <tr>
  540. <td>
  541. <div id="yzdfs" ></div>
  542. </td>
  543. </tr>
  544. <tr>
  545. <td></td>
  546. </tr>
  547. </table>
  548. </td>
  549. <td align="center" valign="top"><table
  550. border="0" cellspacing="0" cellpadding="0">
  551. <tr>
  552. <td><img
  553. src="<%=request.getContextPath()%>/resource/images/detailInfo/3.jpg"
  554. width="500" height="35" /></td>
  555. </tr>
  556. <tr>
  557. <td>
  558. <div id="nzdfs" ></div>
  559. </td>
  560. </tr>
  561. <tr>
  562. <td></td>
  563. </tr>
  564. </table>
  565. </td>
  566. </tr>
  567. <tr>
  568. <td align="center" valign="top"><table
  569. border="0" cellspacing="0" cellpadding="0">
  570. <tr>
  571. <td><img
  572. src="<%=request.getContextPath()%>/resource/images/detailInfo/4.jpg"
  573. width="500" height="35" /></td>
  574. </tr>
  575. <tr>
  576. <td
  577. >
  578. <div id="rfxpl" ></div>
  579. </td>
  580. </tr>
  581. <tr>
  582. <td></td>
  583. </tr>
  584. </table>
  585. </td>
  586. <td align="center" valign="top"><table
  587. border="0" cellspacing="0" cellpadding="0">
  588. <tr>
  589. <td><img
  590. src="<%=request.getContextPath()%>/resource/images/detailInfo/5.jpg"
  591. width="500" height="35" /></td>
  592. </tr>
  593. <tr>
  594. <td
  595. >
  596. <div id="yfxpl" ></div>
  597. </td>
  598. </tr>
  599. <tr>
  600. <td></td>
  601. </tr>
  602. </table>
  603. </td>
  604. <td align="center" valign="top"><table
  605. border="0" cellspacing="0" cellpadding="0">
  606. <tr>
  607. <td><img
  608. src="<%=request.getContextPath()%>/resource/images/detailInfo/6.jpg"
  609. width="500" height="35" /></td>
  610. </tr>
  611. <tr>
  612. <td>
  613. <div id="nfxpl" ></div>
  614. </td>
  615. </tr>
  616. <tr>
  617. <td></td>
  618. </tr>
  619. </table>
  620. </td>
  621. </tr>
  622. </table>
  623. </form>
  624. </body>