向 iOS 应用添加地图 (Objective-C)

1. 准备工作

摘要

在此 Codelab 中，您将学习开始使用 Google Maps Platform 通过 Objective-C 构建 iOS 应用需知的内容。您将学习所有基础知识，从准备工作到加载 Maps SDK for iOS、显示您的第一个地图、使用标记和标记聚类、在地图上绘图，以及处理用户互动等，面面俱到。

要构建的内容

在此 Codelab 中，您将构建 iOS 应用，用于执行以下操作：

• 加载 Maps SDK for iOS 和 Maps SDK for iOS 实用程序库
• 显示以澳大利亚悉尼为中心的地图
• 显示悉尼周围 100 个地点的自定义标记
• 实施标记聚类
• 启用用户互动功能，这样，当用户点击标记时，能够重新设置中心并在地图上绘制圆形区域

要学习的内容

• Google Maps Platform 使用入门
• 加载 Maps SDK for iOS 和 Google Maps SDK for iOS 实用程序库
• 加载地图
• 使用标记、自定义标记和标记聚类
• 使用 Maps SDK for iOS 事件系统提供用户互动功能
• 以编程方式控制地图
• 在地图上绘图

前提条件

您必须熟悉以下各项内容，才能完成此 Codelab。如果您已经能够熟练使用 Google Maps Platform，请直接跳到该 Codelab！

所需的 Google Maps Platform 产品

在此 Codelab 中，您将使用以下 Google Maps Platform 产品：

• Maps SDK for iOS
• Google Maps SDK for iOS 实用程序库

开始使用 Google Maps Platform

如果您之前从未使用过 Google Maps Platform，请参阅 Google Maps Platform 使用入门指南或观看 Google Maps Platform 使用入门播放列表中的视频，完成以下步骤：

1. 创建一个结算帐号。
2. 创建一个项目。
3. 启用所需的 Google Maps Platform API 和 SDK（已在上一节中列出）。
4. 生成一个 API 密钥。

注意：您需要登录现有 Google 帐号，或者在注册过程中创建一个新帐号。

完成此 Codelab 的其他要求

要完成此 Codelab，您需要以下帐号、服务和工具：

• 已启用结算功能的 Google Cloud Platform 帐号
• 已启用 Maps SDK for iOS 的 Google Maps Platform API 密钥
• Objective-C 基础知识
• Xcode 12.0，目标 SDK 为 12.0 或更高版本

2. 进行设置

要完成下面的启用步骤，您需要启用 Maps SDK for iOS。

设置 Google Maps Platform

如果您还没有已启用结算功能的 Google Cloud Platform 帐号和项目，请参阅 Google Maps Platform 使用入门指南，创建结算帐号和项目。

1. 在 Cloud Console 中，点击项目下拉菜单，选择要用于此 Codelab 的项目。

2. 在 Google Cloud Marketplace 中启用此 Codelab 所需的 Google Maps Platform API 和 SDK。为此，请按照此视频或此文档中的步骤操作。
3. 在 Cloud Console 的凭据页面中生成 API 密钥。您可以按照此视频或此文档中的步骤操作。向 Google Maps Platform 发出的所有请求都需要 API 密钥。

项目入门模板设置

在开始此 Codelab 之前，请按照下列步骤下载入门项目模板以及完整的解决方案代码：

1. 请访问 https://github.com/googlecodelabs/maps-platform-101-objc，下载此 Codelab 的 GitHub 代码库或创建分支。

StarterApp 项目位于 /starter 目录，其中包含完成此 Codelab 所需的基本文件结构。您需要的所有内容均位于 /starter/StarterApp 目录中。

如果您想查看正在运行的完整解决方案代码，可完成上述设置步骤，然后在 /solution/SolutionApp 目录中查看解决方案。

3. 安装 Maps SDK for iOS

要使用 Maps SDK for iOS，第一步是安装所需的依赖项。此过程有两个步骤：通过 Cocoapods 依赖项管理器安装 Maps SDK for iOS 和 Maps SDK for iOS 实用程序库，和向 SDK 提供 API 密钥。

