Kamera yolu animasyonları ekleme

Platform seçin: Android iOS JavaScript

Kullanıcılarınıza daha etkileyici bir deneyim sunmak için 3D haritanıza kamera yolu animasyonları ekleyebilirsiniz. Kamera yolu animasyonları, haritadaki bir noktaya uçabilir, bu noktanın etrafında uçabilir veya Camera öğesini haritadaki bir noktaya animasyonla taşımak için birleştirilebilir. Bu noktaya taşınırken rakım ve altitudeMode da belirtilebilir.

Animasyon için Camera yapılandırırken kameranın rakımının nasıl yorumlanacağını belirtmek üzere altitudeMode özelliğini ayarlayabilirsiniz:

  • AltitudeMode.absolute: Rakımı, ortalama deniz seviyesinin üzerindeki metre cinsinden değer olarak yorumlar (belirtilmezse varsayılan değer).
  • AltitudeMode.relativeToGround: Yüksekliği, kameranın odak noktasında zemin yüzeyinin üzerindeki metre cinsinden değer olarak yorumlar.
  • AltitudeMode.relativeToMesh: Rakımı, kameranın merkez noktasındaki en yüksek 3D ağ yüzeyinin (binalar veya arazi gibi) metre cinsinden yüksekliği olarak yorumlar.

Git

Aşağıdaki kod örneğinde, 3D haritada belirli bir noktaya uçmak için Camera öğesini animasyonlu hale getirmek üzere flyCameraTo değiştiricisinin nasıl kullanılacağı gösterilmektedir.

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: {}
  )

Etrafta uçma

Aşağıdaki kod örneğinde, 3D haritadaki belirli bir noktanın etrafında uçmak için Camera animasyonunu oluşturmak üzere flyCameraAround değiştiricisinin nasıl kullanılacağı gösterilmektedir.

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: {}
  )