코딩 강좌/웹 지도 만들기
leaflet - #8 거리와 면적 측정하기 2편
요긴소프트
2022. 1. 29. 21:17
728x90
반응형
지난 글에서 소개해 드린 거리와 면적 측정 기능에 평을 추가하는 방법을 알려드리겠습니다.
어느 때부터인가 평을 공식적으로 쓰지 못하게(?) 되어서 네이버나 카카오 맵에서 평을 확인하려면 번거로운데 여전히 평을 많이 사용하는 환경에서 굳이 기능을 숨겨야 하는지 잘 모르겠습니다.
아래처럼 옵션을 주시면 기존 제곱미터(평방미터) 옆에 평으로 환산된 면적이 표시됩니다.
See the Pen leaflet tutorial #8 by yogin (@yogin) on CodePen.
주요 코드를 설명 드리면
var options = {
primaryLengthUnit: 'meters',
secondaryLengthUnit: 'kilometers',
primaryAreaUnit: 'sqmeters',
secondaryAreaUnit: 'sqpyung',
activeColor: '#E99944',
completedColor: '#DD5145',
units: {
sqpyung: {
factor: 0.3025,
display: '평',
decimals: 2
}
}
};
var measureControl = L.control.measure(options);
measureControl.addTo(map);
이전 코드에서 옵션 부분만 추가되었습니다.
5: 두번째 면적 단위 sqpyung 설정
8~14: 새로운 단위 평(sqpyung) 추가
16: 측정 컨트롤 생성
17: 측정 컨트롤 맵에 추가
1미터가 0.3025 평이므로 factor 값에 지정하고 소수점 2째자리까지 표현하기 위해 decimals에 2 지정합니다.
이렇게 하면 기존 면적 측정결과에 평이 함께 표시됩니다.
728x90
반응형