1. 将 Maps SDK for iOS 和 Maps SDK for iOS 实用程序库添加到 Podfile。

在此 Codelab 中，您会同时用到 Maps SDK for iOS 和 Maps iOS 实用程序库，前者提供 Google 地图的所有核心功能，后者提供各种实用程序（包括标记聚类）丰富您的地图内容。

首先，在 Xcode（或您首选的文本编辑器）中打开 Pods > Podfile，并更新该文件，使之在 use_frameworks! 下添加 Maps SDK for iOS 和实用程序库依赖项：

pod 'GoogleMaps'
pod 'Google-Maps-iOS-Utils'

2. 安装 Maps SDK for iOS 和 Maps SDK for iOS 实用程序库 Pod。

如需安装依赖项，请通过命令行在 /starter 目录中运行 pod install。CocoaPods 将自动下载依赖项，并创建 StarterApp.xcworkspace。3. 安装依赖项后，在 Xcode 中打开 StarterApp.xcworkspace，然后通过按 Command+R 的方式在 iPhone 模拟器中运行应用。如果一切设置正确无误，模拟器将启动并显示黑屏。不用担心，因为您尚未构建任何内容，所以黑屏是正常现象！4. 在 AppDelegate.h 中导入 SDK。

现在您已安装了依赖项，可以向 SDK 提供 API 密钥了。请首先以依赖项的方式导入 Maps SDK for iOS，具体方法是将以下代码置于 #import "AppDelegate.h" import 语句下：

@import GoogleMaps;

5. 在 iOS SDK import 语句下方，声明一个 NSString 常量并将值设为您的 API 密钥：

static NSString *const kMapsAPIKey = @"YOUR API KEY";

6. 在 application: didFinishLaunchingWithOptions: 中的 GMSServices 上调用 provideAPIKey，将 API 密钥传递给 iOS SDK：

- (BOOL)application:(UIApplication *)application
    didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
  [GMSServices provideAPIKey:kMapsAPIKey];
  return YES;
}

更新后的 AppDelegate.m 文件现在应如下所示：

#import "AppDelegate.h"
@import GoogleMaps;

static NSString *const kMapsAPIKey = @"YOUR API KEY";

@implementation AppDelegate

- (BOOL)application:(UIApplication *)application
    didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
  [GMSServices provideAPIKey:kMapsAPIKey];
  return YES;
}
@end

您的 Podfile 应如下所示：

source 'https://github.com/CocoaPods/Specs.git'
platform :ios, '11.0'

target 'StarterApp' do
  use_frameworks!

pod 'GoogleMaps', '5.1.0.0'
pod 'Google-Maps-iOS-Utils', '3.4.0'

end

现在您已安装好依赖项并提供了 API 密钥，可以开始调用 Maps SDK for iOS 了。

4. 显示地图

是时候显示您的第一个地图了！

Maps SDK for iOS 中最常用的部分是 GMSMapView 类，它提供了许多可让您创建和操纵地图实例的方法。具体步骤如下：

1. 打开 ViewController.m。

您将在此处完成此 Codelab 的所有剩余操作。您会发现已为您弃用了视图控制器的 loadView 和 viewDidLoad 生命周期事件。2. 通过在文件顶部添加以下代码，导入 Maps SDK for iOS：

@import GoogleMaps;

3. 声明用于存储 GMSMapView 的实例变量 ViewController。

在此 Codelab 的整个过程中，GMSMapView 的实例将是您使用的主要对象，您将在各种视图控制器生命周期方法中引用该对象，并在其上执行操作。要提供该实例，请更新 ViewController 的实施，以声明一个用于存储该实例的实例变量：

@implementation ViewController {
  GMSMapView *_mapView;
}

4. 在 loadView 中，创建 GMSCameraPosition 的实例。

GMSCameraPosition 可定义地图的中心位置以及显示时的缩放级别。以下代码会调用 cameraWithLatitude:longitude:zoom: 方法，将地图中心设为澳大利亚悉尼，纬度为 -33.86，经度为 151.20，缩放级别为 12：

GMSCameraPosition *camera = [GMSCameraPosition cameraWithLatitude:-33.86 longitude:151.20 zoom:12];

