나의 전자지도 제작 방법
DH 교육용 위키
목차
나의 전자지도 예시
나의 전자지도 제작 방법
- 전자지도 상에 표시할 관심 지점(Point of Interst, POI)을 정한다.
- 관심 지점의 경위도 좌표를 구한다.
- 구글 맵 상에 찾고자 하는 지점을 검색
- '구글 맵'에 표시된 관심 지점 위에서 마우스 오른쪽 버튼 클릭한 후, "이곳이 궁금한가요?"를 선택
- '구글 맵'이 알려주는 경도, 위도 값을 복사
- 나의 위키 문서에 다음과 같이 CODING
googlemap 요소의 Attributes
- width .... 지도 표시 창의 넓이: 절대값 또는 상대값으로 표시 (400, 600, 100%, 90%)
- height .... 지도 표시 창의 높이: 절대값으로 표시
- lat .... latitude, 표시할 지도 중심부의 위도
- lon .... longitude, 표시할 지도 중심부의 경도
- type .... 표시할 지도의 초기 형태: normal, satellite, hybrid
- zoom .... 축척 0~19
- icon .... 관심 지점 표시에 쓸 아이콘 이미지 URL
googlemap 요소의 Data Value
36.56591, 127.517885, [[청주 이항희 가옥]] -------- ---------- -------------------- 위도 경도 POI 이름 및 링크
가장 간단한 형태 구글 맵 사용 예시
스크립트
<googlemap width="600" height="300" lat="36.56591" lon="127.517885" type="normal" zoom="15" icon="http://maps.google.com/mapfiles/marker.png"> 36.56591, 127.517885, [[청주 이항희 가옥]] </googlemap>
표시
응용
Path
<googlemap lat="37.38" lon="127.099" zoom="12"> 3#00FFFF 37.393512, 127.053715, 1 37.392142, 127.090316, 2 37.357394, 127.081634, 3 37.386235, 127.135188, 4 </googlemap>
- <googlemap> 태그 안의 데이타 영역에서 먼저 선의 굵기 및 색상 값을 입력하고, 그 다음 줄부터 각 지점의 좌표와 이동 순서를 차례로 입력.
- 경로(Path) 표시 속성
- 3#000000 .... 3: 선 굵기, ##00FFFF: 선 색상
Areas
<googlemap lat="37.38" lon="127.099" zoom="12"> 3#00FFFF (80#FFFF00) 37.393512, 127.053715 37.357394, 127.081634 37.386235, 127.135188 37.393512, 127.053715 </googlemap>
- <googlemap> 태그 안의 데이타 영역에서 먼저 구역(Area) 표시 선의 굵기 및 색상 값을 입력하고, 두번째 줄부터 각 지점의 좌표를 차례로 입력.
- 구역(Area) 표시 속성
- 3#00FFFF ..... 3: Path 굵기, #000000: 경로 색상
- (#80FFF00) ..... 80: 투명도(투명도 값: 00 ~ FF), #FFFF00: 구역 내부 색상
Marker 설정하기
<googlemap lat="37.38" lon="127.099" zoom="12" icons="http://digerati.aks.ac.kr/DhLab/2017/111/Tutorials/marker{label}.png"> 3#00FFFF (B) 37.393512, 127.053715, 1 (B) 37.392142, 127.090316, 2 (C) 37.357394, 127.081634, 3 (C) 37.386235, 127.135188, 4 </googlemap>
http://digerati.aks.ac.kr/DhLab/2017/111/Tutorials/markerB.png
http://digerati.aks.ac.kr/DhLab/2017/111/Tutorials/markerC.png
KML 파일 불러오기
<googlemap lat="36.216770" lon="127.613973" type="hybrid" zoom="8"> http://digerati.aks.ac.kr/DhLab/2017/111/Tutorials/E001.kml </googlemap>
※ KML File Source 보기: E001.kml
KML로 내보내기
<googlemapkml article="나의 전자지도 제작 방법">View in Google Earth</googlemapkml>