运行使用 Tensorflow.js 进行对象检测

Question

我正在使用 Tensorflow.js 进行对象检测。我正在尝试在浏览器中运行自定义对象检测 tensorflow.js 模型。我可以使用以下命令将 tensorflow 模型转换为 tensorflow.js 模型（在 google colab 中）：

!tensorflowjs_converter \
--input_format=tf_frozen_model \
--output_node_names='detection_boxes,detection_scores,detection_classes,num_detections' \
/content/frozen_inference_graph.pb \
/content/web_model

我正在分享 inference.html 文件的代码片段 [已更新]:

<html>
<head>
<script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs@latest"> </script>
<!--<script src="webcam.js"></script>-->
      <img id="img" src="257.jpg" width="300" height="300"/>

</head>
<body>
    <button type="button" id="startPredicting" onclick="startPredicting()" >Start Predicting</button>
    <button type="button" id="stopPredicting" onclick="stopPredicting()" >Stop Predicting</button>
    <div id="prediction"></div>
</body>

<script src="index.js"></script>
</html>

index.js文件的代码片段如下[已更新]:

let model;
let isPredicting = false;

async function init(){
        try {
            model = await tf.loadGraphModel('http://127.0.0.1:8887/uno_model/model.json');
        } catch (err) {
            console.log(err);
        }
}

async function predict() {
        console.log("executing model");
        const img = document.getElementById('img');

        tf_img = tf.browser.fromPixels(img);
        tf.print(tf_img)

        tf_img = tf_img.expandDims(0);

        console.log(tf_img.shape)  // Image dimension is  [1, 300, 300, 3]

         let output = await model.executeAsync(
        { 'image_tensor' : tf_img},
        [ 'detection_boxes','detection_scores','detection_classes','num_detections']);


        for (let i = 0; i < output.length; i++){
            console.log(output[i].dataSync())
        }

 }

init()


function startPredicting(){
    isPredicting = true;
    predict();
}

function stopPredicting(){
    isPredicting = false;
    predict();
}

它产生以下输出 [更新]：

我查看了上面的输出，但无法获得 class 标签等。 如何提取 detection_classes、detection_scores 和 detection_boxes？ 此模型可与 python 代码一起正常工作。

[更新]：看起来，我在提供 [1,300,300,3] 图像作为模型输入后得到了输出。

你能指导我吗？我错过了什么吗？

Answer 1

虽然 python 模型未添加到问题中，但提取的模型节点、张量大小及其类型提供了识别 detection_classes、detection_scores, 和 detection_boxes.

第一个张量的大小为 400，对应于 detection_boxes。 dataSync 运算符 return 是一个完全展平的数组。尺寸 400 很可能对应于形状 [100, 4]。下面讨论的其他张量的形状证实了这一点。 [100, 4] 表示输入中有 100 个边界框 - 很可能是图像。具体来说就是前四个元素对应第一个bounding box，以此类推...

第二张量对应detections_scores。 100 个边界框有 100 个检测分数。这个数组的第一个元素对应第一个数组的前四个元素（detection_boxes数组）

第三个数组对应detection_classes。它是一个包含 100 个整数的数组，其中每个值都是匹配标签的索引。

第四个数组对应num_detections。它包含有多少个检测：100

I looked at the above output but I couldn't get class labels

要获取标签（字符串），取自 detection_classes 的索引应该用于 json（python 中的字典）或包含所有标签和他们的指数。

值得注意的是，对于js模型return与python模型相同的输出，所有处理在python之前对图像进行喂养模型应该在 js 中复制。

Answer 2

终于找到问题了，和输入框的大小有关

SSD 模型需要 [1,300,300,3] image/frame 的形状作为输入。我在我的代码中添加了这个并得到了解决方案。使用以下行（在 inference.html 中），我们可以将图像的 (300,300,3) 形状作为模型的输入：

 <img id="img" src="257.jpg" width="300" height="300"/>

在 index.js 中使用以下行：

 tf_img = tf_img.expandDims(0);
 console.log(tf_img.shape)  // Image dimension is  [1, 300, 300, 3]

我们得到了SSD需要的[1,300,300,3]的image shape

运行 使用 Tensorflow.js 进行对象检测

Running object detection using Tensorflow.js

tensorflow

tensorflow.js

运行使用 Tensorflow.js 进行对象检测