경로 다중선 맞춤설정

플랫폼 선택: Android iOS JavaScript

경로 폴리라인 (또는 마커)을 맞춤설정하기 전에 먼저 UI 맞춤설정 옵션을 초기화해야 합니다.

UI 맞춤설정 옵션 초기화

UI 맞춤설정 옵션을 초기 설정하는 데 사용되는 권장 콜백은 GMTCMapViewDelegate에 선언됩니다. mapViewDidInitialize 콜백은 GMTCMapView 객체가 지도를 렌더링할 준비가 되면 트리거됩니다. 스타일 코디네이터가 초기화되었지만 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.
}

다중선 맞춤설정

다중선 맞춤설정은 GMTCConsumerMapStyleCoordinator#setPolylineStyleOptions(_:polylineType:)를 사용하여 설정됩니다.

다음 예에서는 폴리라인 스타일 옵션을 설정하는 방법을 보여줍니다.

다중선 유형

다음 폴리라인 유형을 맞춤설정할 수 있습니다.

  • GMTCPolylineType.activeRoute: 차량이 승차 또는 하차 등 승객의 다음 지점으로 이동하는 경로입니다.
  • GMTCPolylineType.remainingRoute: 차량이 GMTCPolylineType.activeRoute을 완료한 후 남은 이동 구간입니다.

두 유형 모두 공유 여정 전체에 표시됩니다.

다중선 속성

각 폴리라인에 대해 맞춤설정할 수 있는 속성은 Google 지도 PolylineOptions에 제공된 속성의 하위 집합입니다. 소비자 SDK GMTCPolylineStyleOptions 속성에는 다음과 같은 특징이 있습니다.

  • 이니셜라이저를 사용하여 빌드되었습니다.
  • 속성에 맞춤 값을 제공하려면 변경 불가 또는 변경 가능할 수 있습니다.
  • 기본값이 있습니다.

다음 속성을 맞춤설정할 수 있습니다.

  • color
  • width
  • isVisible: 폴리선을 사용 중지하려면 isVisible를 false로 설정합니다.
  • isTrafficEnabled: 이 속성은 기본적으로 false로 설정됩니다.

예

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];
}

교통 상황을 고려한 다중선

폴리라인의 교통 레이어는 기본적으로 사용 중지되어 있습니다. polylineStyleOptions.isTrafficEnabled = true를 사용하여 사용 설정하면 비정상 트래픽 구간을 나타내는 세그먼트가 경로로 그려집니다.

교통상황은 다음 네 가지 속도 중 하나로 표시됩니다.

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

setTrafficColorFor(_:color:)를 사용하여 각 속도 분류를 나타내는 색상을 맞춤설정할 수 있습니다.