본문 바로가기

오픈레이어스6

[Openlayers] ol-ext FixedPopup 1. ol-extopenlayers의 확장 플러그인으로 style, animation, filter, controls, intersections, popup등 다양하게 제공합니다. ol-ext 다운로드는 아래 링크에 접속하셔서 다운받으시면 됩니다. https://github.com/Viglino/ol-ext GitHub - Viglino/ol-ext: Cool extensions for Openlayers (ol) - animated clusters, CSS popup, Font Awesome symbol renderer, chartCool extensions for Openlayers (ol) - animated clusters, CSS popup, Font Awesome symbol renderer,.. 2023. 10. 12.
[Openlayers] ol.style.icon image사이즈 조절방법 지난 포스팅에 이어서 [openlayers] Feature에 style적용하는 방법 + (ol.style.icon)*버전: openlayers6 기준 입니다.1. ol.style지도상에 특정 도형을 그릴때 우리는 Feature라는 객체를 사용했습니다. [Openlayers] 점, 선, 면 Feature 그리기1.오픈레이어스(OpenLayers)란 웹브라우저에서 지도, GISteammoca.tistory.comol.style.icon사용시 사용되는 이미지의 크기를 줄여서 올리는 방법을 포스팅 해보도록 하겠습니다. 우선 지도상에 이미지를 사용할경우 ol.style.icon을 사용하여 이미지 스타일을 생성합니다. image: new ol.style.Icon ({ anchor : [0.5, 0.5], src :.. 2023. 10. 5.
[openlayers] Feature에 style적용하는 방법 + (ol.style.icon) *버전: openlayers6 기준 입니다.1. ol.style지도상에 특정 도형을 그릴때 우리는 Feature라는 객체를 사용했습니다. [Openlayers] 점, 선, 면 Feature 그리기1.오픈레이어스(OpenLayers)란 웹브라우저에서 지도, GIS라이브러리를 사용할 수 있게 제공하는 오픈소스 자바스크립트 라이브러리입니다. 이번 포스팅은 Openlayers에서 많이 쓰이는 주요 객체들 중 Fteammoca.tistory.com이때 Feature에는 색상이나 두께 또는 z-index등의 Style을 입힐 수 있는데, 이때 style을 지정하는 방법엔크게 두가지가 있습니다. 1) new ol.style. Style 생성new ol. layer. Vector ({ source : new ol. s.. 2023. 10. 5.
[Openlayers] 드래그영역속에 있는 Feature 찾기 *버전: openlayers6 기준 입니다. 이번 포스팅에서는 지난번에 올렸던 점, 선, 면 Feature그리기편에 이어서 https://teammoca.tistory.com/m/20 Openlayers 점, 선, 면 Feature 그리기1.오픈레이어스(OpenLayers)란 웹브라우저에서 지도, GIS라이브러리를 사용할 수 있게 제공하는 오픈소스 자바스크립트 라이브러리입니다. 이번 포스팅은 Openlayers에서 많이 쓰이는 주요 객체들 중 Fteammoca.tistory.com드래그를 했을때 영역의 Feature를 찾는 법을 알아보도록 하겠습니다. 1. 우선 지난 포스팅의 예제소스를 통해 지도상에 점, 선, 면 Feature 그려보겠습니다.//source생성 let sample_source = new.. 2023. 9. 25.
[Openlayers] 지도상에 클릭한 지점 위도,경도 좌표얻기 *버전: openlayers6 기준 입니다. 이번 포스팅은 Openlayers에서 지도상에 마우스로 클릭한 지점에 표시(Point)를 찍고, 해당 클릭한 지점의 위도와 경도를 얻는방법을 알아보도록 하겠습니다. 우선 지도상에 나타낼 point Feature를 생성하는 기본적인 틀은 지난 포스팅과 같습니다. https://teammoca.tistory.com/m/20 Openlayers 점, 선, 면 Feature 그리기1.오픈레이어스(OpenLayers)란 웹브라우저에서 지도, GIS라이브러리를 사용할 수 있게 제공하는 오픈소스 자바스크립트 라이브러리입니다. 이번 포스팅은 Openlayers에서 많이 쓰이는 주요 객체들 중 Fteammoca.tistory.com 그러나 이번 포스팅은 마우스를 찍는 시점에 .. 2023. 9. 21.
[Openlayers] 점, 선, 면 Feature 그리기 1.오픈레이어스(OpenLayers)란 웹브라우저에서 지도, GIS라이브러리를 사용할 수 있게 제공하는 오픈소스 자바스크립트 라이브러리입니다. 이번 포스팅은 Openlayers에서 많이 쓰이는 주요 객체들 중 Feature , Source, Layer에 대해 간단하게 설명하겠습니다. 2. Feature , Source, Layer우선 openlayers에는 map이라는 핵심 객체가 있습니다. 그 안에서 Feature , Source, Layer등의 다른 객체들이 모여 map이라는 객체를 구성하게 됩니다. 객체 구성하는 크기의 순을 표현해보자면 Feature -> Source -> Layer순으로 이어집니다. 아래 그림을 통해 세 객체를 간단하게 표현해보았습니다.1) Feature Feature은 점(Po.. 2023. 9. 20.

티스토리툴바