新增攝影機路徑動畫

選取平台: Android iOS JavaScript

您可以在 3D 地圖中加入攝影機路徑動畫,為使用者提供更身歷其境的體驗。攝影機路徑動畫可以飛往、環繞或合併,以動畫形式將 Camera 移至地圖上的某個點,包括指定其海拔高度和 altitudeMode。

為動畫設定 Camera 時,您可以設定 altitudeMode 屬性 (或呼叫 setAltitudeMode),指定攝影機高度的解讀方式:

目的地

下列程式碼範例示範如何為 Camera 加上動畫效果,方法是使用 FlyToOptions 設定,在 GoogleMap3D 上呼叫 flyCameraTo 方法,飛到 3D 地圖上的特定點。

// Add imports and define constants
import com.google.android.gms.maps3d.model.AltitudeMode
import com.google.android.gms.maps3d.model.FlyToOptions
import com.google.android.gms.maps3d.model.FlyAroundOptions
import com.google.android.gms.maps3d.model.Camera
import com.google.android.gms.maps3d.model.Map3DMode
import com.google.android.gms.maps3d.model.latLngAltitude
const val EMPIRE_STATE_BUILDING_LATITUDE = 40.748233
const val EMPIRE_STATE_BUILDING_LONGITUDE = -73.985663

// Add to the onMap3DViewReady method, after the googleMap3D object has been initialized
googleMap3D.setMapMode(Map3DMode.HYBRID)
googleMap3D.flyCameraTo(
    flyToOptions {
        endCamera = camera {
            center = latLngAltitude {
                latitude = EMPIRE_STATE_BUILDING_LATITUDE
                longitude = EMPIRE_STATE_BUILDING_LONGITUDE
                altitude = 212.0 // in meters
            }
            heading = 34.0 // bearing in degrees
            tilt = 67.0 // relative to vertical
            range = 750.0 // distance away from the focal point in meters
            roll = 0.0 // roll relative to horizontal
            altitudeMode = AltitudeMode.RELATIVE_TO_GROUND
        }
        durationInMillis = 2000
    }
)

飛越

下列程式碼範例說明如何呼叫 GoogleMap3D 上的 flyCameraAround 方法,並使用 FlyAroundOptions 設定,讓 Camera 繞著 3D 地圖上的特定點飛行動畫。

// Add imports and define constants
import com.google.android.gms.maps3d.model.AltitudeMode
import com.google.android.gms.maps3d.model.Map3DMode
import com.google.android.gms.maps3d.model.latLngAltitude
const val EMPIRE_STATE_BUILDING_LATITUDE = 40.748233
const val EMPIRE_STATE_BUILDING_LONGITUDE = -73.985663

// Add to the onMap3DViewReady method, after the googleMap3D object has been initialized
googleMap3D.setMapMode(Map3DMode.HYBRID)
googleMap3D.flyCameraAround(
    flyAroundOptions {
        center = camera {
            center = latLngAltitude {
                latitude = EMPIRE_STATE_BUILDING_LATITUDE
                longitude = EMPIRE_STATE_BUILDING_LONGITUDE
                altitude = 212.0
            }
            heading = 34.0
            tilt = 67.0
            range = 750.0
            roll = 0.0
            altitudeMode = AltitudeMode.RELATIVE_TO_GROUND
        }
        durationInMillis = 5000
        rounds = 1.0 // Number of rotations - can be fractional
    }
)