KakaoMap

지도를 표시하기 위한 KakaoMap 사용방법.

KakaoMap은 지도, 스카이뷰 및 3D 스카이뷰를 표시할 수 있습니다. Gui, Label, Shape, Route 등 사용자 객체를 추가하여 지도에 추가할 수 있습니다. 그 외 카메라나 기타 지도 옵션을 설정하여 표시할 수 있습니다.

KakaoMap 표시하기


KakaoMap을 표시하기 위해서는 ViewInfoType중 MapviewInfo를 사용합니다. 엔진 초기화 및 시작 이후, 엔진이 렌더링 준비를 마치면 KMControllerDelegate를 통해 addViews를 호출합니다. 이 때 MapviewInfo를 통해 KakaoMap View를 생성할 수 있습니다. MapviewInfo에 지정할 수 있는 property는 다음과 같습니다.

Property Description
viewName 추가할 KakaoMap의 name. 이미 추가한 view중에 중복된 이름이 있으면 추가되지 않는다.
viewInfoName 표시할 baseMap viewInfo의 이름. map / skyview 등이 있다. 지정하지 않을 경우 type에 따른 기본값으로 지정된다.
defaultPosition 초기 위치. 지정하지 않을 경우 기본값은 서울 시청.
defaultLevel 초기 레벨값. 지정하지 않을 경우 17.
enabled 초기 활성화 여부. 지정하지 않을 경우 기본 값은 true.
func addViews() {
	let defaultPosition: MapPoint = MapPoint(longitude: 127.108678, latitude: 37.402001)
        
    // MapviewInfo생성.
    // viewName과 사용할 viewInfoName, defaultPosition과 level을 설정한다.
    let mapviewInfo: MapviewInfo = MapviewInfo(viewName: "mapview", viewInfoName: "map", defaultPosition: defaultPosition, defaultLevel: 7)
        
    // mapviewInfo를 파라미터로 mapController를 통해 생성한 뷰의 객체를 얻어온다.
    // 정상적으로 생성되는 경우 Result.OK, 생성에 실패하는경우 Result.NOK가 리턴된다.
    if mapController?.addView(mapviewInfo) == Result.OK {
        print("OK") 
    }
}

레벨별 표시 정보

KakaoMap의 표시레벨은 0레벨부터 21레벨까지 존재합니다. 각 레벨별로 카메라가 지도를 바라보는 높이값이 계산됩니다. 단, View의 사이즈가 변할 경우 지도에 보여지는 영역이 달라지므로, 레벨별 카메라 높이값이 재계산되어 달라질 수 있습니다. 현재는 한반도가 보이는 레벨인 6레벨부터 지도가 표시되며, 최소 줌레벨도 6레벨로 제한되어 있습니다. 각 레벨별 표시하는 정보는 아래와 같습니다.

6 7 8 9
lv6 lv7 lv8 lv9
10 11 12 13
lv10 lv11 lv12 lv13
14 15 16 17
lv14 lv15 lv16 lv17
18 19 20 21
lv18 lv19 lv20 lv21

BaseMap변경 및 오버레이


KakaoMap은 기본적으로 2D 지도를 base map으로 사용하지만, skyview 혹은 지적편집도로 base map 변경이 가능합니다. 또한, baseMap 위에 교통정보 / 자전거도로 / 로드뷰 라인 등 다양한 종류의 오버레이를 표시할 수 있습니다. 이 부분에 대한 설명은 지도 구성 페이지를 참조하시기 바랍니다.

Margins


KakaoMap은 지도의 여백을 지정할 수 있습니다.

margin_before

예를 들어, 위와 같이 화면 전체가 지도 표시 영역이었다가 UI가 지도 위로 올라올 경우, UI가 지도를 가리면서 지도의 중심점이 맞지 않을 수 있습니다.

margin_before

이 경우, 아래 margin을 설정하면 지도의 중심점을 계산할 때 지도를 가린 UI 만큼은 제외하고 중심점을 계산할 수 있습니다.

카메라


카메라 이동 API, 관련 property를 이용해서 지도를 다양한 방법으로 표시할 수 있습니다. 자세한 설명은 Camera에서 참조할 수 있습니다.

지도 Objects


KakaoMapsSDK는 지도 위에 Label, Shape, Route, Gui 총 4가지 타입의 Object를 표시하는 기능을 제공합니다.

Manager Layer Classes
Shape ShapeManager ShapeLayer PolygonShape, MapPolygonShape, PolylineShape, MapPolylineShape
Route RouteManager RouteLayer Route
Label LabelManager LabelLayer, LodLabelLayer Poi, LodPoi, WaveText
Gui GuiManager SpriteLayer, InfoWindowLayer SpriteGui, InfoWindow

