基于Javascript的纸上标记检测

Question

目前，我正在寻找一种简单的方法，以检测标记的位置，在一张照片纸上使用Javascript。到目前为止，我只发现了一些库，它们对我来说有点过头了。

例如，awe.js使用AR技术检测实时视频上的标记。但是，我所需要的只是图片上的标记检测，如下面上传的示例文件所示。(请注意，这些标记只是虚拟的标记。我将在每个角落使用单独的标记)

带有4个假标记的纸片

我试过的图书馆：

• awe.js
• 亚努科
• OpenCV:不适合Javascript
• tracking.js：https://trackingjs.com/examples/brief.html (不是很好)

有人知道我的问题有一个简单的解决办法吗？

Answer 1

感谢所有试图为我的问题找到解决方案的人。毕竟，我设法用js检测到了我的纸张上的标记：

https://github.com/jcmellado/js-aruco/tree/master/samples/getusermedia

snapshot制作一个实时视频的快照，在画布上呈现每个快照并检测标记。我调整了“getusermedia.html”，这样它就不会从视频中获取快照，而只在画布上呈现一次图像。检测器能够找到此页面中列出的每一个标记：

http://diogok.net/js-aruco-markers/index.html

最后，我不得不从aruco.js重写函数，以便它找到小于纸张20%的标记(这是默认值)。

AR.Detector.prototype.detect = function(image) {
  CV.grayscale(image, this.grey);
  CV.adaptiveThreshold(this.grey, this.thres, 2, 3);
  this.contours = CV.findContours(this.thres, this.binary);
  this.candidates = this.findCandidates(this.contours, image.width * 0.01, 0.05, 10);
  this.candidates = this.clockwiseCorners(this.candidates);
  this.candidates = this.notTooNear(this.candidates, 10);
  return this.findMarkers(this.grey, this.candidates, 49);
};

这样，js就可以在我的纸页的角上找到小标记了。

Answer 2

如果映像中有自定义标记，或者必须在服务器端执行标记检测，则可以使用js-aruco2 2库。在这里，您不必使用ArUco标记(由于最小哈明距离为1)，可以使用更高级的ARUCO_MIP_36h12 (也由ArUco团队在其C++库中提供，汉明距离为12)，或者您可以通过以下方式创建自己的标记列表：

AR.DICTIONARIES.MyDictionary = {
  nBits: 25, //bit dimension of the markers in your dictionary
  tau: 1,    //optional hamming distance of the codes in your dictionary
  codeList: ['0x1084210UL', '0x1084217UL', ...] //hexadecimal representation of every marker in your dictionary, where the array order represent the marker id
};