|
|
|
@ -59,6 +59,8 @@ export default function LaancAreaMap({
|
|
|
|
|
const [detailLayer, setDetailLayer] = useState(); |
|
|
|
|
const [coordArr, setCoordArr] = useState([]); |
|
|
|
|
|
|
|
|
|
const [viewCoordObj, setViewCoordObj] = useState([]); |
|
|
|
|
|
|
|
|
|
const detailGeo = useMemo(() => { |
|
|
|
|
return { |
|
|
|
|
type: 'FeatureCollection', |
|
|
|
@ -317,21 +319,21 @@ export default function LaancAreaMap({
|
|
|
|
|
<div style={{ position: 'relative' }}> |
|
|
|
|
<LaancMapSearch mapObject={mapObject} /> |
|
|
|
|
<div |
|
|
|
|
className='d-flex absolute' |
|
|
|
|
style={{ |
|
|
|
|
position: 'relative', |
|
|
|
|
zIndex: 100, |
|
|
|
|
margin: '470px 10px 10px 10px' |
|
|
|
|
}} |
|
|
|
|
className='d-flex' |
|
|
|
|
// style={{
|
|
|
|
|
// position: 'relative',
|
|
|
|
|
// zIndex: 100,
|
|
|
|
|
// margin: '470px 10px 10px 10px'
|
|
|
|
|
// }}
|
|
|
|
|
> |
|
|
|
|
{mapObject ? ( |
|
|
|
|
<div style={{ width: '400px' }}> |
|
|
|
|
// <div style={{ width: '400px' }}>
|
|
|
|
|
<div> |
|
|
|
|
{drawObj.getAll().features.length > 1 |
|
|
|
|
? drawObj |
|
|
|
|
.getAll() |
|
|
|
|
.features.filter(obj => obj.properties.id !== 'BUFFER') |
|
|
|
|
.map((obj, i) => { |
|
|
|
|
// console.log(obj, '>>>>>>obj');
|
|
|
|
|
const coord = |
|
|
|
|
obj.properties.id === 'LINE' |
|
|
|
|
? obj.geometry.coordinates |
|
|
|
@ -339,10 +341,10 @@ export default function LaancAreaMap({
|
|
|
|
|
|
|
|
|
|
return ( |
|
|
|
|
<div |
|
|
|
|
style={{ |
|
|
|
|
backgroundColor: '#fff', |
|
|
|
|
marginBottom: '10px' |
|
|
|
|
}} |
|
|
|
|
// style={{
|
|
|
|
|
// backgroundColor: '#fff',
|
|
|
|
|
// marginBottom: '10px'
|
|
|
|
|
// }}
|
|
|
|
|
> |
|
|
|
|
<div>비행구역 {i + 1}</div> |
|
|
|
|
{coord?.map(co => { |
|
|
|
@ -355,23 +357,6 @@ export default function LaancAreaMap({
|
|
|
|
|
); |
|
|
|
|
} |
|
|
|
|
})} |
|
|
|
|
{/* {obj.geometry.coordinates.map(coord => { |
|
|
|
|
if (obj.properties.id === 'LINE') { |
|
|
|
|
const fCoord = FormattingCoord(coord); |
|
|
|
|
return ( |
|
|
|
|
<div> |
|
|
|
|
{fCoord[0]} , {fCoord[1]} |
|
|
|
|
</div> |
|
|
|
|
); |
|
|
|
|
} else if(obj.properties.id === 'POLYGON') { |
|
|
|
|
const fCoord = FormattingCoord(coord); |
|
|
|
|
return ( |
|
|
|
|
<div> |
|
|
|
|
{fCoord[0]} , {fCoord[1]} |
|
|
|
|
</div> |
|
|
|
|
); |
|
|
|
|
} |
|
|
|
|
})} */} |
|
|
|
|
</div> |
|
|
|
|
); |
|
|
|
|
}) |
|
|
|
@ -422,6 +407,7 @@ export default function LaancAreaMap({
|
|
|
|
|
handlerCoordinates={handlerCoordinates} |
|
|
|
|
handlerInitCoordinates={handlerInitCoordinates} |
|
|
|
|
setCoordArr={setCoordArr} |
|
|
|
|
setViewCoordObj={setViewCoordObj} |
|
|
|
|
/> |
|
|
|
|
<FeatureAirZone map={mapObject} mapboxgl={mapboxgl} /> |
|
|
|
|
{modal ? ( |
|
|
|
|