[OpenLayers] 맵 마커 띄우기(point, polygon)

 

---

이전 관련 게시글

2023.01.27 - [eclipse/OpenLayers] - [openlayers] 지도 맵 띄우기

 

---

결과 화면

멥 마커 띄우기 입니다.

---

개발 코드

1. jsp 에서 마커 지정할 수 있도록 옵션 설정

표시 모양을 정하기 위해 form을 이용하여 option을 선택합니다.

 

2. js에서 select id를 변수에 담기

사용자가 point이든 polygon이든 선택하면, js로 넘겨져 해당 옵션의 feature를 생성할 수 있도록 합니다.
select id 인 type을 js에서 사용할 수 있도록 typeSelect라는 변수에 담아 사용하겠습니다.

 

3. marker 및 vector 설정

source와 vector를 선언하여 레이어 위에 feature를 생성할 수 있도록 선언합니다.

 

4. 맵 위에 마커를 설정할 수 있도록 설정

jsp에서 이벤트가 변경되면 draw라는 것을 이용하여 지도 위에 그릴 수 있도록 준비하고,
addInteraction을 이용하여 상호작용에 추가합니다.

1. 이벤트(value값)이 변결될 때 
2. 기존에 있는 상호작용 제거 후 valie 값 받아 Draw 속성(Source. type)
3. MAP에 그린 객체 표시하기 위해 상호작용

 

5. map에 도형레이어 추가

또한 지도 위에 도형레이어를 추가해야하기 때문에 map생성되는 부분에 도형레이어(vector)를 추가합니다.

--------
openlayers의 라이브러리와 지원 문서는 아래에 있는 주소에서 도움받아 제작하였습니다.

https://openlayers.org/en/latest/apidoc/

OpenLayers v7.2.2 API - Index