위치 표시하기

좌표 표시하기 링크 복사

현재 위치의 카텍(KATEC) 좌표를 표시할 수 있습니다.

예시 코드 좌표 표시하기

private fun showWGS84() {
    activity?.apply {
        mapView.getMapToCenter().let {pos ->
            val point = KATECToWGS84(pos.x.roundToInt(),pos.y.roundToInt())
            val alerts = AlertDialog.Builder(this)
                    .setTitle("현재 위치")
                    .setMessage("longitude: ${point.x}\nlatitude: ${point.y}")
            alerts.setCancelable(true)
            alerts.setNegativeButton("close")
            { dialog, _ ->
                dialog.dismiss()
            }
            alerts.create().show()
        }
    }
}
private fun showWGS84() {
    activity?.apply {
        mapView.getMapToCenter().let {pos ->
            val point = KATECToWGS84(pos.x.roundToInt(),pos.y.roundToInt())
            val alerts = AlertDialog.Builder(this)
                    .setTitle("현재 위치")
                    .setMessage("longitude: ${point.x}\nlatitude: ${point.y}")
            alerts.setCancelable(true)
            alerts.setNegativeButton("close")
            { dialog, _ ->
                dialog.dismiss()
            }
            alerts.create().show()
        }
    }
}

코드가 숨겨졌습니다.

마커 추가하기 링크 복사

KNMapMarker 클래스의 함수를 이용하여 마커를 설정할 수 있습니다. 마커는 사용자가 직접 이미지를 변경하여 사용할 수도 있으며 별도의 설정을 하지 않는 경우 기본 핀 이미지로 표시됩니다.

예시 코드 마커 추가하기

private fun addMarker() {
        KNMapMarker(mapView.coordinate).apply {
            tag = basicLocationMarkerId
            priority = basicLocationMarkerPriority
            // setVisibleRange(.1f, 30f)
            markerMap[tag] = this
            mapView.addMarker(this)
        }
}
private fun addMarker() {
        KNMapMarker(mapView.coordinate).apply {
            tag = basicLocationMarkerId
            priority = basicLocationMarkerPriority
            // setVisibleRange(.1f, 30f)
            markerMap[tag] = this
            mapView.addMarker(this)
        }
}

코드가 숨겨졌습니다.

마커 제거하기 링크 복사

KNMapView 클래스의 removeMarkersAll 함수를 이용하여 추가한 마커를 삭제할 수 있습니다.

예시 코드 마커 제거하기

private fun removeMarker() {
    mapView.removeMarkersAll()
}
private fun removeMarker() {
    mapView.removeMarkersAll()
}

코드가 숨겨졌습니다.

마커 이동하기 링크 복사

KNMapMarker 클래스의 함수를 이용하여 애니메이션 효과와 함께 마커의 위치를 이동할 수 있습니다.

예시 코드 마커 이동하기

private fun moveCoordinateMarker() {
    markerMap[basicLocationMarkerId]?.apply {
        val x = rand.nextInt(-50,50)
        val y = rand.nextInt(-50,50)
        animate(FloatPoint(this.coordinate.x + x, this.coordinate.y + y), 1000L)
    }
}
private fun moveCoordinateMarker() {
    markerMap[basicLocationMarkerId]?.apply {
        val x = rand.nextInt(-50,50)
        val y = rand.nextInt(-50,50)
        animate(FloatPoint(this.coordinate.x + x, this.coordinate.y + y), 1000L)
    }
}

코드가 숨겨졌습니다.

마커 숨기기/보이기 링크 복사

KNMapMarker 클래스의 함수를 이용하여 마커를 숨기거나 다시 나타낼 수 있습니다.

예시 코드 마커 숨기기/보이기

private fun showOrHideMarker() {
    markerMap[basicLocationMarkerId]?.apply {
        this.isVisible = !this.isVisible
    }
}
private fun showOrHideMarker() {
    markerMap[basicLocationMarkerId]?.apply {
        this.isVisible = !this.isVisible
    }
}

코드가 숨겨졌습니다.

커스텀 마커 추가하기 링크 복사

KNMapMarker 클래스의 함수를 이용하여 사용자가 직접 마커의 이미지를 변경하여 사용할 수 있습니다.

예시 코드 커스텀 마커 추가하기

private fun addCustomMarker() {
    if (markerMap.containsKey(customLocationMarkerId)) return
    markerMap[customLocationMarkerId] = KNMapMarker(FloatPoint(mapView.coordinate.x /*+ rand.nextInt(-50, 50)*/, mapView.coordinate.y /*+ rand.nextInt(-50, 50)*/)).apply {
        icon = goalImage
        tag = customLocationMarkerId
        pixelOffset = IntPoint(0, goalImage.height /2)
        mapView.addMarker(this)
    }
}
private fun addCustomMarker() {
    if (markerMap.containsKey(customLocationMarkerId)) return
    markerMap[customLocationMarkerId] = KNMapMarker(FloatPoint(mapView.coordinate.x /*+ rand.nextInt(-50, 50)*/, mapView.coordinate.y /*+ rand.nextInt(-50, 50)*/)).apply {
        icon = goalImage
        tag = customLocationMarkerId
        pixelOffset = IntPoint(0, goalImage.height /2)
        mapView.addMarker(this)
    }
}

코드가 숨겨졌습니다.

마커를 기준으로 화면 맞추기 링크 복사

설정한 마커들을 기준으로 화면을 맞춥니다.

