Menyesuaikan polyline rute

Pilih platform: Android iOS JavaScript

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

Melakukan inisialisasi opsi penyesuaian UI

Callback yang direkomendasikan yang digunakan untuk menetapkan opsi penyesuaian UI terlebih dahulu dideklarasikan dalam GMTCMapViewDelegate. mapViewDidInitialize callback akan 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.
}

Menyesuaikan polyline

Penyesuaian polyline disetel menggunakan GMTCConsumerMapStyleCoordinator#setPolylineStyleOptions(_:polylineType:).

Contoh berikut menunjukkan cara menetapkan opsi gaya polyline:

Jenis polyline

Anda dapat menyesuaikan jenis polyline berikut:

  • GMTCPolylineType.activeRoute: Rute yang dilalui kendaraan ke di titik berikutnya, apakah itu penjemputan atau pengantaran.
  • GMTCPolylineType.remainingRoute: Segmen perjalanan yang tersisa setelah kendaraan menyelesaikan GMTCPolylineType.activeRoute.

Kedua jenis konten ini ditampilkan di sepanjang perjalanan bersama.

Properti polyline

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

  • Dibangun menggunakan penginisialisasi.
  • Dapat menjadi tidak dapat diubah atau dapat diubah 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 berbasis traffic

Lapisan lalu lintas polyline dinonaktifkan secara default. Saat Anda mengaktifkannya menggunakan polylineStyleOptions.isTrafficEnabled = true, segmen yang mewakili jalur lalu lintas yang tidak normal akan digambar sebagai rute.

Kondisi lalu lintas direpresentasikan sebagai salah satu dari empat kecepatan:

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

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