1、项目背景
微信小程序近日增加了实现Web AR的基础功能API,该API能实时从摄像头获取每帧图像。
但是,微信小程序官方没有提供图像识别和跟踪的功能。于是,大家尝试移植TensorflowJS等各种计算机视觉库到微信小程序。
Tacking.js是一个轻量型的计算机视觉库,能实现颜色跟踪、人脸检测等功能。比移植TensorflowJS简单了很多。
本演示项目的源代码在GitHub上,地址请见文章末尾。
2、准备步骤
下载源代码,用微信开发者工具打开源代码,点击工具栏上的“预览“按钮,微信扫一扫会启动微信小程序。
微信小程序会请求使用摄像头权限,选择“允许“。如果“拒绝”了,在小程序右上角的设置按钮中找到“摄像头“启用即可。
因为是新的小程序API,iOS版微信需要7.0.4版,Android版微信需要7.0.5版。目前,大多数人没有安装新版微信,可以选择“take a photo”模式体验,而不是“access a camera”模式。因为“take a photo”模式没有使用微信小程序新API,所以在任何版本的微信都可用。
3、使用方法
运行Demo微信小程序,扫描这张图片即可。也可以扫描紫红色、橘黄色、天蓝色的现实物体。
扫描成功后期待的效果如下:
“take a photo”模式的实际截图
操作方法:点击“take a photo”按钮拍照,点击“Retry”重新拍照。
“access a camera”模式的实际截图
操作方法:程序会自动检测摄像头画面中是否存在紫色、黄色、蓝色,没有手动操作。
4、图像颜色识别和跟踪的用途
根据颜色虽然不能判断是什么物体,但能在一堆已知颜色的物体中,区分是什么物体。根据颜色判断比分析形状轮廓等图像处理技术的速度要快很多,但准确率要低。适用于对准确度要求不高的场合。
5、开源代码地址
https://github.com/sanyuered/WeChat-MiniProgram-WebAR