[카카오맵] 폴리건 그리기

시군구 카카오맵에 폴리건 그리기

 	fetch('/resources/json/sig.json') 
    .then(response => response.json())
    .then(data => {
        const { kakao } = window;

        var features = data.features; // geojson의 features를 변수에 할당

        features.forEach(feature => { 
            var coordinates = feature.geometry.coordinates; // feature의 좌표 데이터
            var name = feature.properties.SIG_KOR_NM; // feature의 이름 데이터
            feature.name = feature.properties.SIG_KOR_NM;
            
            var ob = new Object();
            ob.name=name;
            ob.path=[];
            coordinates[0].forEach(coordinate => {
                var latlng = new kakao.maps.LatLng(coordinate[1], coordinate[0]); // 경도, 위도 순서로 좌표 변환
                ob.path.push(latlng); // 경로에 좌표 추가
            });
            displayPoly(ob); 		// 경계 영역을 표시
            polygons.push(ob);	// 전역변수에 넣어주기
        });// forEach end
        
       function displayPoly(ob) {
      		var polygon = new kakao.maps.Polygon({
              path: ob.path, 			// 경로 설정
              strokeWeight: 2, 			// 선 두께 설정
              strokeColor: '#FF0000', 	// 선 색상 설정
              strokeOpacity: 0.01, 		// 선 투명도 설정
              fillColor: '#FF0000', 	// 채우기 색상 설정
              fillOpacity: 0.00001 		// 채우기 투명도 설정
          });
       	polygon.setMap(map); 			// 지도에 경계 영역 추가
       	polyEventAdd(polygon, ob);
       };//display
    })//try 끝
    .catch(error => {
        console.error('데이터 가져오기 실패:', error);
    });
	//폴리건마다 mouseover 이벤트 넣어줌 (구 이름 찾기)
	function polyEventAdd (polygon, ob){
	  	        		
  		  kakao.maps.event.addListener(polygon, 'mouseover', function() {
	
			  if(state){
				  state = false;
				  if(ob.name != nowGu){ 	//현재 구와 지도 구가 다를때
					  nowGu = ob.name;
					  searchList();	//검색
				  }
				  else {return;}			//현재 구와 지도 구가 같음 (검색할 필요 없음.)
				 
			  }
			  else {return;}				
		});//mouseover	
  	};

      

열심히 그렸는데 사용하지 않게 되어 기록해둠..

 var bounds = map.getBounds();
       for(var i=0; i<markersArr.length; i++){
           if(bounds.contain(markersArr[i].getPosition())){
               info.push(markerAddArr[i].replace("서울 ",""));
               console.log(info[i]);
           }
       }
       info = info.join(',');