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

一、插件运动检测分析的流程

1.1、相关核心命名空间

插件关于姿态、运动检测的能力,都包含在calcsports两个命名空间下。其中sports命名空间下包含了所有的内置运动分析器类和运动检测相关计时、计数的核心逻辑抽象;calc命名空间下包含了人体姿态分析的角度、垂直、水平、视角等规则计算器、姿态相似度和关键点追踪等能力,sports也是基于此能力实现。

1.2、运动分析的过程

运动分析的过程,便是逐帧分析人体结果,当捕捉符合到要求的姿态动作,便触发计时、计数回调。UI便可以基于此回调与用户进行交互。

二、获取所有的内置运动

sports.SportBase是运动分析器抽象基类,实现了基本的计数、计时逻辑,其中SPORTS静态属性包含了所有的插件内置运动。

const SportBase = AiSport.sports.SportBase;
console.log(SportBase.SPORTS);
//输出结果
//0: {key: "Rope-Skipping", name: "跳绳"}
//1: {key: "Jumping-Jack", name: "开合跳"}
//2: {key: "Sit-Up", name: "仰卧起坐"}
//3: {key: "Push-Up", name: "俯卧撑"}
//4: {key: "Squat", name: "深蹲起"}
//5: {key: "Plank", name: "平板支撑"}
//6: {key: "Squat-Horse", name: "马步蹲"}

二、创建一个指定的运动分析器

//调用SportBase.create静态方法,创建一个俯卧撑运动分析器实例
const AiSport = requirePlugin("aiSport");
const SportBase = AiSport.sports.SportBase;
const sport = SportBase.create('Push-Up');
console.log(sport);

三、执行运动分析检测


//创建俯卧撑运动分析器
const AiSport = requirePlugin("aiSport");
const SportBase = AiSport.sports.SportBase;
const sport = SportBase.create('Push-Up');
sport.onTiCK = (cnt, times) => {
console.log('运动计数变化');
console.log(cnt, times);
}; //抽帧
const context = wx.createCameraContext();
const listener = context.onCameraFrame((frame) => {
const iamge = {
width: Number(frame.width),
height: Number(frame.height),
rawData: frame.data
}; //人体识别
humanDetection.detectionAsync(image).then(human=>{ //将人体识别结果推入运动分析器
sport.pushing(human); });
});
listener.start();

下篇将为您介绍姿态分析,敬请期待...

