添加地图

请选择平台: Android iOS JavaScript

在 API 中,地图由 GMSMapView 类表示, UIView 的子类。地图是 Google 地球中最重要的对象 Maps SDK for iOS,并提供了必要的方法来添加和移除 以及管理其他对象,例如标记和多段线。

简介

借助 Maps SDK for iOS,您可以在 iOS 应用这些地图和您在其中看到的地图具有相同的外观 Google 地图 iOS 应用,并且该 SDK 提供了许多相同的功能。

除了地图绘制功能外,该 API 还支持 与 iOS 界面模型保持一致的交互。例如,您可以通过定义可响应用户手势(如点按和双击)的响应器来设置与地图的交互。

使用地图对象时的关键类是 GMSMapView 类。 GMSMapView 会自动处理以下操作:

  • 连接到 Google 地图服务。
  • 下载地图图块。
  • 在设备屏幕上显示图块。
  • 显示各种控件,例如平移和缩放控件。
  • 通过移动和缩放地图响应平移和缩放手势。
    • 通过倾斜 地图。

除了这些自动操作外,您还可以控制 通过该 API 提供的属性和方法, GMSMapView 类。GMSMapView,可用于添加和移除标记、地面 叠加层和多段线,更改显示的地图类型,以及 地图上通过 GMSCameraPosition 显示的内容 类。

使用 SwiftUI 构建地图

SwiftUI 提供了一种使用声明式方法创建界面的另一种方式。您只需告诉 SwiftUI 您希望视图如何随着其所有不同的状态而变化,系统将完成其余工作。SwiftUI 在更新视图时 底层状态由于事件或用户操作而发生变化。

Maps SDK for iOS 基于 UIKit 构建而成,不提供 与 SwiftUI 兼容的视图。在 SwiftUI 中添加地图需要符合 UIViewRepresentableUIViewControllerRepresentable。如需了解详情,请参阅 通过以下 Codelab 将地图添加到您的 iOS 应用: SwiftUI

添加地图

添加地图的基本步骤如下:

  1. 要获取 SDK、API 密钥并添加所需的框架,请按照下列步骤操作: 具体步骤如下:

    1. 在 Google Cloud 控制台中进行设置

    2. 使用 API 密钥

    3. 设置 Xcode 项目

    4. AppDelegate 中,将您的 API 密钥提供给 provideAPIKey: GMSServices 上的 class 方法。

    5. 创建或更新 ViewController。如果地图显示 视图控制器,请务必在 viewDidLoad 方法结合使用。

    6. 初始化地图视图时,使用以下代码设置配置选项 GMSMapViewOptions。属性包括 framecameramapIDbackgroundColorscreen

    7. 地图选项 camera 属性设为 GMSCameraPosition 对象。它指定了 的中心和缩放级别 地图。

    8. 使用 GMSMapView 创建并实例化 GMSMapViewoptions: 方法。如果此地图要用作视图控制器的 仅限视图,地图选项 frame 的默认值 CGRectZero 可以是 用作视图 frame - 地图会自动调整大小。

    9. GMSMapView 对象设置为视图控制器的视图。例如 self.view = mapView;

下面的示例向某个应用添加了一个以新加坡市区为中心的地图。

Swift

import GoogleMaps

class MapObjects : UIViewController {
  override func viewDidLoad() {
    super.viewDidLoad()

    let options = GMSMapViewOptions()
    options.camera = GMSCameraPosition(latitude: 1.285, longitude: 103.848, zoom: 12)
    options.frame = self.view.bounds;

    let mapView = GMSMapView(options:options)
    self.view = mapView
  }
}

Objective-C

- (void)viewDidLoad {
  [super viewDidLoad];

  GMSMapViewOptions *options = [[GMSMapViewOptions alloc] init];
  options.camera = [GMSCameraPosition cameraWithLatitude:1.285
                                                        longitude:103.848
                                                             zoom:12];
  options.frame = self.view.bounds;

  GMSMapView *mapView = [[GMSMapView alloc] initWithOptions:options];
  self.view = mapView;
}

完成上述步骤后,您可以进一步配置 GMSMapView 对象。

后续步骤

完成这些步骤后,您可以配置地图, 设置