一切就绪!

着手开发前,请先阅读我们的开发者文档

激活 Google Maps SDK for iOS

为帮助您起步,我们将引导您在 Google Developers Console 中先完成几项任务:

  1. 创建或选择项目
  2. 激活 Google Maps SDK for iOS
  3. 创建相应密钥
继续

标记

标记指示地图上的单个位置。

默认情况下,标记使用具有通用 Google 地图界面的标准图标。 如果您希望自定义标记,您可以更改默认标记的颜色、将标记图像替换为自定义图标,或者更改标记的其他属性。

添加标记

要添加标记,请创建一个包含 positiontitleGMSMarker 对象,并设置其 map

下面的示例演示了如何向现有的 GMSMapView 对象添加标记。 标记在 10,10 坐标处创建,当用户点击时,它会在一个信息窗口中显示字符串“Hello world”。

Swift

let position = CLLocationCoordinate2D(latitude: 10, longitude: 10)
let marker = GMSMarker(position: position)
marker.title = "Hello World"
marker.map = mapView

Objective-C

CLLocationCoordinate2D position = CLLocationCoordinate2DMake(10, 10);
GMSMarker *marker = [GMSMarker markerWithPosition:position];
marker.title = @"Hello World";
marker.map = mapView;

您可以通过将 marker.appearAnimation 属性设置为 kGMSMarkerAnimationPop,从而以动画呈现方式将新标记添加到地图中。

删除标记

通过将 GMSMarkermap 属性设置为 nil,您可以将标记从地图中移除。 或者,您也可以通过调用 GMSMapViewclear 方法移除目前地图上的所有叠层(包括标记)。

Swift

let camera = GMSCameraPosition.camera(withLatitude: -33.8683, longitude:151.2086, zoom:6)
let mapView = GMSMapView.map(withFrame: .zero, camera: camera)
...
mapView.clear()

Objective-C

GMSCameraPosition *camera = [GMSCameraPosition cameraWithLatitude:-33.8683
                                                        longitude:151.2086
                                                             zoom:6];
mapView = [GMSMapView mapWithFrame:CGRectZero camera:camera];
...
[mapView clear];

如果您在向地图添加标记后想要对它进行修改,请务必保留 GMSMarker 对象。 稍后您可以通过更改此对象来修改该标记。

Swift

let marker = GMSMarker(position: position)
marker.map = mapView
...
marker.map = nil

Objective-C

GMSMarker *marker = [GMSMarker markerWithPosition:position];
marker.map = mapView;
...
marker.map = nil

更改标记颜色

您可以定制默认标记图像的颜色,只需使用 markerImageWithColor: 请求默认图标的某个着色版本,然后将得到的图像传递给 GMSMarker 的图标属性即可。

Swift

marker.icon = GMSMarker.markerImage(with: .black)

Objective-C

marker.icon = [GMSMarker markerImageWithColor:[UIColor blackColor]];

定制标记图像

如果您希望更改默认标记图像,您可以使用标记的 iconiconView 属性设置自定义图标。

如果设置 iconView,API 将忽略 icon 属性。 只要设置 iconView,就会忽略当前 icon 的更新。

使用标记的 icon 属性

下面的片段将创建一个带自定义图标的标记,此自定义图标以 icon 属性中的 UIImage 形式提供。 图标的中心为英国伦敦。 这段代码假定您的应用包含一个名为“house.png”的图像。

Swift

let position = CLLocationCoordinate2D(latitude:51.5, longitude: -0.127)
let london = GMSMarker(position: position)
london.title = "London"
london.icon = UIImage(named: "house")
london.map = mapView

Objective-C

CLLocationCoordinate2D position = CLLocationCoordinate2DMake(51.5, -0.127);
GMSMarker *london = [GMSMarker markerWithPosition:position];
london.title = @"London";
london.icon = [UIImage imageNamed:@"house"];
london.map = mapView;

如果您要使用相同的图像创建若干标记,请为每个标记使用同一个 UIImage 实例。 在显示大量标记时,这将有助于提高您应用的性能。

此图像可以具有多个帧。 此外,建议使用 alignmentRectInsets 属性,如果某个标记含有阴影或其他不可用的区域,该属性将十分有用。

使用标记的 iconView 属性

下面的片段将通过设置标记的 iconView 属性来创建一个带自定义图标的标记,并用标记的颜色以动画形式反映更改。

这段代码假定您的应用包含一个名为“house.png”的图像。

Swift

import UIKit
import GoogleMaps

class ViewController:UIViewController, GMSMapViewDelegate {
  var mapView:GMSMapView!
  var london:GMSMarker?
  var londonView:UIImageView?

  override func loadView() {

    let camera = GMSCameraPosition.camera(withLatitude:51.5,
                                          longitude: -0.127,
                                          zoom:14)
    let mapView = GMSMapView.map(withFrame: .zero, camera: camera)
    view = mapView

    mapView.delegate = self

    let house = UIImage(named:"House")!.withRenderingMode(.alwaysTemplate)
    let markerView = UIImageView(image: house)
    markerView.tintColor = .red
    londonView = markerView

    let position = CLLocationCoordinate2D(latitude:51.5, longitude: -0.127)
    let marker = GMSMarker(position: position)
    marker.title = "London"
    marker.iconView = markerView
    marker.tracksViewChanges = true
    marker.map = mapView
    london = marker
  }

