[비행관제] 드론 history 갱신

src/components/map/naver/NaverMap.js

@@ -41,7 +41,7 @@ export const NaverCustomMap = () => {
             center: new naver.maps.LatLng(36.56793936069445, 127.85101412107547),
             zoom: 10,
             zoomControl: true,
-            mapTypeId: naver.maps.MapTypeId.HYBRID,
+            mapTypeId: naver.maps.MapTypeId.NORMAL,
             zoomControlOptions: {
                 position: naver.maps.Position.TOP_LEFT,
 

src/components/map/naver/dron/DronMarker.js

@@ -92,12 +92,7 @@ export const DronMarker = props => {
             id: id,
             controlId: controlId,
             icon: {                
-                //   content: [
-                //     '<div>dddd</div>',
-
-                // ].join(''),
                 url: DronIcon,                
-                // size: new naver.maps.Size(50, 50),
                 origin: new naver.maps.Point(0, 0),
                 anchor: new naver.maps.Point(15, 15),
             }
@@ -109,6 +104,9 @@ export const DronMarker = props => {
             handlerDronClick(marker);
         });
 
+        // drone 정보 창
+        // markerInfoWindow(marker);
+
         setArrMarkers(m => [...m, marker]);
     };
 
@@ -116,10 +114,6 @@ export const DronMarker = props => {
         const idntfNum = marker.id;
         const contorlId = marker.controlId;        
         
-        // 클릭한 식별번호 정보를 가진 그룹 추출
-        // const group = controlGroupAuthInfo.find(group => group.idntfNum === idntfNum);
-
-        //히스토리 불러오기     
         dispatch(objectClickAction(contorlId));
         dispatch(controlGpDtlAction.request(contorlId));
         dispatch(controlGpFlightPlanAction.request(idntfNum));
@@ -182,5 +176,43 @@ export const DronMarker = props => {
         setArrMarkers(arrData);
     };
 
+    const markerInfoWindow = (marker) => {
+        controlGpList.forEach(gps => {
+            
+            const contents = [
+                `<div class="tooltip-box">`,
+                `   <div class="tooltip-ti">`,
+                `       <span>${marker.id}</span>`,
+                `   </div>`,
+                `   <div class="tooltip-txt">`,
+                `       <div class="tooltip-txt-list">`,                
+                `          <span>${gps.speed}${gps.speedType}</span>`,
+                `       </div>`,
+                `       <div class="tooltip-txt-list">`,
+                `          <span>${gps.elev}${gps.elevType}</span>`,
+                `       </div>`,
+                `       <div class="tooltip-txt-list">`,
+                `          <span>${gps.heading}</span>`,
+                `       </div>`,
+                `   </div>`,
+                `</div>`
+            ].join('');
+
+            const info = new naver.maps.InfoWindow({ 
+                id: marker.id,
+                content: contents,
+                backgroundColor: '#283046', //박스안쪽영역 컬러                
+                anchorSize: new props.naver.maps.Size(30, -10),
+                anchorSkew: false,
+                anchorColor: '#283046',
+                pixelOffset: new props.naver.maps.Point(20, -20)
+            });
+
+            console.log(info);
+
+            info.open(props.map, marker);
+        });
+    }
+
     return null;
 };

src/modules/control/gp/sagas/controlGpSaga.ts

@@ -36,11 +36,9 @@ function* getControlGpSaga(
             });
         } 
 
-        console.log('gps ', gpsData);
-
         yield put(
             Actions.controlGpAction.success({
-                controlGpList: gpsData
+                controlGpList: data
             })
         );
 
@@ -59,15 +57,18 @@ function* getControlGpSaga(
 
             // History Push            
             if(controlGpHistory) {
-                const stateHistory = controlGpHistory;
-                const history = stateHistory.map((h) => {
-                    return {
-                        ...h,
-                        detailData
-                    }
-                });
-                
-                yield put(Actions.controlGpHisAction.success(history));
+                const stateHistory = controlGpHistory.concat();
+                
+                const hisObj = {
+                    lat: detailData.lat,
+                    lng: detailData.lng,
+                    objectId: detailData.objectId
+                }
+                stateHistory.push(hisObj);
+
+                yield put(Actions.controlGpHisAction.success({
+                    controlGpHistory: stateHistory
+                }));
             }
         }
     } catch (error) {           

src/modules/control/map/reducers/controlMapReducer.ts

@@ -1,6 +1,6 @@
 // ** Initial State
 const initialState = {
-  mapType: 'HYBRID',
+  mapType: 'NORMAL',
   objectId: null,
   isClickObject: false,
   area0001: true, // 비행금지 구역