|
|
@@ -42,7 +42,8 @@ stateMap.set(2, '#FFFF00');
|
|
|
stateMap.set(3, '#808080');
|
|
|
stateMap.set(4, '#CC6600');
|
|
|
stateMap.set(5, '#9933FF');
|
|
|
-
|
|
|
+var _isClick = null;
|
|
|
+let _evpData = [];
|
|
|
|
|
|
$(document).ready(function () {
|
|
|
init();
|
|
|
@@ -99,11 +100,69 @@ function init() {
|
|
|
//getSignalInfo();
|
|
|
const worker = new Worker('/js/worker.js');
|
|
|
worker.postMessage({message:"worker START"});
|
|
|
+
|
|
|
worker.onmessage = (ev)=>{
|
|
|
const data = JSON.parse(ev.data);
|
|
|
- drawEmergencyRoad(data);
|
|
|
+ const iframe = $('#iframeTreeList').contents();
|
|
|
+ const table = iframe.find('.evp-table');
|
|
|
+ const img = iframe.find('#tab2 img');
|
|
|
+ const imgName = '/images/evp_icon';
|
|
|
+ let exp = '.png';
|
|
|
+ let str = '<tr><td colspan="3" class="empty-evp">조회된 내용이 없습니다.</td></tr>';
|
|
|
+ _evpData = data;
|
|
|
+ if (data && data.length > 0) {
|
|
|
+ table.empty();
|
|
|
+ exp = '.gif';
|
|
|
+ str = '';
|
|
|
+ for (let obj of data) {
|
|
|
+ let className = '';
|
|
|
+ if (_isClick && obj.service_id === _isClick) {
|
|
|
+ className = 'on';
|
|
|
+ }
|
|
|
+ str += `<tr class="tr_${obj.service_id} ${className}"><td>${obj.clct_dt}</td><td>${obj.service_id}</td><td>${obj.service_nm}</td></tr>`;
|
|
|
+ }
|
|
|
+
|
|
|
+ if (_isClick) {
|
|
|
+ drawEvp(_isClick);
|
|
|
+ }
|
|
|
+
|
|
|
+ table.html(str);
|
|
|
+ data.forEach((obj)=>{
|
|
|
+ iframe.find('.tr_' + obj.service_id).off('click');
|
|
|
+ iframe.find('.tr_' + obj.service_id).on('click',()=> drawEvp(obj.service_id));
|
|
|
+ })
|
|
|
+ }
|
|
|
+ else {
|
|
|
+ if (iframe.find('.empty-evp').length === 0) {
|
|
|
+ table.html(str);
|
|
|
+ }
|
|
|
+
|
|
|
+ if (_EmergencyMap.size){
|
|
|
+ _EmergencyMap.forEach((obj)=>{
|
|
|
+ obj.clear();
|
|
|
+ });
|
|
|
+
|
|
|
+ _EmergencyMap.clear();
|
|
|
+ _isClick = null;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if (img.attr('src') !== imgName + exp) {
|
|
|
+ img.attr('src',imgName + exp);
|
|
|
+ }
|
|
|
+
|
|
|
}
|
|
|
|
|
|
+ function drawEvp(serviceId) {
|
|
|
+ if (serviceId) {
|
|
|
+ const iframe = $('#iframeTreeList').contents();
|
|
|
+ if (!iframe.find('.tr_'+ serviceId + '.on').length) {
|
|
|
+ iframe.find('tr.on').removeClass('on');
|
|
|
+ iframe.find('.tr_'+ serviceId).addClass('on');
|
|
|
+ }
|
|
|
+ let idx = _evpData.findIndex((obj)=> obj.service_id === serviceId);
|
|
|
+ drawEmergencyRoad(_evpData[idx]);
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
let coordMarker;
|
|
|
@@ -303,73 +362,61 @@ function setEmergencyCurr(car, sigMap, road, arrive, dataMap) {
|
|
|
}
|
|
|
|
|
|
function drawEmergencyRoad(data) {
|
|
|
- if (data && data.length) {
|
|
|
- data.forEach((obj)=>{
|
|
|
- const beforeObj = _EmergencyMap.get(obj.service_id);
|
|
|
- if (!beforeObj) {
|
|
|
- const emgObj = new EmergencyObj(obj);
|
|
|
- if (_EmergencyMap.size === 0) {
|
|
|
- emgObj.setBound();
|
|
|
- }
|
|
|
-
|
|
|
- _EmergencyMap.set(obj.service_id, emgObj);
|
|
|
- }
|
|
|
- else {
|
|
|
- beforeObj.car.moveMarker(getKakaoPosition(obj.event_list[0].cur_lat, obj.event_list[0].cur_lng));
|
|
|
- obj.phase_list.forEach((sigObj)=>{
|
|
|
- const beforeSig = beforeObj.sig.get(sigObj.service_id + '_' + sigObj.seq_no);
|
|
|
- if (beforeSig) {
|
|
|
- const {a_head_lat, a_head_lng, a_mid_lat, a_mid_lng, a_end_lat, a_end_lng,
|
|
|
- b_head_lat, b_head_lng, b_mid_lat, b_mid_lng, b_end_lat, b_end_lng, state} = sigObj
|
|
|
- beforeSig.setState(state);
|
|
|
- if (beforeSig.a_ring) {
|
|
|
+ if (data) {
|
|
|
+ if (_EmergencyMap.size > 0) {
|
|
|
+ const evpObj = _EmergencyMap.get(data.service_id);
|
|
|
+ if (evpObj) {
|
|
|
+ evpObj.car.moveMarker(getKakaoPosition(data.event_list[0].cur_lat, data.event_list[0].cur_lng));
|
|
|
+ data.phase_list.forEach((obj)=>{
|
|
|
+ const {a_head_lat, a_head_lng, a_mid_lat, a_mid_lng, a_end_lat, a_end_lng,
|
|
|
+ b_head_lat, b_head_lng, b_mid_lat, b_mid_lng, b_end_lat, b_end_lng, state} = obj;
|
|
|
+ const sig = evpObj.sig.get(obj.service_id + '_' + obj.seq_no);
|
|
|
+ if (sig) {
|
|
|
+ sig.setState(state);
|
|
|
+ if (sig.a_ring) {
|
|
|
const a_head = getKakaoPosition(a_head_lat, a_head_lng);
|
|
|
const a_mid = getKakaoPosition(a_mid_lat, a_mid_lng);
|
|
|
const a_end = getKakaoPosition(a_end_lat, a_end_lng);
|
|
|
- beforeSig.a_ring.setPath([a_head, a_mid, a_end]);
|
|
|
+ sig.a_ring.setPath([a_head, a_mid, a_end]);
|
|
|
}
|
|
|
|
|
|
- if (beforeSig.b_ring) {
|
|
|
+ if (sig.b_ring) {
|
|
|
const b_head = getKakaoPosition(b_head_lat, b_head_lng);
|
|
|
const b_mid = getKakaoPosition(b_mid_lat, b_mid_lng);
|
|
|
const b_end = getKakaoPosition(b_end_lat, b_end_lng);
|
|
|
- beforeSig.b_ring.setPath([b_head, b_mid, b_end]);
|
|
|
+ sig.b_ring.setPath([b_head, b_mid, b_end]);
|
|
|
}
|
|
|
-
|
|
|
- if (beforeSig.a_ring === null && beforeSig.b_ring === null) {
|
|
|
- beforeSig.createRing(sigObj);
|
|
|
+ if (sig.a_ring === null && sig.b_ring === null) {
|
|
|
+ sig.createRing(data);
|
|
|
}
|
|
|
}
|
|
|
+ else {
|
|
|
+ evpObj.sig.set(obj.service_id + '_' + obj.seq_no, new EmergencySig(obj));
|
|
|
+ }
|
|
|
});
|
|
|
}
|
|
|
- });
|
|
|
-
|
|
|
- if (_EmergencyMap.size !== data.length) {
|
|
|
- const keyArr = Array.from(_EmergencyMap.keys());
|
|
|
- for (let key of keyArr) {
|
|
|
- let cnt = 0;
|
|
|
- data.forEach((obj) => {
|
|
|
- if (obj.service_id === key) {
|
|
|
- cnt++;
|
|
|
- }
|
|
|
- })
|
|
|
- if (cnt === 0) {
|
|
|
- const sigObj = _EmergencyMap.get(key).sig;
|
|
|
- sigMap.delete(sigObj.lat + '_' + sigObj.lng);
|
|
|
- _EmergencyMap.get(key).clear();
|
|
|
- _EmergencyMap.delete(key);
|
|
|
- }
|
|
|
+ else {
|
|
|
+ _EmergencyMap.forEach((obj)=>{
|
|
|
+ obj.clear();
|
|
|
+ });
|
|
|
+ _EmergencyMap.clear();
|
|
|
+ const emgObj = new EmergencyObj(data);
|
|
|
+ _EmergencyMap.set(data.service_id, emgObj);
|
|
|
+ _isClick = data.service_id;
|
|
|
}
|
|
|
}
|
|
|
+ else {
|
|
|
+ const emgObj = new EmergencyObj(data);
|
|
|
+ _EmergencyMap.set(data.service_id, emgObj);
|
|
|
+ _isClick = data.service_id;
|
|
|
+ }
|
|
|
}
|
|
|
else {
|
|
|
- if (_EmergencyMap.size > 0) {
|
|
|
- _EmergencyMap.forEach((obj)=>{
|
|
|
- obj.clear();
|
|
|
- });
|
|
|
- _EmergencyMap.clear();
|
|
|
- }
|
|
|
- // clearEmgMarker();
|
|
|
+ _EmergencyMap.forEach((obj)=>{
|
|
|
+ obj.clear();
|
|
|
+ });
|
|
|
+ _EmergencyMap.clear();
|
|
|
+ _isClick = null;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
@@ -1589,6 +1636,7 @@ class EmergencyObj{
|
|
|
|
|
|
init() {
|
|
|
this.road = new EmergencyRoadObj(this.route_list);
|
|
|
+ this.road.setBound();
|
|
|
if (this.phase_list && this.phase_list.length) {
|
|
|
this.phase_list.forEach((obj)=>{
|
|
|
const sig = new EmergencySig(obj);
|
|
|
@@ -1604,10 +1652,11 @@ class EmergencyObj{
|
|
|
this.road.hide();
|
|
|
}
|
|
|
|
|
|
- if (this.sig && this.sig.length) {
|
|
|
+ if (this.sig && this.sig.size) {
|
|
|
this.sig.forEach((obj)=>{
|
|
|
obj.hide();
|
|
|
- })
|
|
|
+ });
|
|
|
+ this.sig.clear();
|
|
|
}
|
|
|
|
|
|
if (this.car) {
|
|
|
@@ -1751,7 +1800,7 @@ class EmergencySig{
|
|
|
stateColor = stateMap.get(Number(this.state));
|
|
|
}
|
|
|
const position = getKakaoPosition(this.lat, this.lng);
|
|
|
- if (!sigMap.get(this.lat + '_' + this.lng)) {
|
|
|
+ if (!sigMap.get(this.service_id + '_' + this.sep_no)) {
|
|
|
this.circle = new kakao.maps.Circle({
|
|
|
center : position, // 원의 중심좌표 입니다
|
|
|
radius: 60, // 미터 단위의 원의 반지름입니다
|
|
|
@@ -1869,6 +1918,10 @@ class EmergencySig{
|
|
|
if (this.b_ring) {
|
|
|
this.b_ring.hide();
|
|
|
}
|
|
|
+
|
|
|
+ if (sigMap && sigMap.size) {
|
|
|
+ sigMap.clear();
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
setCenter() {
|