5. 在 loadView 中，创建 GMSMapView 的实例，以实例化地图。

要创建新的地图实例，请调用 mapWithFrame:camera:。请注意帧是如何设为 CGRectZero 的，这是一个来自 iOS CGGeometry 库的全局变量，会指定一个宽度为 0、高度为 0 且位于视图控制器内 (0,0) 位置的帧。相机已设在您刚刚创建的相机位置上。

要实际显示地图，接下来需要将视图控制器的根视图设置为 _mapview，它会让地图以全屏方式显示。

_mapView = [GMSMapView mapWithFrame:CGRectZero camera:camera];
self.view = _mapView;

6. 将 GMSMapViewDelegate 设置为视图控制器。

实施后，地图视图代理可让您处理来自 GMSMapView 实例上用户互动的事件，后续步骤中您会需要使用这些事件。

首先，更新 ViewController 的接口，以遵循 GMSMapViewDelegate: 的协议。

@interface ViewController ()<GMSMapViewDelegate>

接下来，添加以下代码以将 GMSMapViewDelegate 设置为 ViewController。

_mapView.delegate = self;

现在，请（通过按 Command+R 的方式）在 iOS 模拟器中重新加载应用，地图应该就显示出来了！

回顾一下，在此步骤中，您通过创建 GMSMapView 的实例，显示了一个以澳大利亚悉尼市为中心的地图。

您的 ViewController.m 文件现在应如下所示：

#import "ViewController.h"
#import "LocationGenerator.h"
@import GoogleMaps;

@interface ViewController ()<GMSMapViewDelegate>
@end

@implementation ViewController {
  GMSMapView *_mapView;
}

- (void)loadView {
  [super loadView];
  GMSCameraPosition *camera = [GMSCameraPosition cameraWithLatitude:-33.86 longitude:151.20 zoom:12];
  _mapView = [GMSMapView mapWithFrame:CGRectZero camera:camera];
  self.view = _mapView;
  _mapView.delegate = self;
}

5. 云端地图样式设置（可选）

您可以使用云端地图样式设置自定义地图样式。

创建地图 ID

如果您尚未使用关联的地图样式创建地图 ID，请参阅地图 ID 指南完成以下步骤：

1. 创建地图 ID。
2. 将地图 ID 与地图样式相关联。

注意：在 Maps SDK for Android 或 Maps SDK for iOS 上使用地图 ID 会触发地图加载，而此地图加载会针对动态地图 SKU 进行收费。如需了解详情，请参阅 Google 地图结算。

为您的应用添加地图 ID

要使用您在上一步中创建的地图 ID，请打开 ViewController.m 文件，然后在 loadView 方法中创建一个 GMSMapID 对象并为其提供地图 ID。接下来，通过提供 GMSMapID 对象作为参数来修改 GMSMapView 实例化。

ViewController.m

- (void)loadView {
    GMSMapID *mapID = [[GMSMapID alloc] initWithIdentifier:@"YOUR_MAP_ID"];
    _mapView = [GMSMapView mapWithFrame:CGRectZero mapID:mapID camera:camera];
    // ...
}

完成上述操作后，继续并运行应用，以您选择的样式查看您的地图！

6. 向地图添加标记

虽然开发者可以借助 Maps SDK for iOS 执行很多操作，但是在地图上添加标记绝对是最受欢迎的操作。借助标记，您可以在地图上显示特定点，并且标记是最常用的处理用户互动的界面元素。如果之前使用过 Google 地图，那么您可能熟悉默认标记，如下所示：

在这一步中，您将学习如何使用 GMSMarker 类在地图上放置标记。

请注意，在通过视图控制器的 loadView 生命周期事件中的上一步加载地图之前，您无法在地图上放置标记，因此您要在 viewDidLoad 生命周期事件中完成这些步骤，该事件会在视图（和地图）加载完成后调用。

1. 定义 CLLocationCoordinate2D 对象。

