基于 PoseNet 绘制图像（p5.js）

Question

我在 p5.js 网络编辑器中使用 ml5 的 poseNet 在使用网络摄像头的用户的脸上放置一个时髦的头像。当框架中没有人时，我希望草图绘制一个警告标志（草图文件中的图像 'warning1.png'）。当检测到 0 个姿势时，草图已经可以记录 'no one in the frame'，但是我如何在 warning1.png 上绘制图像canvas什么时候不是写在draw函数里而是写在setup函数里？

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

当画面中不止一个人时也是如此（我使用的是 poseNet 的 multiPose）。草图在框架中检测到 +1 人（并且控制台记录 'too many people in the frame'）...

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

...但是如何在 canvas.

上绘制图像 'warning2.png'

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

非常感谢！！

Answer 1

您可以创建另一个全局变量来跟踪错误当前是否正在发生。在 gotPoses 中，您可以将 else 语句添加到您的 if 语句中。然后将全局变量设置为 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);
}

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

基于 PoseNet 绘制图像（p5.js）

Drawing images (in p5.js) based on PoseNet

javascript

p5.js

ml5.js