Haritanın stilini ayarlama

Platform seçin: Android iOS JavaScript

Bu kılavuzda, bir geziyi takip ederken Android uygulamanızda gösterilen haritayı özelleştirmenin yolları açıklanmaktadır. görünümünü ve tarzını özelleştirebilirsiniz. düzenleyebilirsiniz:

• Bulut tabanlı harita stilleriyle haritanın stilini belirleme
• Seyahate odaklanmak için kamerayı ayarlayın
• İşaretleri özelleştirme
• Çoklu çizgileri özelleştirme

Bulut tabanlı harita stilleriyle haritayı biçimlendirin

Bulut tabanlı haritaları kullanarak harita bileşeninin görünümünü ve tarzını özelleştirin görünüm. Tüm cihazlarınız için Google Cloud Console'da harita stilleri oluşturup düzenleyebilirsiniz kodda herhangi bir değişiklik yapmanıza gerek kalmadan Google Haritalar'ı kullanan uygulamalarınız için geçerlidir. Daha fazla bilgi için bkz. Bulut tabanlı harita stilleri.

Hem ConsumerMapView ve ConsumerMapFragment Sınıflar bulut tabanlı harita stilini destekler. Bulut tabanlı harita stilleri kullanmak için, seçilen haritaların oluşturucu LATEST. Aşağıdaki bölümlerde, bulut tabanlı harita stilinin projenizle nasıl kullanılacağına dair örnekler verilmiştir.

ConsumerMapView

ConsumerMapView özelliğinde bulut tabanlı harita stilini kullanmak için GoogleMapOptions üzerindeki mapId alanını dâhil edin ve GoogleMapOptions ayarını getConsumerGoogleMapAsync(ConsumerMapReadyCallback, Fragment, GoogleMapOptions) veya getTüketiciGoogleharitasıAsync(TüketiciHaritaHazır Çağrısı, FragmentActivity, GoogleMapOptions)

Ö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'te bulut tabanlı harita stillerini kullanmanın iki yolu vardır:

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

XML ile statik olarak

ConsumerMapFragment içindeki XML ile bulut tabanlı harita stilini kullanmak için belirtilen mapId ile map:mapId XML özelliğini 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

Bulut tabanlı harita stilini newInstance ile kullanmak için ConsumerMapFragment, GoogleMapOptions üzerinde mapId alanını ayarlayıp GoogleMapOptions - newInstance. 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 kameranın yakınlaştırma ayarını değiştirin

Etkin bir yolculuk paylaşımı oturumu sırasında kamera yakınlaştırma ve odaklama işlemlerini iki şekilde yapabilirsiniz:

• AutoCamera: AutoCamera kullanmak istiyorsanız herhangi bir işlem yapmanız gerekmez. Kamera geziyi takip eder. Ayrıntılar için bkz. AutoCamera.

• Kamera davranışını özelleştirme: Kamera davranışını özelleştirmek için AutoCamera'ü devre dışı bırakıp özelleştirmelerinizi yapmanız gerekir. Ayrıntılı bilgi için Kamera davranışını özelleştirme başlıklı makaleyi inceleyin.

AutoCamera, kamerayı ortalayın

Tüketici SDK'sı varsayılan olarak etkinleştirilmiş bir AutoCamera özelliği sağlar Haritalar SDK'sındaki yerleşik Konumum düğmesi. Kamera şuna yakınlaştırır: yolculuk paylaşımı rotasına ve bir sonraki seyahat ara noktasına odaklanır.

AutoCamera kullanmak istiyorsanız uygulamayı etkinleştirdiğinizden emin olun. Daha fazla bilgi için isAutoCameraEnabled başlıklı makaleyi inceleyin.

Konumum düğmesi hakkında ayrıntılı bilgi için Maps JavaScript API dokümanlarında Konumum düğmesi bölümüne bakın.

Kamera davranışını özelleştirin

Kamera davranışı üzerinde daha fazla kontrol sahibi olmak için aşağıdaki adımları uygulayarak AutoCamera ve kamera davranışını manuel olarak özelleştirin.

1. ConsumerController.setAutoCameraEnabled() işlevini kullanarak AutoCamera özelliğini devre dışı bırakın.

2. ConsumerController.getCameraUpdate() işlevini kullanarak önerilen kamera sınırlarını alın.

3. CameraUpdate işlevini şu Android işlevlerinden biri için bağımsız değişken olarak sağlayın:

   • GoogleMap.moveCamera()

   • GoogleMap.animateCamera().

Sırada ne var?

Android'de bir geziyi takip etme