CLLocationCoordinate2D 是 iOS CoreLocation 库提供的结构体，用于定义位于一组纬度和经度上的地理位置。要开始创建您的第一个标记，请定义 CLLocationCoordinate2D 对象，并将纬度和经度设置为地图中心。您可使用 camera.target.latitude 和 camera.target.longitude 属性从地图视图中访问地图中心的坐标。

CLLocationCoordinate2D mapCenter = CLLocationCoordinate2DMake(_mapView.camera.target.latitude, _mapView.camera.target.longitude);

2. 创建 GMSMarker 的实例。

Maps SDK for iOS 提供 GMSMarker 类。GMSMarker 的每个实例都代表地图上的一个标记，且创建实例时，采取了调用 markerWithPosition: 并向实例传递 CLLocationCoordinate2D 对象以告知 SDK 应在地图何处放置标记的方式。.

GMSMarker *marker = [GMSMarker markerWithPosition:mapCenter];

3. 设置自定义标记图标。

Google 地图的默认红色图钉标记非常不错，但对地图进行自定义也是如此！幸运的是，通过 Maps SDK for iOS 使用自定义标记非常简单。您会发现 StarterApp 项目包含一个名为“custom_pin.png”的图片，供您使用，但您也可使用自己想要的任何图片。

要设置自定义标记，请将标记的 icon 属性设置为 UIImage 的实例。

marker.icon = [UIImage imageNamed:@"custom_pin.png"];

4. 将标记渲染到地图上。

此时，您的标记已创建完毕，但您会发现它并未显示在地图上。为此，请将 GMSMarker 实例的 map 属性设置为 GMSMapView 的实例。

marker.map = _mapView;

现在重新加载应用，即可看到自己的第一个带标记的地图了！

回顾一下，在此部分中，您创建了一个 GMSMarker 类的实例，并将其应用到地图视图，成功地在地图上显示出标记。ViewController.m 中更新后的 viewDidLoad 生命周期事件现在应如下所示：

- (void)viewDidLoad {
  [super viewDidLoad];

  CLLocationCoordinate2D mapCenter = CLLocationCoordinate2DMake(_mapView.camera.target.latitude, _mapView.camera.target.longitude);
  GMSMarker *marker = [GMSMarker markerWithPosition:mapCenter];
  marker.icon = [UIImage imageNamed:@"custom_pin.png"];
  marker.map = _mapView;
}

7. 启用标记聚类

使用多个标记或标记彼此靠得很近时，您可能会遇到如下问题：标记重叠或看起来过于拥挤，导致用户体验不佳。例如，如果两个标记相互非常接近，那么您可能会遇到如下情况：

这正是标记聚类的用武之地。标记聚类是另一种经常实施的地图项，它将临近的标记组合为单一图标，并且该图标能够随缩放级别而改变，如下所示：

标记聚类算法会将地图的可见区域划分为网格，然后聚集位于同一单元格的图标。幸运的是，您不必为任何此类操作担心，因为 Google Maps Platform 团队创建了一个实用的开源实用程序库，名为 Google Maps SDK for iOS 实用程序库。除了许多其他功能之外，这个实用程序库还会自动为您处理标记聚类。要详细了解标记聚类，请参阅 Google Maps Platform 文档，也可以在 GitHub 上查看 iOS 实用程序库的源代码。

1. 向地图添加更多标记。

要了解标记聚类的实际运作情况，您需要在地图上放置大量标记。为了化繁为简，我们在 LocationGenerator.m 的入门项目中提供了一个便利的标记生成器。

要向地图添加自己所需的任意数量的标记，只需调用上一步代码下的视图控制器 viewDidLoad 生命周期中的 generateMarkersNear:count:。该方法会在 CLLocationCoordinate2D 对象中指定坐标周围的随机位置创建 count 中指定的标记个数。在这种情况下，只需将前面创建的 mapCenter 变量传递给该对象即可。系统会以 NSArray 形式返回标记。

NSArray<GMSMarker *> *markerArray = [LocationGenerator generateMarkersNear:mapCenter count:100];

2. 导入 Google Maps SDK for iOS 实用程序库。

要将 Maps iOS 实用程序库以依赖项的形式添加到您的项目中，请将以下代码添加到 ViewController.m 顶部的依赖项列表中：

