Javascript 将用户输入的图像文件转换为图像分类器tensorflow js模型所需的输入_Javascript_Tensorflow_Machine Learning

Javascript 将用户输入的图像文件转换为图像分类器tensorflow js模型所需的输入

javascript tensorflow machine-learning

Javascript 将用户输入的图像文件转换为图像分类器tensorflow js模型所需的输入,javascript,tensorflow,machine-learning,Javascript,Tensorflow,Machine Learning,我正在尝试使用tensorflow js创建一个基于浏览器的图像分类器。我创建了一个模型并导出到model.json，并使用该模型预测用户输入图像文件。当用户输入图像文件时，我将值传递给模型，但是我得到以下错误 Error when checking : expected flatten_input to have shape [null,28,28] but got array with shape [100,100,3] 我在下面附上了我的全部代码 <!DOCTYPE html>

我正在尝试使用tensorflow js创建一个基于浏览器的图像分类器。我创建了一个模型并导出到model.json，并使用该模型预测用户输入图像文件。当用户输入图像文件时，我将值传递给模型，但是我得到以下错误

Error when checking : expected flatten_input to have shape [null,28,28] but got array with shape [100,100,3]

我在下面附上了我的全部代码

<!DOCTYPE html>
<html>

<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href='https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css'>
<script 
 src='https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.bundle.min.js'>.   
</script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js'></script>

 </head>

 <body>
<div class="container d-flex justify-container-center">
    <input type='file' accept='image/*' onchange='openFile(event)'><br>
    <img id='output' style="height:100px; width:100px;">
    <button id="modelrun" onclick="runModel();" >Predict</button>
</div>
<script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs@1.1.2"></script>

<script>
    var inputTensor
    let targetSize = { w: 28, h: 28 }
    loadModel();
    var openFile = function (file) {
        var input = file.target;
        var reader = new FileReader();
        reader.onload = function () {
            var dataURL = reader.result;
            var output = document.getElementById('output');
            output.src = dataURL;
            inputTensor = tf.browser.fromPixels(output)
            console.log("Tensor image", inputTensor)
            console.log("Image tensor generated")
            inputTensor.width = 28
            inputTensor.height = 28
        };
        reader.readAsDataURL(input.files[0]);
    };

    async function loadModel() {
        model = undefined;
        console.log("model ", model)
        model = await tf.loadLayersModel('/model.json');
        console.log("model loaded", model)
        return
    }

    window.runModel = async function () {
        if (inputTensor) {
            const output = model.predict(inputTensor)
            console.log('model.predict (output):', output.dataSync())
        }
    }
</script>


.   


无功传感器
设targetSize={w:28，h:28}
loadModel（）；
var openFile=函数（文件）{
var输入=file.target；
var reader=new FileReader（）；
reader.onload=函数（）{
var dataURL=reader.result；
var output=document.getElementById（'output'）；
output.src=dataURL；
InputSensor=tf.browser.fromPixels（输出）
console.log（“张量图像”，输入传感器）
log（“生成的图像张量”）
输入传感器宽度=28
输入传感器高度=28
};
reader.readAsDataURL（input.files[0]）；
};
异步函数loadModel（）{
模型=未定义；
日志（“模型”，模型）
model=wait tf.loadLayersModel（'/model.json'）；
日志（“模型加载”，模型）
返回
}
window.runModel=异步函数（）{
if（输入传感器）{
常数输出=模型预测（输入传感器）
console.log（'model.predict（output）：'，output.dataSync（）
}
}