Nhóm điểm đánh dấu

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

Trang này mô tả tiện ích phân nhóm đánh dấu có sẵn trong thư viện tiện ích dành cho SDK Maps dành cho iOS.

Bằng cách nhóm các điểm đánh dấu, bạn có thể đặt một số lượng lớn điểm đánh dấu trên bản đồ mà không làm cho bản đồ khó đọc. Tiện ích phân nhóm điểm đánh dấu giúp bạn quản lý nhiều điểm đánh dấu ở các mức thu phóng khác nhau.

Khi người dùng xem bản đồ ở mức thu phóng cao, các điểm đánh dấu riêng lẻ sẽ hiển thị trên bản đồ. Khi người dùng thu nhỏ, các điểm đánh dấu sẽ tập hợp thành các cụm để giúp xem bản đồ dễ dàng hơn.

Ảnh chụp màn hình sau đây hiển thị kiểu mặc định của cụm đánh dấu:

Một bản đồ có các điểm đánh dấu theo cụm trong kiểu mặc định

Dưới đây là ví dụ về các cụm điểm đánh dấu tuỳ chỉnh:

Một bản đồ có các điểm đánh dấu cụm được tùy chỉnh

Điều kiện tiên quyết và ghi chú

SDK Maps dành cho Thư viện tiện ích iOS

Tiện ích phân nhóm đánh dấu là một phần của SDK Maps dành cho Thư viện tiện ích iOS. Nếu bạn chưa thiết lập thư viện, hãy làm theo hướng dẫn thiết lập trước khi đọc phần còn lại của trang này.

Để có hiệu suất tốt nhất, số lượng điểm đánh dấu tối đa được đề xuất là 10.000.

Quyền truy cập thông tin vị trí

Ví dụ này sử dụng GPS của thiết bị để xác định vị trí người dùng và bản đồ trên tọa độ của họ. Để bật tính năng này, bạn phải thêm nội dung mô tả vào quyền NSLocationWhenInUseUsageDescription trong tệp Info.plist của dự án.

Để thêm, hãy làm như sau:

  1. Nhấp vào tệp Info.plist trong Trình điều hướng dự án trong Xcode để mở Trình chỉnh sửa danh sách thuộc tính.
  2. Nhấp vào biểu tượng &hl=vi' các biểu tượng bên cạnh &# 39;Thông tin thuộc tính thông tin&# 39; để thêm thuộc tính mới.
  3. Trong trường & khóa 33. Xcode sẽ tự động dịch nội dung này thành tên dài ' Privacy – Vị trí khi đang sử dụng Mô tả sử dụng'. Để nắm được danh sách đầy đủ các thuộc tính cấp quyền truy cập thông tin vị trí, hãy xem phần Yêu cầu ủy quyền cho Dịch vụ vị trí trong tài liệu dành cho Nhà phát triển của Apple.
  4. Để trường " & 39; Type&# 39; được đặt thành &# 39; string&# 39 ;.
  5. Trong trường "giá trị 39", hãy nhập nội dung mô tả lý do ứng dụng của bạn yêu cầu sử dụng vị trí của người dùng. Ví dụ: "Xác định vị trí người dùng để cung cấp danh sách doanh nghiệp lân cận."

Triển khai phân nhóm điểm đánh dấu

Việc triển khai phân nhóm điểm đánh dấu gồm ba bước:

  1. Tạo thực thể trình quản lý cụm.
  2. Truyền các điểm đánh dấu bạn muốn nhóm vào trình quản lý cụm.
  3. Gọi trình quản lý cụm.
Để xem ví dụ đầy đủ về cách triển khai tính năng phân nhóm đánh dấu, hãy xem các ứng dụng ví dụ về Objective-C và Swift trên GitHub.

Tạo trình quản lý cụm

Để sử dụng trình quản lý cụm, hãy làm như sau:

  1. Đặt ViewController mà bản đồ của bạn hiển thị để tuân thủ giao thức GMSMapViewDelegate.
  2. Tạo một thực thể của GMUClusterManager.
  3. Chuyển thực thể của GMSMapView mà bạn muốn triển khai tính năng phân nhóm đánh dấu và triển khai các giao thức sau cho thực thể GMUClusterManager:
    • GMUClusterIconGenerator: Cung cấp logic ứng dụng tìm nạp biểu tượng cụm để sử dụng ở các mức thu phóng khác nhau.
    • GMUClusterAlgorithm: Chỉ định một thuật toán xác định hành vi của cách nhóm các điểm đánh dấu, chẳng hạn như khoảng cách giữa các điểm đánh dấu để đưa vào cùng một cụm.
    • GMUClusterRenderer: Cung cấp logic ứng dụng xử lý quá trình kết xuất thực tế của các biểu tượng cụm trên bản đồ.
  4. Đặt uỷ quyền bản đồ trên thực thể GMUClusterManager.

