공간데이터 웹 서비스
OpenLayers
웹 브라우저 상에 지도 데이터를 시각화 및 조작이 가능한 JavaScript 라이브러리
OSM (OpenStreetMap) 라는 오픈소스형 무료 지도 서비스 이용
OSM의 시작지인 런던은 가로수 하나까지도 한땀한땀 노드로 다 표현을 해놓았을 정도로 지도 데이터 질이 매우 좋다고 합니다.
주요 대도시들은 구글맵보다도 더 정확하고 자세한 표현합니다.
지도 기반의 GIS (geographic information system) 프로젝트 - GeoServer, PostgreSQL 연동으로 개발
특징
타일 레이어
OSM, Bing, MapBox, Stamen 및 찾을 수 있는 기타 XYZ 소스에서 타일을 가져옵니다.
OGC 매핑 서비스 및 untiled 레이어도 지원됩니다.
벡터 레이어
GeoJSON, TopoJSON, KML, GML, Mapbox 벡터 타일 및 기타 형식의 벡터 데이터를 렌더링합니다.
Cutting Edge, Fast & Mobile Ready
Canvas 2D, WebGL 및 HTML5의 모든 최신 기능을 활용합니다.
즉시 사용 가능한 모바일 지원
필요한 구성 요소만으로 경량 사용자 지정 프로필을 구축 가능합니다.
Easy to Customize and Extend
간단한 CSS로 지도 컨트롤의 스타일을 지정할 수 있습니다.
다양한 수준의 API에 연결하거나 타사 라이브러리를 사용하여 기능을 사용자 지정하고 확장합니다.
구조
Openlayers에서 지도서비스가 나타나기 위해서는 Map이 핵심요소로 필요합니다.
Map은 지도화면에 배경지도(BingMaps, GoogleMap, Kakao, Naver, OSM, 브이월드) 또는 배경지도 위에 WMS/WFS 레이어를 표출하기 위해 필요한 필수 객체 입니다.
Map을 사용하여 지도를 화면에 표출하기 위해서는 Layer와 View, Interaction, Controls 와 같은 요소가 필요합니다.
Layer는 배경지도 또는 레이어를 표출하기 위해 사용하는 객체입니다. 하나 이상의 레이어가 필요하여 Map에서 배열로 사용됩니다.
View는 해상도, 화면 레벨, 좌표 등 지도의 시각적 효과에 대한 변수들을 정의합니다.
Controls는 화면에 고정된 위치에 사용되는 버튼등에 이벤트를 적용하여 회전, 위치이동 등의 이벤트를 제공합니다.
Interaction은 마우스, 키보드 등의 이벤트로 효과를 제공합니다. (true, false)
Leaflet
리플릿(Leaflet)은 웹 매핑 애플리케이션을 빌드하기 위해 사용되는 오픈 소스 자바스크립트 라이브러리입니다. HTML5와 CSS3를 지원하고 대부분의 모바일 및 데스크톱 플랫폼을 지원합니다.
리플릿은 GIS 배경지식이 없는 개발자들이 공용 서버에 호스팅되는 타이틀 웹 맵을 선택적 타일 오버레이와 함께 매우 쉽게 표출할 수 있게 합니다. GeoJSON 파일로부터 피처 데이터(feature data)를 로드하고 스타일을 입히고 상호작용 레이어를 만들 수 있습니다.(예: 클릭할 때 팝업 포함 마커 등)
특징
Leaflet은 기본 사항이 완벽하게만 작동하도록 만드는 데 중점을 둡니다 .
사용 가능한 레이어
타일 레이어, WMS
마커, 팝업
벡터 레이어 : polylines, polygons, circles, rectangles
Image overlays
GeoJSON
사용자 정의 기능
간편한 스타일 변경을 위한 순수한 CSS3 팝업 및 컨트롤
이미지 및 HTML 기반 마커
사용자 지정 맵 레이어 및 컨트롤을 위한 간단한 인터페이스
사용자 지정 지도 투영 (
EPSG:3857/4326/3395기본 제공)기존 클래스 확장을 위한 강력한 OOP 기능
성능 특징
모바일의 하드웨어 가속은 네이티브 앱처럼 부드럽게 느껴집니다.
CSS3 기능을 활용하여 패닝 및 확대/축소를 정말 부드럽게 만들기
동적 클리핑 및 단순화가 포함된 스마트 폴리라인/폴리곤 렌더링으로 매우 빨라집니다.
필요하지 않은 기능을 생략하기 위한 모듈식 빌드 시스템
모바일에서 탭 지연 제거
시각적 특징
확대/축소 및 이동 애니메이션
타일 및 팝업 페이드 애니메이션
마커, 팝업 및 맵 컨트롤을 위한 매우 멋진 기본 디자인
Retina 해상도 지원
OpenLayers vs Leaflet
Last updated
