Error: pixels passed to tf.browser.fromPixels() must be either an HTMLImageElement

user_7141068 0
Viewed 466

Trying to predict with TensorflowJS. But, in input image above error is showing? My image is Uint8Array type. How can I pass an Uint8Array type for making a tensor?


    
      async predict(imageData: any) {
    
        let img = tf.browser.fromPixels(imageData, 3).resizeBilinear([256, 256]) # problem showing here
        img = imageData.reshape([256, 256, 3])
        img = tf.cast(img, 'float32')
    
        const segmentation = this.model.predict(img) as any
    
        console.log('success')
    
      }
    
    
    loadImage(file: FileList) {
    
        this.fileToUpload = file.item(0);
        let reader = new FileReader();
        reader.readAsDataURL(this.fileToUpload);
    
        reader.onload = (event: any) => {
          this.imageUrl = reader.result
          this.predict(this.convertDataURIToBinary(this.imageUrl)); # passing Unit8Array image from here
        }
    
      }

Any idea how can I overcome it? Thanks for your suggestion.

Update

Solved this issue using '@ViewChild('ImageRef') ImageRef: ElementRef;' . Lastly I converted Unit8Array into imageData then drew into canvas with putImageData.

But facing problem in another part. As I am doing image segmentation, the result is just the inverse of what I made in python. Any idea?

In python I did - >


    img_face = cv2.resize(frame,(256,256))
    img_face = cv2.cvtColor(img_face, cv2.COLOR_BGR2RGB)
    img_face = img_face / 255.0
    img_face = img_face.astype(np.float32)
    mask = model.predict(np.expand_dims(img_face , axis=0))[0]

And my current js part is already mentioned above as predict() func.

tensorflowjs-converter tensor tensorflow.js angular javascript
1 Answers

If imageData is a UInt8Array, it can be easily converted to a tensor using tf.tensor

tf.tensor(imageData)

Additionnally the image width and height can be specified while creating the tensor

tf.tensor(imageData, [height, width, channels])

Now regarding the image processing, in python you are doing

img_face / 255.0

You are not doing the same thing in js. you need to divide the js tensor by 255

user_50699570
Related