Lớp xếp kề

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

Bạn có thể thêm hình ảnh ở đầu bản đồ của mình dưới dạng Lớp Thẻ thông tin. Các lớp Thẻ thông tin là được đặt phía trên ô bản đồ tại một mức thu phóng cụ thể. Khi có đủ thẻ thông tin, bạn có thể bổ sung cho dữ liệu bản đồ của Google cho toàn bộ bản đồ, ở nhiều mức thu phóng.

Giới thiệu

Lớp xếp kề (đôi khi được gọi là Lớp phủ xếp kề) cho phép bạn xếp chồng hình ảnh lên trên ô bản đồ cơ sở của Google. Đây là một cách hay để thêm dữ liệu - chẳng hạn như địa điểm ưa thích hoặc thông tin giao thông - và hình ảnh địa phương để ứng dụng của bạn. Khi kết hợp với loại bản đồ kGMSTypeNone, lớp xếp kề cho phép bạn thay thế dữ liệu bản đồ cơ sở của Google bằng dữ liệu bản đồ của riêng mình một cách hiệu quả.

Lớp xếp kề rất hữu ích khi bạn muốn thêm hình ảnh phong phú, thường là bao gồm các khu vực địa lý rộng lớn lên bản đồ. Ngược lại, đường đất lớp phủ rất hữu ích khi bạn muốn sửa một hình ảnh riêng lẻ một điểm trên bản đồ.

Toạ độ ô

API Maps chia nhỏ hình ảnh ở mỗi mức thu phóng thành một tập hợp bản đồ hình vuông thẻ thông tin được sắp xếp trong một lưới có thứ tự. Khi bản đồ cuộn đến một vị trí mới hoặc lên một mức thu phóng mới, API Maps sẽ xác định ô nào cần thiết và chuyển dữ liệu đó thành một tập hợp thẻ thông tin để truy xuất.

Để triển khai phép chiếu Mercator của Google, ô có toạ độ (0,0) luôn ở góc tây bắc bản đồ, với giá trị x tăng từ tây sang đông và giá trị y tăng từ bắc xuống nam. Thẻ thông tin được lập chỉ mục bằng toạ độ x,y trong nguồn gốc đó. Ví dụ: tại thu phóng mức 2, khi trái đất được chia thành 16 ô, mỗi ô có thể được được tham chiếu bởi một cặp x,y duy nhất:

Mỗi ô bản đồ là một hình vuông có kích thước 256x256. Ở mức thu phóng 0, toàn bộ thế giới hiển thị trong một thẻ thông tin. Mỗi mức thu phóng sẽ tăng độ phóng to lên là thừa số 2. Vì vậy, ở mức thu phóng 1, bản đồ sẽ được thể hiện dưới dạng lưới 2x2 của các ô hoặc lưới 4x4 ở mức thu phóng 2, lưới 8x8 ở mức thu phóng 3, v.v. Nếu đang tạo hình ảnh cho một lớp ô, bạn sẽ phải tạo một lớp mới Hình ảnh 256x256 điểm cho mỗi ô ở mỗi mức thu phóng mà bạn muốn hỗ trợ.

Thêm một lớp Thẻ thông tin

1. Tạo thực thể cho đối tượng GMSURLTileLayer hoặc một lớp con tuỳ chỉnh của GMSTileLayer/GMSSyncTileLayer.
2. Sửa đổi thuộc tính zIndex để điều chỉnh vị trí của thuộc tính này (không bắt buộc) so với các lớp ô khác.
3. Gán đối tượng GMSTileLayer cho bản đồ bằng cách đặt map của đối tượng này thuộc tính này.

SDK bản đồ dành cho iOS cung cấp ba lớp có thể được sử dụng để triển khai lớp thẻ thông tin. Với mỗi lớp, bạn sẽ cần xác định cách tìm nạp ô bản đồ chính xác cho một tập hợp toạ độ {x,y,zoom} nhất định. Chiến lược phát hành đĩa đơn các lựa chọn hiện có là:

• Lớp con GMSSyncTileLayer, cung cấp việc triển khai tileForX:y:zoom trả về các thực thể UIImage.
• Lớp con GMSTileLayer, cung cấp phương thức triển khai lệnh không đồng bộ phương thức requestTileForX:y:zoom mà sau đó sẽ gọi lại bằng một hình ảnh thẻ thông tin.
• Sử dụng lớp hiện có, GMSURLTileLayer, để tự động tìm nạp thẻ thông tin từ URL, cung cấp khối GMSTileURLConstructor. GMSURLTileLayer là một lớp cụ thể không thể phân lớp con được.

Trong trường hợp phân lớp con GMSSyncTileLayer hoặc GMSTileLayer, việc cung cấp Kết quả ô nil sẽ cho SDK Maps biết dành cho iOS biết rằng dữ liệu hiện đang không có sẵn nhưng có thể sẽ có trong tương lai. Ngoài ra, trả về kGMSTileLayerNoTile để cho biết rằng không có thẻ thông tin nào ở đây vị trí.

