eye detection example
marcomoscardini opened this issue · 9 comments
I am after a valid example of your objectdetect.js to detect eyes in a face ROI. I have succeeded to detect one eye and integrate into the image example. I would like to detect eyes within the face being detected, can it be done?
this will detect the face and one eye, what do I nee to do to make it detect 2 eyes in a face region, can I make it work with many faces at the same time?
on openCV C++ I did manage, but in JS I am having hard time, can u help?
<script src="js/objectdetect.js"></script> <script src="js/objectdetect.frontalface.js"></script> <script src="js/objectdetect.eye.js"></script> <script src="http://code.jquery.com/jquery-1.8.0.min.js"></script> <script src="js/jquery.objectdetect.js"></script> <script> $(window).load(function() { $("#face").objectdetect("all", {classifier: objectdetect.frontalface}, function(coords) { $(" $("#face").objectdetect("all", {classifier: objectdetect.eye}, function(coords) {
$("<div />", {
"css": {
"border": "2px solid #F00",
"position": "absolute",
"left": ($("#face").offset().left + coords[0][0]) + "px",
"top": ($("#face").offset().top + coords[0][1]) + "px",
"width": coords[0][2] + "px",
"height": coords[0][3] + "px"
}
}).appendTo("body");
});
});
});
</script>
It can be done, but not yet with the jQuery plugin. I think that adding an option called "selection" that allows to restrict the search window might be the answer to your question - what do you think?
absolutely, I have tried to run it on a standalone image, but it can not working on multiple faces with in the same source image. I just nested the detection of the face, and run a eye detect on the whole image/video and I get wrong data when connected to a video... but I will try again today ( it works with static images).
as I said: performance on the second stage object detection has to work on a ROI and not on the whole image... that way performance is improved and I can detect eyes within a face and not only with in whole image.
I was thinking to copy the face in a canvas and make the eye-detector work on the copied portion of the image... but I am too novice to do it... I need to research it further. I am not too sure performance wise it would be good, but functionally, I would get what I need, just as you proposed a selection to work with.
thisis what I managed to get working so far, but as I said it works only on whole images
<title>Image Example</title><script src="js/objectdetect.js"></script>
<script src="js/objectdetect.frontalface.js"></script>
<script src="js/objectdetect.eye.js"></script>
<script src="http://code.jquery.com/jquery-1.8.0.min.js"></script>
<script src="js/jquery.objectdetect.js"></script>
<script>
$(window).load(function() {
$("#face").objectdetect("all", { classifier: objectdetect.frontalface }, function(face) {
$("<div />", {
"css": {
"border": "2px solid #00FF00",
"position": "absolute",
"left": ($("#face").offset().left + face[0][0]) + "px",
"top": ($("#face").offset().top + face[0][1]) + "px",
"width": face[0][2] + "px",
"height": face[0][3] + "px"
}
}).appendTo("body");
//detect_eyes
$("#face").objectdetect("all", {classifier: objectdetect.eye}, function(eyes) {
$("<div />", {
"css": {
"border": "2px solid #F00",
"position": "absolute",
"left": ($("#face").offset().left + eyes[0][0]) + "px",
"top": ($("#face").offset().top + eyes[0][1]) + "px",
"width": eyes[0][2] + "px",
"height": eyes[0][3] + "px"
}
}).appendTo("body");
$("<div />", {
"css": {
"border": "2px solid #F00",
"position": "absolute",
"left": ($("#face").offset().left + eyes[1][0]) + "px",
"top": ($("#face").offset().top + eyes[1][1]) + "px",
"width": eyes[1][2] + "px",
"height": eyes[1][3] + "px"
}
}).appendTo("body");
});
});
});
</script>
Image
This weekend I added the possibility to specify a ROI / selection using the jQuery plugin:
$("#face").objectdetect("all", {classifier: objectdetect.frontalface}, function(faces) {
for (var i = 0; i < faces.length; ++i) {
$(this).highlight(faces[i], "red");
$(this).objectdetect("all", {classifier: objectdetect.eye, selection: faces[i]}, function(eyes) {
for (var j = 0; j < eyes.length; ++j) {
$(this).highlight(eyes[j], "blue");
}
});
}
});For a complete example, have a look at https://github.com/mtschirs/js-objectdetect/blob/master/examples/example_image.htm
impressive, but fails on chrome and firefox, tested on opera works well
sorry, fails only on chrome due to a dom security issue
tested on fx and opera 12 works
When running the examples from your local system and not via webserver, Chrome needs to be started with the --allow-file-access-from-files flag. Or try http://mtschirs.github.com/js-objectdetect/examples/example_image.htm instead.
Does this code for ROI/selection by mtschris works on video?
I dont see why not, it works on a canvas after all
On Sat, 2013-03-23 at 02:22 -0700, samjones wrote:
Does this code for ROI/selection by mtschris works on video?
—
Reply to this email directly or view it on GitHub.
It can be done, but not yet with the jQuery plugin. I think that adding an option called "selection" that allows to restrict the search window might be the answer to your question.
Is there any such option of providing 'selection' in js (without jquery)?
Also I can't find any reference to the functions used in example, any links on that will be very helpful.