분류 전체보기 143

한줄 팁 - PostGIS 교차 중복된 면적 구하기

PostGIS에 저장된 폴리곤 레이어가 있다고 가정하고, 이 레이어의 feature들 중 내가 설정한 영역과 중복되는 폴리곤들의 면적을 구하는 한줄 쿼리 입니다. select pnu, ST_Area( st_intersection( geom, st_transform( st_setsrid(st_geomfromtext('POLYGON ((127.00143 37.49791, 127.00635 37.49791, 127.00635 37.50109, 127.00143 37.50109, 127.00143 37.49791))'), 4326), 3857)))as area from lp_pa_cbnd where st_intersects(geom, st_transform( st_setsrid(st_geomfromtext('P..

한줄 팁 - Postgresql에서 CSV 바로 만들기

Postgresql의 Copy라는 명령어로 간단하게 CSV(Comma Separated Values) 포맷 파일을 만들 수 있습니다. 즉 좌표가 포함된 PostGIS 레이어 테이블도 간단하게 CSV 파일로 만들 수 있습니다. 문법은 아래와 같습니다. COPY [Table 이름 또는 쿼리] to '[파일경로/파일이름.csv]' csv header; 파일경로는 서버에서 수행할 경우 절대 경로로 해줘야 합니다. 이 명령어를 이용해 PostGIS 레이어 테이블에서 폴리곤으로 되어 있는 레이어에서 중심점 좌표만 추출한 CSV 파일을 만들고자 한다면 다음과 같이 명령어를 만들 수 있습니다. COPY ( select gate_no, gate_nm, st_x(st_centroid(st_transform(geom,432..

MapLibre - #6 내 위치 공시지가 확인 코딩 2편

이번 글에서는 브이월드 WFS 서비스로 가져온 지적정보를 화면에 표시하는 방법을 설명드리겠습니다. 아래 실행 화면처럼 정보창을 표시하기위해 MapLibre에서 제공하는 MarkerView 플러그인을 사용하겠습니다. MarkerView 플러그인을 사용하시려면 build.gradle 파일에 아래 내용을 추가하시고 Sync Project with gradle files(안드로이드 스튜디오 기준) 해 주시면됩니다. implementation 'org.maplibre.gl:android-plugin-markerview-v9:1.0.0' Repository 이름이 Mapbox SDK v9와 거의 동일한 명명 규칙을 갖고 있으니, 참고하십시오. 주요 소스는 아래와 같습니다. AddMarkerSymbol이라는 메서드를..

MapLibre - #5 내 위치 공시지가 확인 코딩 1편

이번 글은 내가 지도에서 터치한 곳의 공시지가를 확인하는 코드입니다. 이번 글도 이전 MapLibre 강좌와 이어집니다. 공시지가를 확인 하는 방법은 여러가지가 있겠지만, 국토교통부 브이월드 서비스에서 제공하는 OpenAPI를 활용하는 방법으로 코드를 작성했습니다. 가져오는 내용은 선택위치의 지번주소와 공시지가, 공시지가 기준월을 브이월드 WFS 서비스를 통해 가져옵니다. 주요 코드부분은 맵이 준비가 되면(onMapReady), 맵 클릭 이벤트 핸들러를 등록해 줍니다. 맵 클릭 이벤트에서 해당 포인트의 경위도 좌표를 획득하고 브이월드 WFS 요청 URL을 생성합니다. 브이월드 WFS URL 요청문 설명 페이지를 참고하셔서 해당 구문을 작성하시면 됩니다. 이 예제에서는 filter 구문을 활용해 WFS U..

MapLibre - #4 내 위치 찾기

모바일 지도 서비스에 기본적으로 요구되는 기능은 '내 위치 찾기'일 것입니다. MapLibre도 관련 기능을 제공하고 있습니다. 지난 MapLibre 글들에 이어지는 내용으로 설명드리겠습니다. 작성 과정을 처음부터 보시려면 지난 1~3편의 글을 참고하시기 바랍니다. 에뮬레이터 실행화면을 보여드리면 지도화면에 내 위치와 기기의 방향이 표시됩니다. 이렇게 동작하기 위해 필요한 주요 코드를 설명드리겠습니다. 우선 기기의 위치 권한을 요청해서 획득합니다. 이후 OmMapReadyCallback 함수(onMapReady)에서 맵 스타일에 원하는 레이어(주제도)를 추가하고 내 위치 표시 컴포넌트를 활성화하는 순서입니다(나머지 소스에 대한 설명은 주석을 참고하세요). 오늘은 설명할 것이 많지 않네요. 거의 공식처럼 ..

MapLibre - #3 나만의 맵 앱 만들기 3편

이번 글에서는 국토교통부에서 구축해서 브이월드를 통해 제공하는 연속지적도를 지도에 올려보겠습니다. 브이월드에서 제공하는 연속지적도 이미지는 WMS로 제공하고 있습니다. 지난 글에서 작성한 AddWMTSLayer와 유사한 메소드를 작성해서 맵에 추가해 보도록 하겠습니다. 개발환경 설정 및 브이월드 배경지도 추가 방법은 지난 MapLibre #1, #2 강좌를 참고하시면 됩니다. 이번 글에서는 곧바로 추가적인 코드를 설명드리겠습니다. 261번째 라인부터 AddLpPaCbndLayer라는 메소드를 정의했습니다. 브이월드 WMS 호출 URL은 여기를 참고하시면 됩니다. 요청 URL중에 layers 부분에 가져오고 싶은 레이어 이름을 영문으로 적어줍니다. 여기서는 연속지적 본번, 부번 레이어를 동시에 가져왔습니다..

MapLibre - #2 나만의 맵 앱 만들기 2편

지난 글에 이어 나만의 맵 앱 만들기 소스 부분을 설명 드리겠습니다. Maplibre 맵을 생성하는 과정을 설명하면, 32라인의 Mapbox.getInstance(this); 로 MapLibre 객체를 초기화 합니다. 그런데 주의할 점은 MainActivity의 layout을 초기화 하기 전에, 즉 setContentView(R.layout.activity_main); 이전에 호출해 주어야 하는 것입니다. 만약 setContentView 이후에 Mapbox.getInstance를 호출하면 에러가 발생합니다. 그런데 조금 이상하다고 생각되는 부분이 우리는 MapLibre SDK를 쓰고 있는데, 클래스 이름이 여전히 Mapbox 입니다. 아무래도 MapLibre SDK가 Mapbox로 시작했기 때문에 여전히..

MapLibre - #1 나만의 맵 앱 만들기 1편

MapLibre는 iOS, Android 및 기타 플랫폼 용 지도 SDK입니다. MapLibre - Open Maps SDKs Open-source JavaScript and Android / iOS SDKs for building web and mobile apps maplibre.org 모태가 되는 오픈 소스는 Mapbox 인데, 이 Mapbox가 2.0부터 더이상 오픈 소스가 아닌 상용 소프트웨어가 됐습니다. MapLibre는 Mapbox 오픈소스 버전을 계속해서 유지하고 있고 mapbox와 거의 유사하게 코드가 구성되어 있습니다. 오픈소스는 MapTiler라는 회사가 지원하는 것으로 보입니다. MapLibre 포함 Mapbox GL 관련 내용은 여기에 자세히 나와 있으니 관심있으신 분들은 확인해 ..

leaflet - #11 통계지도 만들기 3편

이번 글에서는 정보와 범례 창을 추가해 보도록 하겠습니다. leaflet은 지도 창 위에 보여지는 요소 중 지도를 제외하고 모두 컨트롤로 취급합니다. 정보와 범례 모두 html 요소 중 div 태그(tag)를 사용한 요소입니다. 정보 컨트롤은 마우스 커서를 해당 구에 올려 놓으면 해당 구의 영역을 하일라이트로 표시하고 구 이름과 통계 지표값(예제에서는 value)을 표시합니다. 범례 컨트롤은 지도 화면 우측 하단에 지표 단계별 색상 목록을 표시합니다. 이전 예제와 다른 점은 우선 브이월드 제공 배경지도 중 회색 배경지도를 사용해 통계가 좀 더 확연히 드러나게 수정했습니다. 첨부한 소스 배경지도 설정 부분에 vworldLayer URL주소에 보시면 2d/Base -> 2d/gray로 바뀐 부분을 참고하시면..

leaflet - #10 통계지도 만들기 2편

지난 글에서는 통계용 서울시 행정경계 데이터를 로딩하는 방법을 설명했습니다. 이번에는 이 행정경계에 0에서 100사이의 무작위 값(value)을 부여하고, 값의 범위에 따라 색상을 지정하는 방법을 설명드리겠습니다. 결과는 아래와 같습니다. 주요 코드를 설명 드리면, for (var i in data.features) { var start = 0; var end = 100; var feature = data.features[i]; if (!feature.properties) continue; feature.properties.value = Math.floor((Math.random() * (end - start + 1)) + start); } geojson = L.geoJson(data, { style: ..