Yer İşaretleri bileşeni

Yer İşaretleri bileşeni, önemli yer bilgilerini doğrudan haritada gösteren özelleştirilebilir harita açıklamaları oluşturmanıza olanak tanır. Bir yerin puanı, yer türü, açık veya kapalı durumu, fiyat aralığı ya da özel metin (ör. yapay zekayla üretilmiş bir etiket veya seyahat planı numarası) gibi içerikleri gösterebilirsiniz. Bu sayede kullanıcılarınız, ayrıntılı bir yer kartına dokunmalarına gerek kalmadan daha bilgilendirici bir harita keşfi deneyimi yaşar.

Yer işaretleri için kullanılabilen simgeler ve metinler

Her PlaceMarker için bir işaretçi simgesi ve isteğe bağlı işaretçi metni gösterebilirsiniz.

Kullanılabilir simgeler şunlardır:

  • type: Yer türü.
  • none: Simge yok.
Kullanılabilir metin işaretçileri şunlardır:
  • rating: Puan.
  • priceRange: Fiyat aralığı (örneğin, 10-20 TL).
  • openStatus: İşletmenin açık veya kapalı olması.
  • custom: Özel metin (örneğin, "POPÜLER").

Yer kimliği (.placeID), kaynak adı (.resourceName) veya coğrafi koordinatları (.coordinate) kullanarak yere referans verin.

Görüntüleme ve ilişkilendirme koşulları

Places UI Kit harita işaretçileri gösterildiğinde işaretçiler tek başına görünmemelidir. Gerekli Google markalaması, katkıda bulunan kişiye atıf ve Sorun Bildir akışlarını sağlamak için tıklama veya dokunma üzerine etkileşimli olmalı ve ilişkili bir yer ayrıntıları bileşeni ya da lightbox açmalıdır.

Alan sınırlı olduğunda fotoğraf ve yorum ilişkilendirme şartlarımızı inceleyin.

Yer işaretçisi örnekleri

Temel işaretçi özelleştirmeleri

Aşağıdaki kod örneğinde temel yer işareti özelleştirmeleri gösterilmektedir.

Swift

import GooglePlacesSwift
import SwiftUI

@MainActor
struct DefaultMarker: View {
  var body: some View {
    PlaceMarker(
      identifier: PlaceIdentifier.placeID("PLACE_ID"),
      markerIcon: .none
    )
  }
}

@MainActor
struct RatingMarker: View {
  var body: some View {
    PlaceMarker(
      identifier: PlaceIdentifier.placeID("PLACE_ID"),
      markerIcon: .none,
      markerText: .rating
    )
  }
}

@MainActor
struct TypeAndRatingMarker: View {
  var body: some View {
    PlaceMarker(
      identifier: PlaceIdentifier.placeID("PLACE_ID"),
      markerIcon: .type,
      markerText: .rating
    )
  }
}


@MainActor
struct PriceRangeMarker: View {
  var body: some View {
    PlaceMarker(
      identifier: PlaceIdentifier.resourceName("places/PLACE_RESOURCE_NAME"),
      markerIcon: .none,
      markerType: .priceRange
    )
  }
}


@MainActor
struct OpenStatusMarker: View {
  var body: some View {
    PlaceMarker(
      identifier: PlaceIdentifier.coordinate(CLLocationCoordinate2D(latitude: 37.7749, longitude: -122.4194)),
      markerIcon: .icon,
      markerText: .openStatus
    )
  }
}
@MainActor
struct PhotoMarker: View {
    PlaceMarker(
        identifier: PlaceIdentifier.resourceName("places/PLACE_RESOURCE_NAME")
        markerIcon =.Photo
    )
}


@MainActor
struct CustomMarker: View {
  var body: some View {
    PlaceMarker(
      identifier: PlaceIdentifier.placeID("PLACE_ID"),
      markerIcon: .none,
      markerType: .custom(label: "3")
    )
  }
}

İşaretçi görünümünü özelleştirme

Aşağıdaki kod örneğinde, üçgen şeklindeki konuşma balonu ağzını gizleyerek işaretçi görünümünü özelleştirmek ve kullanıcı işaretçiye dokunduğunda özel uygulama işlemlerini tetiklemek için dokunma geri araması sağlamak üzere bildirimli SwiftUI görünüm değiştiricilerinin nasıl kullanılacağı gösterilmektedir.

Swift

@MainActor
struct ModifierStyleMarker: View {
  var body: some View {
    PlaceMarker(
      identifier: .placeID("PLACE_ID"),
      markerIcon: .none,
      markerText: .openStatus,
      configuration: PlaceMarkerConfiguration(beakPresence: false)
    )
    .onTap { placeID in
      print("Marker tapped for place: \(placeID)")
    }
  }
}

Geri aramaları yönetme

Aşağıdaki kod örneğinde, başarılı oluşturma veya eksik veri hatalarını işlemek için geri çağırmaların nasıl kullanılacağı gösterilmektedir.

Swift

import GooglePlacesSwift
import SwiftUI


@MainActor
struct StatusHandlingMarker: View {
  var body: some View {
    PlaceMarker(
      identifier: PlaceIdentifier.placeID("PLACE_ID"),
      markerIcon: .none
      markerText: .priceRange,
    )
    /// Triggered when place data is successfully fetched or when data fetching fails or 
    /// required data is missing for the place..
    .onLoad { result in
        if let place = result.place {
          print("Marker successfully loaded for place ID: \(place.placeID)")
        } else if let error = result.error {
          print("Failed to load marker: \(error)")
      }
    }
  }
}

Haritalar SDK'sı ile entegrasyon

Aşağıdaki kod örneğinde, PlaceMarker öğesinin PlaceMarker etrafına sarmak için PlaceMarkerHostingView yardımcı sınıfı kullanılarak iOS için Google Haritalar SDK'sına GMSMarker nasıl yerleştirileceği gösterilmektedir.

Swift

import GoogleMaps
import GooglePlacesSwift
import SwiftUI
import UIKit


func addPlaceMarker(to mapView: GMSMapView, placeID: String) {
  let marker = GMSMarker()
  let markerView = PlaceMarker(
    identifier: .placeID(placeID),
    markerType: .rating(showIcon: true),
  ).onLoad { result in
    switch Result
    case .success(let place)
      marker.position = place.coordinate
    case .error(let error) {
      print("Failed to load marker: \(error)")
    }
  }

  marker.iconView = PlaceMakerHostingView(markerView)
  marker.map = mapView
}