아래는 fitInMarkers() 함수를 생성하여 지도에 표시되는 마커들을 화면에 맞추는 예시 코드입니다. 현재의 좌표 주변으로 난수를 사용하여 여러 개의 마커를 생성하고 KNMapCameraUpdate.fitTo() 함수를 사용하여 애니메이션화된 카메라를 사용하여 초기화된 영역에 맞춥니다.

예시 코드 마커를 기준으로 화면 맞추기

private fun fitInMarkers() {
    val pos = mapView.coordinate
    val markerList = arrayListOf<KNMapMarker>().apply {
        for (i in 0 until 10) {
            val pos2 = FloatPoint(pos.x + rand.nextInt(-60, 60),
                    pos.y + rand.nextInt(-60, 60))
            add(KNMapMarker(pos2))
        }
        mapView.addMarkers(this)
    }

    mapView.animateCamera(KNMapCameraUpdate.fitTo(KNMapCoordinateRegion.initWithMarkers(markerList)),
            1000L, false)
}
private fun fitInMarkers() {
    val pos = mapView.coordinate
    val markerList = arrayListOf<KNMapMarker>().apply {
        for (i in 0 until 10) {
            val pos2 = FloatPoint(pos.x + rand.nextInt(-60, 60),
                    pos.y + rand.nextInt(-60, 60))
            add(KNMapMarker(pos2))
        }
        mapView.addMarkers(this)
    }

    mapView.animateCamera(KNMapCameraUpdate.fitTo(KNMapCoordinateRegion.initWithMarkers(markerList)),
            1000L, false)
}

코드가 숨겨졌습니다.

사용자 위치 이동하기 링크 복사

현재 사용자의 위치를 임의의 장소로 옮겨 표시합니다.

아래는 moveUserLocation() 함수를 생성하여 지도 위의 사용자 위치를 이동시키는 예시 코드입니다. 사용자 위치가 표시되도록 설정한 후, 지도의 좌표와 난수를 사용하여 새로운 위치를 계산하고, 해당 위치와 각도를 애니메이션화하여 지도에 적용합니다. withCamera 변수의 값에 따라 카메라 애니메이션 또는 위치 및 각도 애니메이션을 선택적으로 수행합니다.

예시 코드 사용자 위치 이동하기

private fun moveUserLocation() {
    mapView.userLocation?.apply {
        isVisible = true
        val pos = FloatPoint(mapView.coordinate.x + rand.nextInt(-50, 50), mapView.coordinate.y + rand.nextInt(-50, 50))
        val angles = (angle + rand.nextInt(0, 50)) % 360
        if (withCamera) {
            mapView.animateCamera(KNMapCameraUpdate.targetTo(pos).bearingTo(angles),500L, true)
        } else {
            animate(pos, angles)
        }
        withCamera = !withCamera
    }
}
private fun moveUserLocation() {
    mapView.userLocation?.apply {
        isVisible = true
        val pos = FloatPoint(mapView.coordinate.x + rand.nextInt(-50, 50), mapView.coordinate.y + rand.nextInt(-50, 50))
        val angles = (angle + rand.nextInt(0, 50)) % 360
        if (withCamera) {
            mapView.animateCamera(KNMapCameraUpdate.targetTo(pos).bearingTo(angles),500L, true)
        } else {
            animate(pos, angles)
        }
        withCamera = !withCamera
    }
}

코드가 숨겨졌습니다.

마커에 말풍선 표시하기 링크 복사

KNMapCalloutBubbleUpdate 클래스를 사용하여 마커에 표시될 말풍선을 생성할 수 있습니다. 말풍선의 제목, 부제목을 입력하고 글자 폰트, 글자 크기, 글자 색상 등을 설정할 수도 있습니다.

예시 코드 마커에 말풍선 표시하기

fun markersWithBubbleAdd(mapView: KNBaseMapView, title: String, subString: String? = null): KNMapMarker {
    clearAllObject(mapView)
    val pos = mapView.coordinate// ?: FloatPoint(321397.72f, 532790.94f)
    return KNMapMarker(FloatPoint(pos.x + rand.nextInt(-1000, 1000),
            pos.y + rand.nextInt(-1000, 1000))).apply {
        callOutBubbleUpdate = KNMapMarker.KNMapCalloutBubbleUpdate.Builder()
                .setTitle(title)
                .setSubTitle(subString)
                .setTitleFontColor(Color.RED)
                .setSubTitleFontColor(Color.MAGENTA)
                .build()
        isVisibleCalloutBubble = true
        mapView.addMarker(this)
    }
}
fun markersWithBubbleAdd(mapView: KNBaseMapView, title: String, subString: String? = null): KNMapMarker {
    clearAllObject(mapView)
    val pos = mapView.coordinate// ?: FloatPoint(321397.72f, 532790.94f)
    return KNMapMarker(FloatPoint(pos.x + rand.nextInt(-1000, 1000),
            pos.y + rand.nextInt(-1000, 1000))).apply {
        callOutBubbleUpdate = KNMapMarker.KNMapCalloutBubbleUpdate.Builder()
                .setTitle(title)
                .setSubTitle(subString)
                .setTitleFontColor(Color.RED)
                .setSubTitleFontColor(Color.MAGENTA)
                .build()
        isVisibleCalloutBubble = true
        mapView.addMarker(this)
    }
}

코드가 숨겨졌습니다.

동작하기

화면 테마 설정하기