ドキュメント / セットアップ / iOS / TomTom

TomTom セットアップ

TomTom Orbis Maps を MapConductor から使う手順です。Android 版と同じ機能を揃えており、Marker・Polyline・Polygon・Circle・GroundImage・RasterLayer・InfoBubble に対応します。

PACKAGE
ios-for-tomtom
API KEY
必要
MIN iOS
16.0
VIEW
TomTomMapView
ほかのプラットフォームAndroidReact

前提

Xcode 15 以上
TomTom Developer Portal の Orbis Maps API キー
デプロイターゲット iOS 16.0 以上
STEP 01

API キーを取得する

TomTom Developer Portal で Orbis Maps 用の API キーを発行します。

STEP 02

TomTom SDK の配信元を足す

TomTom Orbis Maps Display SDK はバイナリの xcframework として TomTom の Artifactory から配布されます。MapConductor のパッケージはそれをバイナリターゲットとして参照するため、アプリ側の Podfile に TomTom のソースを追加します。

PodfileRuby
source 'https://api.tomtom.com/maps-sdk-ios/cocoapods'
STEP 03

Swift Package Manager で追加する

Xcode の File > Add Package Dependencies からパッケージ URL を入力します。

Package URLSwift Package Manager
https://github.com/MapConductor/ios-for-tomtom
Package.swiftSwift
dependencies: [
    .package(url: "https://github.com/MapConductor/ios-sdk-core", from: "1.1.4"),
    .package(url: "https://github.com/MapConductor/ios-for-tomtom", from: "1.0.0"),
],
targets: [
    .target(
        name: "YourApp",
        dependencies: [
            .product(name: "MapConductorCore", package: "ios-sdk-core"),
            .product(name: "MapConductorForTomTom", package: "ios-for-tomtom"),
        ]
    ),
]
STEP 04

API キーを渡す

ビューごとに渡すか、Info.plist に置きます。

ContentView.swiftSwift
// Per view
TomTomMapView(state: state, apiKey: "YOUR_TOMTOM_API_KEY")
Info.plistXML
<key>TomTomAPIKey</key>
<string>YOUR_TOMTOM_API_KEY</string>

動作確認

ここまで動けば完了

地図とマーカーが出れば完了です。draggable なマーカーはそのままドラッグできます。

ContentView.swiftSwiftUI
import SwiftUI
import MapConductorCore
import MapConductorForTomTom

struct ContentView: View {
    @StateObject var state = TomTomMapViewState(
        mapDesignType: TomTomMapDesign.Standard,
        cameraPosition: MapCameraPosition(
            position: GeoPoint(latitude: 52.3676, longitude: 4.9041),
            zoom: 11
        )
    )

    var body: some View {
        TomTomMapView(state: state) {
            Marker(state: MarkerState(
                position: GeoPoint(latitude: 52.3676, longitude: 4.9041),
                icon: DefaultMarkerIcon(label: "Amsterdam"),
                draggable: true
            ))
        }
    }
}

地図デザイン

TomTomMapDesign は Orbis Maps の標準スタイルに対応します。

TomTomMapDesign
Notes
Standard
標準の閲覧向けスタイル
Driving
運転向け
Satellite
衛星画像

うまくいかないとき

地図が真っ白のまま

  • ビューの apiKey か Info.plist の TomTomAPIKey に値が入っているか確認します。
  • デプロイターゲットが iOS 16.0 以上か確認します。

xcframework が見つからない

  • TomTom の SDK はバイナリ配布です。Podfile に TomTom のソースを足したか確認します。

ビルドが通らない

  • ビルドフォルダーをクリアします(Cmd+Shift+K)。
  • ~/Library/Developer/Xcode/DerivedData を削除して再ビルドします。
  • Swift Package Manager の依存を更新します。CocoaPods との併用は避けてください。

次に

TomTom はマーカーのネイティブドラッグを持たないため、MapConductor が MapView のジェスチャを直接処理してドラッグを実装しています。ズームはカメラの緯度を考慮して Google 相当に換算されます。