【一步步开发AI运动小程序】十八、如何识别用户上传图片中的人体、运动、动作、姿态？

【云智AI运动识别小程序插件】，可以为您的小程序，赋于人体检测识别、运动检测识别、姿态识别检测AI能力。本地原生识别引擎，内置10余个运动，无需依赖任何后台或第三方服务，有着识别速度快、体验佳、扩展性强、集成快、成本低的特点，本篇实现需要使用此插件，请先行在微信服务市场或官网了解详情。

一、引言

上一篇文章，为您分享了如何对用户选择（上传）的视频，进行人体检测识别，并进行姿态分析、运动计数等实现。今天我们继续为您分享如何对用户上传（选择）图片，进行人体检测及姿态运动分析。同视频识别检测原理相似，只要拿到用户上传或选择的图片RGBA数据，即可进一步进行人体识别、姿态、运动分析等，如下图所示：

二、解决方案

微信小程序并没有像视频解码一样，提供直接读取图片像素数据的API，所以需要我们自行实现像素数据读取部分。根据我们的经验，有两种方案可以实现选定图片的像素数据读取。一是通过Canvas画布绘制获得，一种是先读取图像文件二进行流，再进行解析。

代码实现

由于自行解析图像像素数据方案，需要针对不同的图像格式进行解析，专业性强、工作量大，不建议采用，当然在实际实现中也可以考虑将图像传至后端使用专业库进行解析再回传，就是效率偏低、成本偏高。所以推荐采用canvas方案，简单、快速，代码如下：

    let res = await wx.chooseMedia({
        mediaType: 'image',
        count: 1
   });

   let path = res.tempFiles[0].tempFilePath;
   res = await wx.getImageInfo({
       src: path,
   });

    //写入图片
    const img = canvas.createImage();
    img.src = path;
    img.width = res.width;
    img.height = res.height;
    img.onload = async () => {
        context.drawImage(img, 0, 0, res.width, res.height);
        const buffer = context.getImageData(0, 0, res.width, res.height);
        const frame = {
            data: new Uint8Array(buffer.data),
            width: buffer.width,
            height: buffer.height
        };
        let human = await humanDetection.detectionAsync(frame);
        console.log(human);
    };

好了，视频和图片人体检测、姿态和运动分析就为您介绍到这，更多插件的使用欢迎评论交流。