clmtrackr
clmtrackr copied to clipboard
My tracker doesn’t work...i can see the default model but it won't match my face ,why?
when i open the html i wrote, the video works fine, but the default face model stay still on the left of the video, it won't match my face. i'm pretty sure the code has no problem, the console reports no warning, and the light on my face is even. So do you have any idea where the problem might come from?
I am going to go with: your code. More seriously: could you provide your code. It is impossible to tell without.
I am going to go with: your code. More seriously: could you provide your code. It is impossible to tell without. Here is my code. I will appreciate it if can help me out.
You do not call 'getCurrentPosition()' inside your function drawLoop(). This might be a problem. I cannot test, because I am not willing to copy your code from screenshot. Try inserting this
if (ctracker.getCurrentPosition()) {
ctracker.draw(overlay);
}
Also, you do not call your positionLoop method anywhere, as far as I can tell. Having a double nested function in there seems dangerous. Have a look at the example at https://github.com/auduno/clmtrackr/blob/dev/examples/clm_video.html . This works well.
<html lang="en">
<head>
<title> face landmark detection</title>
<meta charset = "utf-8">
<style>
#container {
position : relative;
}
#canvas {
position : absolute;
left:0;
top:0;
}
</style>
</head>
<body>
<script src="F:/QQ garbage/webgarbage/clmtrackr-dev/examples/js/libs/utils.js"></script>
<script src="F:/QQ garbage/webgarbage/clmtrackr-dev/build/clmtrackr.js"></script>
<div id="content">
<h2>landmark output</h2>
<div id="container">
<video id="video" width="368" height="288" autoplay="" loop="" playsinline="">
<source src="E:/ApowerREC/output file/20180818_201555.mp4" type="video/mp4">
</video>
<canvas id="canvas" width="368" height="288"></canvas>
</div>
<p>printing facial landmarks</p>
<p id="positions"></p>
<script>
var videoInput = document.getElementById('video');
var ctracker = new clm.tracker();
ctracker.init();
ctracker.start(videoInput);</script>
<script>function positionLoop() {
requestAnimFrame(positionLoop);
var positions = ctracker.getCurrentPosition();
// do something with the positions ...
// print the positions
if (ctracker.getCurrentPosition()) {
ctracker.draw(overlay);
}
var positionString = "hhc";
var newstring = "wwwwww";
//document.getElementById('positions').innerHTML = newstring;
//document.getElementById('positions').innerHTML = positionString;
if (positions) {//used to be positions
for (var p = 0;p < 10;p++) {
positionString += "featurepoint "+p+" : ["+positions[p][0].toFixed(2)+","+positions[p][1].toFixed(2)+"]<br/>";
}
document.getElementById('positions').innerHTML = positionString;
}
}
positionLoop();
var canvasInput = document.getElementById('canvas');
var cc = canvasInput.getContext('2d');
function drawLoop() {
requestAnimFrame(drawLoop);
cc.clearRect(0, 0, canvasInput.width, canvasInput.height);
ctracker.draw(canvasInput);
}
drawLoop();
</script>
</div>
</body>
</html>
Thanks for your patience. I inserted ctracker.draw(overlay) but it didn't work. Here is my code, to run this code you may need change the src of.js and the source of the video, it's really nice of you to help me out. Hoping for your reply.
I'm getting the same issue when I don't use getCurrentPosition (draws face in top left), and when I add the check for getCurrentPosition it doesn't draw at all -- Not detecting the face.