設定攝影機控制項

選取平台: Android iOS JavaScript

使用者可以在地圖上使用手勢,控制攝影機的縮放、傾斜、位置和旋轉。您也可以透過程式輔助方式設定攝影機。

3D 攝影機模型示意圖

The Camera Position

地圖檢視是模擬成一部看向空間中特定點的相機。攝影機的位置和方向由經度/緯度/高度座標 (定義為「中心」,即攝影機指向的位置)、航向、傾斜度、範圍和滾動定義。

中心 (緯度、經度、高度)

center 定義攝影機觀察的 3D 空間特定點。這項資訊是使用 LatLngAltitude 類別指定,該類別會結合經度、緯度和高度的值。這可讓您在三維空間中定位攝影機的焦點。

緯度可以介於正負 90 度 (含首尾)。經度的範圍介於正負 180 度 (含首尾)。高度以公尺為單位,高度的解讀方式取決於攝影機的 altitudeMode (預設為 AltitudeMode.ABSOLUTE、AltitudeMode.RELATIVE_TO_GROUND 或 AltitudeMode.RELATIVE_TO_MESH)。

標題

頂角指定地圖的指南針方向,以正北為基準,依順時針方向測量角度。北為 0 度,東為 90 度,南為 180 度,西為 270 度。

傾斜

傾斜角度是指攝影機與垂直軸的角度,以度為單位。傾斜度為 0 度時,攝影機朝向正下方 (天底)。傾斜度為 90 度時,表示攝影機水平指向方向指定的方向。

範圍

範圍定義相機位置與地圖中心之間的距離 (以公尺為單位)。範圍可從零公尺 (非常近) 到六千三百萬公尺,讓您從非常近的距離一直看到真正的全球視角。這能有效控制地圖的「放大」或「縮小」程度。

向左/向右旋轉

旋轉角是指攝影機相對於地平線的角度,以度為單位。這個參數可用來建立效果,例如飛行模擬模式期間的傾斜,甚至是完整的桶滾,讓攝影機繞著檢視軸旋轉。

控制相機

下列程式碼範例示範如何透過程式輔助方式,在 GoogleMap3D 上呼叫 setCamera 方法,藉此控制 Camera。如要使用這個程式碼範例,請按照「設定」和「在應用程式中加入 3D 地圖」中的操作說明,設定含有基本 3D 地圖的 Android Studio 專案。接著,將下列程式碼新增至 MainActivity.kt 檔案:


// Add imports
import com.google.android.gms.maps3d.model.Map3DMode
import com.google.android.gms.maps3d.model.camera
import com.google.android.gms.maps3d.model.latLngAltitude

// Add to the onMap3DViewReady method, after the googleMap3D object has been initialized
googleMap3D.setMapMode(Map3DMode.HYBRID)
googleMap3D.setCamera(
    camera {
        center = latLngAltitude {
            latitude = 38.743502
            longitude = -109.499374
            altitude = 1467.0
        }
        heading = 350.0
        tilt = 58.1
        range = 138.2
        roll = 0.0
    }
)

UI 控制項

除了標準手勢外,Maps 3D SDK for Android 也提供 UI 控制項,可用於操控攝影機位置。

  • 「縮放控制項」會顯示「+」和「-」按鈕,用於變更地圖的縮放等級。
  • 「移動控制項」會顯示「←」、「→」、「↑」和「↓」按鈕,用於變更地圖中心點。
  • 「旋轉控制項」會顯示「↺」和「↻」,用於變更攝影機的朝向。
  • 「傾斜控制項」會顯示「^」和「⌄」,用於變更攝影機的傾斜角度。
  • 指南針控制項會指出指南針北方的方向,並可將攝影機重設為朝北。

以下程式碼範例說明如何變更 UI 控制項的顯示設定:

```kotlin // Add imports import com.google.android.gms.maps3d.UiControlSettings import com.google.android.gms.maps3d.model.CompassControl import com.google.android.gms.maps3d.model.TiltControl import com.google.android.gms.maps3d.model.ZoomControl</p> <p>...</p> <p>val uiControlSettings = googleMap3D.getUiControlSettings()</p> <p>// Show UI controls on the trailing edge of the map uiControlSettings?.setUiControlsPlacement( listOf(CompassControl(), ZoomControl(), TiltControl()), UiControlSettings.ControlPlacement.TRAILING )</p> <p>// Hide UI controls on the trailing edge of the map uiControlSettings?.setUiControlsPlacement( emptyList(), UiControlSettings.ControlPlacement.TRAILING )