使用 tracking.js 在人脸检测中添加自动捕获答案

【问题标题】：Adding auto capture on face detection using tracking.js使用 tracking.js 在人脸检测中添加自动捕获
【发布时间】：2016-02-26 09:50:39
【问题描述】：

在人脸检测中添加自动捕捉/快照需要帮助。使用 tracking.js 中的这个例子：

https://github.com/eduardolundgren/tracking.js/blob/master/examples/face_camera.html http://trackingjs.com/examples/face_camera.html

任何想法将不胜感激。谢谢！

【问题讨论】：

标签： jquery-plugins tracking.js

【解决方案1】：

我也需要这个。我使用这个链接来帮助我得到这个答案。

How to take a snapshot of HTML5-JavaScript-based video player?

在 tracking.js 示例（face_camera.html）中，我添加了这个画布：

<canvas id="snapshotCanvas" width="320" height="240"></canvas>

然后在 onTrack 事件中我添加了这个：

tracker.on('track', function(event) {
    context.clearRect(0, 0, canvas.width, canvas.height);

    event.data.forEach(function(rect) {
      context.strokeStyle = '#a64ceb';
      context.strokeRect(rect.x, rect.y, rect.width, rect.height);
      context.font = '11px Helvetica';
      context.fillStyle = "#fff";
      context.fillText('x: ' + rect.x + 'px', rect.x + rect.width + 5, rect.y + 11);
      context.fillText('y: ' + rect.y + 'px', rect.x + rect.width + 5, rect.y + 22);


      var snapshotContext = snapshotCanvas.getContext('2d');
      //draw image to canvas. scale to target dimensions
      snapshotContext.drawImage(video, 0, 0, video.width, video.height);

      //convert to desired file format
      var dataURI = snapshotCanvas.toDataURL('image/jpeg'); // can also use 'image/png'
      //This dataURI is what you would use to get the actual image
      console.log(dataURI);
    });
  });

有点晚了，希望对大家有所帮助。

【讨论】：

如何使用这个点击功能？