From ba23e5b2347b8cf212d9672784ab55e31e133ea7 Mon Sep 17 00:00:00 2001 From: Artyom Stepanishchev Date: Tue, 1 Aug 2023 05:18:06 +0400 Subject: [PATCH] [JS/Common] Fix malformed result of Tensor.fromImage(ImageBitmap) (#16919) ### Description Set `canvas` dimensions to the `ImageBitmap` dimensions, thus fixing a malformed Tensor creation. ### Motivation and Context According to the [HTMLCanvasElement.drawImage() spec](https://html.spec.whatwg.org/multipage/canvas.html#drawing-images): > When the destination rectangle is outside the destination image (the output bitmap), the pixels that land outside the output bitmap are discarded, as if the destination was an infinite canvas whose rendering was clipped to the dimensions of the output bitmap. meaning that `ImageBitmap` pixels exceeding the canvas dimensions will be discarded. Since no canvas dimensions are set for `Tensor.fromImage(ImageBitmap)` if-case, the default 300x150px canvas dimensions are used leading to the creation of malformed Tensors where all the exceeding pixels are discarded and equal to `0, 0, 0, 0` during the subsequent `pixels2DContext.getImageData()` call. --- js/common/lib/tensor-factory-impl.ts | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/js/common/lib/tensor-factory-impl.ts b/js/common/lib/tensor-factory-impl.ts index af72ac51e7..c02ff1bb24 100644 --- a/js/common/lib/tensor-factory-impl.ts +++ b/js/common/lib/tensor-factory-impl.ts @@ -190,7 +190,10 @@ export const tensorFromImage = async( throw new Error('Please provide image config with format for Imagebitmap'); } - const pixels2DContext = document.createElement('canvas').getContext('2d'); + const canvas = document.createElement('canvas'); + canvas.width = image.width; + canvas.height = image.height; + const pixels2DContext = canvas.getContext('2d'); if (pixels2DContext != null) { const height = image.height;