Layer Petak

Pilih platform: Android iOS JavaScript

Anda bisa menambahkan gambar di atas peta sebagai Layer Petak. Lapisan Ubin adalah ditempatkan di atas ubin peta pada tingkat zoom tertentu. Dengan jumlah ubin yang cukup, Anda dapat melengkapi data peta Google untuk keseluruhan peta, di berbagai tingkat zoom.

Pengantar

Lapisan ubin (kadang-kadang disebut sebagai Overlay Ubin) memungkinkan Anda untuk menempatkan gambar di atas ubin peta dasar Google. Ini adalah cara yang baik untuk menambahkan data - seperti lokasi menarik atau informasi lalu lintas - dan citra lokal untuk aplikasi Anda. Jika digabungkan dengan jenis peta kGMSTypeNone, lapisan petak secara efektif memungkinkan Anda mengganti data peta dasar Google dengan data Anda sendiri.

Lapisan ubin berguna jika Anda ingin menambahkan gambar yang besar, biasanya yang mencakup area geografis yang luas, hingga ke peta. Sebaliknya, darat overlay berguna jika Anda ingin menetapkan satu gambar sekaligus menunjuk pada peta.

Koordinat ubin

Maps API membagi gambar pada setiap tingkat zoom menjadi satu set peta persegi ubin, yang disusun dalam kisi berurutan. Jika peta di-scroll ke lokasi baru, atau ke tingkat zoom baru, Maps API akan menentukan ubin diperlukan, lalu menerjemahkannya menjadi satu set ubin yang akan diambil.

Untuk implementasi proyeksi Mercator Google, petak dengan koordinat (0,0) selalu berada di sudut barat laut peta, dengan nilai x meningkat dari barat ke timur dan nilai y meningkat dari utara ke selatan. Kartu diindeks menggunakan koordinat x,y dari asal tersebut. Misalnya, di tingkat zoom 2, ketika bumi dibagi menjadi 16 ubin, setiap ubin dapat yang direferensikan oleh pasangan x,y unik:

Peta dunia yang dibagi menjadi empat baris dan empat kolom ubin.

Setiap petak peta adalah 256x256 titik persegi. Pada tingkat zoom 0, seluruh dunia dirender dalam satu kartu. Setiap tingkat zoom meningkatkan pembesaran sebesar faktor dua. Jadi, pada tingkat zoom 1, peta akan dirender sebagai grid 2 x 2 dari ubin, atau grid 4x4 pada tingkat zoom 2, grid 8x8 pada tingkat zoom 3, dan seterusnya. Jika Anda membuat gambar untuk lapisan ubin, Anda perlu membuat Gambar 256x256 point untuk setiap ubin pada setiap tingkat zoom yang ingin Anda dukung.

Menambahkan Lapisan Petak

  1. Membuat instance objek GMSURLTileLayer, atau subclass kustom dari GMSTileLayer/GMSSyncTileLayer.
  2. Jika ingin, ubah properti zIndex untuk menyesuaikan posisinya di hubungan dengan lapisan ubin lainnya.
  3. Tetapkan objek GMSTileLayer ke peta dengan menetapkan map-nya saat ini.

Maps SDK for iOS menyediakan tiga class yang dapat digunakan untuk menerapkan lapisan kartu. Untuk setiap class, Anda harus menentukan cara mengambil ubin peta yang benar untuk kumpulan koordinat {x,y,zoom} yang diberikan. Opsi yang tersedia adalah:

  • Subclass GMSSyncTileLayer, yang menyediakan implementasi tileForX:y:zoom yang menampilkan instance UIImage.
  • Subclass GMSTileLayer, yang menyediakan implementasi asinkron metode requestTileForX:y:zoom yang nantinya memanggil kembali dengan gambar ubin.
  • Gunakan class yang ada, GMSURLTileLayer, untuk mengambil kartu secara otomatis dari URL, yang menyediakan blok GMSTileURLConstructor. GMSURLTileLayer adalah class konkret yang tidak dapat dibuat subclass-nya.

Dalam kasus subclass GMSSyncTileLayer atau GMSTileLayer, memberikan Hasil ubin nil akan memberi tahu Maps SDK for iOS bahwa data saat ini tidak tersedia, tetapi mungkin tersedia pada masa mendatang. Sebagai alternatif, tampilkan kGMSTileLayerNoTile untuk menunjukkan bahwa tidak ada kartu di tempat ini lokasi HTTP/HTTPS.

Untuk GMSURLTileLayer, menampilkan nil dari GMSTileURLConstructor akan menunjukkan bahwa tidak ada kotak di lokasi ini.

Menggunakan `GMSURLTileLayer` untuk mengambil kotak dari URL

GMSURLTileLayer tidak memerlukan subclass, tetapi Anda harus implementasikan blok GMSTileURLConstructor. Kode di bawah ini menunjukkan cara gunakan GMSURLTileLayer untuk menampilkan denah lantai bangunan bertingkat.

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;
      

Subclass GMSSyncTileLayer untuk menyajikan kartu sebagai UIImage

GMSSyncTileLayer dan GMSTileLayer adalah class abstrak yang didesain untuk dibuat subclass-nya. Anda dapat menggunakan class ini untuk menyajikan kartu sebagai milik UIImage. Di bawah contoh menunjukkan cara merender gambar kustom pada beberapa petak pada peta dengan membuat subclass 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
      

Untuk menambahkan layer ke peta Anda, buat instance objek dan setel properti petanya.

Swift

let layer = TestTileLayer()
layer.map = mapView
      

Objective-C

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

Ubin DPI Tinggi untuk perangkat Retina

Anda dapat menggunakan gambar DPI tinggi dengan GMSSyncTileLayer atau GMSURLTileLayer dengan menetapkan tileSize ke 512. Properti tileSize menunjukkan jumlah piksel yang ditampilkan oleh ubin gambar yang ditampilkan sebagai; nilai defaultnya adalah 256 — dimensi pada ubin Google Maps pada perangkat non-Retina.

Jika Anda menampilkan ubin DPI normal pada perangkat DPI tinggi, Anda bisa menskalakan gambar dengan menyetel tileSize ke 512. Perhatikan bahwa menaikkan skala gambar dapat mengurangi kualitas gambar, terutama untuk garis halus atau teks. Untuk hasil terbaik, cocokkan tileSize dan DPI gambar ke layar. Peta yang ditampilkan di perangkat Retina akan terlihat sebaik mungkin saat menampilkan gambar DPI tinggi dengan tileSize 512; sementara peta yang ditampilkan pada perangkat non-Retina akan terlihat bagus dengan gambar normal dan tileSize default sebesar 256.

Menghilangkan petak peta yang sudah tidak berlaku

Jika petak yang disediakan oleh lapisan sudah 'usang', maka metode clearTileCache harus dipanggil pada lapisan untuk memaksa pemuatan ulang. Hal ini akan menyebabkan semua ubin pada lapisan ini dimuat ulang.

Swift

layer.clearTileCache()
      

Objective-C

[layer clearTileCache];