カメラパス アニメーションを追加する

3D 地図にカメラパス アニメーションを追加すると、ユーザーに没入感の高いエクスペリエンスを提供できます。カメラパス アニメーションは、Camera を地図上のポイントに移動したり、ポイントの周囲を移動したり、それらを組み合わせて移動したりできます。移動先のポイントには、高度や altitudeMode を指定することもできます。

アニメーションの Camera を構成するときに、altitudeMode プロパティを設定して、カメラの高度の解釈方法を指定できます。

• AltitudeMode.absolute: 高度を平均海面からのメートル数として解釈します（指定しない場合のデフォルト値）。
• AltitudeMode.relativeToGround: 標高を、カメラの中心点における地表からの高さ（メートル単位）として解釈します。
• AltitudeMode.relativeToMesh: 標高を、カメラの中心点にある最も高い 3D メッシュ サーフェス（建物や地形など）からの高さ（メートル単位）として解釈します。

ジャンプ

次のコードサンプルは、flyCameraTo 修飾子を使用して Camera をアニメーション化し、3D 地図上の特定のポイントに移動する方法を示しています。

Map(mode: .hybrid)
  .flyCameraTo(
    .init(
      center: .init(
        latitude: 47.6210296,
        longitude: -122.3496903,
        altitude: 585
      ),
      heading: 149.0,
      tilt: 77.0,
      roll: 0.0,
      range: 4000,
      altitudeMode: .relativeToGround
    ),
    duration: 5,
    trigger: animate,
    completion: {}
  )

飛び回る

次のコードサンプルは、flyCameraAround 修飾子を使用して Camera をアニメーション化し、3D 地図上の特定のポイントをフライオーバーする方法を示しています。

Map(mode: .hybrid)
  .flyCameraAround(
    .init(
      center: .init(
        latitude: 47.6210296,
        longitude: -122.3496903,
        altitude: 585
      ),
      heading: 149.0,
      tilt: 77.0,
      roll: 0.0,
      range: 3000,
      altitudeMode: .relativeToGround
    ),
    duration: 90,
    repeatCount: 3,
    trigger: flyAround,
    completion: {}
  )