質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.48%
OpenCV

OpenCV(オープンソースコンピュータービジョン)は、1999年にインテルが開発・公開したオープンソースのコンピュータビジョン向けのクロスプラットフォームライブラリです。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Q&A

0回答

1888閲覧

CascadeClassifierのloadが失敗する原因はなんでしょうか?

takataka75

総合スコア95

OpenCV

OpenCV(オープンソースコンピュータービジョン)は、1999年にインテルが開発・公開したオープンソースのコンピュータビジョン向けのクロスプラットフォームライブラリです。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

0グッド

0クリップ

投稿2019/11/24 04:45

編集2019/11/30 02:05

前提・実現したいこと

javascriptでopencvの顔検出(最終的には目を)をしたいと思っています。
とりあえずサンプルを使おうとしているのですが、
loadでxmlの読み込みが失敗して次へいけません

環境
レンタルサーバー(coreserver)
chromeで表示し確認

発生している問題・エラーメッセージ

classifier.load('haarcascade_eye.xml');
の復帰値がfalseになり、
以降の処理がキチンと動かない

該当のソースコード

javascript

1<!DOCTYPE html> 2<html> 3<head> 4<meta charset="utf-8"> 5<title>Hello OpenCV.js</title> 6</head> 7<body> 8<h2>OpenCV sample</h2> 9 <script src="https://docs.opencv.org/3.4/utils.js" type="text/javascript"></script> 10<p id="status">OpenCV.js is loading...</p> 11<div> 12 <div class="inputoutput"> 13 <img id="imageSrc" alt="No Image" /> 14 <div class="caption">imageSrc <input type="file" id="fileInput" name="file" /></div> 15 </div> 16 <br> 17 <form name="test"> 18 <input type="button" value="grayscale" onClick="grayscale()"> 19 <input type="button" value="findface" onClick="findface()"> 20 <br> 21 </form> 22 <br> 23 <div class="inputoutput"> 24 <canvas id="canvasOutput" ></canvas> 25 <div class="caption">canvasOutput</div> 26 </div> 27</div> 28<script type="text/javascript"> 29let imgElement = document.getElementById('imageSrc'); 30let inputElement = document.getElementById('fileInput'); 31inputElement.addEventListener('change', (e) => { 32 imgElement.src = URL.createObjectURL(e.target.files[0]); 33}, false); 34function grayscale(){ 35 let mat = cv.imread(imgElement); 36 var dst = new cv.Mat(); 37 cv.cvtColor(mat, dst, cv.COLOR_RGBA2GRAY, 0); 38 cv.imshow('canvasOutput', dst); 39 mat.delete(); 40 dst.delete(); 41} 42function findface(){ 43 console.log("findface!"); 44 let mat = cv.imread(imgElement); 45 var dst = new cv.Mat(); 46 let classifier = new cv.CascadeClassifier(); 47 let faces = new cv.RectVector(); 48 let result = classifier.load('haarcascade_eye.xml'); 49 50 console.log(result); 51 console.log("findface2!"); 52 var gray = new cv.Mat(); 53 cv.cvtColor(mat, gray, cv.COLOR_RGBA2GRAY, 0); 54 cv.imshow('canvasOutput', gray); 55 // detect faces. 56 console.log("findface3!"); 57 classifier.detectMultiScale(gray, faces, 1.1, 3, 0); 58 // draw faces. 59 console.log("findface4!"); 60 61 for (let i = 0; i < faces.size(); ++i) { 62 console.log(i); 63 let face = faces.get(i); 64 let point1 = new cv.Point(face.x, face.y); 65 let point2 = new cv.Point(face.x + face.width, face.y + face.height); 66 cv.rectangle(dst, point1, point2, [255, 0, 0, 255]); 67 } 68 console.log("findface5!"); 69 cv.imshow('canvasOutput', dst); 70 71 cv.cvtColor(mat, dst, cv.COLOR_RGBA2GRAY, 0); 72 cv.imshow('canvasOutput', dst); 73 mat.delete(); 74 dst.delete(); 75} 76function onOpenCvReady() { 77 document.getElementById('status').innerHTML = 'OpenCV.js is ready.'; 78} 79</script> 80<script async src="https://docs.opencv.org/3.4.1/opencv.js" onload="onOpenCvReady();" type="text/javascript"></script> 81</body> 82</html> 83

xmlは大きいので、リンクにします
https://drive.google.com/open?id=1y07HhQlaX_ro7uaWupUZHR5SO0PSFitO
https://drive.google.com/open?id=1raVceLzYhZK0_Uyy-PNHRbn3CDnY0aJ8

試したこと

haarcascade_eye.xmlは同じフォルダに置いています。
haarcascade_frontalface_default.xmlなども、同じように置いて試しましたが結果は同じです。
バージョン違いも疑いましたが、
4.4.1,3.4.8,3.4.0のものを置いても同じでした。

絶対パス指定(https://~)もしてみましたがNG
パス指定の失敗はないと思っていますが、
javascriptは慣れていないので100%否定はできていない

falseしか出てこないので、
問題の切り分けもできず困っています。
(切り分けができれば、まだやりようはあると思うのですが、お手上げです)

loadの地点ではエラーは出ておらず、
以降のところでエラー(empty)があるので、読み込み失敗と見ています。

error

1cam4.html:43 findface! 2cam4.html:52 false 3cam4.html:53 findface2! 4cam4.html:58 findface3! 5opencv.js:21 OpenCV(3.4.1) Error: Assertion failed (!empty()) in detectMultiScale, file /build/master-contrib_docs-lin64/opencv/modules/objdetect/src/cascadedetect.cpp, line 1698 6shell_printErr @ opencv.js:21 7opencv.js:21 Uncaught 6397064 - Exception catching is disabled, this exception cannot be caught. Compile with -s DISABLE_EXCEPTION_CATCHING=0 or DISABLE_EXCEPTION_CATCHING=2 to catch. 8___cxa_throw @ opencv.js:21 9kD @ opencv.js:25 10iD @ opencv.js:25 11dsa @ opencv.js:34 12yr @ opencv.js:25 13XB @ opencv.js:25 14lic @ opencv.js:37 15dynCall_viiiidii_4 16CascadeClassifier$detectMultiScale 17(anonymous) @ opencv.js:21 18findface @ cam4.html:59 19onclick @ cam4.html:19 20

よろしくお願いいたします。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

oikashinoa

2019/11/24 23:19

haarcascade_eye.xmlも載せたほうが良いと思います。
oikashinoa

2019/11/29 11:24

console.log("findface4!");の下のreは何でしょうか?一度上げたソースが正しいか確認してください
takataka75

2019/11/29 15:06 編集

reは書きミスです。エラーがその手前であって止まってるので、そこまで走ってませんでしたので、気付いてませんでした。スミマセン
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだ回答がついていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問