Warstwy kafelków

Wybierz platformę: Android iOS JavaScript

Na mapie możesz dodawać zdjęcia jako warstwy kafelkowe. Warstwy z kafelków są umieszczane na kafelku mapy przy określonym powiększeniu. Odpowiednia liczba kafelków pozwala uzupełnić dane map Google dla całej mapy na wielu poziomach powiększenia.

Wstęp

Warstwy z kafelkami (czasami nazywane też nakładkami z fragmentami mapy) umożliwiają nałożenie obrazów na podstawowe kafelki mapy Google. To świetny sposób na dodawanie do aplikacji danych, takich jak ciekawe miejsca lub informacje o natężeniu ruchu, a także lokalne zdjęcia. W połączeniu z typem mapy kGMSTypeNone warstwy z kafelkami pozwalają zastąpić podstawowe dane mapy Google własnymi.

Warstwy z kafelkami przydają się, gdy chcesz dodać do mapy rozbudowane zdjęcia, zwykle obejmujące duże obszary geograficzne. Nakładki na powierzchni są natomiast przydatne, gdy chcesz poprawić pojedynczy obraz w jednym punkcie na mapie.

Współrzędne fragmentu

Interfejs Maps API dzieli zdjęcia przy każdym poziomie powiększenia na zestaw kwadratowych fragmentów mapy, które są ułożone w uporządkowanej siatce. Gdy mapa przewija się do nowej lokalizacji lub do nowego poziomu powiększenia, interfejs API Map ustala, które kafelki są potrzebne, i przekształca je w zestaw kafelków do pobrania.

Google implementuje odwzorowanie Merkatora, gdy kafelek ze współrzędną (0,0) znajduje się zawsze w północno-zachodnim rogu mapy, gdzie wartości x rosną z zachodu na wschód, a wartości y – z północy na południe. Kafelki są indeksowane przy użyciu współrzędnych x,y z tego punktu początkowego. Na przykład przy powiększeniu 2, gdy Ziemia jest podzielona na 16 kafelków, do każdego z nich może się odwoływać unikalna para x,y:

Mapa świata podzielona na 4 wiersze i 4 kolumny przedstawiające kafelki.

Każdy kafelek mapy jest kwadratem o wymiarach 256 x 256 punktów. Przy powiększeniu 0 cały świat wyświetla się w jednym kafelku. Każdy poziom powiększenia dwukrotnie zwiększa powiększenie. Tak więc przy powiększeniu 1 mapa będzie renderowana jako siatka 2 x 2, czyli siatka 4 x 4 przy powiększeniu 2, siatka 8 x 8 przy powiększeniu 3 itd. Jeśli tworzysz obrazy dla warstwy płytek, musisz utworzyć nowy obraz punktowy 256 x 256 dla każdego kafelka na każdym poziomie powiększenia, który chcesz obsługiwać.

Dodawanie warstwy kafelków

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

Pakiet SDK Map Google na iOS udostępnia 3 klasy, których można używać do implementacji warstwy kafelków. W przypadku każdej klasy musisz określić sposób pobierania odpowiedniego kafelka mapy dla danego zestawu współrzędnych {x,y,zoom}. Dostępne opcje to:

  • Podklasa GMSSyncTileLayer udostępniająca implementację interfejsu tileForX:y:zoom, która zwraca następującą liczbę instancji: UIImage.
  • Podklasa GMSTileLayer udostępniająca implementację asynchronicznej metody requestTileForX:y:zoom, która później wywołuje obraz kafelka.
  • Użyj istniejącej klasy GMSURLTileLayer do automatycznego pobierania kafelków z adresów URL, zapewniając blok GMSTileURLConstructor. GMSURLTileLayer to konkretna klasa, której nie można traktować jako podklasy.

W przypadku podklasy GMSSyncTileLayer lub GMSTileLayer podanie wyniku kafelka nil informuje pakiet SDK Map Google na iOS, że dane są obecnie niedostępne, ale mogą pojawić się w przyszłości. Możesz też zwrócić kGMSTileLayerNoTile, aby wskazać, że w tej lokalizacji nie ma kafelka.

W przypadku GMSURLTileLayer zwracanie wartości nil z GMSTileURLConstructor będzie oznaczać, że w danej lokalizacji nie ma kafelka.

Używanie „GMSURLTileLayer” do pobierania kafelków z adresów URL

GMSURLTileLayer nie wymaga podklasyfikacji, ale musisz wdrożyć blok GMSTileURLConstructor. Poniższy kod pokazuje, jak za pomocą funkcji GMSURLTileLayer 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 wyświetla kafelki jako UIImage

Klasy GMSSyncTileLayer i GMSTileLayer to klasy abstrakcyjne, które mogą być podklasy. Możesz używać tych zajęć do wyświetlania kafelków jako użytkownika UIImage. Poniższy przykład pokazuje, jak renderować niestandardowy obraz na niektórych kafelkach na mapie według podklasy 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 wysokiej rozdzielczości na urządzenia Retina

Obrazów o wysokiej rozdzielczości DPI możesz używać z GMSSyncTileLayer lub GMSURLTileLayer, ustawiając tileSize na 512. Właściwość tileSize wskazuje liczbę pikseli, które będą preferowane przy wyświetlaniu zwróconych obrazów. Wartość domyślna to 256, co odpowiada wymiarowi kafelka Map Google na urządzeniu innym niż Retina.

Jeśli wyświetlasz zwykłe kafelki DPI na urządzeniu o wysokiej rozdzielczości DPI, możesz przeskalować je w górę, ustawiając tileSize na 512. Pamiętaj, że skalowalność obrazu może obniżyć jego jakość, zwłaszcza w przypadku drobnych linii i tekstu. Aby uzyskać najlepsze wyniki, dopasuj wartości tileSize i DPI obrazu do wyświetlacza. Mapy wyświetlane na urządzeniach z ekranem Retina wyglądają najlepiej przy wyświetlaniu obrazów o wysokiej rozdzielczości tileSize o rozdzielczości tileSize 512. Z kolei mapy wyświetlane na urządzeniach innych niż Retina wyglądają świetnie z zwykłymi zdjęciami i domyślnym ustawieniem tileSize (tileSize) wynoszącym 256.

Usuwanie nieaktualnych kafelków

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

Swift

layer.clearTileCache()
      

Objective-C

[layer clearTileCache];