【一步步开发AI运动小程序】六、人体骨骼图绘制

微淘小雅

随着人工智能技术的不断发展，阿里体育等IT大厂，推出的“乐动力”、“天天跳绳”AI运动APP，让云上运动会、线上运动会、健身打卡、AI体育指导等概念空前火热。那么，能否将这些在APP成功应用的场景搬上小程序，分享这些概念的红利呢？本系列文章就带您一步一步从零开始开发一个AI运动小程序，本系列文章将使用“云智AI运动识别小程序插件”，请先行在微信服务市场或官网了解详情。

一、骨骼图绘制原理

人体骨骼图的绘制，是通过在camera组件上附一个同等大小的透明canvas组件，在上面绘制关键点达到与人体图像重合的目的。
二、绘制代码

1. <template>
2.         <view >
3.                 <camera id="preview"  : flash="off" :device-position="deviceKey"
4.                         resolution="high" frame-size="low" @initdone="onCameraReady">
5.                 </camera>
6.                 <canvas v-if="poseDrawEnabled"  type="2d" id="graphics" :></canvas>
7.         </view>
8. </template>

复制代码

三、注意事项

小程序的抽帧图像大小与camera实时图像可能不一致（https://developers.weixin.qq.com/miniprogram/dev/component/camera.html#Bug-Tip)，所以camera和canvas组件必须保持与帧图像保持同比缩放，否则可能导致骨骼与实时图像不一致。

下篇我们将为您介绍如何进行运动分析，敬请期待...

来源:https://www.cnblogs.com/alphaair/p/17426183.html
免责声明：由于采集信息均来自互联网，如果侵犯了您的权益，请联系我们【E-Mail:cb@itdo.tech】 我们会及时删除侵权内容，谢谢合作！