From 5390b02ab058c18389e75b9e836639310bb14f12 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?junh=5Feee=28=EC=9D=B4=EC=A4=80=ED=9D=AC=29?= Date: Thu, 17 Nov 2022 15:46:06 +0900 Subject: [PATCH] =?UTF-8?q?=EC=9D=B8=EC=B2=9C=EA=B3=B5=ED=95=AD=20?= =?UTF-8?q?=EA=B2=A9=EC=9E=90=EA=B3=B5=EC=97=AD=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/map/geojson/airArea.json | 223 ++++++++++++++---- src/components/map/naver/NaverMap.js | 82 +++---- .../map/naver/feature/FeatureAirZone.js | 14 +- 3 files changed, 222 insertions(+), 97 deletions(-) diff --git a/src/components/map/geojson/airArea.json b/src/components/map/geojson/airArea.json index 66c5d96..8ee0758 100644 --- a/src/components/map/geojson/airArea.json +++ b/src/components/map/geojson/airArea.json @@ -2702,48 +2702,187 @@ "type": "Polygon", "coordinates": [ [ - [126.404371, 37.380504, 0], - [126.422041, 37.376657, 0], - [126.440282, 37.375304, 0], - [126.458541, 37.376486, 0], - [126.476267, 37.380167, 0], - [126.48476, 37.382913, 0], - [126.492921, 37.386235, 0], - [126.507999, 37.394508, 0], - [126.521044, 37.404733, 0], - [126.526677, 37.410483, 0], - [126.535951, 37.423041, 0], - [126.539521, 37.429753, 0], - [126.54439, 37.443789, 0], - [126.545652, 37.451006, 0], - [126.545781, 37.465564, 0], - [126.544646, 37.472794, 0], - [126.540022, 37.486882, 0], - [126.536567, 37.493633, 0], - [126.527501, 37.506291, 0], - [126.521959, 37.512101, 0], - [126.515799, 37.517506, 0], - [126.501816, 37.526938, 0], - [126.485978, 37.534299, 0], - [126.468765, 37.539364, 0], - [126.450703, 37.54198, 0], - [126.432343, 37.542066, 0], - [126.414243, 37.53962, 0], - [126.396956, 37.534716, 0], - [126.381009, 37.527505, 0], - [126.366886, 37.518205, 0], - [126.355017, 37.5071, 0], - [126.345763, 37.494528, 0], - [126.339404, 37.480872, 0], - [126.336132, 37.466547, 0], - [126.336044, 37.451989, 0], - [126.339141, 37.43764, 0], - [126.345328, 37.423935, 0], - [126.354414, 37.411291, 0], - [126.366124, 37.400092, 0], - [126.372854, 37.395142, 0], - [126.387808, 37.386729, 0], - [126.404371, 37.380504, 0] + [126.44094280000002, 37.54235382142311, 0], + [126.44461994135273, 37.54230287215076, 0], + [126.44829258762837, 37.54215008661631, 0], + [126.45195624930022, 37.541895651590615, 0], + [126.45560644793481, 37.541539878102256, 0], + [126.45923872172105, 37.54108320105341, 0], + [126.4628486309776, 37.54052617868294, 0], + [126.46643176363217, 37.53986949187721, 0], + [126.46998374066511, 37.539113943329525, 0], + [126.47350022151095, 37.538260456549324, 0], + [126.47697690941023, 37.53731007472238, 0], + [126.48040955670568, 37.53626395942344, 0], + [126.48379397007506, 37.53512338918297, 0], + [126.4871260156948, 37.53388975790994, 0], + [126.49040162432739, 37.53256457317236, 0], + [126.49361679632621, 37.53114945433823, 0], + [126.49676760655159, 37.52964613057885, 0], + [126.4998502091916, 37.52805643873729, 0], + [126.50286084248206, 37.52638232106468, 0], + [126.505795833319, 37.524625822827126, 0], + [126.50865160175876, 37.522789089786436, 0], + [126.51142466539942, 37.52087436555773, 0], + [126.51411164363836, 37.51888398884744, 0], + [126.51670926180095, 37.51682039057498, 0], + [126.51921435513479, 37.514686090882016, 0], + [126.52162387266492, 37.51248369603286, 0], + [126.5239348809054, 37.51021589521011, 0], + [126.52614456742265, 37.50788545720947, 0], + [126.52825024424588, 37.50549522703788, 0], + [126.53024935112154, 37.503048122419465, 0], + [126.53213945860658, 37.50054713021332, 0], + [126.53391827099826, 37.49799530274809, 0], + [126.53558362909591, 37.49539575407745, 0], + [126.53713351279227, 37.49275165616162, 0], + [126.53856604349106, 37.490066234979395, 0], + [126.5398794863481, 37.48734276657561, 0], + [126.54107225233366, 37.484584573049, 0], + [126.54214290011332, 37.48179501848551, 0], + [126.5430901377462, 37.47897750484189, 0], + [126.54391282419758, 37.47613546778491, 0], + [126.54460997066552, 37.47327237249113, 0], + [126.54518074171949, 37.47039170941269, 0], + [126.54562445624995, 37.467496990013956, 0], + [126.54594058822855, 37.46459174248467, 0], + [126.54612876727788, 37.46167950743456, 0], + [126.54618877905054, 37.458763833574814, 0], + [126.54612056541758, 37.45584827339179, 0], + [126.54592422446628, 37.45293637881798, 0], + [126.54560001030777, 37.45003169690585, 0], + [126.5451483326948, 37.447137765509524, 0], + [126.54456975645077, 37.444258108979696, 0], + [126.54386500071111, 37.441396233876986, 0], + [126.54303493797774, 37.43855562470892, 0], + [126.54208059298897, 37.435739739695606, 0], + [126.54100314140564, 37.43295200656935, 0], + [126.53980390831609, 37.430195818413104, 0], + [126.5384843665616, 37.42747452954293, 0], + [126.53704613488523, 37.42479145143916, 0], + [126.53549097590567, 37.422149848731486, 0], + [126.53382079391994, 37.41955293524234, 0], + [126.53203763253687, 37.417003870093694, 0], + [126.53014367214507, 37.41450575388156, 0], + [126.52814122721848, 37.41206162492309, 0], + [126.5260327434629, 37.40967445558032, 0], + [126.52382079480729, 37.407347148665366, 0], + [126.52150808024346, 37.40508253393088, 0], + [126.51909742051836, 37.40288336465029, 0], + [126.51659175468285, 37.40075231429156, 0], + [126.5139941365013, 37.39869197328861, 0], + [126.51130773072649, 37.396704845913995, 0], + [126.50853580924435, 37.39479334725669, 0], + [126.5056817470933, 37.39295980030843, 0], + [126.5027490183626, 37.391206433162004, 0], + [126.49974119197545, 37.389535376324815, 0], + [126.49666192736099, 37.38794866015083, 0], + [126.49351497002117, 37.38644821239399, 0], + [126.49030414699712, 37.38503585588566, 0], + [126.4870333622409, 37.38371330633935, 0], + [126.48370659189776, 37.382482170284575, 0], + [126.48032787950466, 37.38134394313284, 0], + [126.47690133111058, 37.38030000737772, 0], + [126.47343111032448, 37.3793516309311, 0], + [126.46992143329652, 37.378499965597655, 0], + [126.46637656363843, 37.377746045689165, 0], + [126.4628008072892, 37.37709078678045, 0], + [126.45919850733164, 37.37653498460818, 0], + [126.45557403876613, 37.37607931411399, 0], + [126.45193180324753, 37.37572432863285, 0], + [126.44827622379123, 37.37547045922783, 0], + [126.4446117394546, 37.37531801417182, 0], + [126.44094280000002, 37.375267178576884, 0], + [126.43727386054543, 37.37531801417182, 0], + [126.4336093762088, 37.37547045922783, 0], + [126.4299537967525, 37.37572432863285, 0], + [126.4263115612339, 37.37607931411399, 0], + [126.4226870926684, 37.37653498460818, 0], + [126.41908479271083, 37.37709078678045, 0], + [126.4155090363616, 37.377746045689165, 0], + [126.41196416670351, 37.378499965597655, 0], + [126.40845448967555, 37.3793516309311, 0], + [126.40498426888945, 37.38030000737772, 0], + [126.40155772049538, 37.38134394313284, 0], + [126.39817900810228, 37.382482170284575, 0], + [126.39485223775914, 37.38371330633935, 0], + [126.39158145300291, 37.38503585588566, 0], + [126.38837062997887, 37.38644821239399, 0], + [126.38522367263904, 37.38794866015083, 0], + [126.38214440802459, 37.389535376324815, 0], + [126.37913658163743, 37.391206433162004, 0], + [126.37620385290673, 37.39295980030843, 0], + [126.37334979075567, 37.39479334725669, 0], + [126.37057786927355, 37.396704845913995, 0], + [126.36789146349874, 37.39869197328861, 0], + [126.36529384531718, 37.40075231429156, 0], + [126.36278817948165, 37.40288336465029, 0], + [126.36037751975657, 37.40508253393088, 0], + [126.35806480519274, 37.407347148665366, 0], + [126.35585285653713, 37.40967445558032, 0], + [126.35374437278153, 37.41206162492309, 0], + [126.35174192785496, 37.41450575388156, 0], + [126.34984796746316, 37.417003870093694, 0], + [126.34806480608009, 37.41955293524234, 0], + [126.34639462409436, 37.422149848731486, 0], + [126.3448394651148, 37.42479145143916, 0], + [126.34340123343843, 37.42747452954293, 0], + [126.34208169168394, 37.430195818413104, 0], + [126.3408824585944, 37.43295200656935, 0], + [126.33980500701105, 37.435739739695606, 0], + [126.3388506620223, 37.43855562470892, 0], + [126.33802059928892, 37.441396233876986, 0], + [126.33731584354925, 37.444258108979696, 0], + [126.33673726730524, 37.447137765509524, 0], + [126.33628558969227, 37.45003169690585, 0], + [126.33596137553376, 37.45293637881798, 0], + [126.33576503458245, 37.45584827339179, 0], + [126.3356968209495, 37.458763833574814, 0], + [126.33575683272215, 37.46167950743456, 0], + [126.33594501177149, 37.46459174248467, 0], + [126.33626114375008, 37.467496990013956, 0], + [126.33670485828054, 37.47039170941269, 0], + [126.33727562933451, 37.47327237249113, 0], + [126.33797277580246, 37.47613546778491, 0], + [126.33879546225383, 37.47897750484189, 0], + [126.33974269988671, 37.48179501848551, 0], + [126.34081334766637, 37.484584573049, 0], + [126.34200611365193, 37.48734276657561, 0], + [126.34331955650897, 37.490066234979395, 0], + [126.34475208720777, 37.49275165616162, 0], + [126.34630197090412, 37.49539575407745, 0], + [126.34796732900178, 37.49799530274809, 0], + [126.34974614139345, 37.50054713021332, 0], + [126.35163624887849, 37.503048122419465, 0], + [126.35363535575415, 37.50549522703788, 0], + [126.35574103257738, 37.50788545720947, 0], + [126.35795071909462, 37.51021589521011, 0], + [126.36026172733511, 37.51248369603286, 0], + [126.36267124486524, 37.514686090882016, 0], + [126.36517633819908, 37.51682039057498, 0], + [126.36777395636167, 37.51888398884744, 0], + [126.37046093460062, 37.52087436555773, 0], + [126.37323399824128, 37.522789089786436, 0], + [126.37608976668103, 37.524625822827126, 0], + [126.37902475751795, 37.52638232106468, 0], + [126.38203539080843, 37.52805643873729, 0], + [126.38511799344845, 37.52964613057885, 0], + [126.38826880367382, 37.53114945433823, 0], + [126.39148397567264, 37.53256457317236, 0], + [126.39475958430523, 37.53388975790994, 0], + [126.39809162992496, 37.53512338918297, 0], + [126.40147604329435, 37.53626395942344, 0], + [126.4049086905898, 37.53731007472238, 0], + [126.40838537848909, 37.538260456549324, 0], + [126.41190185933492, 37.539113943329525, 0], + [126.41545383636786, 37.53986949187721, 0], + [126.41903696902243, 37.54052617868294, 0], + [126.42264687827898, 37.54108320105341, 0], + [126.4262791520652, 37.541539878102256, 0], + [126.42992935069981, 37.541895651590615, 0], + [126.43359301237165, 37.54215008661631, 0], + [126.4372656586473, 37.54230287215076, 0], + [126.44094280000002, 37.54235382142311, 0] ] ] }, diff --git a/src/components/map/naver/NaverMap.js b/src/components/map/naver/NaverMap.js index 67701a1..3ea0304 100644 --- a/src/components/map/naver/NaverMap.js +++ b/src/components/map/naver/NaverMap.js @@ -19,11 +19,26 @@ export const NaverCustomMap = () => { const [poly, setPoly] = useState([]); + const airPort = [ + { + title: '김포공항', + buffer: 9300, + center: new naver.maps.LatLng(37.558522, 126.793722), + reduce: [54.4, 218.6, 500, 905.4, 1459.8, 2195, 3173.5, 4552.5, 6952.5] + }, + { + title: '인천공항', + buffer: 9300, + center: new naver.maps.LatLng(37.4588105, 126.4409428), + reduce: [54.4, 218.6, 500, 905.4, 1459.8, 2195, 3173.5, 4552.5, 6952.5] + } + ]; + let features = geoJson.features; useEffect(() => { NaverMapInit(); - polyArea(); + airPort?.map(air => polyArea(air)); }, []); const NaverMapInit = () => { @@ -48,11 +63,11 @@ export const NaverCustomMap = () => { setArrPolyline([...arrPolyline, line]); }; - const polyArea = () => { + const polyArea = air => { //격자 공역 const polyArr = []; - const SENSOR_RADIUS = 9300; - const position = new naver.maps.LatLng(37.558522, 126.793722); + const radius = air.buffer; + const position = air.center; const color = '#000'; const opacity = 0.7; @@ -72,41 +87,23 @@ export const NaverCustomMap = () => { ); let reduce = 0; - if (j === 0) { - // reduce = 218.6; - reduce = 54.4; - } else if (j === 1) { - // reduce = 905.4; - reduce = 218.6; - } else if (j === 2) { - // reduce = 2195; - reduce = 500; - } else if (j === 3) { - // reduce = 4560.2; - reduce = 905.4; - } else if (j === 4) { - reduce = 1459.8; - } else if (j === 5) { - reduce = 2195; - } else if (j === 6) { - reduce = 3173.5; - } else if (j === 7) { - reduce = 4552.5; - } else if (j === 8) { - reduce = 6952.5; - } + reduce = air.reduce[j]; + + // 2km reduce + // [218.6, 905.4, 2195, 4560.2] + if (angle % 180 == 0) { const polyEW = new naver.maps.Polyline({ path: [ new naver.maps.EPSG3857.getDestinationCoord( coord, 90, - SENSOR_RADIUS - reduce + radius - reduce ), new naver.maps.EPSG3857.getDestinationCoord( coord, 270, - SENSOR_RADIUS - reduce + radius - reduce ) ], strokeWeight: 0.8, @@ -121,12 +118,12 @@ export const NaverCustomMap = () => { new naver.maps.EPSG3857.getDestinationCoord( coord, 0, - SENSOR_RADIUS - reduce + radius - reduce ), new naver.maps.EPSG3857.getDestinationCoord( coord, 180, - SENSOR_RADIUS - reduce + radius - reduce ) ], strokeWeight: 0.8, @@ -140,12 +137,8 @@ export const NaverCustomMap = () => { } const NS = new naver.maps.Polyline({ path: [ - new naver.maps.EPSG3857.getDestinationCoord(position, 0, SENSOR_RADIUS), - new naver.maps.EPSG3857.getDestinationCoord( - position, - 180, - SENSOR_RADIUS - ) + new naver.maps.EPSG3857.getDestinationCoord(position, 0, radius), + new naver.maps.EPSG3857.getDestinationCoord(position, 180, radius) ], strokeWeight: 0.8, strokeOpacity: opacity, @@ -155,16 +148,8 @@ export const NaverCustomMap = () => { polyArr.push(NS); const EW = new naver.maps.Polyline({ path: [ - new naver.maps.EPSG3857.getDestinationCoord( - position, - 90, - SENSOR_RADIUS - ), - new naver.maps.EPSG3857.getDestinationCoord( - position, - 270, - SENSOR_RADIUS - ) + new naver.maps.EPSG3857.getDestinationCoord(position, 90, radius), + new naver.maps.EPSG3857.getDestinationCoord(position, 270, radius) ], strokeWeight: 0.8, strokeOpacity: opacity, @@ -172,7 +157,8 @@ export const NaverCustomMap = () => { // map: props.map }); polyArr.push(EW); - setPoly(polyArr); + + setPoly(m => [...m, polyArr]); }; return ( diff --git a/src/components/map/naver/feature/FeatureAirZone.js b/src/components/map/naver/feature/FeatureAirZone.js index cd6601f..0b9e62d 100644 --- a/src/components/map/naver/feature/FeatureAirZone.js +++ b/src/components/map/naver/feature/FeatureAirZone.js @@ -12,10 +12,12 @@ export const FeatureAirZone = props => { }, [mapControl]); useEffect(() => { - props.poly?.map(prev => { - prev.setMap(props.map); + props.poly?.map(air => { + air?.map(a => { + a.setMap(props.map); + }); }); - }, []); + }, [props.poly]); const infowindowOpen = data => { const content = @@ -120,12 +122,10 @@ export const FeatureAirZone = props => { }); // const coordzip = []; - // let tt = 140; + // let tt = 0; // for (let i = 0; i <= 180; i++) { - // const diff = tt; - // const coord1 = new naver.maps.EPSG3857.getDestinationCoord( - // new naver.maps.LatLng(37.558522, 126.793722), + // new naver.maps.LatLng(37.4588105, 126.4409428), // tt, // 9300 // );