  func mapView(_ mapView:GMSMapView, idleAt position:GMSCameraPosition) {
    UIView.animate(withDuration:5.0, animations: { () -> Void in
      self.londonView?.tintColor = .blue
      }, completion: {(finished) in
        // Stop tracking view changes to allow CPU to idle.
        self.london?.tracksViewChanges = false
    })
  }

Objective-C

#import "ViewController.h"
@import GoogleMaps;

@interface ViewController () <GMSMapViewDelegate>
@property (strong, nonatomic) GMSMapView *mapView;
@end

@implementation ViewController {
  GMSMarker *_london;
  UIImageView *_londonView;
}

- (void)viewDidLoad {
  [super viewDidLoad];

  GMSCameraPosition *camera = [GMSCameraPosition cameraWithLatitude:51.5
                                                          longitude:-0.127
                                                               zoom:14];
  _mapView = [GMSMapView mapWithFrame:CGRectZero camera:camera];
  self.view = _mapView;

  _mapView.delegate = self;

  UIImage *house = [UIImage imageNamed:@"House"];
  house = [house imageWithRenderingMode:UIImageRenderingModeAlwaysTemplate];
  _londonView = [[UIImageView alloc] initWithImage:house];
  _londonView.tintColor = [UIColor redColor];

  CLLocationCoordinate2D position = CLLocationCoordinate2DMake(51.5, -0.127);
  _london = [GMSMarker markerWithPosition:position];
  _london.title = @"London";
  _london.iconView = _londonView;
  _london.tracksViewChanges = YES;
  _london.map = self.mapView;
}

- (void)mapView:(GMSMapView *)mapView
    idleAtCameraPosition:(GMSCameraPosition *)position {
  [UIView animateWithDuration:5.0
                   animations:^{
                     _londonView.tintColor = [UIColor blueColor];
                   }
                   completion:^(BOOL finished) {
                     // Stop tracking view changes to allow CPU to idle.
                     _london.tracksViewChanges = NO;
                   }];
}

@end

因为 iconView 可接受 UIView,所以您可以采用一个包含标准 UI 控件(用于定义标记)的层次结构,其中每个视图都具有一套标准的动画功能。

您既可以更改标记大小、颜色和 alpha 级别,也可以应用任意的变换。 iconView 属性可支持具有 UIView 所有可设置动画的属性(除了 framecenter 以外)的动画。

使用 iconView 时,请注意以下几点:

  • tracksViewChanges 设为 YES 时,UIView 可能会请求资源,这会导致电池消耗增加。 相比之下,单帧 UIImage 为静态,并且不需要重新渲染。

  • 如果您的屏幕上有很多标记,每个标记都有自己的 UIView,并且所有标记都在同时跟踪更改,某些设备在渲染地图时可能会比较吃力。

  • iconView 不会响应用户交互,因为它只是一张视图快照。

  • 无论 clipsToBounds 的实际值为何,视图都展现前者设为 YES 时的行为。 您可以应用作用于边界之外的变换,但是您绘制的对象必须位于对象的边界内。 所有变换/转换都会得到监视并加以应用。 简言之,子视图必须包含在视图中。

要确定何时设置 tracksViewChanges 属性,您应权衡性能注意事项与让标记自动重绘的优势。

例如:

  • 如果您要进行一系列更改,则可以先将属性设为 YES,然后再改回 NO

