マーカーが配置された地図を追加する
このチュートリアルでは、Google マップを iOS アプリに追加する方法を説明します。地図には、特定の場所を示すマーカー(ピンとも呼ばれます)が配置されています。
コードを入手する
GitHub から Google マップの iOS サンプル リポジトリをダウンロードするか、そのクローンを作成します。
開発用プロジェクトをセットアップする
Maps SDK for iOS をインストールする手順は次のとおりです。
- Xcode バージョン 14.0 以降をダウンロードしてインストールします。
- CocoaPods をまだインストールしていない場合は、ターミナルから
sudo gem install cocoapods
を実行して macOS にインストールします。 - Google マップの iOS サンプル リポジトリのクローンを作成するかダウンロードします。
tutorials/map-with-marker
ディレクトリに移動します。pod install
コマンドを実行します。これにより、Podfile
で指定された API と、その依存関係がインストールされます。pod outdated
を実行して、インストールされている Pod のバージョンを新しい更新と比較します。新しいバージョンが検出された場合は、pod update
を実行してPodfile
を更新し、最新の SDK をインストールします。詳しくは、CocoaPods のガイドをご覧ください。- プロジェクトの map-with-marker.xcworkspace ファイルを開き(ダブルクリック)して、Xcode で開きます。プロジェクトを開くには、
.xcworkspace
ファイルを使用する必要があります。
API キーを取得して必要な API を有効にする
このチュートリアルを完了するには、Maps SDK for iOS の使用が許可されている Google API キーが必要です。下のボタンをクリックしてキーを取得し、API を有効にしてください。
スタートガイド詳しくは、API キーを取得するをご覧ください。
API キーをアプリに追加する
次のように、API キーを AppDelegate.swift
に追加します。
- ファイルに次のインポート ステートメントが追加されています。
import GoogleMaps
application(_:didFinishLaunchingWithOptions:)
メソッドで次の行を編集し、YOUR_API_KEY を実際の API キーに置き換えます。GMSServices.provideAPIKey("YOUR_API_KEY")
アプリをビルドして実行する
- iOS デバイスをコンピュータに接続するか、Xcode スキームのポップアップ メニューからシミュレータを選択します。
- デバイスを使用している場合は、位置情報サービスが有効になっていることを確認します。 シミュレータを使用している場合は、[機能] メニューからロケーションを選択します。
- Xcode で [Product/Run] メニュー オプション(またはプレイボタン アイコン)をクリックします。
- Xcode がアプリをビルドし、デバイスまたはシミュレータで実行します。
- このページの画像のように、オーストラリア東海岸のシドニーにマーカーが立った地図が表示されます。
トラブルシューティング:
- 地図が表示されない場合は、上記の手順どおりに API キーを取得してアプリに追加していることをご確認ください。Xcode のデバッグ コンソールで、API キーに関するエラー メッセージを確認します。
- API キーを iOS バンドル ID で制限している場合は、キーを編集してアプリのバンドル ID(
com.google.examples.map-with-marker
)を追加します。 - Wi-Fi または GPS の接続状態が良好であることを確認します。
- ログを表示してアプリをデバッグするには、Xcode デバッグツールを使用します。
コードを理解する
- 地図を作成し、
loadView()
でビューとして設定します。Swift
// Create a GMSCameraPosition that tells the map to display the // coordinate -33.86,151.20 at zoom level 6. let camera = GMSCameraPosition.camera(withLatitude: -33.86, longitude: 151.20, zoom: 6.0) let mapView = GMSMapView.map(withFrame: CGRect.zero, camera: camera) view = mapView
Objective-C
// Create a GMSCameraPosition that tells the map to display the // coordinate -33.86,151.20 at zoom level 6. GMSCameraPosition *camera = [GMSCameraPosition cameraWithLatitude:-33.86 longitude:151.20 zoom:6.0]; GMSMapView *mapView = [[GMSMapView alloc] initWithFrame: CGRectZero camera:camera]; self.view = mapView;
loadView()
で地図にマーカーを追加します。Swift
// Creates a marker in the center of the map. let marker = GMSMarker() marker.position = CLLocationCoordinate2D(latitude: -33.86, longitude: 151.20) marker.title = "Sydney" marker.snippet = "Australia" marker.map = mapView
Objective-C
// Creates a marker in the center of the map. GMSMarker *marker = [[GMSMarker alloc] init]; marker.position = CLLocationCoordinate2DMake(-33.86, 151.20); marker.title = @"Sydney"; marker.snippet = @"Australia"; marker.map = mapView;
デフォルトでは、ユーザーがマーカーをタップすると Maps SDK for iOS で情報ウィンドウのコンテンツが表示されます。このデフォルト動作で問題ない場合は、マーカーにクリック リスナーを追加する必要はありません。
これで完了です。特定の場所を示すマーカーが配置された Google マップを表示する iOS アプリが作成されました。また、Maps SDK for iOS の使用方法も確認しました。
次のステップ
マップ オブジェクトと、マーカーを使ってできることについて、詳しく確認します。