|
|
|
@ -319,156 +319,88 @@ export default function LaancAreaMap({
|
|
|
|
|
<div style={{ position: 'relative' }}> |
|
|
|
|
<LaancMapSearch mapObject={mapObject} /> |
|
|
|
|
<div className='d-flex coords-wrap'> |
|
|
|
|
{mapObject ? ( |
|
|
|
|
{mapObject && viewCoordObj.length > 0 ? ( |
|
|
|
|
<div className='coords-box'> |
|
|
|
|
{drawObj.getAll().features.length > 1 |
|
|
|
|
? drawObj |
|
|
|
|
.getAll() |
|
|
|
|
.features.filter(obj => obj.properties.id !== 'BUFFER') |
|
|
|
|
.map((obj, i) => { |
|
|
|
|
{viewCoordObj?.map((obj, i) => { |
|
|
|
|
const coord = |
|
|
|
|
obj.properties.id === 'LINE' |
|
|
|
|
? obj.geometry.coordinates |
|
|
|
|
: obj.geometry.coordinates[0]; |
|
|
|
|
|
|
|
|
|
// console.log(coord, '>>>>>>>>>.');
|
|
|
|
|
return ( |
|
|
|
|
<div> |
|
|
|
|
<h6 className='ti'>비행구역 {i + 1}</h6> |
|
|
|
|
<div className='coords-box-scroll'> |
|
|
|
|
{coord?.map((co, idx) => { |
|
|
|
|
if (idx + 1 < coord.length) { |
|
|
|
|
const fCoord = FormattingCoord(co); |
|
|
|
|
const current = fCoord.join(', '); |
|
|
|
|
const next = FormattingCoord( |
|
|
|
|
coord[idx + 1].join(', ') |
|
|
|
|
); |
|
|
|
|
// console.log(coord[idx + 1], '---next');
|
|
|
|
|
|
|
|
|
|
return ( |
|
|
|
|
<div className='coords-box-list'> |
|
|
|
|
<span> |
|
|
|
|
<span>12,55557778</span>,<span> 34,55557778</span> |
|
|
|
|
</span> |
|
|
|
|
<span className='etc'>/</span> |
|
|
|
|
<span> |
|
|
|
|
<span>12,55557778</span>,<span> 34,55557778</span> |
|
|
|
|
</span> |
|
|
|
|
</div> |
|
|
|
|
<div className='coords-box-list'> |
|
|
|
|
<span> |
|
|
|
|
<span>12,55557778</span>,<span> 34,55557778</span> |
|
|
|
|
</span> |
|
|
|
|
<span className='etc'>/</span> |
|
|
|
|
<span> |
|
|
|
|
<span>12,55557778</span>,<span> 34,55557778</span> |
|
|
|
|
</span> |
|
|
|
|
</div> |
|
|
|
|
<div className='coords-box-list'> |
|
|
|
|
<span> |
|
|
|
|
<span>12,55557778</span>,<span> 34,55557778</span> |
|
|
|
|
</span> |
|
|
|
|
<span className='etc'>/</span> |
|
|
|
|
<span> |
|
|
|
|
<span>12,55557778</span>,<span> 34,55557778</span> |
|
|
|
|
</span> |
|
|
|
|
</div> |
|
|
|
|
<div className='coords-box-list'> |
|
|
|
|
<span> |
|
|
|
|
<span>12,55557778</span>,<span> 34,55557778</span> |
|
|
|
|
</span> |
|
|
|
|
<span className='etc'>/</span> |
|
|
|
|
<span> |
|
|
|
|
<span>12,55557778</span>,<span> 34,55557778</span> |
|
|
|
|
</span> |
|
|
|
|
</div> |
|
|
|
|
<div className='coords-box-list'> |
|
|
|
|
<span> |
|
|
|
|
<span>12,55557778</span>,<span> 34,55557778</span> |
|
|
|
|
</span> |
|
|
|
|
<span className='etc'>/</span> |
|
|
|
|
<span> |
|
|
|
|
<span>12,55557778</span>,<span> 34,55557778</span> |
|
|
|
|
</span> |
|
|
|
|
</div> |
|
|
|
|
<div className='coords-box-list'> |
|
|
|
|
<span> |
|
|
|
|
<span>12,55557778</span>,<span> 34,55557778</span> |
|
|
|
|
</span> |
|
|
|
|
<span className='etc'>/</span> |
|
|
|
|
<span> |
|
|
|
|
<span>12,55557778</span>,<span> 34,55557778</span> |
|
|
|
|
</span> |
|
|
|
|
</div> |
|
|
|
|
<div className='coords-box-list'> |
|
|
|
|
<span> |
|
|
|
|
<span>12,55557778</span>,<span> 34,55557778</span> |
|
|
|
|
</span> |
|
|
|
|
<span className='etc'>/</span> |
|
|
|
|
<span> |
|
|
|
|
<span>12,55557778</span>,<span> 34,55557778</span> |
|
|
|
|
</span> |
|
|
|
|
</div> |
|
|
|
|
<div className='coords-box-list'> |
|
|
|
|
<span> |
|
|
|
|
<span>12,55557778</span>,<span> 34,55557778</span> |
|
|
|
|
</span> |
|
|
|
|
<span className='etc'>/</span> |
|
|
|
|
<span> |
|
|
|
|
<span>12,55557778</span>,<span> 34,55557778</span> |
|
|
|
|
</span> |
|
|
|
|
</div> |
|
|
|
|
<div className='coords-box-list'> |
|
|
|
|
<span> |
|
|
|
|
<span>12,55557778</span>,<span> 34,55557778</span> |
|
|
|
|
</span> |
|
|
|
|
<span key={idx}> |
|
|
|
|
<span>{current}</span> |
|
|
|
|
<span className='etc'>/</span> |
|
|
|
|
<span> |
|
|
|
|
<span>12,55557778</span>,<span> 34,55557778</span> |
|
|
|
|
<span>{next}</span> |
|
|
|
|
</span> |
|
|
|
|
</div> |
|
|
|
|
<div className='coords-box-list'> |
|
|
|
|
<span> |
|
|
|
|
<span>12,55557778</span>,<span> 34,55557778</span> |
|
|
|
|
</span> |
|
|
|
|
<span className='etc'>/</span> |
|
|
|
|
<span> |
|
|
|
|
<span>12,55557778</span>,<span> 34,55557778</span> |
|
|
|
|
</span> |
|
|
|
|
); |
|
|
|
|
} |
|
|
|
|
})} |
|
|
|
|
</div> |
|
|
|
|
<div className='coords-box-list'> |
|
|
|
|
<span> |
|
|
|
|
<span>12,55557778</span>,<span> 34,55557778</span> |
|
|
|
|
</span> |
|
|
|
|
<span className='etc'>/</span> |
|
|
|
|
<span> |
|
|
|
|
<span>12,55557778</span>,<span> 34,55557778</span> |
|
|
|
|
</span> |
|
|
|
|
</div> |
|
|
|
|
<div className='coords-box-list'> |
|
|
|
|
<span> |
|
|
|
|
<span>12,55557778</span>,<span> 34,55557778</span> |
|
|
|
|
</span> |
|
|
|
|
<span className='etc'>/</span> |
|
|
|
|
<span> |
|
|
|
|
<span>12,55557778</span>,<span> 34,55557778</span> |
|
|
|
|
</span> |
|
|
|
|
); |
|
|
|
|
})} |
|
|
|
|
</div> |
|
|
|
|
) : null} |
|
|
|
|
{/* {mapObject ? ( |
|
|
|
|
<div className='coords-box'> |
|
|
|
|
{drawObj.getAll().features.length > 1 |
|
|
|
|
? drawObj |
|
|
|
|
.getAll() |
|
|
|
|
.features.filter(obj => obj.properties.id !== 'BUFFER') |
|
|
|
|
.map((obj, i) => { |
|
|
|
|
const coord = |
|
|
|
|
obj.properties.id === 'LINE' |
|
|
|
|
? obj.geometry.coordinates |
|
|
|
|
: obj.geometry.coordinates[0]; |
|
|
|
|
|
|
|
|
|
return ( |
|
|
|
|
<div> |
|
|
|
|
<h6 className='ti'>비행구역 {i + 1}</h6> |
|
|
|
|
<div className='coords-box-scroll'> |
|
|
|
|
{coord?.map((co, idx) => { |
|
|
|
|
if (idx + 1 < coord.length) { |
|
|
|
|
const fCoord = FormattingCoord(co); |
|
|
|
|
const current = fCoord.join(', '); |
|
|
|
|
const next = FormattingCoord( |
|
|
|
|
coord[idx + 1] |
|
|
|
|
).join(', '); |
|
|
|
|
|
|
|
|
|
return ( |
|
|
|
|
<div className='coords-box-list'> |
|
|
|
|
<span> |
|
|
|
|
<span>12,55557778</span>,<span> 34,55557778</span> |
|
|
|
|
</span> |
|
|
|
|
<span key={idx}> |
|
|
|
|
<span>{current}</span> |
|
|
|
|
<span className='etc'>/</span> |
|
|
|
|
<span> |
|
|
|
|
<span>12,55557778</span>,{''}<span> 34,55557778</span> |
|
|
|
|
<span>{next}</span> |
|
|
|
|
</span> |
|
|
|
|
</div> |
|
|
|
|
{/* {coord?.map(co => { |
|
|
|
|
const fCoord = FormattingCoord(co); |
|
|
|
|
if (fCoord) { |
|
|
|
|
return ( |
|
|
|
|
<span> |
|
|
|
|
<span>{fCoord[0]}, {fCoord[1]}</span> |
|
|
|
|
</span> |
|
|
|
|
); |
|
|
|
|
} |
|
|
|
|
})} */} |
|
|
|
|
return null; |
|
|
|
|
})} |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
); |
|
|
|
|
}) |
|
|
|
|
: null} |
|
|
|
|
</div> |
|
|
|
|
) : null} |
|
|
|
|
) : null} */} |
|
|
|
|
</div> |
|
|
|
|
<div |
|
|
|
|
id='detail' |
|
|
|
|