Openlayers 3 Ersetze eine fehlerhafte Kachel

Question

Wir laufen Open Layers 3.15. Manchmal erhalten wir eine fallengelassene oder fehlgeschlagene Kachel. Momentan wird nichts angezeigt (was für unsere Benutzer verwirrend sein kann), daher möchten wir dies durch eine Kachel ersetzen, die "keine Daten" oder so etwas sagt. Ich habe versucht, das Ereignis Aufnehmen und Austauschen der Quelle der Fliese zB

  source.on('tileloaderror', function(){ 
       source.setUrl('./images/map/failureTile.png'); 
      }); 

aber das Problem dabei ist, anstatt dies zu tun, auf 1 Fliesen, es tut es für die gesamte Schicht, wir don‘ Ich will das.

Wer weiß, wie wir das nur für die Fliese tun können, die fehlgeschlagen ist und nicht die gesamte Schicht?

Answer 1

Eine Kachel, die nicht geladen werden konnte, sollte eine eindeutige Klasse (.olImageLoadError) haben. Sie können eine CSS-Regel definieren, die diese Elemente nicht anzeigt.

.olImageLoadError { 
    display: none !important; 
} 

Answer 2

Sie konnten dieses versuchen:

source.on('tileloaderror', function(event) { 
    event.tile.getImage().src = './images/map/failureTile.png'; 
}); 

Sie müssen den event Parameter, dass können Sie die Fliese erhalten, die ausgefallen ist, so dass Sie das Bild der Fliese ändern können.

Warnung: Ich habe den obigen Code mit tileloadend anstelle von tileloaderror getestet, weil meine Kacheln bei mir nie ausfallen. :) Ich habe eine simulierte Fehlerrate mit Math.random() verwendet und einige zufällige Kacheln wurden durch das angegebene Bild ersetzt. Ich kann mir keinen Grund vorstellen, warum der obige Code nicht funktionieren würde. Wenn Sie bestätigen, dass es funktioniert, werde ich diese Warnung aus meiner Antwort entfernen. Ich habe es auf OpenLayers 3.14.2 und auf einer OSM-Quelle getestet.