Browse Source

드론교통관리 시스템 경로 이탈 기체 마커 색상 변경 및 불필요한 import 제거

pull/2/head
김장현 10 months ago
parent
commit
1b2e8e13fa
  1. 9
      src/components/map/MapControl.js
  2. 18
      src/components/map/mapbox/dron/DronMarker.js
  3. 2
      src/components/websocket/WebsocketClient.js
  4. 3
      src/views/control/index.js
  5. 3
      src/views/control/main/ControlMain.js

9
src/components/map/MapControl.js

@ -1,12 +1,5 @@
import React from 'react';
import { GoogleCustomMap } from './google/GoogleMap';
import { NaverCustomMap } from './naver/NaverMap';
import MapBoxMap from './mapbox/MapBoxMap'; import MapBoxMap from './mapbox/MapBoxMap';
export const MapControl = props => { export const MapControl = props => {
return ( return <MapBoxMap />;
// <>{props.mapType === 'google' ? <GoogleCustomMap /> : <NaverCustomMap />}</>
// <NaverCustomMap />
<MapBoxMap />
);
}; };

18
src/components/map/mapbox/dron/DronMarker.js

@ -304,32 +304,26 @@ export const DronMarker = props => {
//마커에 위치를 이동한다. //마커에 위치를 이동한다.
const moveMarkers = (marker, position, gps) => { const moveMarkers = (marker, position, gps) => {
const getIcon = marker.icon;
marker.setLngLat(position); marker.setLngLat(position);
const warnList = controlGpArcrftWarnList?.filter( const warnList = controlGpArcrftWarnList?.filter(
i => i.cntrlId === gps.controlId i => i.cntrlId === gps.controlId
); );
if (warnList?.length > 0) { if (warnList?.length > 0) {
const el = document.getElementById(marker.id);
if (warnList[0].controlWarnCd) { if (warnList[0].controlWarnCd) {
// marker.setIcon({ el.style.filter =
// content: `<img ${getIcon.content.substr( 'invert(16%) sepia(79%) saturate(4975%) hue-rotate(359deg) brightness(104%) contrast(129%)';
// getIcon.content.indexOf('src'), marker.setRotation(gps.heading);
// getIcon.content.indexOf('alt') - 6
// )} alt="" style="transform: rotate(${
// gps.heading
// }deg); filter: invert(16%) sepia(79%) saturate(4975%) hue-rotate(359deg) brightness(104%) contrast(129%)" />`,
// anchor: getIcon.anchor
// });
} else { } else {
el.style.filter = '';
marker.setRotation(gps.heading); marker.setRotation(gps.heading);
} }
return; return;
} }
marker.setRotation(gps.heading); marker.setRotation(gps.heading);
}; };
//
const moveInfos = (info, position, item, idx) => { const moveInfos = (info, position, item, idx) => {
if (info) { if (info) {
info.setLngLat([position.lng, position.lat]); info.setLngLat([position.lng, position.lat]);

2
src/components/websocket/WebsocketClient.js

@ -33,7 +33,7 @@ const WebsocketClient = () => {
websocket.current.onmessage = e => { websocket.current.onmessage = e => {
const data = e.data; const data = e.data;
const controlGpList = JSON.parse(data); const controlGpList = JSON.parse(data);
console.log(data);
dispatch(Actions.controlGpAction.request(controlGpList)); dispatch(Actions.controlGpAction.request(controlGpList));
}; };

3
src/views/control/index.js

@ -1,6 +1,4 @@
import React, { useEffect, useState } from 'react';
import { MapControl } from '../../components/map/MapControl'; import { MapControl } from '../../components/map/MapControl';
// import { WebsocketClient } from '../../components/websocket/WebsocketClient';
import ControlMain from './main/ControlMain'; import ControlMain from './main/ControlMain';
const ControlView = () => { const ControlView = () => {
@ -9,7 +7,6 @@ const ControlView = () => {
<div className='map'> <div className='map'>
<MapControl /> <MapControl />
</div> </div>
<ControlMain /> <ControlMain />
</div> </div>
); );

3
src/views/control/main/ControlMain.js

@ -15,14 +15,13 @@ import {
Grid Grid
} from 'react-feather'; } from 'react-feather';
import { AiOutlinePoweroff, AiOutlineExclamation } from 'react-icons/ai'; import { AiOutlinePoweroff } from 'react-icons/ai';
import { IoAlertOutline } from 'react-icons/io5'; import { IoAlertOutline } from 'react-icons/io5';
import { ReactComponent as DroneMenuIcon } from '../../../assets/images/drone_menu_icon.svg'; import { ReactComponent as DroneMenuIcon } from '../../../assets/images/drone_menu_icon.svg';
import { Card } from 'reactstrap'; import { Card } from 'reactstrap';
import ControlAlarmNotice from '../alarm/ControlAlarmNotice'; import ControlAlarmNotice from '../alarm/ControlAlarmNotice';
import ControlReportList from '../report/ControlReportList'; import ControlReportList from '../report/ControlReportList';
import ControlReportDetail from '../report/ControlReportDetail'; import ControlReportDetail from '../report/ControlReportDetail';
import WeatherList from '../weather/WeatherList';
import ControlAlarmList from '../alarm/ControlAlarmList'; import ControlAlarmList from '../alarm/ControlAlarmList';
import ControlSetting from '../setting/ControlSetting'; import ControlSetting from '../setting/ControlSetting';
import WebsocketClient from '../../../components/websocket/WebsocketClient'; import WebsocketClient from '../../../components/websocket/WebsocketClient';

Loading…
Cancel
Save