diff --git a/src/core/renderers/canvas/CanvasCoreTexture.ts b/src/core/renderers/canvas/CanvasCoreTexture.ts index 2831b678..8957fc5f 100644 --- a/src/core/renderers/canvas/CanvasCoreTexture.ts +++ b/src/core/renderers/canvas/CanvasCoreTexture.ts @@ -23,7 +23,11 @@ import { CoreContextTexture } from '../CoreContextTexture.js'; import { formatRgba, type IParsedColor } from './internal/ColorUtils.js'; export class CanvasCoreTexture extends CoreContextTexture { - protected image: ImageBitmap | HTMLCanvasElement | undefined; + protected image: + | ImageBitmap + | HTMLCanvasElement + | HTMLImageElement + | undefined; protected tintCache: | { key: string; @@ -68,7 +72,9 @@ export class CanvasCoreTexture extends CoreContextTexture { return this.image !== undefined; } - getImage(color: IParsedColor): ImageBitmap | HTMLCanvasElement { + getImage( + color: IParsedColor, + ): ImageBitmap | HTMLCanvasElement | HTMLImageElement { const image = this.image; assertTruthy(image, 'Attempt to get unloaded image texture'); @@ -94,7 +100,7 @@ export class CanvasCoreTexture extends CoreContextTexture { } protected tintTexture( - source: ImageBitmap | HTMLCanvasElement, + source: ImageBitmap | HTMLCanvasElement | HTMLImageElement, color: string, ) { const { width, height } = source; @@ -132,8 +138,8 @@ export class CanvasCoreTexture extends CoreContextTexture { this.image = canvas; return { width: data.width, height: data.height }; } else if ( - typeof ImageBitmap !== 'undefined' && - data instanceof ImageBitmap + (typeof ImageBitmap !== 'undefined' && data instanceof ImageBitmap) || + data instanceof HTMLImageElement ) { this.image = data; return { width: data.width, height: data.height }; diff --git a/src/core/textures/ImageTexture.ts b/src/core/textures/ImageTexture.ts index 3196cca1..afc5c9e7 100644 --- a/src/core/textures/ImageTexture.ts +++ b/src/core/textures/ImageTexture.ts @@ -135,6 +135,10 @@ export class ImageTexture extends Texture { async loadImageFallback(src: string, hasAlpha: boolean) { const img = new Image(); + if (!src.startsWith('data:')) { + img.crossOrigin = 'Anonymous'; + } + return new Promise<{ data: HTMLImageElement; premultiplyAlpha: boolean }>( (resolve) => { img.onload = () => {