Bắt đầu

Chọn nền tảng: Android iOS JavaScript

Để sử dụng định kiểu theo hướng dữ liệu cho các ranh giới, bạn phải tạo ID bản đồ. Tiếp theo, bạn phải tạo một kiểu bản đồ mới, chọn các lớp đối tượng ranh giới cần thiết và liên kết kiểu với mã bản đồ của bạn.

Tạo mã bản đồ

mapID là giá trị nhận dạng duy nhất đại diện cho một bản sao của Google Maps. Bạn có thể tạo mã bản đồ và cập nhật kiểu liên kết với mã bản đồ bất cứ lúc nào trong Google Cloud Console.

Ảnh chụp màn hình Google Cloud Console

Tạo kiểu bản đồ mới

Để tạo kiểu bản đồ mới, hãy làm theo hướng dẫn trong mục Quản lý bản đồ kiểu để tạo phong cách. Sau khi hoàn thành, hãy liên kết kiểu với mã bản đồ mới tạo.

Chọn lớp đối tượng

Trong Google Cloud Console, bạn có thể chọn lớp đối tượng để hiển thị. Chiến dịch này xác định loại ranh giới xuất hiện trên bản đồ (ví dụ: địa phương, trạng thái, v.v.).

Quản lý lớp đối tượng

  1. Trong Google Cloud Console, hãy chuyển đến trang Map Styles (Kiểu bản đồ)

  2. Chọn một dự án nếu được nhắc.

  3. Chọn một kiểu bản đồ.

  4. Nhấp vào menu thả xuống Lớp đối tượng để thêm hoặc xóa lớp.

  5. Nhấp vào Lưu để lưu các thay đổi và làm cho chúng khả dụng cho bản đồ của bạn.

Ảnh chụp màn hình cho thấy
trình đơn thả xuống.

Cập nhật mã khởi chạy bản đồ

Bước này yêu cầu liên kết ID bản đồ với một kiểu có một hoặc nhiều đối tượng lớp được bật. Để xác minh rằng mã bản đồ của bạn được thiết lập chính xác trong Cloud Console, xem cách định cấu hình bảng điều khiển này trong Maps Quản lý.

Swift

// A map ID using a style with one or more feature layers enabled

let mapID = GMSMapID(identifier: "YOUR_MAP_ID")
let mapView = GMSMapView(frame: .zero, mapID: mapID, camera: GMSCameraPosition(latitude: 40, longitude: -80, zoom: 7))

Objective-C

// A map ID using a style with one or more feature layers enabled

GMSMapID *mapID = [GMSMapID mapIDWithIdentifier:@"MAP_ID"];
GMSMapView *mapView = [GMSMapView mapWithFrame:CGRectZero mapID:mapID camera:[GMSCameraPosition cameraWithLatitude:40 longitude:-80 zoom:7]];

Thêm lớp đối tượng vào bản đồ

Để lấy tham chiếu đến một lớp đối tượng trên bản đồ của bạn, hãy gọi mapView.featureLayer(of:) khi bản đồ khởi chạy:

Swift

let layer = mapView.featureLayer(of: .locality)

Objective-C

GMSFeatureLayer *layer = [mapView featureLayerOfFeatureType:GMSFeatureTypeLocality];

Kiểm tra các chức năng của bản đồ

Định kiểu theo hướng dữ liệu cho các ranh giới yêu cầu các khả năng được bật trong Google Cloud Console và được liên kết với một mã bản đồ. Bởi vì mã bản đồ phải tuân theo thay đổi, bạn có thể gọi mapView.mapCapabilities trên GMSMapView để xác minh xem một chức năng nhất định (ví dụ: định kiểu theo hướng dữ liệu) luôn có sẵn trước khi gọi phương thức đó.

Bạn cũng có thể phát hiện các thay đổi về các khả năng của bản đồ bằng cách đăng ký GMSViewDelegate. Ví dụ này cho thấy cách sử dụng để kiểm tra các yêu cầu về định kiểu dựa trên dữ liệu.

Swift

class SampleViewController: UIViewController {

  private lazy var mapView: GMSMapView = GMSMapView(frame: .zero, mapID: GMSMapID(identifier: "YOUR_MAP_ID"), camera: GMSCameraPosition(latitude: 40, longitude: -80, zoom: 7))

  override func loadView() {
    self.view = mapView
    mapView.delegate = self
  }
}

extension SampleViewController: GMSMapViewDelegate {
  func mapView(_ mapView: GMSMapView, didChange mapCapabilities: GMSMapCapabilityFlags) {
    if (!mapCapabilities.contains(.dataDrivenStyling)) {
      // Data-driven styling is *not* available, add a fallback.
      // Existing feature layers are also unavailable.
    }
  }
}

Objective-C

@interface SampleViewController: UIViewController <GMSMapViewDelegate>
@end

@implementation SampleViewController
- (void)loadView {
  GMSMapView *mapView = [GMSMapView mapWithFrame:CGRectZero mapID:[GMSMapID mapIDWithIdentifier:@"MAP_ID"] camera:[GMSCameraPosition cameraWithLatitude:40 longitude:-80 zoom:7]];
  mapView.delegete = self;
  self.view = mapView;
}

- (void)mapView:(GMSMapView *)mapView didChangeMapCapabilities:(GMSMapCapabilityFlags)mapCapabilities {
  if (!(mapCapabilities & GMSMapCapabilityFlagsDataDrivenStyling)) {
    // Data-driven styling is *not* available, add a fallback.
    // Existing feature layers are also unavailable.
  }
}
@end