身份证检测

VisionKit 从基础库 3.3.0 版本后开始支持。

身份证检测 能力作为与 其他 VisionKit 能力 平行的能力接口。

该能力,一般用于用户进行 身份证识别 或者 身份证裁剪 等功能的开发。

方法定义

身份证检测,目前只支持通过 视觉模式,即输入一张静态图片进行身份证识别,返回身份证对应信息。

可以通过配置 getAffineImg,决定每次识别是否返回 身份证区域裁剪矩阵

输入身份证图片要求

输入的身份证图片,尽量以 正常的角度拍摄。不同角度带来的 透视效果,会影响识别的 准确度

视觉模式接口

首先需要创建 VKSession 的配置,然后通过 VKSession.start 启动 VKSession 实例。

开启 VKSession,并添加返回对应身份证信息监听事件,示例代码:

// VKSession 配置
const session = wx.createVKSession({
    track: {
        IDCard: {
            mode: 2 // 照片模式
        }
    },
    version: 'v1',
})

// VKSession start
session.start(err => {

  // 静态图片估计模式下,每调一次 detectIDCard 接口就会触发一次 updateAnchors 事件
  session.on('updateAnchors', anchors => {
      // 处理返回的身份证信息
      if (anchors && anchors[0]) {
          // 存在数组,证明存在身份证信息
          const anchor = anchors[0];

          // 识别信息
          const isComplete = anchor.isComplete; // 身份证是否完整
          const label = anchor.label; // 身份证面信息(0 照片面 / 1 国徽面 )
          const orientation = anchor.orientation; // 身份证朝向 (0 朝上 1 朝下 2 朝下 3 朝左)
          const box = anchor.box; // 身份证坐标框点数组 (0 左上点 1 右上点 2 右下点 3 左下点)

          // 裁剪信息,接口 getAffineImg 为 true 时会返回。
          const affineImgWidth = anchor.affineImgWidth;
          const affineImgHeight = anchor.affineImgHeight;
          const affineMat = anchor.affineMat;

          // 存在裁剪信息,可以结合原图获取裁剪后的身份证图片
          if (affineImgWidth && affineImgHeight && affineMat) {
            /*
              * affineMat 3x3仿射变换矩阵,行主序
              *  [0 1 2
              *   3 4 5
              *   6 7 8]
              */
            /*
              * canvas 2d setTransform
              * setTransform(a, b, c, d, e, f)
              *  [a c e
              *   b d f
              *   0 0 1]
              */
             // 可以利用离屏的Canvas2D,结合原图与裁剪矩阵,进行具体的身份证图片裁剪。
          }
      }

  })
  // 图片没有识别到身份证,会触发一次 removeAnchors
  session.on('removeAnchors', anchors => {
      console.log("没有识别到身份证")
  })
});

调用身份证识别,示例代码:


// 调用具体的身份证图片识别接口
session.detectIDCard({
    // 识别身份证图片的 ArrayBuffer,Uint8ClampedArray,RGBA
    // 比如可以通过 canvas(2D)的 context.getImageData 获取
    frameBuffer: imgDataBuffer,
    // 传入识别图片的原始宽度
    width: imgOriginWidth,
    // 传入识别图片的原始高度
    height: imgOriginHeight,
    // 是否获取裁剪图片信息
    getAffineImg: true,
})
// 调用后,识别处理完毕后
// 识别成功会触发 updateAnchors 回调,处理失败会触发 removeAnchors 回调

输出说明

anchor 信息

struct anchor
{
  isComplete,  // 身份证是否完整
  label,       // 身份证面信息(0 照片面 / 1 国徽面 )
  orientation, // 身份证朝向 (0 朝上 1 朝下 2 朝下 3 朝左)
  box,         // 身份证坐标框点数组 (0 左上点 1 右上点 2 右下点 3 左下点)
  /* 身份证裁剪信息
   * getAffineImg 为 true 时返回 */
  affineImgWidth,   // 身份证裁剪宽度
  affineImgHeight,  // 身份证裁剪区域高度
  affineMat,        // 身份证裁剪矩阵
}

身份证坐标框点数组 box

长度为 4 的数组,表示身份证位于原图中,框的坐标点位置。

Array<Point>(8) box

每个数组元素结构为:

struct Point { x, y }

身份证裁剪矩阵 affineMat

长度为 9 的数组,表示行主序的 3×3 仿射变换矩阵。可以结合 Canvas (2D) 以及原图进行具体的身份证图片裁剪。

