Warstwy kafelków

Wybierz platformę: Android iOS JavaScript

Jako warstwę kafelków możesz dodać obrazy na wierzchu mapy. Warstwy kafelków są umieszczane na wierzchu kafelka mapy na określonym poziomie powiększenia. Dzięki wystarczającej liczbie kafelków możesz uzupełnić dane mapy Google na całej mapie na różnych poziomach powiększenia.

Wprowadzenie

Warstwy fragmentów mapy, czasami nazywane nakładkami z fragmentami mapy, umożliwiają nakładanie obrazów na fragmenty mapy podstawowej Google. Użyj tej funkcji, aby dodać do aplikacji dane, takie jak punkty zainteresowania lub informacje o ruchu, oraz lokalne obrazy. W połączeniu z typem mapy kGMSTypeNone warstwy kafelków umożliwiają zastąpienie danych mapy podstawowej Google własnymi danymi.

Warstwy kafelków są przydatne, gdy chcesz dodać do mapy rozległe obrazy, które zwykle obejmują duże obszary geograficzne. Z kolei nakładki na ziemię są przydatne, gdy chcesz umieścić pojedynczy obraz w jednym punkcie na mapie.

Współrzędne mapy

Interfejs API Map Google dzieli obrazy na każdym poziomie powiększenia na zestaw kwadratowych kafelkó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 Google określa, które fragmenty mapy są potrzebne, i przekształca je w zestaw fragmentów mapy do pobrania.

W implementacji rzutu Mercatora w Google kafelek o współrzędnych (0, 0) zawsze znajduje się w lewym górnym rogu mapy,przy czym wartości x rosną z zachodu na wschód, a wartości y – z północy na południe. Kafelki są indeksowane za pomocą współrzędnych x,y od tego punktu początkowego. Na przykład na poziomie powiększenia 2, gdy Ziemia jest podzielona na 16 kafelków, każdy kafelek można odwołać za pomocą unikalnej pary x,y:

Mapa świata podzielona na 4 wiersze i 4 kolumny kafelków.

Każdy kafelek mapy to kwadrat o wymiarach 256 x 256 punktów. Na poziomie powiększenia 0 cały świat jest renderowany w jednym kafelku. Każdy poziom powiększenia zwiększa powiększenie dwukrotnie. Na przykład na poziomie powiększenia 1 mapa jest renderowana jako siatka kafelków 2 x 2, na poziomie powiększenia 2 jako siatka 4 x 4, a na poziomie powiększenia 3 jako siatka 8 x 8. Aby utworzyć obrazy dla warstwy kafelków, utwórz obraz o wymiarach 256 x 256 punktów 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 lub GMSSyncTileLayer.
  2. Opcjonalnie zmodyfikuj właściwość zIndex, aby dostosować jej położenie względem innych warstw kafelków.
  3. Przypisz obiekt GMSTileLayer do mapy, ustawiając jego właściwość map.

Pakiet Maps SDK na iOS udostępnia 3 klasy, których można użyć do implementacji warstwy kafelków. W przypadku każdej klasy musisz określić, jak pobrać prawidłowy kafelek mapy dla danego zestawu współrzędnych {x,y,zoom}. Dostępne są te opcje:

  • Utwórz podklasę GMSSyncTileLayer, implementując tileForX:y:zoom, która zwraca instancje UIImage.
  • Utwórz podklasę GMSTileLayer, implementując metodę asynchroniczną requestTileForX:y:zoom, która później wywołuje zwrotnie obraz kafelka.
  • Użyj istniejącej klasy GMSURLTileLayer, aby automatycznie pobierać kafelki z adresów URL, podając blok GMSTileURLConstructor. GMSURLTileLayer to klasa konkretna, której nie można rozszerzyć.

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

W przypadku GMSURLTileLayer zwrócenie nil z GMSTileURLConstructor będzie oznaczać, że w tej lokalizacji nie ma kafelka.

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

Klasa GMSURLTileLayer nie wymaga tworzenia podklasy, ale musisz zaimplementować blok GMSTileURLConstructor. Poniższy kod pokazuje, jak użyć GMSURLTileLayer do wyświetlenia planu 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;
      

Tworzenie podklasy GMSSyncTileLayer w celu udostępniania kafelków jako UIImage

Klasy GMSSyncTileLayer i GMSTileLayer to klasy abstrakcyjne, które można rozszerzać. Możesz używać tych klas do udostępniania kafelków jako UIImage. Poniższy przykład pokazuje, jak renderować niestandardowy obraz na niektórych kafelkach 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ść map.

Swift

let layer = TestTileLayer()
layer.map = mapView
      

Objective-C

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

Kafelki o wysokiej rozdzielczości na urządzeniach Retina

Możesz używać obrazów o wysokiej rozdzielczości z klasą GMSSyncTileLayer lub GMSURLTileLayer, ustawiając tileSize na 512. Właściwość tileSize wskazuje liczbę pikseli, w których mają być wyświetlane zwracane obrazy kafelków. Domyślnie jest to 256 – wymiar kafelka Map Google na urządzeniu bez ekranu Retina.

Jeśli wyświetlasz kafelki o normalnej rozdzielczości na urządzeniu o wysokiej rozdzielczości, możesz powiększyć obrazy, ustawiając tileSize na 512. Pamiętaj, że powiększanie obrazów może pogorszyć ich jakość, zwłaszcza w przypadku cienkich linii lub tekstu. Aby uzyskać najlepsze rezultaty, dopasuj tileSize i rozdzielczość obrazu do wyświetlacza. Mapy wyświetlane na urządzeniu Retina będą wyglądać najlepiej, gdy będą wyświetlać obrazy o wysokiej rozdzielczości z tileSize ustawionym na 512. Z kolei mapy wyświetlane na urządzeniu bez ekranu Retina będą wyglądać świetnie z normalnymi obrazami i domyślnym tileSize ustawionym na 256.

Czyszczenie nieaktualnych kafelków

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

Swift

layer.clearTileCache()
      

Objective-C

[layer clearTileCache];