프로그래밍/Frontend

[openlayers] polygon vector layer 클릭 시 나타나는 기본스타일 삭제하기

돔돔이 2023. 11. 30. 14:49
728x90
반응형

 

 

저의 경우 openlayers로 지도를 만들어서 그 위에 격자모양의 폴리곤을 추가했는데요.

이 격자모양을 클릭하고 나면 기본 클릭스타일(?)이 생기더라고요.

 

 

 

 

클릭을 해제했을 때 나타나는 스타일입니다.
오픈레이어스에서 자동으로 설정해놓은 기본클릭스타일...?인 것 같아요.

 

 

 

 

이 스타일은 레이어를 삭제(map.removeLayer)해도 지도 위에 남아있는 버그가 생기더라고요.

아래는 레이어를 삭제했을 때 남아있는 모습입니다.

지도 아무데나 클릭하면 사라지기는 하지만... 레이어를 삭제했을때 같이 삭제되도록 만들어보겠습니다.

 

 

 

 

 

반응형

 

 

레이어를 지도에 추가할 때, 레이어의 select interlection도 함께 추가해줍니다.

 

// 레이어 추가
map.addLayer(vectorLayer);

// select 인터렉션 생성
var select = new ol.interaction.Select({
  layers: [vectorLayer],
});

// 지도에 인터렉션 추가
map.addInteraction(select);

 

728x90

 

 

 

그리고 레이어를 삭제할 때, select interaction도 함께 제거해주면 된답니다.

이렇게 하면, 레이어를 삭제했을 때, 이상한 클릭스타일도 같이 사라지게 됩니다.

 

// 지도에서 레이어를 삭제할 때 select interaction도 제거
map.removeInteraction(select);
map.removeLayer(vectorLayer);

 

 

 

끝.

728x90
반응형