Kachelebenen

Plattform auswählen: Android iOS JavaScript

Sie können Bilder als Kachelebenen auf Ihre Karte legen. Kachelebenen werden bei einer bestimmten Zoomstufe über einer Kartenkachel platziert. Wenn Sie genügend Kacheln haben, können Sie die Kartendaten von Google für die gesamte Karte in mehreren Zoomstufen ergänzen.

Einführung

Mit Kachelebenen (manchmal auch als Kachel-Overlays bezeichnet) können Sie Bilder über die Kacheln der Google-Basiskarte legen. Dies ist eine hervorragende Möglichkeit, Ihrer App Daten wie POIs oder Verkehrsinformationen und lokale Bilder hinzuzufügen. In Kombination mit dem Kartentyp kGMSTypeNone können Sie die Basiskartendaten von Google durch Ihre eigenen ersetzen.

Kachelebenen sind hilfreich, um der Karte umfangreiches Bildmaterial hinzuzufügen, zumeist um große geografische Bereiche abzudecken. Mit Boden-Overlays kann dagegen ein einzelnes Bild an einem Punkt der Karte fixiert werden.

Kachelkoordinaten

Die Maps API unterteilt die Bilder in jeder Zoomstufe in einen Satz quadratischer Kartenkacheln, die in einem geordneten Raster angeordnet sind. Wenn eine Karte zu einem neuen Standort bewegt oder ein neuer Zoomfaktor für sie eingestellt wird, ermittelt die Maps API die benötigten Kacheln und wandelt diese Werte in einen abzurufenden Kachelsatz um.

Bei der Implementierung der Mercator-Projektion in Google befindet sich die Kachel mit den Koordinaten (0,0) immer in der nordwestlichen Ecke der Karte. Die x-Werte nehmen von Westen nach Osten und die y-Werte von Norden nach Süden zu. Die Kacheln werden mithilfe von x,y-Koordinaten aus diesem Ursprung indexiert. Zum Beispiel kann bei Zoomfaktor 2, wenn die Erde in 16 Kacheln aufgeteilt ist, jede einzelne Kachel durch ein eindeutiges x,y-Paar bezeichnet werden:

Weltkarte, unterteilt in Kacheln mit 4 Zeilen und 4 Spalten

Jede Kachel ist ein Quadrat mit 256x256 Punkten. Bei Zoomstufe 0 wird die ganze Welt in einer einzigen Kachel gerendert. Jede Zoomstufe vergrößert die Darstellung um den Faktor zwei. Entsprechend wird die Karte bei Zoomstufe 1 mit einem Raster von 2 × 2 Kacheln gerendert, bei Zoomstufe 2 mit einem Raster von 4 × 4 Kacheln, bei Zoomstufe 3 mit einem Raster von 8 × 8 Kacheln usw. Wenn Sie Bilder für eine Kachelebene erstellen, müssen Sie für jede Kachel jeweils ein neues Bild mit 256 × 256 Punkten pro Zoomstufe erstellen, die unterstützt werden soll.

Kachelebene hinzufügen

  1. Instanziere ein GMSURLTileLayer-Objekt oder eine benutzerdefinierte Unterklasse von GMSTileLayer oder GMSSyncTileLayer.
  2. Optional können Sie die zIndex-Eigenschaft ändern, um die Position im Verhältnis zu anderen Kachelnbenen anzupassen.
  3. Weisen Sie das GMSTileLayer-Objekt der Karte zu, indem Sie die Eigenschaft map festlegen.

