diff --git a/src/components/map/naver/NaverMap.js b/src/components/map/naver/NaverMap.js index 3faea5b..8573137 100644 --- a/src/components/map/naver/NaverMap.js +++ b/src/components/map/naver/NaverMap.js @@ -14,10 +14,8 @@ export const NaverCustomMap = () => { const naver = window.naver; const [mapObject, setMapObject] = useState(null); - const [arrPolyline, setArrPolyline] = useState([]); - - let arrMarkers = []; // 마커 배열 - // let arrPolyline = []; // 폴리라인 배열 + const [arrPolyline, setArrPolyline] = useState([]); + let features = geoJson.features; useEffect(() => { @@ -68,7 +66,7 @@ export const NaverCustomMap = () => { diff --git a/src/components/map/naver/dron/DronHistory.js b/src/components/map/naver/dron/DronHistory.js index 16a2f27..ff70a3e 100644 --- a/src/components/map/naver/dron/DronHistory.js +++ b/src/components/map/naver/dron/DronHistory.js @@ -8,32 +8,40 @@ export const DronHistory = props => { const { controlGpList } = useSelector(state => state.controlGpState); const { objectId, isClickObject } = useSelector(state => state.controlMapReducer); + const [arrHistory, setArrHistory] = useState([]); + let naver = props.naver; let polyline; - let polylinePath = []; + let polylinePath = []; const dispatch = useDispatch(); useEffect(() => { - if(objectId && isClickObject) { - const gps = controlGpList.find((gps) => gps.controlId === objectId) + if(objectId && isClickObject) { + if(arrHistory && arrHistory.length > 0) { + const gps = controlGpList.find((gps) => gps.controlId === objectId); + + if(gps) { + const addHistory = { + objectId: gps.objectId, + lat: gps.lat, + lng: gps.lng + } + + const history = [...arrHistory, addHistory]; + polylineInit(history); - if(gps) { - const addHistory = { - objectId: gps.objectId, - lat: gps.lat, - lng: gps.lng - } - - const history = [...controlGpHistory, addHistory]; - - polylineInit(history); - } + setArrHistory((his) => { + return [...his, addHistory]; + }); + } + } } }, [controlGpList]); - useEffect(() => { - polylineInit(controlGpHistory) + useEffect(() => { + setArrHistory(controlGpHistory); + polylineInit(controlGpHistory); }, [controlGpHistory]); useEffect(() => { diff --git a/src/modules/control/gp/sagas/controlGpSaga.ts b/src/modules/control/gp/sagas/controlGpSaga.ts index 8618410..989488f 100644 --- a/src/modules/control/gp/sagas/controlGpSaga.ts +++ b/src/modules/control/gp/sagas/controlGpSaga.ts @@ -36,20 +36,19 @@ function* getControlGpSaga( }); } - // console.log('gps>>>> ', gpsData); + console.log('gps data >>>> ', gpsData); yield put( Actions.controlGpAction.success({ - controlGpList: data + controlGpList: gpsData }) ); - if (objectId && isClickObject) { - console.log(' mm ;;') + if (objectId && isClickObject) { let detailData; //상세 정보에서 실시간 데이터 호출 - data.map(item => { + gpsData.map(item => { if (item.controlId === objectId) { detailData = item; }