[Openlayers] Openlayers Heatmap Usage
2023. 2. 1. 11:47
Career/Openlayers
How can I use Heatmap() in openlayer? It's easy to use than you think about it. Method If you finished this script You can handle heatmap Method that you want That's an example. achacha ⭐ Don't forget to inherit openlayers ⭐ Create map You need to make a map to put layers on. const openStreetMap = new ol.Map ({ target: 'o2map2', layers : [ new ol.layer.Tile({ source: new ol.source.OSM(), }) ], v..
[Openlayers] Openlayers code storage
2023. 1. 26. 15:57
Career/Openlayers
polygon, circle, dot ... and style const map = new ol.Map ({ target : 'o2map', layers : [ new ol.layer.Tile({ source: new ol.source.OSM() }) ], view: new ol.View ({ zoom: 5, projection : 'EPSG:4326', center: [127, 35.22], }) }) const featureSource = new ol.source.Vector ({ }) const featureLayer = new ol.layer.Vector ({ source: featureSource }) const dotLayer = new ol.Feature ({ geometry : new ol..
[Openlayers] Openlayer's sensitive properties
2023. 1. 25. 10:48
Career/Openlayers
※ 오픈레이어스를 사용하기 위해서 상속을 받아야 된다. Method /* 오픈스트리트맵 */ const openSt = new ol.layer.Tile({ target: 'o2map' source: new ol.source.OSM(), visible: true, opacity: 1 }) if you use this code You face a error like this. (It wasn't working normally.) You should surround layer parameter by using array '[]' If you don't surround a layer parameter It will be not worked. Usage const map = new ol.Map ({ target:..
[Openlayers] 오픈레이어스 Polygon 사용방법
2023. 1. 19. 16:48
Career/Openlayers
※ 물론, 오픈레이어스를 사용하기 위해서 상속을 받아야 된다. (Obviously Before starting, You should inherit to use Openlayers) Method /* 여기안에는 그냥 배열 처리만 해줘도 사용 할 수 있다. */ const polygon = new ol.geom.Polygon([]); polygon.setCoordinates([[[120, 38],[120, 33],[126, 38] ,[126, 33]]]); const polygonFeature = new ol.Feature(polygon); polygon 사용하는 코드이다. (This is a code for using polygon.) 만약 여러개의 폴리곤을 사용하고 싶으면 (if you wanna try..
[Openlayers] 오픈레이어스 ol.geom.style 사용방법
2023. 1. 19. 15:51
Career/Openlayers
이제 좀 오픈레이어스에 대해서 이해가 가기 시작한다. Method const circleFeature = new ol.Feature ({ geometry: new ol.geom.Circle([127, 38], 2), }) 다음과 같이 서클이 있는 상태에서 const circleStyle = new ol.style.Style({ stroke: new ol.style.Stroke ({ color: 'red', width: 5, }), }) 서클 스타일을 다음과 같이 만들어준다. 그리고 circleFeature.setStyle(circleStyle); 서클 객체에다가 setStyle(스타일) 넣어주게 되면 스타일이 적용이 된다. To be continue..
[Openlayers] 오픈레이어스 LineString 사용 방법
2023. 1. 19. 13:44
Career/Openlayers
너무 간단해서 깜딱 놀랐다. '점' 찍어봤다면 이건 거의 3분 카레수준으로 해볼수 있을 것이다. Method const lineLayer = new ol.Feature ({ geometry: new ol.geom.LineString([[133, 38],[133, 55]]) }) 다음과 같이 설정해주고 ol.geom.LineString -> 줄 긋는 기능 사용 당연히 줄이니까 좌표를 두개 적어넣어주야한다. featureSource.addFeatures([multiPointFeature, lineLayer]); map.addLayer(featureLayer); lineLayer를 addFeature 해주게 되면 다음과 같이 나타나게된다. 🤑tips addFeature() -> 하나만 addFeatures([..