在单个 HTMLImageElement 上运行 tfjs BlazePose 姿势检测时出错答案

【问题标题】：Error running tfjs BlazePose pose detection on single HTMLImageElement在单个 HTMLImageElement 上运行 tfjs BlazePose 姿势检测时出错
【发布时间】：2022-07-22 17:19:44
【问题描述】：

我正在尝试使用 tfjs 在浏览器中进行 3d 姿势检测。我已按照https://github.com/tensorflow/tfjs-models/tree/master/pose-detection/src/blazepose_mediapipe的说明进行操作

但是代码失败并出现错误。我做错了什么？

这是我的代码

main.js

var img = new Image();
img.onload = async () => {
    const model = poseDetection.SupportedModels.BlazePose;
    const detectorConfig = {
        runtime: 'mediapipe', // or 'tfjs'
        modelType: 'lite',
        solutionPath: 'https://cdn.jsdelivr.net/npm/@mediapipe/pose',
    };
    try {
        detector = await poseDetection.createDetector(model, detectorConfig);
        console.log(img);
        const estimationConfig = {
            enableSmoothing: false, maxPoses: 1,
            type: 'full',
            scoreThreshold: 0.65,
            render3D: true
        };
        try {
            const poses = await detector.estimatePoses(img);
            console.log(poses);
        } catch (error) {
            detector.dispose();
            detector = null;
            console.log(error);
        }
    } catch (err) {
        console.log(err);
    }
}
img.src = "testimg.jpg";

index.html

<!DOCTYPE html>
<html>

<head>
    <script src="https://cdn.jsdelivr.net/npm/@tensorflow-models/pose-detection" crossorigin="anonymous"></script>
    <!-- Include below scripts if you want to use TF.js runtime. -->
    <script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs-core" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs-converter" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs-backend-webgl" crossorigin="anonymous"></script>

    <!-- Optional: Include below scripts if you want to use MediaPipe runtime. -->
    <script src="https://cdn.jsdelivr.net/npm/@mediapipe/pose" crossorigin="anonymous"></script>

</head>

<body>
    <script src="main.js"></script>
</body>

</html>

在浏览器中打开 html 时出现以下错误。 html 托管在 expressjs 上。

main.js:11 <img src="testimg.jpg">
main.js:24 TypeError: Cannot read properties of undefined (reading 'Tensor')
    at e.<anonymous> (pose-detection:17:7199)
    at pose-detection:17:2162
    at Object.next (pose-detection:17:2267)
    at pose-detection:17:1204
    at new Promise (<anonymous>)
    at s (pose-detection:17:949)
    at e.estimatePoses (pose-detection:17:6935)
    at img.onload (main.js:19:42)

【问题讨论】：

你确定你的图片加载良好吗？
@edkeveked 嗨，是的，这就是我将图像元素记录到控制台的原因。如果我删除图像，onload 会失败，我会得到一个不同的错误。
我还记录了一个关于 tfjs github.com/tensorflow/tfjs/issues/6514的问题
如果你把图片标签放在你的身体里，图片会显示出来吗？
@edkeveked 是的，我使用了并显示了图像。早些时候我在这个标签上放了一个 id，然后我将相应的元素传递给了estimateposes，得到了同样的错误。我担心这是由于种族问题，因此像现在描述中给出的那样重写。

标签： javascript tensorflow.js

【解决方案1】：

我设法在本地复制了您的问题，但似乎脚本标签的顺序错误。如果您将“pose-detection”脚本标签放到底部，这将起作用。

按照文档here查看正确顺序

【讨论】：