2

我正在 ionic 3 框架中制作一个用于识别手写字符的应用程序,为此,我正在使用 tensorflowjs。问题是当一切都解决后,预测总是返回相同的值。

模型(使用 tensorflowjs-converter 从 keras 转换而来)本地存储在assets/models/model.json.

我试图预测的图像是从 HTMLCanvasElement 中提取的,您可以在其中绘制字符,然后函数getCanvas()从中检索 ImageData:

getCanvas() {
    let photo = document.getElementById('MyCanvas') as HTMLCanvasElement;
    let ctx = photo.getContext('2d');
    const data: ImageData = ctx.createImageData(300,300);
    return data;
}

[1, 32, 32, 3]然后,计算模型的输入张量,data然后,我将其输入到模型中evaluateModel()。在该函数中,我加载model.jsonwithtf.loadModel()并尝试预测图像的类别:

import * as tf from '@tensorflow/tfjs';

async evaluateModel() {
    imageData: ImageData = this.getCanvas();
    const modelURL: string = './../../assets/models/model.json';

    let img: tf.Tensor<tf.Rank.R3> = tf.fromPixels(imageData);
    img = tf.image.resizeBilinear(img, [32, 32]);
    img = img.expandDims(0);

    await tf.loadModel(modelURL).then(model => {
        const output: any = model.predict(img);
        const results: number = output.argMax(1).dataSync()[0];
        console.log(results);
    }

一切正常,没有任何错误,但是当将输出预测记录到控制台时,它总是返回相同的值。此外,预测数组非常平坦,指出 python 中的模型在测试中达到 99,01% 的准确率

console.log(Array.from(output.dataSync())); 

17  /* Result of the argMax function on output */
[0.011652837507426739, 0.03457817807793617, 0.029257778078317642, 0.008851004764437675, 0.01691449247300625, 0.026485547423362732, 0.04974032938480377, 0.016473202034831047, 0.021701140329241753, 0.020724112167954445, 0.03173287212848663, 0.024661116302013397, 0.007072054781019688, 0.022814681753516197, 0.011404283344745636, 0.015105938538908958, 0.024694452062249184, 0.07453715801239014, 0.011547397822141647, 0.03946337103843689, 0.018134022131562233, 0.027423541992902756, 0.014102200977504253, 0.016702469438314438, 0.05513478443026543, 0.030478181317448616, 0.012863627634942532, 0.011269242502748966, 0.022525735199451447, 0.022545555606484413, 0.02840271405875683, 0.011758353561162949, 0.006561313755810261, 0.020660076290369034, 0.009705542586743832, 0.024312887340784073, 0.011940978467464447, 0.020643217489123344, 0.009319263510406017, 0.00957920216023922, 0.01844164915382862, 0.015434195287525654, 0.02170679345726967, 0.017867043614387512, 0.013763428665697575, 0.029312126338481903]

尝试解决此问题时,我想到的唯一两件事是:

  1. ImageData 未正确提取画布绘图,因此预测始终返回相同的值。
  2. 上的权重model.json没有被访问或加载,因此模型返回相同的值。

有任何想法吗?

任何帮助表示赞赏。

4

1 回答 1

1

createImageData创建一个具有透明黑色像素的新 ImageDate。因此,每次调用该方法时,都会返回相同的 ImageData。

您宁愿在另一个画布上重绘初始图像,其尺寸(高度和宽度)与作为模型参数给出的张量的形状相匹配。

// create a new canvas on which the initial canvas will be redrawn 
const canvas = document.createElement('canvas');
// draws on the first 32 * 32 pixels
canvas.drawImage(photos, 0, 0, 32, 32);
// returns the imageData corresponding to the part of the canvas we drew
return canvas.getImageData(0, 0, 32, 32);

有了这个新的 imageData,不再需要使用tf.bilineartf.reshape就足以为张量提供所需的形状。

img = tf.image.reshape(img, [1, 32, 32, 3]);
于 2019-01-10T22:48:48.353 回答