---
title: 지도 컨트롤
---

<script>
    import { Plus, Minus, Diff, Compass, Search, LocateFixed, PersonStanding, Layers } from '@lucide/svelte';
    import DocsNote from '$lib/components/docs/DocsNote.svelte';
    import DocsLayers from '$lib/components/docs/DocsLayers.svelte';
</script>

# { title }

지도 컨트롤은 인터페이스 오른쪽에 위치합니다.
이 컨트롤로 지도를 탐색하고, 확대/축소하고, 다양한 지도 스타일 간 전환을 할 수 있습니다.

### <Diff size="16" class="inline-block" style="margin-bottom: 2px" /> 지도 탐색

상단의 컨트롤로 확대<Plus size="16" class="inline-block" style="margin-bottom: 2px" />·축소<Minus size="16" class="inline-block" style="margin-bottom: 2px" />하고, 지도의 방향과 기울기<Compass size="16" class="inline-block" style="margin-bottom: 2px" />를 바꿀 수 있습니다.

<DocsNote>

<kbd>Ctrl</kbd> 키를 누른 채로 지도를 드래그해도 방향과 기울기를 조절할 수 있습니다.

</DocsNote>

### <Search size="16" class="inline-block" style="margin-bottom: 2px" /> 검색창

검색창을 사용해 주소를 찾고 지도에서 해당 위치로 이동할 수 있습니다.

### <LocateFixed size="16" class="inline-block" style="margin-bottom: 2px" /> 위치 찾기 버튼

위치 찾기 버튼을 누르면 현재 위치를 중심으로 지도가 이동합니다.

<DocsNote>

브라우저와 <b>gpx.studio</b>에 위치 정보 접근을 허용한 경우에만 작동합니다.
    
</DocsNote>

### <PersonStanding size="16" class="inline-block" style="margin-bottom: 2px" /> 스트리트 뷰

이 버튼을 사용하면 지도에서 스트리트 뷰 모드를 켤 수 있습니다.
[설정](./menu/settings)에서 선택한 스트리트 뷰 출처에 따라 스트리트 뷰 이미지를 확인하는 방식이 다릅니다.

- <a href="https://www.mapillary.com/" target="_blank">Mapillary</a>: 지도에 초록색 선으로 스트리트 뷰가 촬영된 구간이 표시됩니다. 충분히 확대하면 초록색 점으로 스트리트 뷰 이미지가 있는 정확한 위치가 표시됩니다. 초록색 점 위에 마우스를 올리면 해당 위치의 스트리트 뷰 이미지가 보입니다.
- <a href="https://www.google.com/streetview/" target="_blank">Google Street View</a>: 지도를 클릭하면 해당 위치의 스트리트 뷰 이미지가 담긴 새 탭이 열립니다.

### <Layers size="16" class="inline-block" style="margin-bottom: 2px" /> 지도 레이어

지도 레이어 버튼을 사용하면 배경 지도를 전환하고, 오버레이와 관심 지점 카테고리를 켜고 끌 수 있습니다.

- **배경 지도**는 세계의 주요 지리적 특징을 보여주는 바탕 지도입니다.
목적에 따라 배경 지도마다 스타일과 상세도가 다르며, 한 번에 하나의 배경 지도만 표시할 수 있습니다.
- **오버레이**는 배경 지도 위에 추가로 표시되어 보완 정보를 제공하는 레이어입니다.
- **관심 지점**은 상점, 식당, 숙박 시설 등 다양한 장소 카테고리를 지도에 표시할 수 있습니다.

<div class="flex flex-col items-center">
<DocsLayers />
<span class="text-sm text-center mt-2">

지도에 마우스를 올리면 지형 배경 지도 위에 <a href="https://hiking.waymarkedtrails.org" target="_blank">Waymarked Trails 하이킹</a> 오버레이가 표시됩니다.

</span>
</div>

**gpx.studio**에는 전 세계 및 지역별 배경 지도와 오버레이가 다양하게 준비되어 있으며, 관심 지점 카테고리도 여러 종류 제공됩니다.
[지도 레이어 설정 대화상자](./menu/settings)에서 활성화할 수 있습니다.

이 설정에서 오버레이의 투명도도 조절할 수 있습니다.

고급 사용자는 <a href="https://en.wikipedia.org/wiki/Web_Map_Tile_Service" target="_blank">WMTS</a>, <a href="https://en.wikipedia.org/wiki/Web_Map_Service" target="_blank">WMS</a>, 또는 <a href="https://maplibre.org/maplibre-style-spec/" target="_blank">MapLibre 스타일 JSON</a> URL을 입력해 사용자 지정 배경 지도와 오버레이를 추가할 수 있습니다.