4가지 타입의 view object는 위와 같이 공통적으로 각 타입별 매니저를 통해 관리합니다. Layer단위로 object들을 grouping해서 일종의 폴더처럼 추가/삭제 등 관리할 수 있습니다. Layer를 생성하면 해당 Layer를 통해서 각 object들을 생성할 수 있습니다. 단, Gui는 SpriteLayer, InfoWindow 두 가지의 레이어만 존재하며 사용자가 임의로 추가하거나 제거할 수 없습니다.

렌더링 우선순위

렌더링 순서
Shape 1
Route 2
Label 3
Gui 4

사용자가 API를 통해 추가할 수 있는 Object는 Gui, Label, Route, Shape가 있으며 각 Object type별로 렌더링 순서는 Shape < Route < Label < Gui 이며 이 순서는 고정되어 있습니다. 즉, Label은 Gui위로 그려질 수 없습니다.

각 Object type별로 Layer가 존재하며, 같은 type으로 생성한 Layer는 zOrder 프로퍼티를 통해 렌더링 순서를 조절할 수 있습니다. 예를 들어, ShapeLayer를 여러개 만들어서 각 ShapeLayer별로 zOrder를 다르게 하여 렌더링 순서를 변경할 수 있습니다. 단, Object type별로 우선순위는 고정이 되어있으므로 ShapeLayer의 우선순위를 조정하더라도 다른 Layer(LabelLayer, RouteLayer 등)보다 위에 그려질 수 없습니다.

또한, 각 Layer안에 추가한 Object는 Layer 내에서 zOrder 프로퍼티를 통해 렌더링 우선순위를 조절할 수 있습니다.

Style

Gui를 제외한 사용자가 추가한 Object는 style로 object를 어떻게 표시할지 결정합니다. Style은 객체가 표시될 style을 세부적으로 설정하고, styleID를 부여하여 생성합니다. 이렇게 생성된 style은 각 객체마다 styleID를 통한 참조 형식으로 스타일을 결정하게 됩니다. 예를 들어, Poi를 생성할 때 단위 Poi마다 어떻게 표시될지 심볼을 정하는것이 아니라, 특정 심볼을 사용하는 스타일을 생성 후 Poi에 해당 스타일을 styleID를 통해 지정해주면, 내부적으로 해당 ID를 갖는 style을 참조하여 Poi가 그려집니다.

Style은 레벨별로 표출 스타일을 다르게 지정할 수 있습니다. 단위 스타일 데이터인 PerLevelStyle로 레벨 구간별로 표출 스타일을 구성해서, 하나의 style을 완성할 수 있습니다. 또한, 이러한 style을 여러개를 포함하는 styleSet을 구성할 수도 있습니다.

Style

기본 Style은 위 그림처럼 PerLevelStyle로 구성할 수 있습니다. PerLevelStyle에는 해당 스타일이 표출되기 시작할 level값을 지정할 수 있습니다. 예를 들어, 위 그림처럼 PerLevelStyle을 0,5,15 세가지의 PerLevelStyle로 하나의 style을 구성했다면, 0-4레벨까지는 PerLevelStyle1로, 5-14까지는 PerLevelStyle2로, 15-21까지는 PerLevelStyle3로 표시됩니다. 만약 Style을 level값이 0인 PerLevelStyle 하나로만 구성하면 전 레벨에서 동일한 스타일로 표시할 수 있습니다.

StyleSet

StyleSet은 여러개의 Style로 구성됩니다. 여러개의 Style로 StyleSet을 구성해서, 인덱스로 특정 스타일을 사용하도록 접근할 수 있습니다. StyleSet은 Shape와 Route에서 사용됩니다.

기타 지도 옵션


빌딩 높이, 지도판의 Poi 크기, 언어 설정 등 기타 지도 옵션을 설정할 수 있습니다.

  • 빌딩 높이 : 0~1사이의 Float값으로 지정하며, 값에 따라 지도를 기울였을 때 빌딩의 높이 값을 조절할 수 있습니다.
    let mapView = mapController?.getView("mapview") as? KakaoMap
    mapView?.buildingScale = 1.0
  • 지도판 Poi 크기 : small부터 x-large까지 설정 가능하며, Poi의 글자 크기 및 심볼 크기를 조절할 수 있습니다.
    let mapView = mapController?.getView("mapview") as? KakaoMap
    mapView?.poiScale = .regular
  • 언어 설정 : 한국어, 영어로 언어를 변경할 수 있습니다.
    let mapView = mapController?.getView("mapview") as? KakaoMap
    mapView?.setLanguage("en") // 영어로 언어 변경