Thư viện tiện ích bao gồm cả phương thức triển khai mặc định của trình tạo biểu tượng (GMUDefaultClusterIconGenerator), thuật toán (GMUNonHierarchicalDistanceBasedAlgorithm) và trình kết xuất (GMUDefaultClusterRenderer). Bạn có thể tùy ý tạo trình tạo biểu tượng, thuật toán và trình kết xuất tuỳ chỉnh của riêng mình.

Mã sau đây tạo ra trình quản lý cụm bằng cách sử dụng các giá trị mặc định sau trong lệnh gọi lại viewDidLoad của ViewController:

Swift

import GoogleMaps
import GoogleMapsUtils

class MarkerClustering: UIViewController, GMSMapViewDelegate {
  private var mapView: GMSMapView!
  private var clusterManager: GMUClusterManager!

  override func viewDidLoad() {
    super.viewDidLoad()

    // Set up the cluster manager with the supplied icon generator and
    // renderer.
    let iconGenerator = GMUDefaultClusterIconGenerator()
    let algorithm = GMUNonHierarchicalDistanceBasedAlgorithm()
    let renderer = GMUDefaultClusterRenderer(mapView: mapView,
                                clusterIconGenerator: iconGenerator)
    clusterManager = GMUClusterManager(map: mapView, algorithm: algorithm,
                                                      renderer: renderer)

    // Register self to listen to GMSMapViewDelegate events.
    clusterManager.setMapDelegate(self)
    // ...
  }
  // ...
}
      

Objective-C

@import GoogleMaps;
@import GoogleMapsUtils;

@interface MarkerClustering () <GMSMapViewDelegate>

@end

@implementation MarkerClustering {
  GMSMapView *_mapView;
  GMUClusterManager *_clusterManager;
}

- (void)viewDidLoad {
  [super viewDidLoad];

  // Set up the cluster manager with a supplied icon generator and renderer.
  id<GMUClusterAlgorithm> algorithm =
      [[GMUNonHierarchicalDistanceBasedAlgorithm alloc] init];
  id<GMUClusterIconGenerator> iconGenerator =
      [[GMUDefaultClusterIconGenerator alloc] init];
  id<GMUClusterRenderer> renderer =
      [[GMUDefaultClusterRenderer alloc] initWithMapView:_mapView
                                    clusterIconGenerator:iconGenerator];
  _clusterManager =
      [[GMUClusterManager alloc] initWithMap:_mapView
                                   algorithm:algorithm
                                    renderer:renderer];

  // Register self to listen to GMSMapViewDelegate events.
  [_clusterManager setMapDelegate:self];
  // ...
}
// ...
@end
      

Thêm điểm đánh dấu

Có hai cách để thêm điểm đánh dấu vào bộ phân đoạn điểm đánh dấu: riêng lẻ hoặc dưới dạng một mảng.

Điểm đánh dấu cá nhân

Swift

let position = CLLocationCoordinate2D(latitude: 47.60, longitude: -122.33)
let marker = GMSMarker(position: position)
clusterManager.add(marker)
      

Objective-C

CLLocationCoordinate2D position = CLLocationCoordinate2DMake(47.60, -122.33);
GMSMarker *marker = [GMSMarker markerWithPosition:position];
[_clusterManager addItem:marker];
      

Mảng điểm đánh dấu

Swift

let position1 = CLLocationCoordinate2D(latitude: 47.60, longitude: -122.33)
let marker1 = GMSMarker(position: position1)

let position2 = CLLocationCoordinate2D(latitude: 47.60, longitude: -122.46)
let marker2 = GMSMarker(position: position2)

let position3 = CLLocationCoordinate2D(latitude: 47.30, longitude: -122.46)
let marker3 = GMSMarker(position: position3)

let position4 = CLLocationCoordinate2D(latitude: 47.20, longitude: -122.23)
let marker4 = GMSMarker(position: position4)

