diff --git a/src/components/map/mapbox/MapBoxMap.js b/src/components/map/mapbox/MapBoxMap.js
index 98791e93..68d5fe5c 100644
--- a/src/components/map/mapbox/MapBoxMap.js
+++ b/src/components/map/mapbox/MapBoxMap.js
@@ -100,8 +100,10 @@ export default function MapBoxMap() {
// 지도 초기 셋팅
useLayoutEffect(() => {
- mapBoxMapInit();
- }, []);
+ if (mapState.mapType === 'TERRAIN' || mapState.mapType === 'SATELLITE') {
+ mapBoxMapInit();
+ }
+ }, [mapState.mapType]);
// 공역 표출 정보에 따른 공역 변경
useEffect(() => {
@@ -299,7 +301,7 @@ export default function MapBoxMap() {
const map = new mapboxgl.Map({
container: 'map', // container ID
- style: 'mapbox://styles/mapbox/streets-v12', // style URL
+ style: mapState.mapStyleUrl, // style URL
center: [127.85101412107547, 37.520357], // starting position [lng, lat]
zoom: 8.5, // starting zoom
antialias: true,
diff --git a/src/containers/flight/NewFlightApprovalsContainer.js b/src/containers/flight/NewFlightApprovalsContainer.js
index 094f19c8..234fcc80 100644
--- a/src/containers/flight/NewFlightApprovalsContainer.js
+++ b/src/containers/flight/NewFlightApprovalsContainer.js
@@ -23,8 +23,17 @@ import { setLogout } from '@src/redux/features/account/auth/authThunk';
import logo from '../../assets/images/logo/kac_logo_ icon.svg';
import { AiOutlinePoweroff } from 'react-icons/ai';
import WebsocketClient from '../../components/websocket/WebsocketClient';
-import { Card, ButtonGroup, Button, Modal, ModalHeader, ModalBody, ModalFooter, Table } from '@component/ui';
-import { FiUsers, FiFileText } from "react-icons/fi";
+import {
+ Card,
+ ButtonGroup,
+ Button,
+ Modal,
+ ModalHeader,
+ ModalBody,
+ ModalFooter,
+ Table
+} from '@component/ui';
+import { FiUsers, FiFileText } from 'react-icons/fi';
export default function NewFlightApprovalsContainer({ mode }) {
const dispatch = useDispatch();
@@ -37,7 +46,7 @@ export default function NewFlightApprovalsContainer({ mode }) {
const [filter, setFilter] = useState('');
// 지도
const [mapObject, setMapObject] = useState();
- const [mapType, setMapType] = useMapType();
+ const [setMapType] = useMapType();
const { areaCoordList, isOpenModal } = useSelector(state => state.laancState);
const [startDate, setStartDate] = useState(dayjs().format('YYYY-MM-DD'));
@@ -54,7 +63,7 @@ export default function NewFlightApprovalsContainer({ mode }) {
// 미니맵 레이어
const [previewLayer, setPreviewLayer] = useState();
- const map = useSelector(state => state.mapState.map);
+ const { map, mapType } = useSelector(state => state.mapState);
// popup
const [isPopup, setIsPopup] = useState(false);
@@ -340,7 +349,7 @@ export default function NewFlightApprovalsContainer({ mode }) {
return (
<>
-
+