ก่อนที่จะปรับแต่งเครื่องหมาย (หรือเส้นหลายส่วน) คุณต้องเริ่มต้นตัวเลือกการปรับแต่ง UI ก่อน
เริ่มต้นตัวเลือกการปรับแต่ง UI
ประกาศ Callback ที่แนะนำซึ่งใช้ในการตั้งค่าตัวเลือกการปรับแต่ง 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.
}
ปรับแต่งเครื่องหมาย
ตัวอย่างต่อไปนี้ใช้ GMTCMapView เพื่อปรับแต่งรูปแบบเครื่องหมาย
หากต้องการตั้งค่าประเภทเครื่องหมายและพร็อพเพอร์ตี้ ให้ใช้
setMarkerStyleOptions(_:markerType:) ตัวเลือกเครื่องหมายที่กำหนดเองจะลบล้างค่าเริ่มต้นที่ Consumer SDK ระบุ
Swift
/** MapViewController.swift */
func updateMarkerUIOptions() {
  let customizableMarkerType = GMTCCustomizableMarkerType.tripVehicle
  let markerStyleOptions = GMTCMutableMarkerStyleOptions()
  markerStyleOptions.groundAnchor = groundAnchor
  markerStyleOptions.isVisible = true
  markerStyleOptions.icon = icon
  markerStyleOptions.zIndex = 100
  markerStyleOptions.isFlat = false
  let coordinator = self.mapView.consumerMapStyleCoordinator
  coordinator.setMarkerStyleOptions(markerStyleOptions, markerType: customizableMarkerType)
}
/** To restore the default values, call setMarkerStyleOptions(_:markerType:) using nil for the GMTCMarkerStyleOptions parameter.
Here is an example of retrieving the active GMTCMarkerStyleOptions. */
private func retrieveMarkerStyle(markerType: GMTCCustomizableMarkerType) {
  let styleCoordinator = mapView.consumerMapStyleCoordinator
  // The 'markerStyleOptions' contains the stored style options for this marker type.
  let markerStyleOptions = styleCoordinator.markerStyleOptions(for: markerType)
}
Objective-C
/** MapViewController.m */
- (void)updateMarkerUIOptions {
  // The marker type that you would like to set custom UI options for.
  GMTCCustomizableMarkerType customizableMarkerType = GMTCCustomizableMarkerTypeTripVehicle;
  GMTCMutableMarkerStyleOptions *markerStyleOptions =
      [[GMTCMutableMarkerStyleOptions alloc] init];
  markerStyleOptions.groundAnchor = groundAnchor;
  markerStyleOptions.isVisible = YES;
  markerStyleOptions.icon = icon;
  markerStyleOptions.zIndex = 100;
  markerStyleOptions.isFlat = NO;
  [[_mapView consumerMapStyleCoordinator] setMarkerStyleOptions:markerStyleOptions markerType:customizableMarkerType];
}
/** To restore the default values, call setMarkerStyleOptions:markerStyleOptions:markerType: using nil for the GMTCMarkerStyleOptions parameter.
Here is an example of retrieving the active GMTCMarkerStyleOptions. */
- (void)retrieveMarkerStyle:(GMTCCustomizableMarkerType)markerType {
  GMTCConsumerMapStyleCoordinator *styleCoordinator = _mapView.consumerMapStyleCoordinator;
  // The 'markerStyleOptions' contains the stored style options for this marker type.
  GMTCMarkerStyleOptions *markerStyleOptions = [styleCoordinator markerStyleOptionsForType:markerType];
}
ประเภทเครื่องหมาย
คุณปรับแต่งเครื่องหมายต่อไปนี้ได้
- GMTCCustomizableMarkerType.unknown
- GMTCCustomizableMarkerType.tripPickupPoint
- GMTCCustomizableMarkerType.tripDropoffPoint
- GMTCCustomizableMarkerType.tripVehicle
- GMTCCustomizableMarkerType.intermediateDestination
ใช้ GMTCCustomizableMarkerType.tripPickupPoint
GMTCCustomizableMarkerType.intermediateDestination และ
GMTCCustomizableMarkerType.tripDropoffPoint เพื่อปรับแต่งจุดแวะพักเมื่อ
แชร์การเดินทาง
ใช้ GMTCCustomizableMarkerType.tripVehicle เพื่อปรับแต่งไอคอนยานพาหนะ
เมื่อแชร์การเดินทาง ไอคอนเครื่องหมายจะไม่เปลี่ยนแปลง
ตามประเภทพาหนะจริงสำหรับการเดินทาง
ตัวเลือกมาร์คเกอร์
พร็อพเพอร์ตี้ที่ปรับแต่งได้ซึ่งพร้อมใช้งานสำหรับเครื่องหมายแต่ละรายการเป็นชุดย่อยของ
พร็อพเพอร์ตี้ที่ Google Maps จัดให้
MarkerOptions
Consumer SDK
GMTCMarkerStyleOptions
มีลักษณะดังนี้
- สร้างโดยใช้ตัวเริ่มต้น
- เปลี่ยนแปลงไม่ได้เมื่อสร้างแล้ว
- มีค่าเริ่มต้น คุณจึงต้องระบุค่าที่กำหนดเองเท่านั้น
คุณปรับแต่งพร็อพเพอร์ตี้ต่อไปนี้ได้
- groundAnchor
- isVisible: หากต้องการปิดเครื่องหมาย ให้ตั้งค่า- isVisibleเป็น false คุณควรระบุข้อมูลให้เพียงพอเพื่ออนุญาตให้คุณใช้องค์ประกอบ UI ของคุณเองแทน
- iconView
- icon
- zIndex
- isFlat
ตัวอย่าง
Swift
/** MapViewController.swift */
private func updateMarkerUIOptions() {
  // Get the GMTCConsumerMapStyleCoordinator
  let consumerMapStyleCoordinator = mapView.consumerMapStyleCoordinator
  // The marker type that you would like to set custom UI options for.
  let customizableMarkerType = GMTCCustomizableMarkerType.tripVehicle
  // Initializing marker options.
  let markerStyleOptions = GMTCMutableMarkerStyleOptions()
  markerStyleOptions.groundAnchor = kGMSMarkerDefaultGroundAnchor
  markerStyleOptions.icon = icon
  markerStyleOptions.zIndex = 100
  markerStyleOptions.isFlat = false
  markerStyleOptions.isVisible = true
  consumerMapStyleCoordinator.setMarkerStyleOptions(markerStyleOptions, markerType: customizableMarkerType)
  // Reset marker options to default values.
  consumerMapStyleCoordinator.setMarkerStyleOptions(nil, markerType: customizableMarkerType)
}
Objective-C
/** MapViewController.m */
- (void)updateMarkerUIOptions {
  // Get the GMTCConsumerMapStyleCoordinator
  GMTCConsumerMapStyleCoordinator *consumerMapStyleCoordinator = [_mapView consumerMapStyleCoordinator];
  // The marker type that you would like to set custom UI options for.
  GMTCCustomizableMarkerType customizableMarkerType = GMTCCustomizableMarkerTypeTripVehicle;
  // Initializing marker options.
  GMTCMutableMarkerStyleOptions *markerStyleOptions =
      [[GMTCMutableMarkerStyleOptions alloc] init];
  markerStyleOptions.groundAnchor = kGMSMarkerDefaultGroundAnchor;
  markerStyleOptions.icon = icon;
  markerStyleOptions.zIndex = 100;
  markerStyleOptions.isFlat = NO;
  markerStyleOptions.isVisible = YES;
  [consumerMapStyleCoordinator setMarkerStyleOptions:markerStyleOptions markerType:customizableMarkerType];
  // Reset marker options to default values.
  [consumerMapStyleCoordinator setMarkerStyleOptions:nil markerType:customizableMarkerType];
}
การอัปเดต ETA แบบไดนามิกสำหรับเครื่องหมายการรับสินค้า
หากต้องการสร้างเครื่องหมายการรับสินค้าที่แสดงเวลาที่คาดว่าจะถึง (ETA) ที่อัปเดตแบบไดนามิกเป็นระยะๆ
ให้อัปเดตตัวเลือกรูปแบบเครื่องหมายสำหรับ
GMTCCustomizableMarkerType.tripPickupPoint
ตัวอย่าง
Swift
/** MapViewController.swift */
/// Updates the ETA every minute by creating a Timer that repeats every minute.
private func schedulePickupMarkerStyleUpdates() {
  Timer.scheduledTimer(
    timeInterval: 60.0,  // Update marker ETA every minute.
    target: self,
    selector: #selector(updatePickupMarkerETA),
    userInfo: nil,
    repeats: true)
}
/// Updates the marker options for GMTCCustomizableMarkerType.tripPickupPoint for the current time.
@objc private func updatePickupMarkerETA() {
  let consumerMapStyleCoordinator = mapView.consumerMapStyleCoordinator
  let previousOptions = consumerMapStyleCoordinator.markerStyleOptions(for: .tripPickupPoint)
  // Get updated ETA icon.
  let updatedETAIcon = pickupIconForCurrentTime()
  let markerStyleOptions = GMTCMutableMarkerStyleOptions()
  markerStyleOptions.groundAnchor = kGMSMarkerDefaultGroundAnchor
  markerStyleOptions.icon = updatedETAIcon
  markerStyleOptions.zIndex = 100
  markerStyleOptions.isFlat = false
  markerStyleOptions.isVisible = true
  consumerMapStyleCoordinator.setMarkerStyleOptions(markerStyleOptions, markerType: .tripPickupPoint)
}
Objective-C
/** MapViewController.m */
/** Updates the ETA every minute by creating an NSTimer that repeats every minute. */
- (void)schedulePickupMarkerStyleUpdates {
  [NSTimer scheduledTimerWithTimeInterval:60.0 // Update marker ETA every minute.
                                   target:self
                                 selector:@selector(updatePickupMarkerETA)
                                 userInfo:nil
                                  repeats:YES];
}
/** Updates the marker options for GMTCCustomizableMarkerTypeTripPickupPoint for the current time. */
- (void)updatePickupMarkerETA {
  GMTCConsumerMapStyleCoordinator *consumerMapStyleCoordinator = [_mapView consumerMapStyleCoordinator];
  GMTCMarkerStyleOptions *previousOptions = [consumerMapStyleCoordinator markerStyleOptionsForType:GMTCCustomizableMarkerTypeTripPickupPoint];
  // Get updated ETA icon.
  UIImage *updatedETAIcon = [self pickupIconForCurrentTime];
  GMTCMutableMarkerStyleOptions *markerStyleOptions =
                               [[GMTCMutableMarkerStyleOptions alloc] init];
  markerStyleOptions.groundAnchor = kGMSMarkerDefaultGroundAnchor;
  markerStyleOptions.icon = updatedETAIcon;
  markerStyleOptions.zIndex = 100;
  markerStyleOptions.isFlat = NO;
  markerStyleOptions.isVisible = YES;
  [consumerMapStyleCoordinator setMarkerStyleOptions:markerStyleOptions markerType:GMTCCustomizableMarkerTypeTripPickupPoint];
}