Das Maps SDK for iOS bietet drei Klassen, mit denen sich eine Kachelnebene implementieren lässt. Für jede Klasse müssen Sie festlegen, wie die richtige Kartenkachel für eine bestimmte Reihe von {x,y,zoom}-Koordinaten abgerufen wird. Folgende Optionen sind verfügbar:

  • Erstellen Sie eine Unterklasse von GMSSyncTileLayer und implementieren Sie tileForX:y:zoom, um UIImage-Instanzen zurückzugeben.
  • Unterklasse GMSTileLayer mit Implementierung der asynchronen Methode requestTileForX:y:zoom, die später mit einem Kachelbild zurückruft.
  • Verwenden Sie die vorhandene Klasse GMSURLTileLayer, um Kacheln automatisch über URLs abzurufen. Geben Sie dazu den Block GMSTileURLConstructor an. GMSURLTileLayer ist eine konkrete Klasse, die nicht als abgeleitete Klasse verwendet werden kann.

Wenn Sie eine Unterklasse von GMSSyncTileLayer oder GMSTileLayer verwenden, wird dem Maps SDK for iOS durch Angabe eines nil-Kachelergebnisses mitgeteilt, dass Daten derzeit nicht verfügbar sind, aber möglicherweise in Zukunft verfügbar sein werden. Alternativ können Sie kGMSTileLayerNoTile zurückgeben, um anzugeben, dass sich an dieser Stelle keine Kachel befindet.

Wenn für GMSURLTileLayer nil von GMSTileURLConstructor zurückgegeben wird, bedeutet das, dass sich an dieser Stelle keine Kachel befindet.

Kacheln mittels "GMSURLTileLayer" von URLs abrufen

Für GMSURLTileLayer ist keine Unterklasse erforderlich, aber Sie müssen den Block GMSTileURLConstructor implementieren. Im folgenden Code wird gezeigt, wie mit GMSURLTileLayer der Grundriss eines mehrstöckigen Gebäudes angezeigt wird.

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;
      

Kacheln mittels Unterklassen von "GMSSyncTileLayer" als UIImage-Element bereitstellen

GMSSyncTileLayer und GMSTileLayer sind abstrakte Klassen, die als abgeleitete Klassen konzipiert sind. Mit diesen Klassen können Sie Kacheln als UIImage bereitstellen. Im folgenden Beispiel wird gezeigt, wie ein benutzerdefiniertes Bild über einigen der Kacheln auf der Karte gerendert wird, indem GMSSyncTileLayer als Unterklasse definiert wird.

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
      

Um die Kachelebene zur Karte hinzuzufügen, instanziieren Sie das Objekt und legen Sie seine Karteneigenschaft fest.

Swift

let layer = TestTileLayer()
layer.map = mapView
      

Objective-C

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

Kacheln mit hohem DPI-Wert für Retina-Geräte

Sie können Bilder mit hoher Auflösung mit GMSSyncTileLayer oder GMSURLTileLayer verwenden, indem Sie tileSize auf 512 festlegen. Die Eigenschaft tileSize gibt die Anzahl der Pixel an, in denen die zurückgegebenen Kachelbilder bevorzugt angezeigt werden sollen. Standardmäßig ist dies 256, die Größe einer Google Maps-Kachel auf einem Gerät ohne Retina-Display.

Wenn Sie normale DPI-Kacheln auf einem Gerät mit hoher DPI anzeigen, können Sie die Bilder skalieren, indem Sie tileSize auf 512 festlegen. Hinweis: Durch das Hochskalieren von Bildern kann die Bildqualität beeinträchtigt werden, insbesondere bei dünnen Linien oder Text. Die besten Ergebnisse erzielen Sie, wenn Sie die tileSize und die Bild-DPI an das Display anpassen. Auf Retina-Geräten sehen Karten am besten aus, wenn sie mit Bildern mit hoher Auflösung und einer tileSize von 512 angezeigt werden. Auf Nicht-Retina-Geräten sehen Karten mit normalen Bildern und der StandardtileSize von 256 gut aus.

Veraltete Kacheln löschen

Wenn die von der Ebene bereitgestellten Kacheln veraltet sind, sollte die Methode clearTileCache auf der Ebene aufgerufen werden, um eine Aktualisierung zu erzwingen. Dadurch werden alle Kacheln dieser Ebene neu geladen.

Swift

layer.clearTileCache()
      

Objective-C

[layer clearTileCache];