[swift] Mapbox를 활용한 실시간 위치 기반 자전거 대여 서비스 개발 방법

29 Nov 2023

swift

이번 포스트에서는 Mapbox를 활용하여 실시간 위치 기반 자전거 대여 서비스를 개발하는 방법에 대해 알아보겠습니다.

1. Mapbox API 키 발급

Mapbox를 사용하기 위해서는 먼저 Mapbox API 키를 발급해야 합니다. Mapbox 계정을 생성한 후, 키를 발급받을 수 있습니다. 발급받은 키는 개발 환경에서 API 호출 시 사용됩니다.

2. iOS 프로젝트 설정

Swift를 사용하여 iOS 프로젝트를 개발한다고 가정하겠습니다. 다음은 Mapbox SDK를 iOS 프로젝트에 추가하는 방법입니다.

Cocoapods를 사용하는 경우

프로젝트 폴더에서 Podfile을 엽니다.
Podfile에 다음과 같은 코드를 추가합니다:

platform :ios, '10.0'
use_frameworks!

target 'YourProjectName' do
    pod 'Mapbox-iOS-SDK', '~> 6.2.0'
end

터미널에서 pod install 명령을 실행하여 의존성을 설치합니다.

수동으로 SDK 추가하는 경우

Mapbox SDK 다운로드 페이지에서 최신 버전의 SDK를 다운로드합니다.
다운로드한 SDK를 프로젝트의 적절한 위치에 추가합니다.
Xcode에서 프로젝트를 열고, General 탭의 Embedded Binaries에 추가한 SDK를 선택합니다.

3. Mapbox 지도 표시

자전거 대여 서비스에서 가장 기본적인 기능은 맵에 지도를 표시하는 것입니다. 다음은 Mapbox SDK를 사용하여 지도를 표시하는 방법입니다.

import Mapbox

class MapViewController: UIViewController, MGLMapViewDelegate {

    override func viewDidLoad() {
        super.viewDidLoad()

        let mapView = MGLMapView(frame: view.bounds)
        mapView.autoresizingMask = [.flexibleWidth, .flexibleHeight]

        // API 키 설정
        mapView.accessToken = "YOUR_MAPBOX_API_KEY"

        // 맵 스타일 설정
        mapView.styleURL = MGLStyle.streetsStyleURL

        // 현재 위치 트래킹 활성화
        mapView.showsUserLocation = true

        // 중심 좌표 설정
        mapView.setCenter(CLLocationCoordinate2D(latitude: 37.5665, longitude: 126.9780), zoomLevel: 12, animated: false)

        // 지도를 뷰에 추가
        view.addSubview(mapView)
    }
}

위의 코드를 통해, Mapbox SDK를 사용하여 MapView를 생성하고, API 키를 설정하며, 맵의 스타일과 현재 위치 트래킹을 활성화시키고, 표시할 중심 좌표를 설정하고, 지도를 뷰에 추가합니다.

4. 실시간 자전거 위치 표시

실시간 위치 기반 자전거 대여 서비스에는 자전거 위치를 실시간으로 표시해야합니다. Mapbox SDK는 이를 지원하기 위해 MGLPointAnnotation을 제공합니다.

다음은 자전거 위치를 표시하는 예제입니다.

import Mapbox

class BikeSharingViewController: UIViewController, MGLMapViewDelegate {

    override func viewDidLoad() {
        super.viewDidLoad()

        let mapView = MGLMapView(frame: view.bounds)
        mapView.autoresizingMask = [.flexibleWidth, .flexibleHeight]

        // API 키 설정
        mapView.accessToken = "YOUR_MAPBOX_API_KEY"

        // 맵 스타일 설정
        mapView.styleURL = MGLStyle.streetsStyleURL

        // 현재 위치 트래킹 활성화
        mapView.showsUserLocation = true

        // 중심 좌표 설정
        mapView.setCenter(CLLocationCoordinate2D(latitude: 37.5665, longitude: 126.9780), zoomLevel: 12, animated: false)

        // 지도를 뷰에 추가
        view.addSubview(mapView)

        // 자전거 위치를 표시할 어노테이션 생성
        let bikeAnnotation = MGLPointAnnotation()
        bikeAnnotation.coordinate = CLLocationCoordinate2D(latitude: 37.5657, longitude: 126.9780)
        bikeAnnotation.title = "자전거 위치"
        bikeAnnotation.subtitle = "현재 자전거 이용 가능"

        // 어노테이션을 맵뷰에 추가
        mapView.addAnnotation(bikeAnnotation)
    }
}

위의 코드에서 MGLPointAnnotation을 사용하여 자전거 위치를 표시하고, 이를 맵뷰에 추가합니다.

이제 여러분은 Mapbox를 활용하여 실시간 위치 기반 자전거 대여 서비스를 개발하는 방법을 알게되었습니다. 추가로 자세한 기능과 API 사용 방법은 Mapbox 공식 문서를 참고하시기 바랍니다.