@import GoogleMapsUtils;

3. 配置标记聚类器。

要使用标记聚类器，您需要提供三项内容来配置其运行方式：聚类算法、图标生成器和渲染程序。聚类算法用于确定标记的聚类行为，例如要在同一聚类中添加的标记之间的距离。图标生成器会提供要在不同缩放级别使用的聚类图标。渲染程序可处理地图上聚类图标的实际渲染。

如果您愿意，也可以从头开始编写上述所有程序，不过 Maps iOS 实用程序库提供了默认的实施，以简化这一过程。您只需添加以下代码：

id<GMUClusterAlgorithm> algorithm = [[GMUNonHierarchicalDistanceBasedAlgorithm alloc] init];

id<GMUClusterIconGenerator> clusterIconGenerator = [[GMUDefaultClusterIconGenerator alloc] init];

id<GMUClusterRenderer> renderer = [[GMUDefaultClusterRenderer alloc] initWithMapView:_mapView clusterIconGenerator:clusterIconGenerator];

4. 创建 GMUClusterManager 的实例。

GMUClusterManager 是使用您指定的算法、图标生成器和渲染程序实施标记聚类的类。要创建渲染程序并提供给地图视图使用，请先向 ViewController 实施添加实例变量，以存储聚类管理器实例：

@implementation ViewController {
  GMSMapView *_mapView;
  GMUClusterManager *_clusterManager;
}

然后，在 viewDidLoad 生命周期事件中创建 GMUClusterManager 的实例：

_clusterManager = [[GMUClusterManager alloc] initWithMap:_mapView algorithm:algorithm renderer:renderer];

5. 添加标记并运行标记聚类器。

现在，您的标记聚类器实例已配置完毕，您只需调用 addItems: 将要加入聚类的标记数组传递给聚类管理器，然后调用 cluster 来运行聚类器即可。

[_clusterManager addItems:markerArray];
[_clusterManager cluster];

请重新加载您的应用，现在，您应该会看到大量标记都已进行了妥当的聚类。接下来，您可以在地图上进行双指张合和缩放操作，尝试不同的缩放级别，看看标记聚类随着您放大/缩小而调整的情况。

回顾一下，在此步骤中，您配置了 Google Maps SDK for iOS 实用程序库中的标记聚类器的实例，然后使用该实例将地图上的 100 个标记进行了聚类。ViewController.m 中的 viewDidLoad 生命周期事件现在应如下所示：

- (void)viewDidLoad {
  [super viewDidLoad];

  CLLocationCoordinate2D mapCenter = CLLocationCoordinate2DMake(_mapView.camera.target.latitude,
                                                                _mapView.camera.target.longitude);
  GMSMarker *marker = [GMSMarker markerWithPosition:mapCenter];
  marker.icon = [UIImage imageNamed:@"custom_pin.png"];
  marker.map = _mapView;
  NSArray<GMSMarker *> *markerArray = [LocationGenerator generateMarkersNear:mapCenter count:100];

  id<GMUClusterAlgorithm> algorithm = [[GMUNonHierarchicalDistanceBasedAlgorithm alloc] init];
  id<GMUClusterIconGenerator> clusterIconGenerator = [[GMUDefaultClusterIconGenerator alloc] init];
  id<GMUClusterRenderer> renderer = [[GMUDefaultClusterRenderer alloc] initWithMapView:_mapView clusterIconGenerator:clusterIconGenerator];
  _clusterManager = [[GMUClusterManager alloc] initWithMap:_mapView algorithm:algorithm renderer:renderer];

  [_clusterManager addItems:markerArray];
  [_clusterManager cluster];
}

8. 添加用户互动

您现在有一个精美地图，不仅显示着各种标记，还使用了标记聚类。在此步骤中，您将利用（之前已设为视图控制器的）GMSMapViewDelegate 对用户互动添加一些额外处理，以改善地图的用户体验。

Maps SDK for iOS 提供通过地图视图代理实施的全面事件系统，其中包含可让您在各种用户互动出现时执行代码的事件处理脚本。例如，地图视图代理包含各种方法，可让您触发互动（例如，用户点击地图和标记、平移地图的视图、放大和缩小等）的代码执行。

