@allmaps/render/dist/renderers/CanvasRenderer.js

Render functions for WebGL and image buffers

import { BaseRenderer } from "./BaseRenderer.js";
import { CacheableImageDataTile } from "../tilecache/CacheableImageDataTile.js";
import { createWarpedMapFactory } from "../maps/WarpedMap.js";
import { Viewport } from "../viewport/Viewport.js";
import { renderToIntArray } from "../shared/render-to-int-array.js";
class CanvasRenderer extends BaseRenderer {
  canvas;
  context;
  constructor(canvas, options) {
    super(
      CacheableImageDataTile.createFactory(),
      createWarpedMapFactory(),
      options
    );
    this.canvas = canvas;
    this.context = canvas.getContext("2d");
  }
  /**
   * Render the map for a given viewport.
   *
   * If no viewport is specified, a viewport is deduced based on the WarpedMapList and canvas width and hight.
   *
   * @param viewport - the viewport to render
   */
  async render(viewport) {
    this.viewport = viewport || Viewport.fromSizeAndMaps(
      [this.canvas.width, this.canvas.height],
      this.warpedMapList
    );
    await Promise.allSettled(this.loadMissingImageInfosInViewport());
    this.assureProjection();
    this.requestFetchableTiles();
    await this.tileCache.allRequestedTilesLoaded();
    const imageData = new ImageData(
      this.viewport.canvasSize[0],
      this.viewport.canvasSize[1]
    );
    await renderToIntArray(
      this.warpedMapList,
      this.tileCache,
      this.viewport,
      this.getTileImageData,
      this.getTileSize,
      imageData.data
    );
    this.context.putImageData(imageData, 0, 0);
  }
  getTileImageData(data, index) {
    return data.data[index];
  }
  getTileSize(data) {
    return [data.width, data.height];
  }
}
export {
  CanvasRenderer
};
//# sourceMappingURL=CanvasRenderer.js.map