پاپاورها

پلتفرم مورد نظر را انتخاب کنید: اندروید، iOS، جاوا اسکریپت

نقشه سانفرانسیسکو با نشانگر و علامت پاپ‌اور بر فراز ساختمان فری.

یک پنجره بازشو، محتوا (معمولاً متن یا تصاویر) را در یک پنجره حباب اطلاعات بالای نقشه، در یک مکان مشخص نمایش می‌دهد. این پنجره بازشو دارای یک ناحیه محتوا و یک ساقه مخروطی شکل است. نوک ساقه به یک مکان مشخص روی نقشه متصل است.

معمولاً با استفاده از اصلاح‌کننده‌ی .popover یک popover را به یک نشانگر متصل می‌کنید، اما می‌توانید یک popover را به یک مختصات LatLng خاص با ارتفاع نیز متصل کنید، یا آن را از یک نشانگر جابجا کنید.

اضافه کردن یک پاپ‌اوور

برای افزودن یک popover، یک موجودیت Popover ایجاد کنید و گزینه‌های آن، از جمله موقعیت و حالت ارتفاع را تنظیم کنید. موقعیت یک شیء LatLngAltitude است که محل نمایش popover را تعیین می‌کند. می‌توانید با تنظیم حالت ارتفاع، نحوه تفسیر ارتفاع را هنگام لنگر انداختن توسط LatLngAltitude کنترل کنید. اگر لنگر انداختن به یک نشانگر باشد، به جای آن از موقعیت نشانگر استفاده می‌شود.

محتوای یک popover را می‌توان با استفاده از SwiftUI Views سفارشی کرد. می‌توانید با ارسال یک closure View builder به موجودیت Popover یا اصلاح‌کننده .popover ، طرح‌بندی‌های سفارشی ارائه دهید.

یک popover به یک شیء LatLngAltitude اضافه کنید

نمونه کد زیر یک popover به شیء LatLngAltitude اضافه می‌کند:

import GoogleMaps3D
import SwiftUI

struct SimpleCoordinatePopover: View {
  @State private var isOpen = true
  // Alcatraz Island coordinates
  private let alcatraz = LatLngAltitude(latitude: 37.8270, longitude: -122.4230)

  var body: some View {
    Map(initialCamera: .init(latitude: 37.8270, longitude: -122.4230)) {
      Popover(
        positionAnchor: alcatraz,
        isOpen: $isOpen
      ) {
        Text("Alcatraz Island")
      }
    }
  }
}

افزودن یک پنجره‌ی پاپ‌اوور به یک نشانگر

نمونه کد زیر یک popover به یک نشانگر اضافه می‌کند:

import GoogleMaps3D
import SwiftUI

struct SimpleMarkerPopover: View {
  @State private var isOpen = false
  // Ferry Building coordinates
  private let ferryBuilding = LatLngAltitude(latitude: 37.7955, longitude: -122.3937)

  var body: some View {
    Map(initialCamera: .init(latitude: 37.7955, longitude: -122.3937)) {
      Marker(position: ferryBuilding)
        .popover(isOpen: $isOpen) {
          Text("Ferry Building")
        }
        .onTap {
          isOpen.toggle()
        }
    }
  }
}