Failure to use ml5.js image classification model-Error: Based on the provided shape, [1,64,64,4], the tensor should have 16384 values but has 20155392

Question

I trained an image classification neural network model written in ml5.js. When I try to use the model files in a p5.js web editor, I get an error 'Based on the provided shape, [1,64,64,4], the tensor should have 16384 values but has 20155392'.

The code is in this p5 sketch - https://editor.p5js.org/konstantina1/sketches/85Ny1SC2J (clicking on the arrow in the top right corner will show the files).
When I run a local server on a web page with the same structure, I see 'model ready!' (a confirmation that the model has loaded) and that's it.

I read a lot of comments that the bin file may be corrupt - I saved the model myself producing the bin file so it should be ok. As suggested here by the author of very similar code, https://www.youtube.com/watch?v=3MqJzMvHE3E, adding pixelDensity(1) in setup() doesn't help.

I am new to machine learning, could someone please help? Thank you in advance.

Answer 1

The model was trained with images 64x64 px so the input test image must be the same size.

1944 (original image width) * 2592 (original image height) * 4 (number of channels) = 20155392. The tensor should have 64 (image width) * 64 (image height) * 4 (number of channels) = 16387 values. This is what the error refers to.

The copy() method used originally didn't resize the input image properly. The correct way to resize the image is inputImage.resize(IMAGE_WIDTH, IMAGE_HEIGHT).

Working sketch: https://editor.p5js.org/konstantina1/sketches/85Ny1SC2J

Answer 2

A version of the sketch with image file upload: https://editor.p5js.org/konstantina1/sketches/qMNkkkbIm