[OpenLayers] 지도 라이브러리 OpenLayers의 기본 개념

 

 

OpenLayers 주요객체

 

1. Map

OpenLayers의 핵심 객체로 지도를 생성하고 여러 레이어, 소스 등을 결합하여 화면에 지도 표시함

 

주요 속성 및 메소드

- target : 지도가 랜더링 될 HTML 요소의 ID
- layers : 맵에 추가되는 레이어의 배열
- view : 지도의 초기 중심점과 확대 수준을 정의하는 View 객체
- addLayer() : 지도의 레이어에 새 레이어를 추가
- getView() : 현재 맵의 View 객체 반환

 

2. View

지도의 시각적 표현 제어

지도의 중심점, 확대/축소 레벨, 회전 등을 설정

 

주요 속성 및 메소드

- center : 지도의 중심점 좌표
- zoom : 초기 확대/축소 레벨
- rotation : 지도의 회전 각도
- setCenter(coordinate) : 지도의 중심점 설정
- setZoom(zoomLevel) : 확대/축소 레벨 설정

 

 

3. Layer

지도에 표시되는 데이터 정의

 

Layer 종류

- VectorLayer : Vector 데이터를 지도에 표시하는 데 사용됨
- TileLayer : Tile 이미지를 지도로 로드하여 데이터 표시

 

 

4. Source

Layer의 데이터 Source로 지도에 데이터를 제공하는 역할

 

Source 종류

- VectorSource : Vector 데이터를 로드하고 관리하는 소스
- TileSource : Tile 데이터를 로드, OSM 타일을 불러올 때 사용됨

 

 

5. Feature

지도에 표시될 개별적인 요소로 Feature는 점, 선, 면 등의 지리적 객체를 나타냄

 

주요 속성 및 메소드

- geometry : Feature의 지리적 형태를 정의
- setProperties(properties) : Feature에 속성을 설정
- get(propertyName) : 특정 속성 값을 가져옴

 

 

6. Geometry

Feature의 지리적 모양을 정의

다양한 형태의 지리적 데이터를 지원함

 

주요 클래스

- Point : 하나의 점을 정의
- LineString : 선을 정의
- Polygon : 폴리곤(면)을 정의

 

 

7. Style

지도의 Feature 또는 Layer에 대한 시각적 스타일을 정의

Point, LineString, Polygon에 대한 스타일을 정의 가능

 

주요 클래스

- Style : 스타일을 정의하는 기본 클래스
- Fill : 폴리곤의 채우기 색상 정의
- Stroke : 선의 색상과 두께를 정의
- Circle : 점의 스타일을 원형으로 정의

 

 

8. Interaction

사용자가 지도와 상호작용 할 수 있게 해줌

 

주요 클래스

- DragPan : 드래그를 통해 지도를 이동
- MouseWheelZoom : 마우스 휠로 지도를 확대/축소
- Select : 지도의 특정 Feature 선택

 

 

9. Control

지도의 사용자 인터페이스 요소를 정의

 

주요 클래스

- Zoom : 지도에 확대/축소 버튼 추가
- ScaleLine : 지도에 축척바 추가
- FullScreen : 전체 화면 모드로 전환할 수 있는 버튼 추가

 

 

10. Overlay

지도의 특정 위치에 HTML 요소를 고정

팝업이나 사용자 인터페이스 요소를 특정 좌표에 표시

 

주요 속성 및 메소드

- position : 오버레이 위치 정의
- element : 오버레이로 표시할 HTML 요소
- setPosition(coordinate) : 오버레이의 위치를 설정

 

 

OpenLayers 주요객체 규모 비교

 

• Map > Layer > Source > Feature