Haritanın stilini ayarlama

Platform seçin: Android iOS JavaScript

Bu kılavuzda, gezi sırasında iOS uygulamanızda gösterilen haritayı şekillendirme yöntemleri açıklanmaktadır.

Başlamadan önce

Haritaya stil uygulamadan önce, aşağıdakilerin uygulandığı bir tüketici uygulamanız olmalıdır:

Ayrıca, Consumer SDK'nın ihtiyaç duyduğu arka uç hizmetlerini ve Consumer SDK'yı da ayarlamanız gerekir. Ayrıntılar için Consumer SDK'yı ayarlama ve Fleet Engine nedir? başlıklı makaleleri inceleyin.

Harita özelleştirmeleri

Kullanabileceğiniz özelleştirmeler şunlardır:

  • Haritaya stil uygulama: Bulut tabanlı harita stillerini kullanarak harita renklerine, çoklu çizgilere ve diğer harita özelliklerine stil uygulayabilirsiniz. Haritaya stil uygulama başlıklı makaleyi inceleyin.

  • Kamera yakınlaştırmasını ayarlama: Yerleşik özelliği kullanabilir veya bir yolculuğa odaklanmak için kendi kamera seçeneklerinizi belirleyebilirsiniz. Kamera yakınlaştırmasını ayarlayarak bir geziye odaklanma başlıklı makaleyi inceleyin.

  • İşaretçileri ve çoklu çizgileri özelleştirme: Uygulama tasarımınıza özel işaretçiler ve rota çoklu çizgileri ekleyebilirsiniz. Bu tasarım öğeleri, tüketici uygulamanızın aracın rotasının dinamik bir önizlemesini göstermesini sağlar. İşaretçileri özelleştirme ve Çoklu çizgileri özelleştirme başlıklı makaleleri inceleyin.

    SDK, bu seçenekleri consumerMapStyleCoordinator özelliği aracılığıyla sağlar. Bu özellik GMTCMapView sınıfı üzerinden kullanılabilir.

Bulut tabanlı harita stilleriyle haritaya stil uygulama

Bulut tabanlı harita stillerini kullanarak harita bileşeninin görünümünü ve tarzını özelleştirin. Google Haritalar'ı kullanan uygulamalarınız için Google Cloud Console'da harita stilleri oluşturup düzenleyebilir, kodunuzda herhangi bir değişiklik yapmanız gerekmez. Daha fazla bilgi için Bulut tabanlı harita stilleri sayfasında platformunuzu seçin.

Hem ConsumerMapView hem de ConsumerMapFragment sınıfları bulut tabanlı harita stillerini destekler. Bulut tabanlı harita stilini kullanmak için seçilen harita oluşturucunun LATEST olduğundan emin olun. Aşağıdaki bölümlerde, projenizde bulut tabanlı harita stilini kullanma örnekleri gösterilmektedir.

ConsumerMapView

ConsumerMapView'da bulut tabanlı harita stilini kullanmak için GoogleMapOptions üzerinde mapId alanını ayarlayın ve GoogleMapOptions değerini getConsumerGoogleMapAsync(ConsumerMapReadyCallback, Fragment, GoogleMapOptions) veya getConsumerGoogleMapAsync(ConsumerMapReadyCallback, FragmentActivity, GoogleMapOptions)'e iletin.

Örnek

Java

public class SampleAppActivity extends AppCompatActivity {

  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    ConsumerMapView mapView = findViewById(R.id.consumer_map_view);

    if (mapView != null) {
      GoogleMapOptions optionsWithMapId = new GoogleMapOptions().mapId("map-id");
      mapView.getConsumerGoogleMapAsync(
          new ConsumerMapReadyCallback() {
            @Override
            public void onConsumerMapReady(@NonNull ConsumerGoogleMap consumerGoogleMap) {
              // ...
            }
          },
          /* fragmentActivity= */ this,
          /* googleMapOptions= */ optionsWithMapId);
    }
  }
}

Kotlin

class SampleAppActivity : AppCompatActivity() {
  override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    val mapView = findViewById(R.id.consumer_map_view) as ConsumerMapView

    val optionsWithMapId = GoogleMapOptions().mapId("map-id")
    mapView.getConsumerGoogleMapAsync(
      object : ConsumerGoogleMap.ConsumerMapReadyCallback() {
        override fun onConsumerMapReady(consumerGoogleMap: ConsumerGoogleMap) {
          // ...
        }
      },
      /* fragmentActivity= */ this,
      /* googleMapOptions= */ optionsWithMapId)
  }
}

ConsumerMapFragment

ConsumerMapFragments'ta bulut tabanlı harita stillerini kullanmanın iki yolu vardır:

  • XML ile statik olarak.
  • newInstance ile dinamik olarak.

XML ile statik olarak

