ol 7.1.1-dev.1667574553768 → 7.1.1-dev.1667679047704

package/DataTile.d.ts

@@ -1,16 +1,43 @@
+/**
+ * @typedef {HTMLImageElement|HTMLCanvasElement|HTMLVideoElement} ImageLike
+ */
+/**
+ * @typedef {Uint8Array|Uint8ClampedArray|Float32Array|DataView} ArrayLike
+ */
+/**
+ * Data that can be used with a DataTile.
+ * @typedef {ArrayLike|ImageLike} Data
+ */
+/**
+ * @param {Data} data Tile data.
+ * @return {ImageLike|null} The image-like data.
+ */
+export function asImageLike(data: Data): ImageLike | null;
+/**
+ * @param {Data} data Tile data.
+ * @return {ArrayLike|null} The array-like data.
+ */
+export function asArrayLike(data: Data): ArrayLike | null;
+/**
+ * @param {ImageLike} image The image.
+ * @return {Uint8ClampedArray} The data.
+ */
+export function toArray(image: ImageLike): Uint8ClampedArray;
 export default DataTile;
+export type ImageLike = HTMLImageElement | HTMLCanvasElement | HTMLVideoElement;
+export type ArrayLike = Uint8Array | Uint8ClampedArray | Float32Array | DataView;
 /**
- * Data that can be used with a DataTile.  For increased browser compatibility, use
- * Uint8Array instead of Uint8ClampedArray where possible.
+ * Data that can be used with a DataTile.
  */
-export type Data = Uint8Array | Uint8ClampedArray | Float32Array | DataView;
+export type Data = ArrayLike | ImageLike;
 export type Options = {
     /**
      * Tile coordinate.
      */
     tileCoord: import("./tilecoord.js").TileCoord;
     /**
-     * Data loader.
+     * Data loader.  For loaders that generate images,
+     * the promise should not resolve until the image is loaded.
      */
     loader: () => Promise<Data>;
     /**
@@ -28,15 +55,11 @@ export type Options = {
      */
     size?: import("./size.js").Size | undefined;
 };
-/**
- * Data that can be used with a DataTile.  For increased browser compatibility, use
- * Uint8Array instead of Uint8ClampedArray where possible.
- * @typedef {Uint8Array|Uint8ClampedArray|Float32Array|DataView} Data
- */
 /**
  * @typedef {Object} Options
  * @property {import("./tilecoord.js").TileCoord} tileCoord Tile coordinate.
- * @property {function(): Promise<Data>} loader Data loader.
+ * @property {function(): Promise<Data>} loader Data loader.  For loaders that generate images,
+ * the promise should not resolve until the image is loaded.
  * @property {number} [transition=250] A duration for tile opacity
  * transitions in milliseconds. A duration of 0 disables the opacity transition.
  * @property {boolean} [interpolate=false] Use interpolated values when resampling.  By default,
@@ -65,7 +88,7 @@ declare class DataTile extends Tile {
      */
     private error_;
     /**
-     * @type {import('./size.js').Size}
+     * @type {import('./size.js').Size|null}
      * @private
      */
     private size_;

package/DataTile.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DataTile.d.ts","sourceRoot":"","sources":["DataTile.js"],"names":[],"mappings":";;;;;mBASa,UAAU,GAAC,iBAAiB,GAAC,YAAY,GAAC,QAAQ;;;;;eAKjD,OAAO,gBAAgB,EAAE,SAAS;;;;kBACtB,QAAQ,IAAI,CAAC;;;;;;;;;;;;;;;;AATvC;;;;GAIG;AAEH;;;;;;;;;;GAUG;AAEH;IACE;;OAEG;IACH,qBAFW,OAAO,EAiCjB;IAvBC;;;OAGG;IACH,gBAA6B;IAE7B;;;OAGG;IACH,cAAiB;IAEjB;;;OAGG;IACH,eAAkB;IAElB;;;OAGG;IACH,cAAuC;IAGzC;;;OAGG;IACH,WAFY,OAAO,WAAW,EAAE,IAAI,CAInC;IAED;;;;OAIG;IACH,WAHY,IAAI,CAKf;IAED;;;;OAIG;IACH,YAHY,KAAK,CAKhB;CA0BF"}
+{"version":3,"file":"DataTile.d.ts","sourceRoot":"","sources":["DataTile.js"],"names":[],"mappings":"AAOA;;GAEG;AAEH;;GAEG;AAEH;;;GAGG;AAEH;;;GAGG;AACH,kCAHW,IAAI,GACH,SAAS,GAAC,IAAI,CAQzB;AAED;;;GAGG;AACH,kCAHW,IAAI,GACH,SAAS,GAAC,IAAI,CASzB;AAOD;;;GAGG;AACH,+BAHW,SAAS,GACR,iBAAiB,CAsB5B;;wBAlEY,gBAAgB,GAAC,iBAAiB,GAAC,gBAAgB;wBAInD,UAAU,GAAC,iBAAiB,GAAC,YAAY,GAAC,QAAQ;;;;mBAKlD,SAAS,GAAC,SAAS;;;;;eAkElB,OAAO,gBAAgB,EAAE,SAAS;;;;;kBACtB,QAAQ,IAAI,CAAC;;;;;;;;;;;;;;;;AAHvC;;;;;;;;;;;GAWG;AAEH;IACE;;OAEG;IACH,qBAFW,OAAO,EAiCjB;IAvBC;;;OAGG;IACH,gBAA6B;IAE7B;;;OAGG;IACH,cAAiB;IAEjB;;;OAGG;IACH,eAAkB;IAElB;;;OAGG;IACH,cAAiC;IAGnC;;;OAGG;IACH,WAFY,OAAO,WAAW,EAAE,IAAI,CAWnC;IAED;;;;OAIG;IACH,WAHY,IAAI,CAKf;IAED;;;;OAIG;IACH,YAHY,KAAK,CAKhB;CA0BF"}

