diff --git a/src/components/basis/flight/plan/FlightPlanAreaMap.js b/src/components/basis/flight/plan/FlightPlanAreaMap.js
index 34941225..6432e16f 100644
--- a/src/components/basis/flight/plan/FlightPlanAreaMap.js
+++ b/src/components/basis/flight/plan/FlightPlanAreaMap.js
@@ -44,6 +44,8 @@ const FlightPlanAreaMap = props => {
const [searchRes, setSearchRes] = useState([]);
const [isSearch, setIsSearch] = useState(false);
+ const [dragSize, setDragSize] = useState(0);
+
useEffect(() => {
NaverMapInit();
return () => {
@@ -115,7 +117,33 @@ const FlightPlanAreaMap = props => {
style: naver.maps.ZoomControlStyle.SMALL
}
};
- setMap(new naver.maps.Map('map', mapOptions));
+ const mapp = new naver.maps.Map('map', mapOptions);
+ naver.maps.Event.addListener(mapp, 'idle', function () {
+ // console.log(dragSize);
+ });
+ naver.maps.Event.addListener(mapp, 'zoom_changed', function () {
+ switch (mapp.zoom) {
+ case 13:
+ setDragSize(100);
+ break;
+ case 14:
+ setDragSize(40);
+ break;
+ case 15:
+ setDragSize(35);
+ break;
+ case 16:
+ setDragSize(20);
+ break;
+ case 17:
+ setDragSize(10);
+ break;
+ default:
+ setDragSize(100);
+ break;
+ }
+ });
+ setMap(mapp);
};
const handlerDrawType = val => {
@@ -216,6 +244,7 @@ const FlightPlanAreaMap = props => {
handleConfirm={props.handleConfirm}
isDone={props.isDone}
isDisabled={props.isDisabled}
+ dragSize={dragSize}
/>
) : null}
@@ -273,26 +302,6 @@ const FlightPlanAreaMap = props => {
-
- {/*
-
-
- 검색
-
-
*/}
diff --git a/src/components/map/naver/draw/FlightPlanDraw.js b/src/components/map/naver/draw/FlightPlanDraw.js
index 0cc17bad..a4f0686a 100644
--- a/src/components/map/naver/draw/FlightPlanDraw.js
+++ b/src/components/map/naver/draw/FlightPlanDraw.js
@@ -33,7 +33,8 @@ export const FlightPlanDraw = props => {
const naver = props.naver;
const map = props.map;
let mode = props.mode;
- let dragCircleSize = props.dragCircleSize;
+ // let dragCircleSize = props.dragCircleSize;
+ // let dragSize = props.dragSize;
let areaInfo;
let lastDistance;
@@ -62,6 +63,13 @@ export const FlightPlanDraw = props => {
dispatch(Actions.FLIGHT_PLAN_AREA_BUFFER_LIST.request(areaDetail));
};
+ const [radiusCircle, setRadiusCircle] = useState();
+
+ // useEffect(() => {
+ // console.log(props.dragSize);
+ // setRadiusCircle(props.dragSize);
+ // }, [props.dragSize]);
+
useEffect(() => {
drawInit();
}, [mapControl.drawType]);
@@ -119,12 +127,6 @@ export const FlightPlanDraw = props => {
setDragCircle([]);
setBuffer();
}
- if (pastCircle.length != 0) {
- pastCircle.forEach(prev => prev.setMap(null));
- naver.maps.Event.removeListener(pastClickEve);
-
- setCircle([]);
- }
if (pastPolygon) {
pastPolygon.setMap(null);
pastDragCircle.forEach(c => c.setMap(null));
@@ -132,6 +134,12 @@ export const FlightPlanDraw = props => {
setPolygon();
setDragCircle([]);
}
+ if (pastCircle.length != 0) {
+ pastCircle.forEach(prev => prev.setMap(null));
+ naver.maps.Event.removeListener(pastClickEve);
+
+ setCircle([]);
+ }
if (pastMarker.length != 0) {
pastMarker.forEach(m => m.setMap(null));
setMarker([]);
@@ -198,11 +206,9 @@ export const FlightPlanDraw = props => {
title: '좌표 최소 개수',
desc: '좌표를 두 개 점으로 이어주세요.'
});
-
polyline.setMap(null);
polyline = '';
}
-
setFigure(polyline);
} else if (polygon) {
let path = polygon.getPath();
@@ -549,7 +555,7 @@ export const FlightPlanDraw = props => {
};
areaInfo.coordinates.push(point);
- areaInfo.bufferZone = circle.getRadius();
+ areaInfo.bufferZone = Math.round(circle.getRadius());
areaInfo.areaType = 'CIRCLE';
}
props.handleCoordinates(areaInfo);
@@ -592,8 +598,6 @@ export const FlightPlanDraw = props => {
let clickSet;
{
- // isDisabled === true ? (clickSet = false) : (clickSet = true);
- // (isYour || isDone) === true ? (clickSet = false) : (clickSet = true);
(isDisabled || isDone) === true
? (clickSet = false)
: (clickSet = true);
@@ -626,17 +630,15 @@ export const FlightPlanDraw = props => {
fillColor: '#ffffff',
fillOpacity: 1,
center: paths[i],
- radius: 17,
- // radius: dragCircleSize,
+ // radius: 17,
+ // radius: dragSize,
map: map,
// clickable: true
- clickable: clickSet
+ clickable: clickSet,
+ ...(props.dragSize ? { radius: radiusCircle } : { radius: 100 })
})
);
- // dragCircleEve.push(naver.maps.Event.addListener(dragCircle[i], 'mousedown', function () { onMouseDownDrag(i) }))
{
- // isDisabled
- // isYour || isDone
isDisabled || isDone
? {}
: dragCircleEve.push(
@@ -740,17 +742,15 @@ export const FlightPlanDraw = props => {
fillColor: '#ffffff',
fillOpacity: 1,
center: paths[i],
- radius: 15,
+ // radius: dragSize,
+ // radius: 17,
// radius: dragCircleSize,
map: map,
// clickable: true
clickable: clickSet
})
);
- // dragCircleEve.push(naver.maps.Event.addListener(dragCircle[i], 'mousedown', function () { onMouseDownDrag(i) }))
{
- // isDisabled
- // isYour || isDone
isDisabled || isDone
? {}
: dragCircleEve.push(