chart.helper.js 44 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232
  1. $(function () {
  2. "use strict";
  3. BWA.Chart = BWA.Chart || {};
  4. BWA.Chart.getLastYearSameWeekDate = function (dateStart, dateEnd, weekday) {
  5. var data = {
  6. startDate: dateStart,
  7. endDate: dateEnd
  8. };
  9. for (var i = 0; i < 7; i++) {
  10. if (moment(data.startDate).toDate().getDay() == weekday)
  11. return data;
  12. data.startDate = moment(data.startDate).subtract(-1, 'days');
  13. data.endDate = moment(data.endDate).subtract(-1, 'days');
  14. }
  15. return data;
  16. }
  17. BWA.Chart.getCustermTimeArgumentAxisString = function (codeTimeType, date) { // $Code.TimeType
  18. switch (codeTimeType) {
  19. case $Code.TimeType.QUARTERMIN:
  20. var year = date.getFullYear();
  21. var mon = (date.getMonth() + 1);
  22. var day = date.getDate();
  23. var hour = date.getHours()
  24. var min = date.getMinutes();
  25. if (mon < 10)
  26. mon = "0" + mon;
  27. if (day < 10)
  28. day = "0" + day;
  29. if (hour < 10)
  30. hour = "0" + hour;
  31. if (min < 10)
  32. min = "0" + min;
  33. return year + "-" + mon + "-" + day + " " + hour + ":" + min;
  34. break;
  35. case $Code.TimeType.NONE:
  36. var year = date.getFullYear();
  37. var mon = (date.getMonth() + 1);
  38. var day = date.getDate();
  39. if (mon < 10)
  40. mon = "0" + mon;
  41. if (day < 10)
  42. day = "0" + day;
  43. return year + "-" + mon + "-" + day;
  44. break;
  45. case $Code.TimeType.HOUR:
  46. return date.getDate() + "일 : " + date.getHours() + "시";
  47. break;
  48. case $Code.TimeType.DAY:
  49. return date.getMonth() + 1 + "월 : " + date.getDate() + "일";
  50. break;
  51. case $Code.TimeType.MONTH:
  52. return date.getFullYear() + "년 : " + (date.getMonth() + 1) + "월";
  53. break;
  54. }
  55. return date.toLocaleDateString('ja-JP');
  56. };
  57. BWA.Chart.getTimeLineArgumentAxis = function (momentDateTime, codeTimeType, MS, ME) { // $Code.TimeType
  58. var argumentAxis = null;
  59. var dateType = '';
  60. switch (codeTimeType) {
  61. case $Code.TimeType.MIN:
  62. dateType = 'day';
  63. argumentAxis = {
  64. argumentType: 'datetime',
  65. title: $G('hour'),
  66. label: {
  67. alignment: 'center',
  68. format: 'HH'
  69. },
  70. tickInterval: { hours: 1 },
  71. };
  72. break;
  73. case $Code.TimeType.QUARTERMIN:
  74. dateType = 'day';
  75. argumentAxis = {
  76. argumentType: 'datetime',
  77. title: $G('hour'),
  78. label: {
  79. alignment: 'center',
  80. format: 'HH'
  81. },
  82. tickInterval: { hours: 1 },
  83. };
  84. break;
  85. case $Code.TimeType.HOUR:
  86. dateType = 'day';
  87. argumentAxis = {
  88. argumentType: 'string',
  89. title: $G('hour'),
  90. label: {
  91. alignment: 'center',
  92. format: 'HH:mm'
  93. },
  94. tickInterval: { hours: 1 },
  95. };
  96. if (!_.isNull(MS) && !_.isNull(ME)) {
  97. argumentAxis.min = moment(MS).add(-1, 'hours').toDate();
  98. argumentAxis.max = moment(ME).add(1, 'hours').toDate();
  99. }
  100. break;
  101. case $Code.TimeType.DAY:
  102. dateType = 'month';
  103. argumentAxis = {
  104. argumentType: 'string',
  105. title: $G('day'),
  106. label: {
  107. alignment: 'center',
  108. format: 'MM-dd'
  109. },
  110. tickInterval: { days: 1 },
  111. };
  112. if (!_.isNull(MS) && !_.isNull(ME)) {
  113. argumentAxis.min = moment(MS).add(-1, 'days').toDate();
  114. argumentAxis.max = moment(ME).add(1, 'days').toDate();
  115. }
  116. break;
  117. case $Code.TimeType.MONTH:
  118. dateType = 'year';
  119. argumentAxis = {
  120. argumentType: 'string',
  121. title: $G('month'),
  122. label: {
  123. alignment: 'center',
  124. format: 'MM'
  125. },
  126. tickInterval: { months: 1 },
  127. };
  128. if (!_.isNull(MS) && !_.isNull(ME)) {
  129. argumentAxis.min = moment(MS).add(-1, 'months').toDate();
  130. argumentAxis.max = moment(ME).add(1, 'months').toDate();
  131. }
  132. break;
  133. }
  134. if (!_.isNull(momentDateTime)) {
  135. argumentAxis.min = moment(momentDateTime.startOf(dateType).toDate()).add(-1, 'hours').toDate();
  136. argumentAxis.max = moment(momentDateTime.endOf(dateType).toDate()).add(1, 'hours').toDate();
  137. }
  138. argumentAxis.valueMarginsEnabled = false;
  139. return argumentAxis;
  140. };
  141. BWA.Chart.mapWithConvertingDateTime = function (array, timetype) {
  142. return _.map(array, function (x) {
  143. if (timetype)
  144. if (!_.isNull(timetype))
  145. x.DateTime = BWA.Chart.getCustermTimeArgumentAxisString(timetype, moment(x.DateTime).toDate());
  146. else
  147. x.DateTime = moment(x.DateTime).toDate();
  148. return x;
  149. });
  150. };
  151. BWA.Chart.mapNewWithConvertingDateTime = function (array, timetype) {
  152. return _.map(array, function (x) {
  153. return {
  154. DateTime: (!_.isNull(timetype)) ? BWA.Chart.getCustermTimeArgumentAxisString(timetype, moment(x.DateTime).toDate()) : moment(x.DateTime).toDate(),
  155. Value: x.Value
  156. };
  157. return x;
  158. });
  159. };
  160. BWA.Chart.getRelationDataArrayOnDateTime = function (dataArray1, dataArray2, fieldName1, fieldName2) {
  161. var dataArray = [];
  162. var minLength = Math.min(dataArray1.length, dataArray2.length)
  163. var index1 = 0;
  164. var index2 = 0;
  165. for (var i = 0 ; i < minLength ; i++) {
  166. var l = dataArray1[index1];
  167. var r = dataArray2[index2];
  168. if (l.DateTime === r.DateTime) {
  169. var obj = {};
  170. obj[fieldName1] = l.Value;
  171. obj[fieldName2] = r.Value;
  172. dataArray.push(obj);
  173. index1++;
  174. index2++;
  175. }
  176. else if (l.DateTime > r.DateTime) {
  177. index2++;
  178. }
  179. else if (l.DateTime < r.DateTime) {
  180. index1++;
  181. }
  182. }
  183. return dataArray;
  184. }
  185. // hcLee 2015 04 23
  186. BWA.Chart.getRelationDataArrayOnDateTime2 = function (dataArray1, dataArray2, dataArray3, fieldName1, fieldName2, fieldName3) {
  187. var dataArray = [];
  188. var minLength = Math.min(dataArray1.length, dataArray2.length);
  189. minLength = Math.min(minLength, dataArray3.length);
  190. var index1 = 0;
  191. var index2 = 0;
  192. var index3 = 0;
  193. for (var i = 0 ; i < minLength ; i++) {
  194. var l = dataArray1[index1];
  195. var r = dataArray2[index2];
  196. var m = dataArray3[index3];
  197. if (l.DateTime === r.DateTime) {
  198. var obj = {};
  199. obj[fieldName1] = l.Value;
  200. obj[fieldName2] = r.Value;
  201. dataArray.push(obj);
  202. index1++;
  203. index2++;
  204. }
  205. else if (l.DateTime > r.DateTime) {
  206. index2++;
  207. }
  208. else if (l.DateTime < r.DateTime) {
  209. index1++;
  210. }
  211. }
  212. return dataArray;
  213. }
  214. // hcLee 2018 02 27
  215. BWA.Chart.getRelationDataArrayOnDateTimeNew = function (dataArray1, dataArray2, fieldName1, fieldName2) {
  216. var dataArray = [];
  217. var minLength = Math.min(dataArray1.length, dataArray2.length)
  218. var index1 = 0;
  219. var index2 = 0;
  220. for (var i = 0 ; i < minLength ; i++) {
  221. var l = dataArray1[index1];
  222. var r = dataArray2[index2];
  223. if (l.DateTime === r.DateTime) {
  224. var obj = {};
  225. obj[fieldName1] = l.lv1;
  226. obj[fieldName2] = r.rv1;
  227. dataArray.push(obj);
  228. index1++;
  229. index2++;
  230. }
  231. else if (l.DateTime > r.DateTime) {
  232. index2++;
  233. }
  234. else if (l.DateTime < r.DateTime) {
  235. index1++;
  236. }
  237. }
  238. return dataArray;
  239. }
  240. BWA.Chart.Instance = function (id, chartType) {
  241. id = '#' + id;
  242. return function (options) {
  243. $(id)[chartType](options);
  244. return function () {
  245. return $(id)[chartType]('instance');
  246. }
  247. }
  248. }
  249. });
  250. $(function () {
  251. 'use strict';
  252. BemsWebApplication.Factory.FA = function (FA_fType, params, viewInfo) {
  253. var initialized = false,
  254. shouldReload = false,
  255. datagrid = null,
  256. currentTabIndex = ko.observable(0),
  257. facilityViewModel = new BWA.CmFacilityViewModel(),
  258. dataSource;
  259. var m_Facility;
  260. var facilityDataSource = BWA.db.createDataSource('CmFacility'),
  261. facilitiesForSearch = ko.observableArray(),
  262. facilityCodeForSearch = ko.observable(0),
  263. deferredForSearch = new $.Deferred();
  264. var visiblePopup = ko.observable(false);
  265. var formulaGet = new BWA.Chart.FormulaGet(BWA.UserInfo.SiteId());
  266. // cyim 2016.08.22 : 성능분석 그래프의 경우 시간 데이타만 표시되어야 한다
  267. var timeBoxForSearch = BWA.SearchView.createDateTimeBox($G.TimeTypesForHourOnly, null, false);
  268. // !!!! 중요 hcLee
  269. var charts = BWA.UserInfo.GetCharts(FA_fType);
  270. var multiViewOptions = {
  271. viewIndex: currentTabIndex,
  272. viewCount: parseInt(charts.length / 6) + 1,
  273. PageChanged: function () {
  274. if (currentTabIndex() == 1) {
  275. makePageChart(1);
  276. }
  277. if (currentTabIndex() == 2) {
  278. makePageChart(2);
  279. }
  280. handleSearchInSearchView();
  281. },
  282. };
  283. var divs = [];
  284. function makePageChart(p) {
  285. // TYPE 1~5먼저 처리
  286. if (p == 0 && charts.length < 5)
  287. switch (charts.length) {
  288. case 1:
  289. document.getElementById("f_detail_chart").style.height = "700px";
  290. makeChart('clearfix', 0, 'margin-left: 1.1%; width: 66.25%; height: 700px; margin-top:28px;');
  291. break;
  292. case 2:
  293. document.getElementById("f_detail_chart").style.height = "700px";
  294. makeChart('clearfix', 0, 'margin-left: 1.1%; width: 66.25%; height: 340px; margin-top:28px;');
  295. makeChart('clearfix', 1, 'margin-left: 1.1%; width: 66.25%; height: 340px; margin-top:18px;');
  296. break;
  297. case 3:
  298. document.getElementById("f_detail_chart").style.height = "700px";
  299. makeChart('clearfix', 0, 'margin-left: 1.1%; width: 66.25%; height: 340px; margin-top:28px;');
  300. makeChart('clearfix', 1, 'margin-left: 1.1%; width: 32.5%; height: 340px; margin-top:18px;');
  301. makeChart('clearfix', 2, 'margin-left: 1.1%; width: 32.5%; height: 340px; margin-top:18px;');
  302. break;
  303. case 4:
  304. makeChart('clearfix', 0, 'margin-left: 1.1%; width: 66.25%; height: 340px; margin-top:28px;');
  305. // 필요
  306. document.getElementById('clearfix').insertAdjacentHTML('beforeend', "<div class='clear'></div>");
  307. makeChart('clearfix', 1, 'width: 32.5%; height: 340px; margin-top:18px;');
  308. makeChart('clearfix', 2, 'margin-left: 1.1%; width: 32.5%; height: 340px; margin-top:18px;');
  309. makeChart('clearfix', 3, 'margin-left: 1.1%; width: 32.5%; height: 340px; margin-top:18px;');
  310. break;
  311. }
  312. if (p == 0 && charts.length >= 5) {
  313. makeChart('clearfix', 0, 'margin-left: 1.1%; width: 32.5%; height: 340px; margin-top:28px;');
  314. makeChart('clearfix', 1, 'margin-left: 1.1%; width: 32.5%; height: 340px; margin-top:28px;');
  315. document.getElementById('clearfix').insertAdjacentHTML('beforeend', "<div class='clear'></div>");
  316. makeChart('clearfix', 2, 'width: 32.5%; height: 340px; margin-top:18px;');
  317. makeChart('clearfix', 3, 'margin-left: 1.1%; width: 32.5%; height: 340px; margin-top:18px;');
  318. makeChart('clearfix', 4, 'margin-left: 1.1%; width: 32.5%; height: 340px; margin-top:18px;');
  319. }
  320. if (p >= 1) {
  321. var chartpage = 'subCharts_' + p;
  322. var itemIndex = 0;
  323. for (var c = p * 6 - 1; c < charts.length; c++) {
  324. if (c >= charts.length) return;
  325. if (c >= p * 6 + 5) return;
  326. var divid = 'divchart_' + charts[c].ChartId();
  327. var chartId = 'chart_' + charts[c].ChartId();
  328. var style = 'margin-left: 1.1%; width: 32.5%; height: 340px;';
  329. if (itemIndex == 0) style = 'width: 32.5%; height: 340px;';
  330. if (itemIndex == 3) style = 'width: 32.5%; height: 340px; margin-top:18px;';
  331. if (itemIndex == 3)
  332. document.getElementById('clearfix').insertAdjacentHTML('beforeend', "<div class='clear'></div>");
  333. if (itemIndex > 3) style = 'margin-left: 1.1%; width: 32.5%; height: 340px; margin-top:18px;';
  334. makeChart(chartpage, c, style);
  335. itemIndex++;
  336. }
  337. }
  338. }
  339. function makeChart(pid, index, style) {
  340. var divid = 'divchart_' + charts[index].ChartId();
  341. if (document.getElementById(divid) == null)
  342. document.getElementById(pid).insertAdjacentHTML('beforeend',
  343. "<div id=" + divid +
  344. " class='fl chart_wrap_box' style='" + style + "' >" +
  345. "<p class='body_sub_title_2depth'>" +
  346. (charts[index].Title()) +
  347. "</p>" +
  348. "<div id=" + ('chart_' + charts[index].ChartId()) +
  349. " style='height: 90%; width: 100%;' /> </div>");
  350. }
  351. function makeChartView(p) {
  352. var div = [];
  353. if (p == 0) {
  354. div.push({
  355. id: 'f_detail'
  356. });
  357. for (var c = 0; c < charts.length; c++) {
  358. if (c >= charts.length) return div;
  359. if (c >= 5) return div;
  360. div.push({ id: 'divchart_' + charts[c].ChartId(), chartId: 'chart_' + charts[c].ChartId() });
  361. }
  362. }
  363. else {
  364. for (var c = p * 6 - 1; c < charts.length; c++) {
  365. if (c >= charts.length) return div;
  366. if (c >= p * 6 + 5) return div;
  367. div.push({ id: 'divchart_' + charts[c].ChartId(), chartId: 'chart_' + charts[c].ChartId() });
  368. }
  369. }
  370. return div;
  371. }
  372. for (var p = 0; p < multiViewOptions.viewCount; p++) {
  373. divs.push(makeChartView(p));
  374. }
  375. var chartLayout = new BWA.ChartLayout({
  376. divs: divs,
  377. multiViewOptions: multiViewOptions,
  378. });
  379. var m = moment();
  380. // 추가 2015 04 20 hcLee ->
  381. var CODE = $Code,
  382. FuelType = CODE.FuelType,
  383. FT = CODE.FacilityType,
  384. FC = CODE.FacilityCode,
  385. F = CODE.Formula,
  386. TIT = CODE.TimeIntervalType;
  387. function handleViewShown() {
  388. if (initialized === false) {
  389. makePageChart(0);
  390. initialized = true;
  391. timeBoxForSearch.setDefaultDate();
  392. var eq = BWA.DataUtil.constructEqualFilter;
  393. facilityDataSource.filter([eq('SiteId', BWA.UserInfo.SiteId()), 'and', eq('FacilityTypeId', FA_fType)]);
  394. $.when(facilityDataSource.load()).done(function (facilities) {
  395. facilitiesForSearch(facilities);
  396. if (_.isEmpty(facilities) === false) {
  397. var f = facilities[0]; // 첫번째 설비 그려주기 위해
  398. handleSelectedFacilityInSearchView(f);
  399. handleSearchInSearchView();
  400. //2018 03 06 hcLee
  401. var datagrid = $('#FA_DataGridViewInSearchView').dxDataGrid('instance');
  402. if (_.has(datagrid, 'selectRows')) {
  403. datagrid.selectRows(f);
  404. }
  405. }
  406. });
  407. }
  408. else {
  409. handleSearchInSearchView();
  410. }
  411. }
  412. if (shouldReload) {
  413. }
  414. function handleViewHidden() {
  415. var paging = BWA.ChartLayout.Paging;
  416. paging.sideOverlayVisible(false);
  417. $SearchView.visibleObservable(false); // hcLee 2015 03 23
  418. visiblePopup(false);
  419. }
  420. function handleViewShowing() {
  421. }
  422. function refreshList() {
  423. }
  424. var searchViewOptions = {
  425. searchViewItems: [
  426. { id: 'FacilityCode', ignoreValue: 0, defaultValue: 0, value: facilityCodeForSearch, dataSource: facilitiesForSearch },
  427. ],
  428. promiseDataInSearchView: deferredForSearch.promise()
  429. };
  430. function handleSelectedFacilityInSearchView(facility) {
  431. m_Facility = facility;
  432. return;
  433. }
  434. function ChartProcess(chartInfo, DataArray, valueAx, seriesF) {
  435. var chartid = '#chart_' + chartInfo.ChartId();
  436. $(chartid).dxChart({
  437. dataSource: DataArray,
  438. palette: chartInfo.Palette(),
  439. legend: {
  440. visible: true,
  441. verticalAlignment: 'top',
  442. horizontalAlignment: 'center'
  443. },
  444. commonAxisSettings: {
  445. title: {
  446. valueMarginsEnabled: true,
  447. margin: 20,
  448. font: {
  449. color: "black",
  450. size: 18,
  451. weight: 600,
  452. family: "Nanum Gothic",
  453. },
  454. },
  455. axisDivisionFactor: 50,
  456. grid: {
  457. visible: false,
  458. }
  459. },
  460. commonSeriesSettings: {
  461. argumentField: "DateTime",
  462. selectionStyle: {
  463. hatching: {
  464. direction: "left"
  465. }
  466. }
  467. },
  468. valueAxis: valueAx,
  469. series: seriesF,
  470. crosshair: {
  471. enabled: true,
  472. width: 1,
  473. horizontalLine: {
  474. color: '#452d11',
  475. dashStyle: 'dash',
  476. visible: false
  477. },
  478. verticalLine: {
  479. color: '#452d11',
  480. dashStyle: 'dash',
  481. visible: true
  482. },
  483. label: {
  484. visible: true,
  485. backgroundColor: "#452d11",
  486. font: {
  487. color: "white",
  488. size: 12,
  489. weight: 600,
  490. }
  491. }
  492. },
  493. tooltip: {
  494. enabled: true,
  495. color: "#3e1717",
  496. format: 'fixedPoint',
  497. precision: 2,
  498. font: {
  499. color: "white",
  500. size: 12,
  501. weight: 600,
  502. },
  503. argumentFormat: 'shortDate',
  504. customizeText: function () {
  505. return {
  506. text: [this.argumentText, ': ', this.valueText].join('')
  507. };
  508. }
  509. },
  510. });
  511. }
  512. function ChartProcess2(chartInfo, DataArray, valueAx) {
  513. var chartid = '#chart_' + chartInfo.ChartId();
  514. var argAxis = {
  515. title: {
  516. text: chartInfo.XAxTitle(),
  517. }
  518. };
  519. if (chartInfo.UseXAxMinMax())
  520. $.extend(argAxis, {
  521. max: chartInfo.XAxMax(),
  522. min: chartInfo.XAxMin(),
  523. });
  524. $(chartid).dxChart({
  525. dataSource: DataArray,
  526. palette: chartInfo.Palette(),
  527. legend: {
  528. visible: false,
  529. verticalAlignment: 'top',
  530. horizontalAlignment: 'center'
  531. },
  532. argumentAxis: argAxis,
  533. valueAxis: valueAx,
  534. series: {
  535. type: chartInfo.XSType(),
  536. valueField: 'lv1',
  537. argumentField: 'xv', //
  538. label: {
  539. visible: false,
  540. //customizeText: function() {
  541. // return this.argumentField + this.valueText;
  542. //}
  543. },
  544. point: { size: 8 }
  545. },
  546. crosshair: {
  547. enabled: true,
  548. width: 1,
  549. horizontalLine: {
  550. color: '#452d11',
  551. dashStyle: 'dash',
  552. visible: false
  553. },
  554. verticalLine: {
  555. color: '#452d11',
  556. dashStyle: 'dash',
  557. visible: true
  558. },
  559. label: {
  560. visible: true,
  561. backgroundColor: "#452d11",
  562. font: {
  563. color: "white",
  564. size: 12,
  565. weight: 600,
  566. }
  567. }
  568. },
  569. tooltip: {
  570. enabled: true,
  571. color: "#3e1717",
  572. format: 'fixedPoint',
  573. precision: 2,
  574. font: {
  575. color: "white",
  576. size: 12,
  577. weight: 600,
  578. },
  579. //argumentFormat: 'shortDate',
  580. customizeText: function () {
  581. return {
  582. text: [this.argumentText, ': ', this.valueText].join('')
  583. };
  584. }
  585. },
  586. });
  587. }
  588. function FormulaProcessLeft(timeIntervalType, date, formulaList) {
  589. var deferred = new $.Deferred();
  590. var promises = [];
  591. var f = m_Facility.toJS();
  592. var DataArray = [];
  593. var p;
  594. _.each(formulaList, function (fid) {
  595. if (fid == null) fid = 0;
  596. if (fid >= 1000)
  597. p = formulaGet.apiGet({
  598. FacilityTypeId: 103,
  599. FacilityCode: f.FacilityCode, // FacilityTypeId가 100보다 크면 의미가 없다. 정상
  600. FormulaId: fid - 1000 + 1,
  601. TimeIntervalType: timeIntervalType,
  602. StartDate: date.startDate,
  603. EndDate: date.endDate
  604. });
  605. else
  606. p = formulaGet.apiGet({
  607. FacilityTypeId: f.FacilityTypeId,
  608. FacilityCode: f.FacilityCode,
  609. FormulaId: fid,
  610. TimeIntervalType: timeIntervalType,
  611. StartDate: date.startDate,
  612. EndDate: date.endDate
  613. });
  614. promises.push(p);
  615. });
  616. $.when.apply(this, promises)
  617. .done(function (data1, data2, data3, data4) {
  618. if (formulaList.length == 1) {
  619. _.each(data1, function (x) {
  620. DataArray.push({
  621. DateTime: BWA.Chart.getCustermTimeArgumentAxisString(timeBoxForSearch.type(), moment(x.DateTime).toDate()),
  622. lv1: x.Value
  623. });
  624. });
  625. deferred.resolve(DataArray);
  626. return DataArray;
  627. }
  628. if (data1 != undefined)
  629. _.each(data1[0], function (x) {
  630. DataArray.push({
  631. DateTime: BWA.Chart.getCustermTimeArgumentAxisString(timeBoxForSearch.type(), moment(x.DateTime).toDate()),
  632. lv1: x.Value
  633. });
  634. });
  635. if (data2 != undefined)
  636. _.each(data2[0], function (x) {
  637. DataArray.push({
  638. DateTime: BWA.Chart.getCustermTimeArgumentAxisString(timeBoxForSearch.type(), moment(x.DateTime).toDate()),
  639. lv2: x.Value
  640. });
  641. });
  642. if (data3 != undefined)
  643. _.each(data3[0], function (x) {
  644. DataArray.push({
  645. DateTime: BWA.Chart.getCustermTimeArgumentAxisString(timeBoxForSearch.type(), moment(x.DateTime).toDate()),
  646. lv3: x.Value
  647. });
  648. });
  649. if (data4 != undefined)
  650. _.each(data4[0], function (x) {
  651. DataArray.push({
  652. DateTime: BWA.Chart.getCustermTimeArgumentAxisString(timeBoxForSearch.type(), moment(x.DateTime).toDate()),
  653. lv4: x.Value
  654. });
  655. });
  656. deferred.resolve(DataArray);
  657. return DataArray;
  658. })
  659. .fail(function (error) {
  660. //alert(error);
  661. //visiblePopup(false);
  662. });
  663. return deferred.promise();
  664. }
  665. function FormulaProcessRight(timeIntervalType, date, formulaList) {
  666. var deferred = new $.Deferred();
  667. var promises = [];
  668. var f = m_Facility.toJS();
  669. var DataArray = [];
  670. var p;
  671. _.each(formulaList, function (fid) {
  672. if (fid == null) fid = 0;
  673. if (fid >= 1000)
  674. p = formulaGet.apiGet({
  675. FacilityTypeId: 103,
  676. FacilityCode: f.FacilityCode, // FacilityTypeId가 100보다 크면 의미가 없다. 정상
  677. FormulaId: fid - 1000 + 1,
  678. TimeIntervalType: timeIntervalType,
  679. StartDate: date.startDate,
  680. EndDate: date.endDate
  681. });
  682. else
  683. p = formulaGet.apiGet({
  684. FacilityTypeId: f.FacilityTypeId,
  685. FacilityCode: f.FacilityCode,
  686. FormulaId: fid,
  687. TimeIntervalType: timeIntervalType,
  688. StartDate: date.startDate,
  689. EndDate: date.endDate
  690. });
  691. promises.push(p);
  692. });
  693. $.when.apply(this, promises)
  694. .done(function (data1, data2, data3, data4) {
  695. if (formulaList.length == 1) {
  696. _.each(data1, function (x) {
  697. DataArray.push({
  698. DateTime: BWA.Chart.getCustermTimeArgumentAxisString(timeBoxForSearch.type(), moment(x.DateTime).toDate()),
  699. rv1: x.Value
  700. });
  701. });
  702. deferred.resolve(DataArray);
  703. return DataArray;
  704. }
  705. if (data1 != undefined)
  706. _.each(data1[0], function (x) {
  707. DataArray.push({
  708. DateTime: BWA.Chart.getCustermTimeArgumentAxisString(timeBoxForSearch.type(), moment(x.DateTime).toDate()),
  709. rv1: x.Value
  710. });
  711. });
  712. if (data2 != undefined)
  713. _.each(data2[0], function (x) {
  714. DataArray.push({
  715. DateTime: BWA.Chart.getCustermTimeArgumentAxisString(timeBoxForSearch.type(), moment(x.DateTime).toDate()),
  716. rv2: x.Value
  717. });
  718. });
  719. if (data3 != undefined)
  720. _.each(data3[0], function (x) {
  721. DataArray.push({
  722. DateTime: BWA.Chart.getCustermTimeArgumentAxisString(timeBoxForSearch.type(), moment(x.DateTime).toDate()),
  723. rv3: x.Value
  724. });
  725. });
  726. if (data4 != undefined)
  727. _.each(data4[0], function (x) {
  728. DataArray.push({
  729. DateTime: BWA.Chart.getCustermTimeArgumentAxisString(timeBoxForSearch.type(), moment(x.DateTime).toDate()),
  730. rv4: x.Value
  731. });
  732. });
  733. deferred.resolve(DataArray);
  734. return DataArray;
  735. })
  736. .fail(function (error) {
  737. //alert(error);
  738. //visiblePopup(false);
  739. });
  740. return deferred.promise();
  741. }
  742. // 최종적으로 차트별로 이함수를 불러줘야 한다.
  743. function DrawChart(chartInfo, timeIntervalType, date) {
  744. if (chartInfo == null) return;
  745. if (chartInfo.UseX()) return DrawChart2(chartInfo, timeIntervalType, date);
  746. var promises = [];
  747. var f = m_Facility.toJS();
  748. // L, R Y축 설정
  749. var valueAx = [];
  750. if (chartInfo.LAxTitle() != null) {
  751. var va = {
  752. name: 'left',
  753. //2018 04 23 hcLee 추가
  754. grid: {
  755. visible: true
  756. },
  757. title: {
  758. text: chartInfo.LAxTitle(),
  759. },
  760. };
  761. if (chartInfo.UseLAxMinMax())
  762. $.extend(va, {
  763. type: 'continuous',
  764. valueType: 'numeric',
  765. minValueMargin: 0,
  766. maxValueMargin: 0,
  767. max: chartInfo.LAxMax(),
  768. min: chartInfo.LAxMin(),
  769. tickInterval: (chartInfo.LAxMax() - chartInfo.LAxMin()) / 5,
  770. valueMarginsEnabled: true,
  771. });
  772. // 2018 03 12 hcLee 추가
  773. if (chartInfo.UseLCTLine())
  774. $.extend(va, {
  775. constantLines: [{
  776. label: {
  777. text: chartInfo.LCTLineTitle(),
  778. },
  779. width: 2,
  780. value: chartInfo.LCTLineValue(),
  781. dashStyle: 'dash'
  782. }],
  783. });
  784. valueAx.push(va);
  785. }
  786. if (chartInfo.RAxTitle() != null) {
  787. var va = {
  788. name: 'right',
  789. //2018 04 23 hcLee 추가
  790. grid: {
  791. visible: true
  792. },
  793. title: {
  794. text: chartInfo.RAxTitle(),
  795. },
  796. position: 'right',
  797. label: {
  798. visible: true,
  799. },
  800. };
  801. if (chartInfo.UseRAxMinMax())
  802. $.extend(va, {
  803. type: 'continuous',
  804. valueType: 'numeric',
  805. minValueMargin: 0,
  806. maxValueMargin: 0,
  807. max: chartInfo.RAxMax(),
  808. min: chartInfo.RAxMin(),
  809. tickInterval: (chartInfo.RAxMax() - chartInfo.RAxMin()) / 5,
  810. valueMarginsEnabled: true,
  811. });
  812. // 2018 03 12 hcLee 추가
  813. if (chartInfo.UseRCTLine())
  814. $.extend(va, {
  815. constantLines: [{
  816. label: {
  817. font: {
  818. color: 'red',
  819. },
  820. horizontalAlignment: 'right',
  821. text: chartInfo.RCTLineTitle(),
  822. },
  823. width: 2,
  824. value: chartInfo.RCTLineValue(),
  825. dashStyle: 'dash',
  826. color: 'red' // hcLee 2018 03 28 오른쪽 기준선
  827. }],
  828. });
  829. valueAx.push(va);
  830. }
  831. // L, R series 설정
  832. var series = [];
  833. if (chartInfo.LSFmId1() > 0)
  834. series.push(
  835. {
  836. name: chartInfo.LSName1(),
  837. type: chartInfo.LSType1(),
  838. valueField: 'lv1',
  839. argumentField: 'DateTime',
  840. label: {
  841. visible: false,
  842. },
  843. point: { size: 3 }
  844. });
  845. if (chartInfo.LSFmId2() > 0)
  846. series.push(
  847. {
  848. name: chartInfo.LSName2(),
  849. type: chartInfo.LSType2(),
  850. valueField: 'lv2',
  851. argumentField: 'DateTime',
  852. label: {
  853. visible: false,
  854. },
  855. point: { size: 3 }
  856. });
  857. if (chartInfo.LSFmId3() > 0)
  858. series.push(
  859. {
  860. name: chartInfo.LSName3(),
  861. type: chartInfo.LSType3(),
  862. valueField: 'lv3',
  863. argumentField: 'DateTime',
  864. label: {
  865. visible: false,
  866. },
  867. point: { size: 3 }
  868. });
  869. if (chartInfo.LSFmId4() > 0)
  870. series.push(
  871. {
  872. name: chartInfo.LSName4(),
  873. type: chartInfo.LSType4(),
  874. valueField: 'lv4',
  875. argumentField: 'DateTime',
  876. label: {
  877. visible: false,
  878. },
  879. point: { size: 3 }
  880. });
  881. if (chartInfo.RSFmId1() > 0)
  882. series.push(
  883. {
  884. name: chartInfo.RSName1(),
  885. type: chartInfo.RSType1(),
  886. axis: 'right',
  887. valueField: 'rv1',
  888. argumentField: 'DateTime',
  889. label: {
  890. visible: false,
  891. },
  892. point: { size: 3 }
  893. });
  894. if (chartInfo.RSFmId2() > 0)
  895. series.push(
  896. {
  897. name: chartInfo.RSName2(),
  898. type: chartInfo.RSType2(),
  899. axis: 'right',
  900. valueField: 'rv2',
  901. argumentField: 'DateTime',
  902. label: {
  903. visible: false,
  904. },
  905. point: { size: 3 }
  906. });
  907. if (chartInfo.RSFmId3() > 0)
  908. series.push(
  909. {
  910. name: chartInfo.RSName3(),
  911. type: chartInfo.RSType3(),
  912. axis: 'right',
  913. valueField: 'rv3',
  914. argumentField: 'DateTime',
  915. label: {
  916. visible: false,
  917. },
  918. point: { size: 3 }
  919. });
  920. if (chartInfo.RSFmId4() > 0)
  921. series.push(
  922. {
  923. name: chartInfo.RSName4(),
  924. type: chartInfo.RSType4(),
  925. axis: 'right',
  926. valueField: 'rv4',
  927. argumentField: 'DateTime',
  928. label: {
  929. visible: false,
  930. },
  931. point: { size: 3 }
  932. });
  933. var DataArray = [];
  934. promises.push(FormulaProcessLeft(timeIntervalType, date, [chartInfo.LSFmId1(), chartInfo.LSFmId2(), chartInfo.LSFmId3(), chartInfo.LSFmId4()]));
  935. promises.push(FormulaProcessRight(timeIntervalType, date, [chartInfo.RSFmId1(), chartInfo.RSFmId2(), chartInfo.RSFmId3(), chartInfo.RSFmId4()]));
  936. $.when.apply(this, promises)
  937. .done(function (dataL, dataR) {
  938. _.each(dataL, function (x) {
  939. DataArray.push(x);
  940. });
  941. _.each(dataR, function (x) {
  942. DataArray.push(x);
  943. });
  944. ChartProcess(chartInfo, DataArray, valueAx, series);
  945. })
  946. .fail(function (error) {
  947. //alert(error);
  948. //visiblePopup(false);
  949. });
  950. }
  951. // X가 시계열이 아닌 경우 별도 처리, 이 경우는 LY만 존재 하고 시리즈 또한 LY용 1개, X축 시리즈 1개 만 존재 한다.
  952. function DrawChart2(chartInfo, timeIntervalType, date) {
  953. if (chartInfo == null) return;
  954. var promises = [];
  955. var f = m_Facility.toJS();
  956. // L, Y축 설정
  957. var valueAx = [];
  958. if (chartInfo.LAxTitle() != null) {
  959. var va = {
  960. name: 'left',
  961. grid: {
  962. visible: true
  963. },
  964. title: {
  965. text: chartInfo.LAxTitle(),
  966. },
  967. };
  968. if (chartInfo.UseLAxMinMax())
  969. $.extend(va, {
  970. type: 'continuous',
  971. valueType: 'numeric',
  972. minValueMargin: 0,
  973. maxValueMargin: 0,
  974. max: chartInfo.LAxMax(),
  975. min: chartInfo.LAxMin(),
  976. tickInterval: (chartInfo.LAxMax() - chartInfo.LAxMin()) / 5,
  977. valueMarginsEnabled: true,
  978. });
  979. // 2018 03 12 hcLee 추가
  980. if (chartInfo.UseLCTLine())
  981. $.extend(va, {
  982. constantLines: [{
  983. label: {
  984. text: chartInfo.LCTLineTitle(),
  985. },
  986. width: 2,
  987. value: chartInfo.LCTLineValue(),
  988. dashStyle: 'dash'
  989. }],
  990. });
  991. valueAx.push(va);
  992. }
  993. var DataArray = [];
  994. promises.push(FormulaProcessLeft(timeIntervalType, date, [chartInfo.LSFmId1(), 0, 0, 0]));
  995. promises.push(FormulaProcessRight(timeIntervalType, date, [chartInfo.XSFmId(), 0, 0, 0]));
  996. $.when.apply(this, promises)
  997. .done(function (dataL, dataX) {
  998. _.each(dataL, function (x) {
  999. DataArray.push(x);
  1000. });
  1001. _.each(dataX, function (x) {
  1002. DataArray.push(x);
  1003. });
  1004. var dataArray = BWA.Chart.getRelationDataArrayOnDateTimeNew(dataL, dataX, 'lv1', 'xv');
  1005. ChartProcess2(chartInfo, dataArray, valueAx);
  1006. })
  1007. .fail(function (error) {
  1008. //alert(error);
  1009. //visiblePopup(false);
  1010. });
  1011. }
  1012. function handleSearchInSearchView(filter, searchViewItems, viewModel) {
  1013. if (m_Facility == null) return;
  1014. var f = m_Facility.toJS();
  1015. facilityViewModel.fromJS(f);
  1016. var timeIntervalType = timeBoxForSearch.type();
  1017. var date = timeBoxForSearch.getDate();
  1018. // 2018 03 06 hcLee 테스트코드
  1019. if (currentTabIndex() == 0) {
  1020. for (var c = 0; c < 5; c++) {
  1021. if (c >= charts.length) return;
  1022. DrawChart(charts[c], timeIntervalType, date);
  1023. }
  1024. }
  1025. else {
  1026. for (var c = currentTabIndex() * 6 - 1; c < charts.length; c++) {
  1027. if (c >= charts.length) return;
  1028. if (c >= currentTabIndex() * 6 + 5) return;
  1029. DrawChart(charts[c], timeIntervalType, date);
  1030. }
  1031. }
  1032. return;
  1033. }
  1034. var viewModel = $.extend(BWA.CommonView.create(
  1035. params, viewInfo, searchViewOptions, ko.observable(null),
  1036. handleViewShown, null, handleSearchInSearchView, undefined,
  1037. chartLayout), {
  1038. viewHidden: handleViewHidden, // hcLee 2015 06 03
  1039. refreshList: refreshList,
  1040. viewShowing: handleViewShowing,
  1041. scrolling: { mode: 'infinite' },
  1042. FA_DataGridOptions: {
  1043. dataSource: facilitiesForSearch,
  1044. columns: [
  1045. { dataField: 'Name', caption: $G('facilityName'), width: '100%', alignment: 'left' }
  1046. ],
  1047. filterRow: {
  1048. visible: true,
  1049. showOperationChooser: false
  1050. },
  1051. selection: {
  1052. mode: 'single'
  1053. },
  1054. rowClick: function (clickRow) {
  1055. handleSelectedFacilityInSearchView(clickRow.data);
  1056. },
  1057. paging: {
  1058. pageSize: 11,
  1059. enabled: true
  1060. }
  1061. },
  1062. contentReadyAction: function (e) {
  1063. datagrid = e.component;
  1064. },
  1065. });
  1066. viewModel.timeBoxForSearch = timeBoxForSearch;
  1067. viewModel.currentTabIndex = currentTabIndex;
  1068. viewModel.multiViewItems = [
  1069. {
  1070. facility: facilityViewModel,
  1071. template: 'mainCharts'
  1072. },
  1073. ];
  1074. for (var p = 1; p < multiViewOptions.viewCount; p++) {
  1075. viewModel.multiViewItems.push({ template: 'subCharts_' + p });
  1076. }
  1077. $HourGlassPopup(viewModel, visiblePopup);
  1078. return viewModel;
  1079. }
  1080. });