getUserMedia()相机焦点

Question

请问有没有使用getUserMedia的摄像头对焦功能？我正在使用QuaggaJS项目- https://serratus.github.io/quaggaJS/examples/live_w_locator.html

我想做的是将焦点对准相机，因为它有点模糊，检测不到条形码。有没有人知道这是否可能？

谢谢!

Answer 1

首先-尽管这里可能是糟糕的实践-我将链接到为什么MediaCapture可能比预期的模糊或颗粒化：

简而言之: MediaCapture在媒体源上做了很多转换，这可能会导致模糊或颗粒状的图像。传递给getUserMedia的MediaConstraints对象不允许您指定焦点所在位置。这是依赖于浏览器的，通常应该在中心周围。

要解决此问题，请使用ImageCapture：

ImageCapture应用编程接口允许控制相机功能，如缩放、亮度、对比度、国际标准化组织和白平衡。最棒的是，Image Capture允许您访问任何可用的设备摄像头或网络摄像头的全分辨率功能。以前在Web上拍摄照片的技术使用的是视频快照，其分辨率低于静态图像的分辨率。

要解决问题，请执行以下操作：

如果QuaggaJS不使用ImageCapture，那么就不可能。如果是这样，你可以通过UX和缩放滑块来解决这个问题。下面是关于如何使用ImageCapture (静止图像)来实现这一点的信息。MediaCapture (视频源)不允许此功能。你可以使用ImageCapture，并有一个像“手动模式”这样的按钮，允许用户选择正确的缩放比例来拍摄照片。

您还可以通过让更新循环在每次更新时执行n ImageCaptures来“模拟”相机。

https://developers.google.com/web/updates/2016/12/imagecapture

下面是一个关于如何使用它的示例/polyfill：https://github.com/GoogleChromeLabs/imagecapture-polyfill

确保您使用处理跨平台支持的最新getUserMedia polyfills：https://www.npmjs.com/package/webrtc-adapter

希望这能有所帮助

Answer 2

如果焦点不工作，well.You可以使用locate : false进行测试。locate的默认值为true。

​

{
  locate: false,
  area: { // defines rectangle of the detection/localization area
    top: "30%",   // top offset
    right: "30%",  // right offset
    left: "30%",   // left offset
    bottom: "30%"  // bottom offset
  }
}

​

根据您的需要调整面积。