Đối với GMSURLTileLayer, việc trả về nil từ GMSTileURLConstructor sẽ cho biết rằng không có ô nào tại vị trí này.

Sử dụng "GMSURLTileLayer" để tìm nạp thẻ thông tin từ URL

GMSURLTileLayer không yêu cầu phân lớp con nhưng bạn phải triển khai khối GMSTileURLConstructor. Mã dưới đây cho biết cách sử dụng GMSURLTileLayer để hiển thị sơ đồ tầng của một toà nhà nhiều tầng.

Swift

let floor = 1

// Implement GMSTileURLConstructor
// Returns a Tile based on the x,y,zoom coordinates, and the requested floor
let urls: GMSTileURLConstructor = { (x, y, zoom) in
  let url = "https://www.example.com/floorplans/L\(floor)_\(zoom)_\(x)_\(y).png"
  return URL(string: url)
}

// Create the GMSTileLayer
let layer = GMSURLTileLayer(urlConstructor: urls)

// Display on the map at a specific zIndex
layer.zIndex = 100
layer.map = mapView
      

Objective-C

NSInteger floor = 1;

// Create the GMSTileLayer
GMSURLTileLayer *layer = [GMSURLTileLayer tileLayerWithURLConstructor:^NSURL * _Nullable(NSUInteger x, NSUInteger y, NSUInteger zoom) {
  NSString *url = [NSString stringWithFormat:@"https://www.example.com/floorplans/L%ld_%lu_%lu_%lu.png",
                   (long)floor, (unsigned long)zoom, (unsigned long)x, (unsigned long)y];
  return [NSURL URLWithString:url];
}];

// Display on the map at a specific zIndex
layer.zIndex = 100;
layer.map = mapView;
      

Lớp con GMSSyncTileLayer để phân phát thẻ thông tin dưới dạng UIImage

GMSSyncTileLayer và GMSTileLayer là các lớp trừu tượng được thiết kế để phân lớp con. Bạn có thể dùng các lớp này để phân phát thẻ thông tin dưới dạng UIImage. Dưới đây ví dụ cho thấy cách hiển thị hình ảnh tuỳ chỉnh trên một số ô trên bản đồ bằng cách phân lớp con GMSSyncTileLayer.

Swift

class TestTileLayer: GMSSyncTileLayer {
  override func tileFor(x: UInt, y: UInt, zoom: UInt) -> UIImage? {
    // On every odd tile, render an image.
    if (x % 2 == 1) {
      return UIImage(named: "australia")
    } else {
      return kGMSTileLayerNoTile
    }
  }
}

      

Objective-C

@interface TestTileLayer : GMSSyncTileLayer
@end

@implementation TestTileLayer

- (UIImage *)tileForX:(NSUInteger)x y:(NSUInteger)y zoom:(NSUInteger)zoom {
  // On every odd tile, render an image.
  if (x % 2 == 1) {
    return [UIImage imageNamed:@"australia"];
  } else {
    return kGMSTileLayerNoTile;
  }
}

@end
      

Để thêm lớp vào bản đồ của bạn, hãy tạo thực thể cho đối tượng và đặt thuộc tính bản đồ của đối tượng đó.

Swift

let layer = TestTileLayer()
layer.map = mapView
      

Objective-C

GMSTileLayer *layer = [[TestTileLayer alloc] init];
layer.map = mapView;
      

Ô DPI cao dành cho thiết bị Retina

Bạn có thể sử dụng hình ảnh có DPI cao bằng GMSSyncTileLayer hoặc GMSURLTileLayer bằng cách đặt tileSize thành 512. Thuộc tính tileSize cho biết số pixel mà thẻ thông tin được trả về hình ảnh sẽ được ưu tiên hiển thị dưới dạng; Giá trị mặc định là 256 — phương diện. của ô Google Maps trên một thiết bị không dùng công nghệ Retina.

Nếu đang hiển thị các ô DPI bình thường trên thiết bị có DPI cao, bạn có thể điều chỉnh tỷ lệ thiết lập hình ảnh bằng cách đặt tileSize thành 512. Xin lưu ý rằng việc nâng cấp hình ảnh có thể làm giảm chất lượng ảnh, đặc biệt là đối với đường kẻ hoặc văn bản nhỏ. Để có kết quả tốt nhất, hãy khớp tileSize và DPI hình ảnh vào màn hình. Bản đồ hiển thị trên một thiết bị Retina sẽ trông đẹp nhất khi hiển thị hình ảnh có DPI cao với tileSize là 512; trong khi bản đồ hiển thị trên một thiết bị không phải là Retina sẽ hiển thị rất đẹp với hình ảnh thông thường và tileSize mặc định là 256.

Lưu ý: Bạn không nên dùng các giá trị dưới 256 cho thiết bị sử dụng màn hình Retina.

Xoá thẻ thông tin cũ

Nếu các ô do lớp cung cấp trở nên "đã lỗi thời", thì phương thức clearTileCache phải được gọi trên lớp để buộc làm mới. Thao tác này sẽ khiến tất cả các ô trên lớp này phải được tải lại.

Swift

layer.clearTileCache()
      

Objective-C

[layer clearTileCache];