添加带标记的地图

本教程介绍了如何向 iOS 应用添加带标记的简单 Google 地图。适合掌握了 Swift 或 Objective-C 的初级或中级知识并对 Xcode 有一般了解的人士。如需查看地图创建高级指南,请参阅开发者指南。

您将按照本教程创建以下地图。标记位于澳大利亚悉尼。

显示地图上悉尼上方有标记的屏幕截图

获取代码

在 GitHub 上克隆或下载 Google 地图 iOS 示例代码库

或者,点击以下按钮下载源代码:

获取代码

Swift

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

#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 Package Manager

您可以使用 Swift 软件包管理器安装 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 键提取软件包,然后点击 Add Package(添加软件包)。
  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 密钥

为应用添加API密钥

按照以下方法向 AppDelegate.swift 添加 API 密钥:

  1. 请注意,以下 import 语句已添加到该文件中:
    import GoogleMaps
  2. 修改 application(_:didFinishLaunchingWithOptions:) 方法中的以下代码行,将 YOUR_API_KEY 替换为您的 API 密钥:
    GMSServices.provideAPIKey("YOUR_API_KEY")

构建并运行应用

  1. 将 iOS 设备连接到计算机,或者从 Xcode 方案菜单中选择模拟器
  2. 如果您正在使用设备,请确保已启用位置服务。 如果您使用的是模拟器,请从功能菜单中选择一个位置。
  3. 在 Xcode 中,点击 Product/Run 菜单选项(或 play 按钮图标)。
    • Xcode 将构建应用,然后在设备上或在模拟器上运行该应用。
    • 您应该会看到一张带有标记的地图,这张地图以位于澳大利亚东海岸的悉尼为中心,与本页上的图像类似。

问题排查:

  • 如果您没有看到地图,请检查您是否已按照前面的说明获取 API 密钥并将其添加到该应用中。查看 Xcode 的调试控制台,了解与 API 密钥相关的错误消息。
  • 如果您已按 iOS 软件包标识符限制 API 密钥,请修改该密钥,以便添加该应用的软件包标识符: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 会显示信息窗口的内容。如果您愿意使用默认行为,则无需为标记添加点击监听器。

恭喜!您已构建了一个 iOS 应用,该应用显示一张 Google 地图,地图上使用标记来指示特定位置。您还学习了如何使用 Maps SDK for iOS

后续步骤

详细了解地图对象以及标记的用途。