街景

请选择平台: Android iOS JavaScript

借助 Google 地图街景,您可以通过 360 度的街道级图像探索世界各地。您可以探索世界标志性建筑,查看自然景观,浏览一段旅程,或显示您企业周围的景象。

概览

Google 街景提供整个覆盖区域内以指定道路为中心的 360 度全景视图。通过 SDK 提供的覆盖范围与 iOS 版 Google 地图应用https://maps.google.com/ 的覆盖范围相同。您可以在关于街景中阅读更多有关街景的内容,并通过交互地图查看支持的区域。

Maps SDK for iOS 提供了用于获取和处理 Google 地图街景中使用的图像的街景服务。街景图像作为全景图返回,并且可以在街景查看器(一个 GMSPanoramaView 类型的对象)中查看。

街景全景图片

每张街景全景图片都是一个或一组图片,提供以单个位置为中心的 360 度全景视图。图片符合等矩形投影(简易圆柱投影)的特点,包含 360 度的水平视角(完整环绕)和 180 度垂直视角(直上直下)。生成的 360 度全景图定义了一个球面投影,其中图片包绕在该球面的二维表面上。

可以通过 GMSPanoramaView 对象查看街景全景图。此对象提供了一个查看器,该查看器通过中心位置的摄像头将全景图呈现为一个球面。您可以通过编程方式控制摄像头的朝向,以及一些用于自定义查看器的属性。

访问街景数据

街景全景图由两种元数据中的一种来标识:

panoramaID
街景全景图的唯一 ID。此 panoramaID 可能会随时间而变化,并且不适合作为长期或硬编码的引用。panoramaID 最适合用于以编程方式访问不同的街景图像。
coordinate
此图片的精确位置,表示为一个 CLLocationCoordinate2D。使用 coordinate 来持久存储全景图的位置,或者将用户在地图上的操作转换成街景图像。

panoramaIDcoordinate 都作为 GMSPanorama 对象的属性进行存储。您可以使用 coordinatepanoramaIDGMSPanoramaService 请求 GMSPanorama。得到的对象将包括两种元数据,以及指向附近全景图的链接数组。

设置全景图的位置

您可以根据坐标设置街景全景图的位置。

  • moveNearCoordinate 方法会请求相应坐标附近的全景图。

  • moveNearCoordinate:radius 方法类似,但允许您指定坐标周围的搜索半径(以米为单位)。

  • 您可以使用 moveNearCoordinate:source 方法指定来源。如果您希望限制街景,以便仅查找室外全景图片,就可以使用来源。默认情况下,地点的全景图是室内或室外。请注意,指定位置可能不存在室外全景图片。

  • 借助 moveNearCoordinate:radius:source 方法,您可以同时指定半径和来源。

查看街景图片

添加街景查看器

添加查看器的基本步骤如下:

  1. (一次)按照入门中的步骤获取 SDK,获得密钥,并添加所需的框架。
  2. 创建或更新 ViewController。如果要在此视图控制器变为可见时显示全景图,请务必在 loadView 方法中创建它。
  3. 使用 GMSPanoramaView initWithFrame: 方法创建并实例化 GMSPanoramaView 类。如果这将用作视图控制器的唯一视图,那么可以使用 CGRectZero 作为地图的边框,这样地图就会自动调整大小。
  4. GMSPanoramaView 对象设为视图控制器的视图,例如 self.view = panoView;
  5. 使用 moveNearCoordinate: 等方法设置街景图像的位置。

下面的示例向某个应用添加了一个街景 查看器。

Swift

import GoogleMaps

class StreetView: UIViewController {

  override func loadView() {
    let panoView = GMSPanoramaView(frame: .zero)
    self.view = panoView

    panoView.moveNearCoordinate(CLLocationCoordinate2D(latitude: -33.732, longitude: 150.312))
  }
}
      

Objective-C

#import "StreetView.h"
@import GoogleMaps;

@interface StreetView ()

@end

@implementation StreetView

- (void)loadView {
  GMSPanoramaView *panoView = [[GMSPanoramaView alloc] initWithFrame:CGRectZero];
  self.view = panoView;

  [panoView moveNearCoordinate:CLLocationCoordinate2DMake(-33.732, 150.312)];
}

@end
      

自定义查看器

您可以通过限制可用手势来对查看器进行自定义。默认情况下,平移、缩放和前往相邻全景图都处于启用状态。个别手势通过 GMSPanoramaView 的属性进行控制。这些属性可以启用或禁用由用户控制的手势;当手势被禁用时,仍可通过编程方式进行更改。

orientationGestures
用户是否能够通过点按或拖动来调整摄像头的朝向。设置为 NO 可禁止更改摄像头的朝向。
zoomGestures
用户是否能够通过双指张合进行缩放。设置为 NO 可停用缩放功能。
navigationGestures
用户是否能够更改所显示的全景图。用户可以通过单次点按导航链接或双击视图来更改全景图。设置为 NO 可禁用导航更改。