在此步骤中，您可通过编程方式实现地图平移，以将地图中心设置为用户点按的任何标记。

1. 实施标记点按监听器。

每当用户点按您之前创建的其中一个标记以及点按标记聚类时（在内部会将标记聚类实施为 GMSMarker 的实例），系统就会调用 mapView:didTapMarker。

要实施事件监听器，请先在 end 语句前的 ViewController.m 的底部将事件监听器移出。

您会注意到此方法将返回 NO。此操作会指示 iOS SDK 在执行完事件处理脚本代码后继续执行默认的 GMSMarker 功能，例如显示信息窗口（如果已配置）。

- (BOOL)mapView:(GMSMapView *)mapView didTapMarker:(GMSMarker *)marker {

  return NO;
}

2. 处理点按事件，并在用户点按标记或标记聚类时，为相机添加动画效果以重新设置地图中心。

mapView:didTapMarker 在被调用时会传递已点按的 GMSMarker 的实例，从而让您在代码中对其进行处理。您可以使用该实例重新设置地图的中心，具体方法是从事件处理脚本内部调用地图视图上的 animateToLocation:，并向其传递标记实例的位置（在 position 属性中提供）。

[_mapView animateToLocation:marker.position];

3. 放大被点按的标记聚类。

一种常见的用户体验模式是，用户点按标记聚类时，放大所点按的标记聚类。这可让用户查看加入聚类的标记，因为聚类将在较低的缩放级别展开。

如前所述，标记聚类图标实际上只是带有自定义图标的 GMSMarker 的实施。那么该如何判断用户是否点按了标记或标记聚类呢？当标记聚类器管理器创建新的聚类图标时，它会实施 GMSMarker 的实例以遵循名为 GMUCluster. 的协议。您可以使用条件语句来检查传递到事件处理脚本的标记是否遵循了此协议。

在通过编程方式获知聚类已被点按的情况后，您就可以在地图视图实例上调用 animateToZoom:，并将缩放级别设为当前级别加 1。当前的缩放级别可在 camera.zoom 属性中的地图视图实例上使用。

另外，请注意以下代码是如何返回 YES 的。这会告知事件处理脚本您已完成事件的处理，以及不要执行处理脚本中的任何其他代码了。这样做的原因之一是防止底层 GMSMarker 对象执行其余的默认行为，例如显示信息窗口，这些行为在用户点按聚类图标时并没有太大意义。

if ([marker.userData conformsToProtocol:@protocol(GMUCluster)]) {
    [_mapView animateToZoom:_mapView.camera.zoom +1];
    return YES;
}

现在重新加载应用，并点按一些标记和标记聚类。无论您点按其中哪一种，地图都会将所点按的元素设置为地图中心。当点按标记聚类时，地图还会放大一个级别，同时标记聚类将展开，以显示归属此聚类的标记。

回顾一下，在此步骤中，您实施了标记点按监听器，并处理了该事件以将点按的元素重设为地图中心，且在所点按的元素是标记聚类图标的情况下进行放大。

您的 mapView:didTapMarker 方法应如下所示：

- (BOOL)mapView:(GMSMapView *)mapView didTapMarker:(GMSMarker *)marker {
  [_mapView animateToLocation:marker.position];

  if ([marker.userData conformsToProtocol:@protocol(GMUCluster)]) {
    [_mapView animateToZoom:_mapView.camera.zoom +1];
    return YES;
  }

  return NO;
}

9. 在地图上绘制

到目前为止，您已创建了悉尼地图，在 100 个随机点显示了标记并处理了用户互动。在此 Codelab 的最后一步中，您将使用 Maps SDK for iOS 的绘图功能，为您的地图体验添加其他实用地图项。

想象一下，此地图将供希望探索悉尼这座城市的用户使用。实用地图项旨在直观展示所点击标记周围一定半径的区域。这样，用户便可以轻松了解从所点击的标记可以轻松步行至其他哪些目的地。

