随着深度学习推理技术的不断发展,让小型设备运行深度学习成为可能,阿里体育等IT大厂,推出的“乐动力”、“天天跳绳”AI运动APP,让云上运动会、线上运动会、健身打卡、AI体育指导等概念空前火热。那么,能否将这些在APP成功应用的场景搬上微信小程序,分享这些概念的红利呢?本系列文章就带您一步一步从零开始开发一个AI运动小程序,本系列文章将使用“AI运动识别”小程序插件,插件详情可以前往微信服务市场搜索相应插件。
微信小程序抽帧需要用到Camera
组件和CameraContext
组件,可以参考官网文档:
https://developers.weixin.qq.com/miniprogram/dev/component/camera.html
https://developers.weixin.qq.com/miniprogram/dev/api/media/camera/wx.createCameraContext.html
Camera
组件设置相机组件的frame-size
属性直接影响到抽帧后的图像数组大小,所以建议设为medium
以下,以便兼顾中低机型。
<camera id="preview" class="preview" style="width:100vw;height:80vh;" flash="off" device-position="back"
resolution="high" frame-size="low" @initdone="onCameraReady">
</camera>
...
onCameraReady(e) {
const context = wx.createCameraContext();
const listener = context.onCameraFrame((frame) => {
//frame.data图像数组将用于后续的人体识别
console.log(frame.data instanceof ArrayBuffer, frame.width, frame.height);
});
listener.start();
}
...
以上便是微信小程序抽帧的代码,实际应用中还需要对抽帧进行流控,以便达到最佳的性能,可以直接使用Demo项目中的camera-device.js
封装好的代码。
这是微信小程序的官方提示,并未说明具体的原因。即:假设给camera
组件设定为宽480px
高640px
,但抽取的帧就不一定是同camera大小宽480px
高640px
了,具体为frame-size大小决定的,实际要上抽取帧后才能确定。
至于导致这个问题的原因,我们认为是抽帧相接口,需要根据相机支持的分辨率,匹配相应的视频格式,进行视频流编码后返回给抽帧接口。
我们建议在实际场景应用中,特别是要开启视频骨骼图的场景,camera
及骨骼图canvas
保持与帧大小的同比绽放。所以如果要使用全屏,需要自己做适配。
建议将frame-size
设为small
,resolution
设为high
,抽帧FPS设为12即可满足大部分场景应用。
下篇我们将为您介绍如何进行人体识别,敬请期待...
原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。
如有侵权,请联系 cloudcommunity@tencent.com 删除。
原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。
如有侵权,请联系 cloudcommunity@tencent.com 删除。