Bulut tabanlı harita stilini ConsumerMapFragment içindeki XML ile kullanmak için map:mapId XML özelliğini belirtilen mapId ile birlikte ekleyin. Aşağıdaki örneğe bakın:

<fragment
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:map="http://schemas.android.com/apk/res-auto"
    android:name="com.google.android.libraries.mapsplatform.transportation.consumer.view.ConsumerMapFragment"
    android:id="@+id/consumer_map_fragment"
    map:mapId="map-id"
    android:layout_width="match_parent"
    android:layout_height="match_parent"/>

newInstance ile dinamik olarak

newInstance içinde bulut tabanlı harita stilini kullanmak için newInstance, GoogleMapOptions üzerinde mapId alanını ayarlayın ve GoogleMapOptions öğesini newInstance öğesine iletin.ConsumerMapFragment Aşağıdaki örneğe bakın:

Java

public class SampleFragmentJ extends Fragment {

  @Override
  public View onCreateView(
      @NonNull LayoutInflater inflater,
      @Nullable ViewGroup container,
      @Nullable Bundle savedInstanceState) {

    final View view = inflater.inflate(R.layout.consumer_map_fragment, container, false);

    GoogleMapOptions optionsWithMapId = new GoogleMapOptions().mapId("map-id");
    ConsumerMapFragment consumerMapFragment = ConsumerMapFragment.newInstance(optionsWithMapId);

    getParentFragmentManager()
        .beginTransaction()
        .add(R.id.consumer_map_fragment, consumerMapFragment)
        .commit();

    consumerMapFragment.getConsumerGoogleMapAsync(
        new ConsumerMapReadyCallback() {
          @Override
          public void onConsumerMapReady(@NonNull ConsumerGoogleMap consumerGoogleMap) {
            // ...
          }
        });

    return view;
  }
}

Kotlin

class SampleFragment : Fragment() {
  override fun onCreateView(
    inflater: LayoutInflater,
    container: ViewGroup?,
    savedInstanceState: Bundle?): View? {

    val view = inflater.inflate(R.layout.consumer_map_fragment, container, false)

    val optionsWithMapId = GoogleMapOptions().mapId("map-id")
    val consumerMapFragment = ConsumerMapFragment.newInstance(optionsWithMapId)

    parentFragmentManager
      .beginTransaction()
      .add(R.id.consumer_map_fragment, consumerMapFragment)
      .commit()

    consumerMapFragment.getConsumerGoogleMapAsync(
      object : ConsumerMapReadyCallback() {
        override fun onConsumerMapReady(consumerGoogleMap: ConsumerGoogleMap) {
          // ...
        }
      })

    return view
  }
}

Bir geziye odaklanmak için kamera yakınlaştırmasını ayarlama

Etkin bir yolculuk paylaşımı oturumu sırasında, kullanıcının rotadaki aracın yakın çekim görünümünü değil, yolculuğu boyunca aracın daha geniş bir görünümünü görmesi faydalıdır. Bunu yapmak için yerleşik AutoCamera özelliğini kullanarak veya kamera davranışını kendiniz özelleştirerek kamera yakınlaştırma düzeyini ayarlarsınız:

  • AutoCamera: AutoCamera kullanmak istiyorsanız herhangi bir işlem yapmanız gerekmez. Kamera, varsayılan olarak geziyi takip eder.

  • Kamera davranışını özelleştirme: Kamera davranışını özelleştirmek için AutoCamera simgesini devre dışı bırakıp özelleştirmelerinizi yapmanız gerekir.

AutoCamera, kamerayı varsayılan olarak ortalar.

Consumer SDK, Haritalar SDK'sının yerleşik Konumum düğmesi için varsayılan olarak etkinleştirilen bir AutoCamera özelliği sunar. Kamera, gezi rotasına ve bir sonraki gezi ara noktasına odaklanmak için yakınlaştırılır.

AutoCamera özelliğini kullanmak istiyorsanız bu özelliğin etkinleştirildiğinden emin olun. Daha fazla bilgi için allowCameraAutoUpdate başlıklı makaleyi inceleyin.

`AutoCamera`

Haritalar SDK'sındaki Konumum düğmesiyle ilgili ayrıntılar için iOS için Haritalar SDK'sı belgelerindeki Konumum düğmesi bölümüne bakın.

Kamera davranışını özelleştirme

Kamera davranışını daha fazla kontrol etmek için AutoCamera seçeneğini devre dışı bırakabilir ve kamera davranışını özelleştirebilirsiniz.

AllowCameraAutoUpdate özelliğiyle AutoCamera özelliğini devre dışı bırakın veya etkinleştirin.

Daha fazla kamera özelleştirmesi için iOS için Haritalar SDK'sı belgelerindeki Kamerayı hareket ettirme başlıklı makaleyi inceleyin.

Sırada ne var?

iOS'te bir geziyi takip etme