iOS SDK 包括一组用于在地图上绘制形状（例如方形、多边形、线条和圆形）的函数。接下来，您将渲染一个圆形，当用户点击标记时，在该标记周围显示半径为 800 米（大约半英里）的区域。

1. 将 _circ 实例变量添加到 ViewController 的实施中。

此实例变量将用于保存最近绘制的圆形，以便可在绘制其他圆形之前将其销毁。毕竟，它对用户没有太大帮助，并且如果每个点按的标记周围都有绘制的圆形，外观上也会很难看！

为此，请按如下所示更新 ViewController 的实施：

@implementation ViewController {
  GMSMapView *_mapView;
  GMUClusterManager *_clusterManager;
  GMSCircle *_circ;
}

2. 当用户点按标记时绘制圆形区域。

在 mapView:didTapMarker 方法的底部，添加下列代码创建 iOS SDK 的 GMSCircle 类的实例，以便绘制一个新的 800 米半径的圆形标记，具体方法是调用 circleWithPosition:radius: 并向其传递所点按标记的位置，一如您在上文重新设置地图中心时的操作。

_circ = [GMSCircle circleWithPosition:marker.position radius:800];

3. 设置圆形样式。

默认情况下，GMSCircle 会绘制一个带黑色描边和透明填充效果的圆形。这非常适合显示半径，但外观并不好看，而且有点不太显眼。接下来，通过向圆形的 fillColor 属性分配 UIColor 的方式，为圆形提供填充色，以改善样式。以下代码将添加透明度为 50% 的灰色填充效果：

_circ.fillColor = [UIColor colorWithRed: 0.67 green: 0.67 blue: 0.67 alpha: 0.5];

4. 对地图上的圆形进行渲染。

和前面创建标记时一样，您会发现仅创建 GMSCircle 的实例并不会使圆形显示在地图上。要显示圆形，只需将地图视图实例分配给圆形的 map 属性即可。

_circ.map = _mapView;

5. 移除之前渲染的所有圆形。

如前所述，一味在地图上添加圆形并不能带来良好的用户体验。要移除上一个点按事件所渲染的圆形，请将 _circ 的 map 属性设为 mapView:didTapMarker 顶部的 nil。

_circ.map = nil;

请重新加载应用，然后点按某个标记。每当点按标记时，您都应该会看到一个新的绘制圆形，且之前渲染的所有圆形均已移除。

回顾一下，在此步骤中，您使用 GMSCircle 类在每次用户点按标记时渲染了圆形。

您的 mapView:didTapMarker 方法应如下所示：

- (BOOL)mapView:(GMSMapView *)mapView didTapMarker:(GMSMarker *)marker {
  _circ.map = nil;
  [_mapView animateToLocation:marker.position];

  if ([marker.userData conformsToProtocol:@protocol(GMUCluster)]) {
    [_mapView animateToZoom:_mapView.camera.zoom +1];
    return YES;
  }

  _circ = [GMSCircle circleWithPosition:marker.position radius:800];
  _circ.fillColor = [UIColor colorWithRed: 0.67 green: 0.67 blue: 0.67 alpha: 0.5];
  _circ.map = _mapView;
  return NO;
}

10. 恭喜

您已成功使用 Google Maps Platform 构建了第一个 iOS 应用，包括加载 Maps SDK for iOS、加载地图、使用标记、控制地图、在地图上绘图以及添加用户互动。

要查看已完成的代码，请在 /solution 目录中查看完成的项目。

后续操作

在此 Codelab 中，我们仅介绍了您可以使用 Maps SDK for iOS 执行的基本操作。接下来，请尝试为地图添加下面的部分地图项：

• 更改地图类型，以显示卫星地图、混合地图和地形地图。
• 自定义其他用户互动，例如缩放和地图控件。
• 添加信息窗口，以便在用户点击标记时显示信息。
• 查看 Places SDK for iOS，向您的应用添加丰富的 Google Maps Platform 地点地图项和数据。

要继续了解使用网页版 Google Maps Platform 的更多方式，请访问以下链接：

• Maps SDk for iOS 文档
• Google Maps Platform YouTube 频道
• Google Maps Platform Codelab
• GitHub 上的 Google Maps Platform 开源项目