  • 如果某个动画正在运行或者内容正在异步加载,您应将属性一直设为 YES,直至操作完成。

更改标记不透明度

您可以通过标记的 opacity 属性来控制其不透明度。 您应将不透明度指定为 0.0 和 1.0 之间的浮点值,其中 0 为全透明,1 为全不透明。

Swift

marker.opacity = 0.6

Objective-C

marker.opacity = 0.6;

您可以通过 GMSMarkerLayer 利用核心动画为标记不透明度设置动画。

将标记平面化

标记的图标通常根据设备屏幕(而不是地图表面)的方向进行绘制,因此旋转、倾斜或缩放地图不一定会改变标记的朝向。

您可以将标记的朝向设置为平贴地球表面。 平面标记将随地图的旋转而旋转,并在地图倾斜时改变视角。

与常规标记一样,当地图放大或缩小时,平面标记将保持大小不变。

如需更改标记的朝向,请将标记的 flat 属性设置为 YEStrue

Swift

let position = CLLocationCoordinate2D(latitude:51.5, longitude: -0.127)
let london = GMSMarker(position: position)
london.isFlat = true
london.map = mapView

Objective-C

CLLocationCoordinate2D position = CLLocationCoordinate2DMake(51.5, -0.127);
GMSMarker *london = [GMSMarker markerWithPosition:position];
london.flat = YES;
london.map = mapView;

旋转标记

您可以通过设置 rotation 属性让标记围绕其锚点旋转。 将旋转指定为 CLLocationDegrees 类型,旋转程度以与默认位置所呈顺时针角度来表示。 当地图上的标记为平面标记时,默认位置为指向北方。

下面的示例会将标记旋转 90°。 将 groundAnchor 属性设置为 0.5,0.5 可使标记围绕其中心而不是底部旋转。

Swift

let position = CLLocationCoordinate2D(latitude:51.5, longitude: -0.127)
let degrees = 90.0
let london = GMSMarker(position: position)
london.groundAnchor = CGPoint(x:0.5, y:0.5)
london.rotation = degrees
london.map = mapView

Objective-C

CLLocationCoordinate2D position = CLLocationCoordinate2DMake(51.5, -0.127);
CLLocationDegrees degrees = 90;
GMSMarker *london = [GMSMarker markerWithPosition:position];
london.groundAnchor = CGPointMake(0.5, 0.5);
london.rotation = degrees;
london.map = mapView;

添加信息窗口

您可以在用户点按标记时,通过信息窗口向其显示信息。 一次只能显示一个信息窗口。 如果用户点按另一个标记,将隐藏当前窗口,并打开新的信息窗口。

信息窗口的内容由 titlesnippet 属性定义。 如果 titlesnippet 属性均为空白或 nil,点击该标记将不会显示信息窗口。

下面这段代码将创建一个简单的标记,标记只有信息窗口的文本标题。

Swift

let position = CLLocationCoordinate2D(latitude:51.5, longitude: -0.127)
let london = GMSMarker(position: position)
london.title = "London"
london.map = mapView

Objective-C

CLLocationCoordinate2D position = CLLocationCoordinate2DMake(51.5, -0.127);
GMSMarker *london = [GMSMarker markerWithPosition:position];
london.title = @"London";
london.map = mapView;

使用 snippet 属性,您可以添加其他文本,该文本将以较小的字体显示在标题下面。 超出信息窗口宽度的字符串将自动换成多行。 特别长的消息可能会被截断。

Swift

let position = CLLocationCoordinate2D(latitude:51.5, longitude: -0.127)
let london = GMSMarker(position: position)
london.title = "London"
london.snippet = "Population: 8,174,100"
london.map = mapView

Objective-C

CLLocationCoordinate2D position = CLLocationCoordinate2DMake(51.5, -0.127);
GMSMarker *london = [GMSMarker markerWithPosition:position];
london.title = @"London";
london.snippet = @"Population: 8,174,100";
london.map = mapView;

将信息窗口设置为自动刷新

如果您希望信息窗口的新属性或内容在更改后立即显示,而不用等待信息窗口先隐藏更改然后再将其显示,请将标记的 tracksInfoWindowChanges 设为 YEStrue

默认值为 NOfalse

Swift

marker.tracksInfoWindowChanges = true

Objective-C

marker.tracksInfoWindowChanges = YES;

要确定何时设置 tracksInfoWindowChanges 属性,您应权衡性能注意事项与让信息窗口自动重绘的优势。

例如:

  • 如果您要进行一系列更改,则可以先将属性设为 YES,然后再改回 NO

  • 如果某个动画正在运行或者内容正在异步加载,您应将属性一直设为 YES,直至操作完成。

使用标记的 iconView 属性时,另请参阅注意事项

更改信息窗口的位置

信息窗口绘制时朝向设备屏幕的相反方向,在其关联标记的上方居中显示。 您可以通过设置 infoWindowAnchor 属性来更改信息窗口相对于标记的位置。 此属性可接受 CGPoint,它定义为一个 (x,y) 偏移,其中 x 和 y 的范围都介于 0.0 和 1.0 之间。默认偏移为 (0.5, 0.0),即顶部中心。

设置 infoWindowAnchor 偏移有助于使信息窗口与自定义图标对齐。

Swift

let position = CLLocationCoordinate2D(latitude:51.5, longitude: -0.127)
let london = GMSMarker(position: position)
london.title = "London"
london.snippet = "Population: 8,174,100"
london.infoWindowAnchor = CGPoint(x:0.5, y:0.5)
london.icon = UIImage(named: "house")
london.map = mapView

Objective-C

CLLocationCoordinate2D position = CLLocationCoordinate2DMake(51.5, -0.127);
GMSMarker *london = [GMSMarker markerWithPosition:position];
london.title = @"London";
london.snippet = @"Population: 8,174,100";
london.infoWindowAnchor = CGPointMake(0.5, 0.5);
london.icon = [UIImage imageNamed:@"house"];
london.map = mapView;

处理标记和信息窗口上的事件

您可以侦听地图上发生的事件,例如当用户点按某个标记或信息窗口的时候。 要侦听事件,您必须实现 GMSMapViewDelegate 协议。 请参阅事件指南以及 GMSMapViewDelegate 中的方法列表。

有关街景事件,请参阅 GMSPanoramaViewDelegate

发送以下问题的反馈:

此网页
Google Maps SDK for iOS
Google Maps SDK for iOS
需要帮助?请访问我们的支持页面