加入含有標記的地圖

本教學課程說明如何在 iOS 應用程式中新增含有標記的簡易 Google 地圖。它適合對 Swift 或 Objective-C 初學者或中級知識的使用者，以及 Xcode 的一般知識。如需建立地圖的進階指南，請參閱開發人員指南。

您會使用本教學課程建立下列地圖。標記位於澳洲雪梨。

取得程式碼

複製或下載 GitHub 上的 Google 地圖 iOS 範例存放區。

您也可以按一下下列按鈕下載原始碼：

提供程式碼

Swift

/*
 * Copyright 2020 Google Inc. All rights reserved.
 *
 *
 * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this
 * file except in compliance with the License. You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software distributed under
 * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF
 * ANY KIND, either express or implied. See the License for the specific language governing
 * permissions and limitations under the License.
 */

import UIKit
import GoogleMaps

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view.
        // 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: self.view.frame, camera: camera)
        self.view.addSubview(mapView)

        // 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

/*
* Copyright 2020 Google Inc. All rights reserved.
*
*
* Licensed under the Apache License, Version 2.0 (the "License"); you may not use this
* file except in compliance with the License. You may obtain a copy of the License at
*
*     http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software distributed under
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF
* ANY KIND, either express or implied. See the License for the specific language governing
* permissions and limitations under the License.
*/

#import "ViewController.h"
#import <GoogleMaps/GoogleMaps.h>

@interface ViewController ()

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
  // Do any additional setup after loading the view.
  // 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];
  GMSMapView *mapView = [GMSMapView mapWithFrame:self.view.frame camera:camera];
  mapView.myLocationEnabled = YES;
  [self.view addSubview:mapView];

  // 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;
}

@end

      

開始使用

Swift 套件管理工具

您可以使用 Swift Package Manager 安裝 Maps SDK for iOS。

1. 確認您已移除所有現有的 Maps SDK for iOS 依附元件。
2. 開啟終端機視窗，然後前往 tutorials/map-with-marker 目錄。
3. 確認 Xcode 工作區已關閉，並執行下列指令：

   sudo gem install cocoapods-deintegrate cocoapods-clean
   pod deintegrate
   pod cache clean --all
   rm Podfile
   rm map-with-marker.xcworkspace

4. 開啟 Xcode 專案，然後刪除 Podfile。
5. 依序前往「File」>「Add Package Dependencies」。
6. 輸入 https://github.com/googlemaps/ios-maps-sdk 做為網址，按下 Enter 來提取套件，然後按一下「新增套件」。
7. 您可能需要透過「File」>「Packages」>「Reset Package Cache」重設套件快取。

使用 CocoaPods

1. 下載並安裝 Xcode 15.0 版或更新版本。
2. 如果您尚未安裝 CocoaPods，請在終端機中執行下列指令，以便在 macOS 上安裝：

   sudo gem install cocoapods

3. 前往 tutorials/map-with-marker 目錄。
4. 執行 pod install 指令。這會安裝 Podfile 中指定的 Maps SDK，以及所有依附元件。
5. 執行 pod outdated，將已安裝的 Pod 版本與任何新的更新進行比較。如果偵測到新版本，請執行 pod update 以更新 Podfile 並安裝最新的 SDK。詳情請參閱 CocoaPods 指南。
6. 開啟 (按兩下) 專案的 map-with-marker.xcworkspace 檔案，在 Xcode 中開啟專案。您必須使用 .xcworkspace 檔案才能開啟專案。

取得 API 金鑰並啟用必要的 API

如想完成本教學課程，請取得具備 Maps SDK for iOS 使用授權的 Google API 金鑰。點選下方按鈕即可取得金鑰並啟用 API。

開始使用

詳情請參閱「取得 API 金鑰」。

Add the API key to your application

將 API 金鑰新增到您的 AppDelegate.swift 中，如下所示：

1. 請注意，檔案已新增下列匯入陳述式：

   import GoogleMaps

2. 在 application(_:didFinishLaunchingWithOptions:) 方法中編輯下列程式碼，並將 YOUR_API_KEY 換成您的 API 金鑰：

   GMSServices.provideAPIKey("YOUR_API_KEY")

注意：教學課程的程式碼範例已設為以 Swift Xcode 專案的形式執行，但包含 Swift 和 Objective-C 範例。

建構並執行應用程式

1. 將 iOS 裝置連線至電腦，或從 Xcode 配置選單中選取模擬工具。
2. 如果你使用裝置，請確認定位服務已啟用。 如果您使用模擬器，請從「Features」(地圖項目) 選單中選取位置。
3. 在 Xcode 中，按一下「Product/Run」選單選項 (或播放按鈕圖示)，
• Xcode 會建構應用程式，然後在裝置或模擬器上執行應用程式。
• 您應該會看到以澳洲東海岸的雪梨為中心的地圖，上面有一個標記，與本頁中的圖片類似。

疑難排解：

• 如未看到地圖，請檢查您是否已按照上述步驟，取得 API 金鑰並加入應用程式。你可以查看 Xcode 的偵錯主控台，查看是否有關於 API 金鑰的錯誤訊息。
• 如果您已按 iOS 軟體包 ID 限制 API 金鑰，請編輯金鑰，加入應用程式的軟體包 ID：com.google.examples.map-with-marker。
• 確認您的 Wi-Fi 或 GPS 連線品質良好。
• 使用 Xcode 偵錯工具查看記錄檔並為應用程式偵錯。

瞭解程式碼

1. 建立地圖，並將其設為 viewDidLoad() 中的檢視畫面。

   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;
         

2. 在 viewDidLoad() 中的地圖加入標記。

   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。

後續步驟

進一步瞭解地圖物件以及標記的用途。