В настоящее время я работаю над распознаванием лиц в браузере. Ниже приведен фрагмент кода моего java-скрипта. он обнаруживает ограничивающие рамки, когда лицо видно на экране. Я хочу напечатать сообщение на холсте, когда моя модель не распознает лицо. В этом случае прогнозы.длина будет равна 0 вот мой код, как мне изменить его для моей функциональности
async function draw(video,context, width, height)
{
context.drawImage(video,0,0,width,height);
const model = await blazeface.load();
const returnTensors = false;
const predictions = await model.estimateFaces(video, returnTensors);
console.info(predictions);
for (let i = 0; i < predictions.length; i++) {
const start = predictions[i].topLeft;
const end = predictions[i].bottomRight;
var probability = predictions[i].probability;
const size = [end[0] - start[0], end[1] - start[1]];
// Render a rectangle over each detected face.
context.beginPath();
context.strokeStyle = "green";
context.lineWidth = "4";
context.rect(start[0], start[1],size[0], size[1]);
context.stroke();
var prob = (probability[0]*100).toPrecision(5).toString();
var text = prob+"%";
context.fillStyle = "red";
context.font = "13pt sans-serif";
context.fillText(text,start[0]+5,start[1]+20);
}
setTimeout(draw,250,video,context,width,height);
}
вот репозиторий Git, который я реализую https://github.com/adarsh1021/facedetection Не судите строго, я впервые использую JS.
...
const predictions = await model.estimateFaces(video, returnTensors);
if (predictions.length < 1) {
context.fillText('No face detected.', 150, 20);
context.textAlign = "center";
}
console.info(predictions);
for (let i = 0; i < predictions.length; i++) {
...
Я добавил //1 в html-файл, я добавил if-else только в начале моего цикла for чуть выше const start.. однако это текстовое поле не отображается в пользовательском интерфейсе, что я делаю неправильно?
Вы хотите добавить его перед циклом for, а не внутри него. Цикл вообще не запустится, если нет никаких прогнозов. Я обновлю свой ответ, чтобы сделать его более понятным.
Большое спасибо, это работает. однако, еще одна помощь. Могу ли я изменить местоположение этого сообщения, в настоящее время оно появляется в левом верхнем углу (я указал его как h1). Я бы хотел, чтобы он появился в кадре видео, например, если есть лицо, покажите ограничивающую рамку с вероятностью, если нет лица, то сообщение «Лицо не обнаружено»
Хорошо, мы можем добиться этого, написав сообщение на холсте вместо элемента html. Я обновлю свой ответ.
Большое спасибо, человек, это работает, и код был прост для понимания :)
Просто создайте
div
илиh1
сообщение, которое хотите отобразить, и добавьте к немуstyle = "display:none"
. Если вы хотите отобразить сообщение, установите для свойстваdisplay
значение block следующим образом:document.getElementById("myDIV").style.display = "block";