পপোভারস

প্ল্যাটফর্ম নির্বাচন করুন: অ্যান্ড্রয়েড আইওএস জাভাস্ক্রিপ্ট

ফেরি বিল্ডিংয়ের উপরে মার্কার এবং পপওভার সহ সান ফ্রান্সিসকোর মানচিত্র।

একটি পপওভার মানচিত্রের উপরে একটি তথ্য বাবল উইন্ডোতে, একটি নির্দিষ্ট স্থানে বিষয়বস্তু (সাধারণত পাঠ্য বা ছবি) প্রদর্শন করে। পপওভারটিতে একটি বিষয়বস্তু এলাকা এবং একটি টেপারড স্টেম থাকে। স্টেমের ডগা মানচিত্রের একটি নির্দিষ্ট অবস্থানের সাথে সংযুক্ত থাকে।

সাধারণত আপনি .popover মডিফায়ার ব্যবহার করে একটি মার্কারের সাথে একটি পপওভার সংযুক্ত করবেন, তবে আপনি উচ্চতা সহ একটি নির্দিষ্ট LatLng স্থানাঙ্কের সাথে একটি পপওভার সংযুক্ত করতে পারেন, অথবা একটি মার্কার থেকে এটি অফসেট করতে পারেন।

একটি পপওভার যোগ করুন

একটি পপওভার যোগ করার জন্য, একটি Popover সত্তা তৈরি করুন এবং এর বিকল্পগুলি সেট করুন, যার মধ্যে অবস্থান এবং উচ্চতা মোড অন্তর্ভুক্ত রয়েছে। অবস্থানটি একটি LatLngAltitude অবজেক্ট, যা নির্ধারণ করে যে পপওভারটি কোথায় প্রদর্শিত হবে। উচ্চতা মোড সেট করে আপনি LatLngAltitude দ্বারা অ্যাঙ্কর করার সময় উচ্চতা কীভাবে ব্যাখ্যা করা হবে তা নিয়ন্ত্রণ করতে পারেন। যদি কোনও মার্কারে অ্যাঙ্কর করা হয়, তবে মার্কারটির অবস্থান ব্যবহার করা হয়।

একটি পপওভারের কন্টেন্ট SwiftUI Views ব্যবহার করে কাস্টমাইজ করা যেতে পারে। আপনি Popover সত্তা অথবা .popover মডিফায়ারে একটি ভিউ বিল্ডার ক্লোজার পাস করে কাস্টম লেআউট প্রদান করতে পারেন।

একটি LatLngAltitude অবজেক্টে একটি পপওভার যোগ করুন

নিম্নলিখিত কোড নমুনাটি একটি 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")
      }
    }
  }
}

একটি মার্কারে একটি পপওভার যোগ করুন

নিম্নলিখিত কোড নমুনাটি একটি মার্কারে একটি পপওভার যোগ করে:

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()
        }
    }
  }
}