【一步步开发AI运动小程序】七、进行运动计时、计数的更多相关文章

  1. 微信小程序(七)-项目实例(原生框架 MINA转云开发)==02-云开发-配置

    云开发:1.就是用云函数的型式来使用云存储和云数据库完成各种操作!     2.只关注调什么函数,完成什么功能即可,无需关心HTTP请求哪一套!     3.此模式不代表没有服务器,只是部署在云环境中 ...

  2. 开发一个微信小程序教程

    一.注册小程序账号 1.进入微信公众平台(https://mp.weixin.qq.com/),注册小程序账号,根据提示填写对应的信息即可. 2.注册成功后进入首页,在 小程序发布流程->小程序 ...

  3. 开发一个微信小程序项目教程

    一.注册小程序账号 1.进入微信公众平台(https://mp.weixin.qq.com/),注册小程序账号,根据提示填写对应的信息即可.2.注册成功后进入首页,在 小程序发布流程->小程序开 ...

  4. 如何快速地开发一个微信小程序

    如何快速地开发一个微信小程序呢?我觉得作为初学者,最好能有一个模板,然后改这个模板. 同样作为初学者,刚开始的时候我有下面的几个问题,后来通过问同学,我弄清楚了. 微信小程序可以连接MySQL或者Sq ...

  5. Java可视化日历(Date类、DATe Format类、Calendar类综合运用),开发可视化日历小程序

    Java时间日期类综合运用,开发可视化日历小程序 由键盘输入指定格式的日期,打印这个月的日历 1.代码 import java.text.DateFormat; import java.text.Pa ...

  6. 全栈开发工程师微信小程序-中(下)

    全栈开发工程师微信小程序-中(下) 微信小程序视图层 wxml用于描述页面的结构,wxss用于描述页面的样式,组件用于视图的基本组成单元. // 绑定数据 index.wxml <view> ...

  7. 全栈开发工程师微信小程序-中(中)

    全栈开发工程师微信小程序-中(中) 开放能力 open-data 用于展示微信开放的数据 type 开放数据类型 open-gid 当 type="groupName" 时生效, ...

  8. 全栈开发工程师微信小程序-中

    全栈开发工程师微信小程序-中 多媒体及其他的组件 navigator 页面链接 target 在哪个目标上发生跳转,默认当前小程序,可选值self/miniProgram url 当前小程序内的跳转链 ...

  9. 全栈开发工程师微信小程序-上(下)

    全栈开发工程师微信小程序-上(下) icon 图标 success, success_no_circle, info, warn, waiting, cancel, download, search, ...

  10. 全栈开发工程师微信小程序-上(中)

    全栈开发工程师微信小程序-上(中) width: 750rpx; 750rpx代表与屏幕等宽,rpx的缩写responsive pixel,这个单位是可以根据屏幕大小进行自适应调整的像素单位. 小程序 ...

随机推荐

  1. freertos学习笔记(十)事件标志组

    事件标志组 相当于用户平时定义的Flag,事件标志,不过freertos支持将该标志组作为启动task的条件 概述 分为8位和24位的模式(通过设置宏来配置) 每一位有0和1两个状态 用法 用于平常程 ...

  2. python pyqt6 设定窗口置顶

    self.setWindowFlag(Qt.WindowType.WindowStaysOnTopHint)即可效果一般,页面会出现闪烁一次, # 置顶按钮 self.top_button = QPu ...

  3. 常回家看看之house_of_kiwi

    house of kiwi 前言:house_of_kiwi 一般是通过触发__malloc_assert来刷新IO流,最后可以劫持程序流或者通过和setcontext来打配合来进行栈迁移来得到fla ...

  4. Redis入门 - C#|.NET Core封装Nuget包

    经过前面章节的学习,可以说大家已经算Redis开发入门了.已经可以去到项目上磨砺了. 但是今天我还想和大家分享一章:封装自己的Redis C#库,然后打包成Nuget包. 首先要说明的是:不是要自己开 ...

  5. CSS – z-index

    介绍 z-index 是用来设置 element 层次高低的 (当 element 重叠的时候) 参考: 4 reasons your z-index isn't working (and how t ...

  6. 关于 xfg 的班会

  7. 利用 Page Visibility API 优化网页性能与用户体验

    在现代 Web 开发中,用户可能会频繁切换标签页,或让网页处于后台运行.为了避免不必要的资源浪费并提升用户体验,合理利用 Page Visibility API 可以在页面不可见时暂停或减少资源的消耗 ...

  8. 墨天轮最受DBA欢迎的数据库技术文档-SQL优化篇

    [墨天轮最受欢迎的技术文档]系列文章得到了很多朋友的支持,大家也告诉了我们期待看到的主题这不!大家想看的优化系列-SQL优化篇来啦~原文文末送墨值中,欢迎大家参与! 数据库的调优被分成多个阶段,每个阶 ...

  9. Vue 组件如何进行传值的?

    1 父子传值 在子组件标签设置属性,在子组件内使用 props 接收属性值 : 2. 子父传值 在子组件中使用 emit 自定义事件,在子组件标签注册自定义事件 ,接收参数 : 3. vuex 状态管 ...

  10. 你对 Vue.js 的template 编译的理解?

    template 是 ES5 新出的语法 ,template 是不会被页面显示的,但是 vue 中会被翻译成 dom 结构 : template 编译的过程 : parse 解析生成ast 抽象语法树 ...