Graduate

Complete opencv.js face detection

...@@ -8,7 +8,7 @@ ...@@ -8,7 +8,7 @@
8 #container { 8 #container {
9 margin: 0px auto; 9 margin: 0px auto;
10 width: 640px; 10 width: 640px;
11 - height: 960px; 11 + height: 480px;
12 border: 10px #333 solid; 12 border: 10px #333 solid;
13 } 13 }
14 #videoInput { 14 #videoInput {
...@@ -76,10 +76,9 @@ function processVideo() { ...@@ -76,10 +76,9 @@ function processVideo() {
76 cap.read(src); 76 cap.read(src);
77 src.copyTo(dst); 77 src.copyTo(dst);
78 cv.cvtColor(dst, gray, cv.COLOR_RGBA2GRAY, 0); 78 cv.cvtColor(dst, gray, cv.COLOR_RGBA2GRAY, 0);
79 - alert('d');
80 // detect faces. 79 // detect faces.
81 - classifier.detectMultiScale(gray, faces, 1.1, 3, 0); 80 + let msize = new cv.Size(120, 120);
82 - alert('e'); 81 + classifier.detectMultiScale(gray, faces, 1.1, 3, 0, msize);
83 // draw faces. 82 // draw faces.
84 for (let i = 0; i < faces.size(); ++i) { 83 for (let i = 0; i < faces.size(); ++i) {
85 let face = faces.get(i); 84 let face = faces.get(i);
...@@ -87,7 +86,6 @@ function processVideo() { ...@@ -87,7 +86,6 @@ function processVideo() {
87 let point2 = new cv.Point(face.x + face.width, face.y + face.height); 86 let point2 = new cv.Point(face.x + face.width, face.y + face.height);
88 cv.rectangle(dst, point1, point2, [255, 0, 0, 255]); 87 cv.rectangle(dst, point1, point2, [255, 0, 0, 255]);
89 } 88 }
90 - alert('f');
91 cv.imshow('canvasOutput', dst); 89 cv.imshow('canvasOutput', dst);
92 // schedule the next one. 90 // schedule the next one.
93 let delay = 1000/FPS - (Date.now() - begin); 91 let delay = 1000/FPS - (Date.now() - begin);
...@@ -102,7 +100,7 @@ setTimeout(processVideo, 0); ...@@ -102,7 +100,7 @@ setTimeout(processVideo, 0);
102 </head> 100 </head>
103 <body onload="cv['onRuntimeInitialized']=()=>{ load_cascade() }"> 101 <body onload="cv['onRuntimeInitialized']=()=>{ load_cascade() }">
104 <div id="container"> 102 <div id="container">
105 -<video autoplay="true" id="videoInput" width=640 height=480> <!-- style="visibility: hidden"--> 103 +<video autoplay="true" id="videoInput" width=640 height=480 style="display: none">
106 104
107 </video> 105 </video>
108 <canvas id='canvasOutput' width=640 height=480> 106 <canvas id='canvasOutput' width=640 height=480>
......