python - 在 Javascript 网页中加载在 Colab 中创建的对象识别模型

Question

我按照以下示例制作了我的对象识别模型： https
: //www.tensorflow.org/tutorials/images/classification 我使用 Colab 创建了这个模型，现在我从 Colab 获得了.py和.ipynb中的模型

使用此指令我将模型保存在.h5中：
model.compile(loss='mean_squared_error', optimizer='adam', metrics=['binary_accuracy'])
model.save('./modelname.h5')

现在，我可以尝试以另一种格式保存此模型，我使用此代码并将其保存在.json和group1-shard°of°.bin文件中：
!pip install tensorflowjs
!mkdir model
!tensorflowjs_converter --input_format keras modelname.h5 model/
!zip -r modelname.zip model

现在我的目标是能够用 Javascript 将这个模型加载到我的 web 应用程序中，并用它来识别图像
问题是能够加载模型有
什么解决方案吗？

更新
我使用我的页面视图的屏幕截图作为图像来识别
这是我代码的基本部分：

async function LoadModel() {
    Model = await tf.loadLayersModel('http://localhost/..../model.json'); //caricamento mio modello
    console.log('conferma caricamento modello ' + Model);
try {
    maxPredictions = Model.getTotalClasses();
    console.log("durante");
}
catch (e){}
if (Model) {
    //controllo caricamento modello
    console.log(Model);
}
console.log("dopo e modello " + Model);
}

然后

OriginImage.onload = function (event) {
try { 
document.createEvent("TouchEvent"); 
var width = document.body.clientWidth;
}
catch(e) { 
var width = ResizeImageWidth;
} 
if (OriginImage.height<OriginImage.width) {
    var height = width*OriginImage.height/OriginImage.width; 
    }
else {
    var height = width;
    width = height*OriginImage.width/OriginImage.height; 
    }
ResizeImage.width = width;
ResizeImage.height = height;  
ResizeImage.src = OriginImage.src;
}    

这是调整大小

ResizeImage.onload = function (event) {
if (Model) recognizeImage(ResizeImage);
}

这是识别图像

async function recognizeImage(Image) {
var cont;
var data = "";
var maxClassName = "";
var maxProbability = "";
const prediction = await Model.predict(Image);
for (let i = 0; i < maxPredictions; i++) {
    if (i==0) {
        maxClassName = prediction[i].className;
        maxProbability = prediction[i].probability;
    }
    else if (prediction[i].probability>maxProbability) {
        maxClassName = prediction[i].className;
        maxProbability = prediction[i].probability;
    }
}
if(maxProbability > 0.90 ) {
        console.log(maxProbability + '  than' + maxClassName);
    return;
} 
else {
    console.log(maxProbability + maxClassName + "Nothing" );
    }
}

标签： pythontensorflowkerastensorflow.jsobject-recognition

Answer 1

我正在使用 React js 加载模型（图像分类和更多机器学习内容）

Tensorflow.js 不支持 Api 读取先前训练的模型

    const file= new Blob()
    file.src=modelJSON
    const files= new Blob()
    files.src=modelWeights
    console.log(files)
    const model= await tf.loadLayersModel(tf.io.browserFiles([file, files]));

如果您使用 Web 应用程序（对于 tensorflow.lite，您可以使用 opencv.readTensorflowmodel(model.pb, weight. pbtxt)

参考：如何使用 tf.loadLayersModel() 从 express 中加载 tensorflow-js 权重？

     const classifierModel = await tf.loadLayersModel(            
            "https://rp5u7.sse.codesandbox.io/api/pokeml/classify"
        ); 
        const im = new Image()
            im.src =imagenSample//'../../../../../Models/ShapesClassification/Samples/images (2).png';
        const abc= this.preprocessImage(im);
const preds = await classifierModel.predict(abc)//.argMax(-1);
            console.log('<Response>',preds,'Principal',preds.shape[0],'DATA',preds.dataSync())
            const responde=[...preds.dataSync()]
            console.log('Maxmimo Valor',Math.max.apply(Math, responde.map(function(o) { return o; })))
            let indiceMax = this.indexOfMax(responde)
            console.log(indiceMax)
            console.log('<<<LABEL>>>',this.labelsReturn(indiceMax))