Warstwy kafelków

Wybierz platformę: Android iOS JavaScript

Obrazy możesz dodawać na mapie jako warstwę płytek. Warstwy kafelków są umieszczane na kafelku mapy na określonym poziomie powiększenia. Jeśli masz wystarczającą liczbę kafelków, możesz uzupełnić dane mapy Google na całej mapie na różnych poziomach powiększenia.

Wprowadzenie

Warstwy kafelków (czasami nazywane nakładkami z kafelkami) umożliwiają nakładanie obrazów na kafelki mapy podstawowej Google. To doskonały sposób na dodawanie do aplikacji danych, takich jak punkty zainteresowania czy informacje o ruchu drogowym, oraz obrazów lokalnych. W połączeniu z typem mapy kGMSTypeNone warstwy płytek umożliwiają zastąpienie danych mapy podstawowej Google własnymi.

Warstwy płytek są przydatne, gdy chcesz dodać do mapy rozległe obrazy, które zwykle obejmują duże obszary geograficzne. Nakładki na mapę są natomiast przydatne, gdy chcesz umieścić jeden obraz w jednym punkcie na mapie.

Współrzędne mapy

Interfejs Maps API dzieli obrazy na każdym poziomie powiększenia na zestaw kwadratowych map, które są uporządkowane w siatce. Gdy mapa przewija się do nowej lokalizacji lub nowego poziomu powiększenia, interfejs Maps API określa, które elementy są potrzebne, i przekształca to w zbiór elementów do pobrania.

W przypadku implementacji przez Google projekcji Mercatora kafelek o współrzędnych (0, 0) znajduje się zawsze w narożniku północno-zachodnim mapy,a wartości x rosną od zachodu na wschód, a wartości y – od północy na południe. Kafelki są indeksowane za pomocą współrzędnych x,y z tego punktu wyjścia. Na przykład na poziomie powiększenia 2, gdy Ziemia jest podzielona na 16 płytek, każda z nich może być wskazywana za pomocą pary x,y:

Mapa świata podzielona na 4 wiersze i 4 kolumny płytek.

Każda płytka mapy ma wymiary 256 x 256 pikseli. Przy powiększeniu 0 cały świat jest renderowany w jednym pikselu. Każdy poziom powiększenia zwiększa powiększenie o współczynnik 2. Na poziomie 1 zoomu mapa będzie renderowana jako siatka złożona z 2 płytek na 2 płytki lub z 4 płytek na 4 płytki na poziomie 2, 8 płytek na 8 płytek na poziomie 3 itd. Jeśli tworzysz obrazy dla warstwy płytek, musisz utworzyć nowy obraz o rozdzielczości 256 x 256 pikseli dla każdej płytki na każdym poziomie powiększenia, który chcesz obsługiwać.

Dodawanie warstwy z kafelkami

  1. Utwórz instancję obiektu GMSURLTileLayer lub niestandardowej podklasy GMSTileLayer lub GMSSyncTileLayer.
  2. Opcjonalnie zmień właściwość zIndex, aby dostosować jej położenie względem innych warstw płytek.
  3. Przypisz do mapy obiekt GMSTileLayer, ustawiając jego właściwość map.

Pakiet Maps SDK na iOS udostępnia 3 klasy, które można wykorzystać do implementacji warstwy płytek. W przypadku każdej klasy musisz określić sposób pobierania odpowiedniej płytki mapy dla danego zestawu współrzędnych {x,y,zoom}. Dostępne opcje:

  • Podklasa GMSSyncTileLayer, która udostępnia implementację tileForX:y:zoom zwracającą instancje UIImage.
  • Podklasa GMSTileLayer, która udostępnia implementację asynchronicznej metody requestTileForX:y:zoom, która później wywołuje z powrotem obraz kafelka.
  • Użyj istniejącej klasy GMSURLTileLayer, aby automatycznie pobierać płytki z adresów URL, podając blok GMSTileURLConstructor. GMSURLTileLayer to konkretna klasa, której nie można podklasyfikować.

W przypadku podklas GMSSyncTileLayer lub GMSTileLayer podanie wyniku kafelka nil spowoduje, że pakiet SDK Map Google na iOS będzie wiedzieć, że dane są obecnie niedostępne, ale mogą być dostępne w przyszłości. Możesz też zwrócić wartość kGMSTileLayerNoTile, aby wskazać, że w danej lokalizacji nie ma żadnej płytki.

W przypadku GMSURLTileLayer zwracanie wartości nil z GMSTileURLConstructor wskazuje, że w tej lokalizacji nie ma płytki.

Pobieranie fragmentów mapy z adresów URL za pomocą GMSURLTileLayer

GMSURLTileLayer nie wymaga tworzenia podklas, ale musisz zaimplementować blok GMSTileURLConstructor. Poniższy kod pokazuje, jak użyć funkcji GMSURLTileLayer, aby wyświetlić plan piętra budynku wielopiętrowego.

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;

Podklasa GMSSyncTileLayer do wyświetlania płytek jako UIImage

Klasy GMSSyncTileLayer i GMSTileLayer to abstrakcyjne klasy przeznaczone do podklasyfikowania. Możesz używać tych klas do wyświetlania płytek jako UIImage. Przykład poniżej pokazuje, jak renderować obraz niestandardowy na niektórych płytkach na mapie, tworząc podklasę 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

Aby dodać warstwę do mapy, utwórz instancję obiektu i ustaw jego właściwość mapy.

Swift

let layer = TestTileLayer()
layer.map = mapView

Objective-C

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

Kafelki o wysokiej rozdzielczości dla urządzeń z wyświetlaczem Retina

Możesz używać obrazów o wysokiej rozdzielczości w GMSSyncTileLayer lub GMSURLTileLayer, ustawiając wartość tileSize na 512. Właściwość tileSize wskazuje liczbę pikseli, w której preferowany format wyświetlania mają mieć zwrócone obrazy kafelka. Domyślnie jest to 256, czyli wymiar kafelka Map Google na urządzeniu bez ekranu Retina.

Jeśli wyświetlasz płytki o zwykłej rozdzielczości na urządzeniu o wysokiej rozdzielczości, możesz powiększyć obraz, ustawiając wartość tileSize na 512. Pamiętaj, że powiększanie zdjęć może obniżyć jakość obrazu, zwłaszcza w przypadku cienkich linii lub tekstu. Aby uzyskać najlepsze wyniki, dopasuj tileSize i rozdzielczość obrazu do wyświetlacza. Mapy wyświetlane na urządzeniu z ekranem Retina będą wyglądać najlepiej, gdy wyświetlają obrazy o wysokiej rozdzielczości (DPI) z wartością tileSize 512, natomiast mapy wyświetlane na urządzeniu bez ekranu Retina będą wyglądać świetnie z normalnymi obrazami i domyślną wartością tileSize 256.

Czyszczenie nieaktualnych kafelków

Jeśli płytki dostarczone przez warstwę staną się „nieaktualne”, należy wywołać metodę clearTileCache warstwy, aby wymusić odświeżenie. Spowoduje to ponowne załadowanie wszystkich kafelków na tej warstwie.

Swift

layer.clearTileCache()

Objective-C

[layer clearTileCache];