ml5.js入门六(介绍)+PoseNet姿势网

最新推荐文章于 2024-05-19 09:41:37 发布

red润

最新推荐文章于 2024-05-19 09:41:37 发布

阅读量1.3k

点赞数 1

分类专栏： ml5 文章标签： js 深度学习自然语言处理 tensorflow 机器学习

本文链接：https://blog.csdn.net/qq_47658204/article/details/118312918

版权

ml5 专栏收录该内容

10 篇文章 7 订阅

订阅专栏

ml5.js是什么

ml5.js 它是基于Tensorflow.js的一个非常简便易用的接口，目的是让更广泛的受众更容易使用机器学习。(演示都是根据官网实例demo)
其他知识点索引点这里
描述

PoseNet姿势网

描述
PoseNet 是一种允许实时人体姿势估计的机器学习模型。

PoseNet 可用于估计单个姿势或多个姿势，这意味着有一种算法版本只能检测图像/视频中的一个人，而一个版本可以检测图像/视频中的多个人。

下面是官网demo 识别图中人物关节

<html>

<head>
  <meta charset="UTF-8">
  <title>poseNet</title>
  
  <script src="../p5.min.js"></script>
  <script src="../ml5.js"></script>
</head>
<body>
  <h1>基于p5.js演示</h1>
  <p id='status'>Loading model...</p>
  <script src="index.js"></script>
</body>

</html>

let img;
let poseNet;
let poses = [];

function setup() {
  createCanvas(640, 360);
  
  img = createImg("data/runner.jpg", imageReady);
  
  img.size(width, height);

  img.hide();

  frameRate(1); // 将 frameRate 设置为 1，因为在这种情况下我们不需要它快速运行
}

// 图片加载完成
function imageReady() {
  const options = {
    minConfidence: 0.1,
    inputResolution: { width, height },
  };

  poseNet = ml5.poseNet(modelReady, options);
  // 给poseNet添加配置
  poseNet.on("pose", function(results) {
    console.log(results);
    poses = results;
  });
}

// poseNet加载完成
function modelReady() {
  select("#status").html("Model Loaded");

  // 当模型准备好后，运行 singlePose() 函数...
  // 如果/当检测到姿势时，poseNet.on('pose', ...) 将监听检测结果
  // 在 draw() 循环中，如果有任何姿势，则执行绘制命令
  poseNet.singlePose(img);
}

// p5不断调用
function draw() {
  if (poses.length > 0) {
    image(img, 0, 0, width, height);
    drawSkeleton(poses);
    drawKeypoints(poses);
    noLoop(); // 当poses存在停止循环
  }
}

// 在检测到的关键点上绘制椭圆的函数
function drawKeypoints() {

  for (let i = 0; i < poses.length; i += 1) {
    // 对于检测到的每个姿势，循环遍历所有关键点
    const pose = poses[i].pose;
    for (let j = 0; j < pose.keypoints.length; j += 1) {
      // 关键点是描述身体部位的对象（如右臂或左肩
      const keypoint = pose.keypoints[j];
      // 只画一个椭圆是姿势概率大于0.2
      if (keypoint.score > 0.2) {
        fill(255);
        stroke(20);
        strokeWeight(4);
        ellipse(round(keypoint.position.x), round(keypoint.position.y), 8, 8);
      }
    }
  }
}

function drawSkeleton() {
  for (let i = 0; i < poses.length; i += 1) {
    const skeleton = poses[i].skeleton;
    // 给关节连线
    for (let j = 0; j < skeleton.length; j += 1) {
      const partA = skeleton[j][0];
      const partB = skeleton[j][1];
      stroke(255);
      strokeWeight(1);
      line(partA.position.x, partA.position.y, partB.position.x, partB.position.y);
    }
  }
}

效果如下

这是原图

在这里插入图片描述

显示效果画出了根据返回的数据画出人物骨骼线

在这里插入图片描述
下一篇身体像素

red润

关注

1
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
ml5.js入门六(介绍)+PoseNet姿势网

ml5.js是什么ml5.js 它是基于Tensorflow.js的一个非常简便易用的接口，目的是让更广泛的受众更容易使用机器学习。(演示都是根据官网实例demo)其他知识点索引点这里描述PoseNet姿势网描述PoseNet 是一种允许实时人体姿势估计的机器学习模型。PoseNet 可用于估计单个姿势或多个姿势，这意味着有一种算法版本只能检测图像/视频中的一个人，而一个版本可以检测图像/视频中的多个人。下面是官网demo 识别图中人物关节<html><head&gt
复制链接

扫一扫

专栏目录