基于 PoseNet 绘制图像（在 p5.js 中）答案

【问题标题】：Drawing images (in p5.js) based on PoseNet基于 PoseNet 绘制图像（在 p5.js 中）
【发布时间】：2021-03-20 12:24:52
【问题描述】：

我在 p5.js 网络编辑器中使用 ml5 的poseNet，在使用网络摄像头的用户脸上放置一个时髦的头部图像。当框架中没有人时，我希望草图绘制一个警告标志（草图文件中的图像 'warning1.png'）。当检测到 0 个姿势时，草图已经可以记录 “框架中没有人”，但是如果没有写入图像，我如何在画布上绘制图像 warning1.png绘制函数但在设置函数中？

if (poses.length == 0) {
    console.log('no one in the frame')
  }

当画面中有多个人时（我正在使用poseNet 的multiPose），情况也是如此。草图在框架中检测到 +1 人（并且控制台记录'框架中的人太多'）...

if (poses.length > 1) {
      console.log('too many people in the frame')
  }

...但是如何在画布上绘制图像 'warning2.png'。

另外，我希望 funkyhead.png 图像在上述情况之一发生时消失 - 现在图像总是绘制。这是我在 p5.js 网络编辑器中的草图： https://editor.p5js.org/saskiasmith/sketches/_5O_aAzE_

非常感谢！！

【问题讨论】：

标签： javascript p5.js ml5

【解决方案1】：

您可以创建另一个全局变量来跟踪当前是否正在发生错误。在gotPoses 中，您可以在 if 语句中添加 else 语句。然后将全局变量设置为 true 或 false。在draw 中，您使用相同的全局变量来确定是否显示图像。

所以： let noPoseDetected = false;

在getPoses中：

if (poses.length == 0) {
    console.log('no one in the frame');
    noPoseDetected = true;
  } else {
    noPoseDetected = false;
  }

然后在抽奖：

if (noPoseDetected) {
    image(warning1, 0, 0, 50,50);
}

这应该适用于您的所有用例。

【讨论】：