Menyesuaikan polyline rute

Pilih platform: Android iOS JavaScript

Sebelum menyesuaikan polyline (atau penanda) rute, Anda harus menginisialisasi opsi penyesuaian UI terlebih dahulu.

Lakukan inisialisasi opsi penyesuaian UI

Callback yang direkomendasikan yang digunakan untuk menetapkan opsi penyesuaian UI pada awalnya dideklarasikan di GMTCMapViewDelegate. Callback mapViewDidInitialize dipicu saat objek GMTCMapView siap merender peta. Koordinator gaya diinisialisasi, tetapi tidak ada elemen UI.

Swift

/** ViewController.swift */

class ViewController: UIViewController, GMTCMapViewDelegate {

  // MARK: - GMTCMapViewDelegate

  func mapViewDidInitialize(_ mapview: GMTCMapView) {
    // Set the UI customization options here.
  }
}

Objective-C

/** ViewController.m */

@interface ViewController () <GMTCMapViewDelegate>

#pragma mark GMTCMapViewDelegate

- (void)mapViewDidInitialize:(GMTCMapView *)mapview {
  // Set the UI customization options here.
}

Sesuaikan polyline

Kustomisasi polyline diatur menggunakan GMTCConsumerMapStyleCoordinator#setPolylineStyleOptions(_:polylineType:).

Contoh berikut menunjukkan cara menyetel opsi gaya polyline:

Jenis garis poli

Anda dapat menyesuaikan jenis polyline berikut:

• GMTCPolylineType.activeRoute: Rute yang dilalui kendaraan menuju titik berikutnya bagi pengendara, baik itu penjemputan atau pengantaran.
• GMTCPolylineType.remainingRoute: Segmen perjalanan yang tersisa setelah kendaraan menyelesaikan GMTCPolylineType.activeRoute.

Kedua jenis ini ditampilkan sepanjang perjalanan bersama.

Properti polyline

Properti yang dapat Anda sesuaikan untuk setiap polyline adalah subset dari properti yang disediakan di Google Maps PolylineOptions. Properti SDK Konsumen GMTCPolylineStyleOptions memiliki ciri-ciri berikut:

• Dibangun menggunakan inisialisasi.
• Dapat berupa immutable atau mutable jika Anda ingin memberikan nilai kustom untuk properti apa pun.
• Memiliki nilai default.

Anda dapat menyesuaikan properti berikut:

• color
• width
• isVisible: Untuk menonaktifkan polyline, tetapkan isVisible ke false.
• isTrafficEnabled: Properti ini ditetapkan ke false secara default.

Contoh

Swift

/** MapViewController.swift */

private func updatePolylineUIOptions() {
  // Get the GMTCConsumerMapStyleCoordinator
  let consumerMapStyleCoordinator = mapView.consumerMapStyleCoordinator

  // The polyline type that you would like to set custom UI options for.
  let customizablePolylineType = GMTCPolylineType.activeRoute

  // Initializing polyline options with default values (immutable version).
  let polylineStyleOptions = GMTCPolylineStyleOptions()
  consumerMapStyleCoordinator.setPolylineStyleOptions(
    polylineStyleOptions, polylineType: customizablePolylineType)

  // Initializing polyline options with custom values (mutable version).
  let mutablePolylineStyleOptions = GMTCMutablePolylineStyleOptions()
  mutablePolylineStyleOptions.isVisible = true
  mutablepolylineStyleOptions.strokeWidth = 8.0
  mutablepolylineStyleOptions.strokeColor = .blue
  mutablepolylineStyleOptions.zIndex = 1000
  mutablepolylineStyleOptions.isGeodesic = true
  mutablePolylineStyleOptions.isTrafficEnabled = true
  mutablePolylineStyleOptions.setTrafficColorFor(.slow, color: .yellow)
  mutablePolylineStyleOptions.setTrafficColorFor(.trafficJam, color: .purple)
  consumerMapStyleCoordinator.setPolylineStyleOptions(
    mutablePolylineStyleOptions, polylineType: customizablePolylineType)

  // Reset polyline options to default values.
  consumerMapStyleCoordinator.setPolylineStyleOptions(
    nil, polylineType: customizablePolylineType)
}

Objective-C

/** MapViewController.m */

- (void)updatePolylineUIOptions {
  // Get the GMTCConsumerMapStyleCoordinator
  GMTCConsumerMapStyleCoordinator *consumerMapStyleCoordinator = [_mapView consumerMapStyleCoordinator];

  // The polyline type that you would like to set custom UI options for.
  GMTCPolylineType customizablePolylineType = GMTCPolylineTypeActiveRoute;

  // Initializing polyline options with default values (immutable version).
  GMTCPolylineStyleOptions *polylineStyleOptions = [[GMTCPolylineStyleOptions alloc] init];
  [consumerMapStyleCoordinator setPolylineStyleOptions:polylineStyleOptions
                               polylineType:customizablePolylineType];

  // Initializing polyline options with custom values (mutable version).
  GMTCMutablePolylineStyleOptions *mutablePolylineStyleOptions = [[GMTCMutablePolylineStyleOptions alloc] init];
  mutablePolylineStyleOptions.isVisible = YES;
  mutablepolylineStyleOptions.strokeWidth = 8.0;
  mutablepolylineStyleOptions.strokeColor = [UIColor blueColor];
  mutablepolylineStyleOptions.zIndex = 1000;
  mutablepolylineStyleOptions.isGeodesic = YES;
  mutablePolylineStyleOptions.isTrafficEnabled = YES;
  [mutablePolylineStyleOptions setTrafficColorForSpeed:GMTSSpeedTypeSlow color:[UIColor yellowColor]];
  [mutablePolylineStyleOptions setTrafficColorForSpeed:GMTSSpeedTypeTrafficJam color:[UIColor purpleColor]];
  [consumerMapStyleCoordinator setPolylineStyleOptions:mutablePolylineStyleOptions
                                          polylineType:customizablePolylineType];

  // Reset polyline options to default values.
  [consumerMapStyleCoordinator setPolylineStyleOptions:nil
                                          polylineType:customizablePolylineType];
}

Polyline yang mengetahui lalu lintas

Lapisan traffic polyline dinonaktifkan secara default. Saat Anda mengaktifkannya dengan menggunakan polylineStyleOptions.isTrafficEnabled = true, segmen yang merepresentasikan rentang traffic non-normal akan digambar sebagai rute.

Kondisi lalu lintas ditampilkan sebagai salah satu dari empat kecepatan:

• GMTSSpeedType.noData
• GMTSSpeedType.normal
• GMTSSpeedType.slow
• GMTSSpeedType.trafficJam

Anda dapat menyesuaikan warna yang mewakili setiap klasifikasi kecepatan tersebut dengan menggunakan setTrafficColorFor(_:color:).