CODEWITHSUNDEEP
javascriptnode.jstensorflow.js
Fantantonio
Fantantonio

Reputation: 427

Tensorflow.js tf.browser.fromPixels() must be an HTMLVideoElement

I am using tensorflow.js in a node + nwjs project and when I give a video element as input to the tensowflow fromPixels method I get this wierd error as output in the console:

Uncaught (in promise) Error: pixels passed to tf.browser.fromPixels() must be either an HTMLVideoElement, HTMLImageElement, HTMLCanvasElement, ImageData in browser, or OffscreenCanvas, ImageData in webworker or {data: Uint32Array, width: number, height: number}, but was HTMLVideoElement

So I can't understand what is going wrong...

This line of code that generate the error is:

const input_tensor = tf.browser.fromPixels(video);

The video is defined as:

export const video = document.getElementById("webcam");

That refers to this HTML element:

<video id="webcam" autoplay muted></video>

Upvotes: 5

Views: 3839

Answers (1)

edkeveked
edkeveked

Reputation: 18371

The video element has not yet loaded to display the video. The following should execute fromPixel only after the video has started loading

const videoElement = document.getElementById("webcam");

videoElement.addEventListener('loadeddata', (e) => {
   //Video should now be loaded but we can add a second check

   if(videoElement.readyState >= 3){
       const input_tensor = tf.browser.fromPixels(video);
   }

});

Upvotes: 1

Related Questions