let markerArray = [marker1, marker2, marker3, marker4]
clusterManager.add(markerArray)
      

Objective-C

CLLocationCoordinate2D position1 = CLLocationCoordinate2DMake(47.60, -122.33);
GMSMarker *marker1 = [GMSMarker markerWithPosition:position1];

CLLocationCoordinate2D position2 = CLLocationCoordinate2DMake(47.60, -122.46);
GMSMarker *marker2 = [GMSMarker markerWithPosition:position2];

CLLocationCoordinate2D position3 = CLLocationCoordinate2DMake(47.30, -122.46);
GMSMarker *marker3 = [GMSMarker markerWithPosition:position3];

CLLocationCoordinate2D position4 = CLLocationCoordinate2DMake(47.20, -122.23);
GMSMarker *marker4 = [GMSMarker markerWithPosition:position4];

NSArray<GMSMarker *> *markerArray = @[marker1, marker2, marker3, marker4];
[_clusterManager addItems:markerArray];
      

Gọi trình phân loại điểm đánh dấu

Sau khi tạo trình tạo điểm đánh dấu và chuyển điểm đánh dấu mà bạn muốn phân nhóm, bạn chỉ cần gọi phương thức cluster trên phiên bản trình phân tích điểm đánh dấu.

Swift

clusterManager.cluster()
      

Objective-C

[_clusterManager cluster];
      

Xử lý sự kiện trên các điểm đánh dấu và cụm

Nhìn chung, khi sử dụng SDK Maps dành cho iOS, bạn phải triển khai giao thức GMSMapViewDelegate để nghe các sự kiện trên bản đồ. Bạn có thể theo dõi các sự kiện trên bản đồ, nhưng không thể nghe các sự kiện trên trình quản lý cụm an toàn. Khi người dùng nhấn vào một điểm đánh dấu, một mục riêng lẻ của cụm hoặc một cụm, API sẽ kích hoạt mapView:didTapMarker: và đính kèm dữ liệu cụm bổ sung vào thuộc tính marker.userData. Sau đó, bạn có thể kiểm tra xem userData có tuân thủ giao thức GMUCluster hay không để xác định xem biểu tượng cụm hoặc điểm đánh dấu có được nhấn vào hay không.

Swift

func mapView(_ mapView: GMSMapView, didTap marker: GMSMarker) -> Bool {
  // center the map on tapped marker
  mapView.animate(toLocation: marker.position)
  // check if a cluster icon was tapped
  if marker.userData is GMUCluster {
    // zoom in on tapped cluster
    mapView.animate(toZoom: mapView.camera.zoom + 1)
    NSLog("Did tap cluster")
    return true
  }

  NSLog("Did tap a normal marker")
  return false
}
      

Objective-C

- (BOOL)mapView:(GMSMapView *)mapView didTapMarker:(GMSMarker *)marker {
  // center the map on tapped marker
    [_mapView animateToLocation:marker.position];
    // check if a cluster icon was tapped
    if ([marker.userData conformsToProtocol:@protocol(GMUCluster)]) {
      // zoom in on tapped cluster
      [_mapView animateToZoom:_mapView.camera.zoom + 1];
      NSLog(@"Did tap cluster");
      return YES;
    }

    NSLog(@"Did tap marker in cluster");
    return NO;
}
      

Trình quản lý cụm này hiện chặn mọi sự kiện mà bạn đã triển khai trên clusterManager. Lớp này sẽ chuyển tiếp mọi sự kiện còn lại đến ủy quyền bản đồ (nếu có). Xin lưu ý rằng các sự kiện cho điểm đánh dấu chuẩn (nghĩa là các điểm đánh dấu không do trình kết xuất cụm tạo ra) luôn được chuyển tiếp đến đại biểu trên bản đồ.

Tùy chỉnh phân nhóm điểm đánh dấu

Bạn có thể cung cấp phương thức triển khai tuỳ chỉnh cho GMUClusterRenderer, GMUClusterIconGenerator hoặc GMUClusterAlgorithm. Bạn có thể căn cứ vào cách triển khai tuỳ chỉnh của mình dựa trên việc triển khai mẫu của các giao thức có trong thư viện tiện ích, hoặc bạn có thể mã hoá cách triển khai tuỳ chỉnh hoàn toàn bằng cách thực hiện các giao thức.