爲什麼我獲得自然寬度爲0的動態創建的圖像

我正在使用Webcam.js從攝像機獲取圖像。爲什麼我獲得自然寬度爲0的動態創建的圖像

document.getElementById('cameraImage').src = data_uri; data_uri爲我提供了相機的圖像表單捕捉事件。

然後，我在JavaScript中動態創建圖像，如 var img = new Image（）; img.src = data_uri;

當我試圖運用它使用Facedetection.js 人臉檢測提示錯誤未能就CanvasRenderingContext2D執行getImageData：源寬度爲0

我怎麼可以設置圖像的源寬度所以人臉檢測將工作

來源

2016-09-16 Prasad

你可以共享可執行的演示/代碼片段或[JSFiddle]（https://jsfiddle.net/）？ [_創建一個最小，完整和可驗證的示例_]（http://stackoverflow.com/help/mcve） – Rayon

特異於人臉檢測JS做一個修改，以便您的porblem將得到解決。

在facedetection.js你會發現

灰度（圖像）{} 功能

更改以下畫布寬度和高度設置

canvas.width = image.naturalWidth; 
canvas.height = image.naturalHeight;

你的臉檢測開始正常工作

來源

2016-10-05 06:18:50

如果您嘗試從其他服務器加載圖像，則可能出於安全原因出現此問題。

請按照此https://developer.mozilla.org/en-US/docs/Web/HTML/CORS_enabled_image。

檢查創建後是否看到圖像。測試很簡單：

var newImg = document.createElement("img"); 
newImg.src = data_uri; 
document.body.appendChild(newImg);

來源

2016-09-16 07:43:02

當我使用Camera獲取圖像以及從用戶上傳圖像時，會導致此問題。 – Prasad

將數據URI分配爲圖像源是異步操作。確保你嘗試做任何事情與它之前，你的形象被完全加載：

var img = new Image(); 
img.onload = function() { 
    // Call your face detection methods here... 
} 
img.src = data_uri;

來源

2016-09-16 10:22:25

從服務器文件使用圖像時，我遇到同樣的問題（加載速度比本地文件慢）。這是我的修復（從行號16568）：

if (time = new Date().getTime(), $$.is("img")) { 
          source = new Image(), source.src = $$.attr("src"), 
            source.crossOrigin = $$.attr("crossorigin"); 

          $(source).load(function() { 
           canvas = ccv.pre(source); 
           options.grayscale && (canvas = ccv.grayscale(canvas, source)); 
           try { 
            options.async && window.Worker ? ccv.detect_objects({ 
             canvas: canvas, 
             cascade: cascade, 
             interval: options.interval, 
             min_neighbors: options.minNeighbors, 
             worker: 1, 
             async: !0 
            })(done) : done(ccv.detect_objects({ 
             canvas: canvas, 
             cascade: cascade, 
             interval: options.interval, 
             min_neighbors: options.minNeighbors 
            })); 
           } catch (e) { 
            options.error.apply($$, [2, e.message]), options.complete.apply($$, [!1]); 
           } 
          }); 
          return this; 

         }

來源

2016-10-06 04:52:31 ducminh1903

爲什麼我獲得自然寬度爲0的動態創建的圖像

回答

相關問題