package/DataTile.js

@@ -3,17 +3,87 @@
  */
 import Tile from './Tile.js';
 import TileState from './TileState.js';
+import {createCanvasContext2D} from './dom.js';
 
 /**
- * Data that can be used with a DataTile.  For increased browser compatibility, use
- * Uint8Array instead of Uint8ClampedArray where possible.
- * @typedef {Uint8Array|Uint8ClampedArray|Float32Array|DataView} Data
+ * @typedef {HTMLImageElement|HTMLCanvasElement|HTMLVideoElement} ImageLike
  */
 
+/**
+ * @typedef {Uint8Array|Uint8ClampedArray|Float32Array|DataView} ArrayLike
+ */
+
+/**
+ * Data that can be used with a DataTile.
+ * @typedef {ArrayLike|ImageLike} Data
+ */
+
+/**
+ * @param {Data} data Tile data.
+ * @return {ImageLike|null} The image-like data.
+ */
+export function asImageLike(data) {
+  return data instanceof Image ||
+    data instanceof HTMLCanvasElement ||
+    data instanceof HTMLVideoElement
+    ? data
+    : null;
+}
+
+/**
+ * @param {Data} data Tile data.
+ * @return {ArrayLike|null} The array-like data.
+ */
+export function asArrayLike(data) {
+  return data instanceof Uint8Array ||
+    data instanceof Uint8ClampedArray ||
+    data instanceof Float32Array ||
+    data instanceof DataView
+    ? data
+    : null;
+}
+
+/**
+ * @type {CanvasRenderingContext2D|null}
+ */
+let sharedContext = null;
+
+/**
+ * @param {ImageLike} image The image.
+ * @return {Uint8ClampedArray} The data.
+ */
+export function toArray(image) {
+  if (!sharedContext) {
+    sharedContext = createCanvasContext2D(
+      image.width,
+      image.height,
+      undefined,
+      {willReadFrequently: true}
+    );
+  }
+  const canvas = sharedContext.canvas;
+  const width = image.width;
+  if (canvas.width !== width) {
+    canvas.width = width;
+  }
+  const height = image.height;
+  if (canvas.height !== height) {
+    canvas.height = height;
+  }
+  sharedContext.drawImage(image, width, height);
+  return sharedContext.getImageData(0, 0, width, height).data;
+}
+
+/**
+ * @type {import('./size.js').Size}
+ */
+const defaultSize = [256, 256];
+
 /**
  * @typedef {Object} Options
  * @property {import("./tilecoord.js").TileCoord} tileCoord Tile coordinate.
- * @property {function(): Promise<Data>} loader Data loader.
+ * @property {function(): Promise<Data>} loader Data loader.  For loaders that generate images,
+ * the promise should not resolve until the image is loaded.
  * @property {number} [transition=250] A duration for tile opacity
  * transitions in milliseconds. A duration of 0 disables the opacity transition.
  * @property {boolean} [interpolate=false] Use interpolated values when resampling.  By default,
@@ -53,10 +123,10 @@ class DataTile extends Tile {
     this.error_ = null;
 
     /**
-     * @type {import('./size.js').Size}
+     * @type {import('./size.js').Size|null}
      * @private
      */
-    this.size_ = options.size || [256, 256];
+    this.size_ = options.size || null;
   }
 
   /**
@@ -64,7 +134,14 @@ class DataTile extends Tile {
    * @return {import('./size.js').Size} Tile size.
    */
   getSize() {
-    return this.size_;
+    if (this.size_) {
+      return this.size_;
+    }
+    const imageData = asImageLike(this.data_);
+    if (imageData) {
+      return [imageData.width, imageData.height];
+    }
+    return defaultSize;
   }
 
   /**