程序示例

身份证照片识别示例

微信小程序示例的 接口VisionKit 视觉能力照片身份证识别

开源地址:照片身份证识别

深度估计

VisionKit 提供深度估计能力。

深度估计,就是获取图像中场景里的每个点到相机的距离信息,这种距离信息组成的图我们称之为深度图。

方法定义

我们在这里提供了深度估计的两种模式:

视觉模式: (安卓微信>=8.0.37,iOS微信>=8.0.38起) 使用摄像头进行深度估计 。

AR模式: (安卓微信>=8.0.38同时基础库>=2.33.0,iOS微信>=8.0.39同时基础库>=3.0.0) 使用摄像头和IMU进行深度估计,输出由near和far控制的非线性深度图,用于做虚实遮挡,目前支持部分机型,支持机型列表等同于6Dof-水平面AR-V2平面AR接口支持列表

接口类型 精度 机型覆盖率
视觉模式
AR模式

视觉模式接口

深度估计视觉模式接口提供2种使用方法,一种是输入一张静态图片进行深度估计,另一种是通过摄像头进行实时深度估计。

  1. 静态图片估计

通过VKSession.detectDepth接口输入一张图像,然后通过VKSession.on接口监听深度图信息,图中像素的值代表当前的深度值,颜色越黑,代表距离摄像头越近,反之颜色越白,代表距离深度越远。

示例代码:


const session = wx.createVKSession({
  track: {
    depth: {
      mode: 2 // mode: 1 - 使用摄像头;2 - 手动传入图像
    },
  },
  gl: this.gl,
})
// 静态图片估计模式下,每调一次 detectDepth 接口就会触发一次 updateAnchors 事件
session.on('updateAnchors', anchors => {
  anchors.forEach(anchor => {
    console.log('anchor.depthArray', anchor.depthArray) // 深度图 ArrayBuffer 数据
    console.log('anchor.size', anchor.size) // 深度图大小,结果为数组[宽, 高]
  })
})

// 需要调用一次 start 以启动
session.start(errno => {
  if (errno) {
    // 如果失败,将返回 errno
  } else {
    // 否则,返回null,表示成功
    session.detectDepth({
      frameBuffer, // 待检测图片的ArrayBuffer 数据。待检测的深度图像RGBA数据, 
      width, // 图像宽度
      height, // 图像高度
    })
  }
})
  1. 通过摄像头实时估计

算法实时输出当前帧的深度图,每一帧像素的值代表当前的深度值,颜色越黑,代表距离摄像头越近,反之颜色越白,代表距离深度越远。

示例代码:

const session = wx.createVKSession({
  track: {
    depth: {
      mode: 1 // mode: 1 - 使用摄像头;2 - 手动传入图像
    },
  },
})

// 需要调用一次 start 以启动
session.start(errno => {
  if (errno) {
    // 如果失败,将返回 errno
  } else {
    // 获取每一帧的信息
    const frame = session.getVKFrame(canvas.width, canvas.height)
    // 获取每帧的深度图信息
    const depthBufferRes = frame.getDepthBuffer();
    const depthBuffer = new Float32Array(depthBufferRes.DepthAddress)
    //创建渲染逻辑, 将数组值传输到一张纹理上,并渲染到屏幕
    render()
  }
})

AR模式接口

详情见水平面AR中的V2+虚实遮挡

实时估计输出说明

1. 效果展示

2. 深度估计关键点

深度实时关键点输出字段包括

struct anchor
{
  DepthAddress, // 深度图ArrayBuffer的地址, 用法如new Float32Array(depthBufferRes.DepthAddress); 
  width,    // 返回深度图的宽
  height,      // 返回深度图的高
}

应用场景示例

  1. 特效场景。
  2. AR游戏以及应用(如下是AR虚实遮挡的例子)。

planev2_deepocc_gif

程序示例

视觉模式:

  1. 实时深度估计能力使用参考
  2. 静态图像深度估计能力使用参考

AR模式:

  1. V2平面+虚实遮挡

demo体验

视觉模式:

  1. 实时深度估计能力,在微信小程序示例中的接口-VisionKit视觉能力-实时深度图检测中体验。
  2. 照片深度估计能力,在微信小程序示例中的接口-VisionKit视觉能力-照片深度图检测中体验。

AR模式:

  1. 在微信小程序示例中的接口-VisionKit视觉能力-水平面AR-v2-虚实遮挡中体验。