在 Angular 8 中使用 Quagga.onProcessed() 时，图像中没有绿线

问题描述

我在 Angular 8.2 中使用 QuaggaJS 插件。我有这个代码，如下所示。

component.ts

Quagga.init({
  inputStream: {
    name: "Live",type: "LiveStream",target: document.querySelector('#scanner-container'),constraints: {
      width: 480,height: 320,facingMode: "environment"
    },},decoder: {
    readers: [
      "code_128_reader",....,],debug: {
      showCanvas: true,BoxFromPatches: {
        showTransformed: true,...,}
    }
  },function (err) {
  if (err) {
    return
  }
  Quagga.start();
});
Quagga.onProcessed(function (result) {
  var drawingCtx = Quagga.canvas.ctx.overlay,drawingCanvas = Quagga.canvas.dom.overlay;
  if (result) {
    if (result.Boxes) {
      drawingCtx.clearRect(0,parseInt(drawingCanvas.getAttribute("width")),parseInt(drawingCanvas.getAttribute("height")));
      result.Boxes.filter(function (Box) {
        return Box !== result.Box;
      }).forEach(function (Box) {
        Quagga.ImageDebug.drawPath(Box,{ x: 0,y: 1 },drawingCtx,{ color: "green",linewidth: 2 });
      });
    }
    if (result.Box) {
      Quagga.ImageDebug.drawPath(result.Box,{ color: "#00F",linewidth: 2 });
    }
    if (result.codeResult && result.codeResult.code) {
      Quagga.ImageDebug.drawPath(result.line,{ x: 'x',y: 'y' },{ color: 'red',linewidth: 3 });
    }
  }
});

在 component.scss 中

canvas.drawing,canvas.drawingBuffer {
  position: absolute;
  left: 0;
  top: 0;
}

在 component.html 中

<div id="scanner-container"></div>

此代码显示此

我不明白为什么条码图像中没有绿线。你有什么想法吗？我已关注this

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）