Class: ImageTile




dispatchEvent(event){boolean | undefined} inherited

Dispatches an event and calls all listeners listening for events of this type. The event parameter can either be a string or an Object with a type property.

Name Type Description
event BaseEvent | string

Event object.

false if anyone called preventDefault on the event object or if any of the listeners returned false.

getImage(){HTMLCanvasElement | HTMLImageElement | HTMLVideoElement}

Get the HTML image element for this tile (may be a Canvas, Image, or Video).


getTileCoord(){TileCoord} inherited

Get the tile coordinate for this tile.

The tile coordinate.

Load the image or retry if loading previously failed. Loading is taken care of by the tile queue, and calling this method is only needed for preloading or for reloading in case of an error.

To retry loading tiles on failed requests, use a custom tileLoadFunction that checks for error status codes and reloads only when the status code is 408, 429, 500, 502, 503 and 504, and only when not too many retries have been made already:

const retryCodes = [408, 429, 500, 502, 503, 504];
const retries = {};
source.setTileLoadFunction((tile, src) => {
  const image = tile.getImage();
    .then((response) => {
      if (retryCodes.includes(response.status)) {
        retries[src] = (retries[src] || 0) + 1;
        if (retries[src] <= 3) {
          setTimeout(() => tile.load(), retries[src] * 1000);
        return Promise.reject();
      return response.blob();
    .then((blob) => {
      const imageUrl = URL.createObjectURL(blob);
      image.src = imageUrl;
      setTimeout(() => URL.revokeObjectURL(imageUrl), 5000);
    .catch(() => tile.setState(3)); // error

setState(state) inherited

Sets the state of this tile. If you write your own tileLoadFunction , it is important to set the state correctly to ERROR when the tile cannot be loaded. Otherwise the tile cannot be removed from the tile queue and will block other requests.

Name Type Description
state ol/TileState