您可以使用 setAllGesturesEnabled: 方法一次启用或停用所有手势。

Swift

panoView.setAllGesturesEnabled(false)
      

Objective-C

[panoView setAllGesturesEnabled:NO];
      

通过网址架构启动街景

从 iOS 版 Google 地图应用中可以查看 Google 街景图像。您可以通过将 mapmode 参数设置为 streetview,在街景模式下使用 comgooglemaps 网址架构来启动 iOS 版 Google 地图应用。下面是将启动街景的一个网址示例。如需了解详情,请参阅网址架构文档。

comgooglemaps://?center=46.414382,10.013988&mapmode=streetview

街景位置和视角 (POV)

GMSPanoramaCamera 可让您以方位、倾斜度和缩放级别的组合来设置街景摄像头的观察点。

下面这段代码将使摄像头朝南,并且略微向下。

Swift

panoView.camera = GMSPanoramaCamera(heading: 180, pitch: -10, zoom: 1)
      

Objective-C

panoView.camera = [GMSPanoramaCamera cameraWithHeading:180
                                                 pitch:-10
                                                  zoom:1];
      

方向

街景位置定义的是摄像头的图像焦点位置,但它并不定义对应于该图像的摄像头朝向。为此,GMSOrientation 对象定义了以下两个属性:

  • heading 定义了相对于正北方向围绕摄像头轨迹的旋转角度(以度为单位)。方位按顺时针方向来测量:正北方为 0,东方为 90,南方为 180,西方为 270。
  • pitch(默认值为 0),定义与镜头初始默认倾斜度的“向上”或“向下”角度差值。镜头的初始默认倾斜度通常(但并不总是)为水平。(例如,在山上拍摄的图像可能会呈现出非水平的默认倾斜度。)计量的俯仰角为正值时摄像头仰视(最大 +90 度垂直向上,与默认间距正交),为负值时摄像头俯视(最大 -90 度垂直向下,与默认间距正交)。

缩放

街景通过使用缩放可支持不同级别的图像细节。您可以通过编程方式设置缩放级别,或者用户可以通过捏合手指进行缩放来更改查看器中的级别。

移动镜头

创建 GMSPanoramaView 后,如果它具有经过配置或默认的摄像头,您可以通过以下几种方法之一来对它进行更改。更改镜头位置时,可以选择以动画方式呈现镜头移动的效果。动画会插入当前镜头属性和新的镜头属性之间。

您可以修改 GMSPanoramaCamera 对象,并在 GMSPanoramaViewcamera 属性中设置它。这会在没有动画的情况下将摄像头贴靠到新的观察点。可以创建一个 GMSCameraPosition 来配置朝向和缩放的任意组合。

Swift

panoView.camera = GMSPanoramaCamera(heading: 180, pitch: -10, zoom: 1)
      

Objective-C

panoView.camera = [GMSPanoramaCamera cameraWithHeading:180
                                                 pitch:-10
                                                  zoom:1];
      

您可以通过调用 GMSPanoramaViewanimateToCamera:animationDuration: 方法以动画方式呈现过渡。另外,您也可以利用Core Animation控制镜头。这是通过 GMSPanoramaViewGMSPanoramaLayer 中的自定义 CALayer 来实现的。

街景中的标记

GMSPanoramaView 对象可以显示地图标记。您可以在 GMSMapViewGMSPanoramaView 对象中使用同一个 GMSMarker 对象,只需设置其相应的属性即可:

Swift

// Create a marker at the Eiffel Tower
let position = CLLocationCoordinate2D(latitude: 48.858, longitude: 2.294)
let marker = GMSMarker(position: position)

// Add the marker to a GMSPanoramaView object named panoView
marker.panoramaView = panoView

// Add the marker to a GMSMapView object named mapView
marker.map = mapView
      

Objective-C

// Create a marker at the Eiffel Tower
CLLocationCoordinate2D position = CLLocationCoordinate2DMake(48.858,2.294);
GMSMarker *marker = [GMSMarker markerWithPosition:position];

// Add the marker to a GMSPanoramaView object named panoView
marker.panoramaView = panoView;

// Add the marker to a GMSMapView object named mapView
marker.map = mapView;
      

标记的大小将根据标记位置与 GMSCameraView 的位置之间的距离缩放。如果此距离变得过大,标记会因为变得太小而无法显示,于是将在视图中被隐藏。

panoramaView 属性设置为 nil 即可将其从 GMSPanoramaView 中移除。

Swift

marker.panoramaView = nil
      

Objective-C

marker.panoramaView = nil;
      

事件

您可以监听街景全景图上发生的事件,例如当用户点按全景图时。如需监听事件,您必须实现 GMSPanoramaViewDelegate 协议。请参阅完整的事件指南以及 GMSPanoramaViewDelegate 中的方法列表。