Тестирование изображений с помощью Affectiva SDK - изменение видеопотока для отображения изображения - PullRequest
Новая
       18

Тестирование изображений с помощью Affectiva SDK - изменение видеопотока для отображения изображения

0 голосов
/ 17 марта 2020

Я использую Affectiva SDK для распознавания эмоций. Текущий рабочий процесс должен инициализировать CameraDetector и нацелить на указанный div. Затем целевой div заполняется тегом Video и Canvas. Оба тега заполнены прямой трансляцией с веб-камеры пользователя. Можно увидеть на изображении ниже.

Я пытаюсь проверить точность этого SDK, однако не могу вставить изображения или изменить источник видео. Попытался отредактировать источник видео и ничего не изменилось, изображение осталось прежним.

Как вставить изображение в видеопоток?

Если кто-то использовал Affectiva SDK и использовал изображения вместо видео, опишите, как.

enter image description here

Текущий Javascript код для инициализации SDK 

function intialiseEmotionRecognition(){
// SDK Needs to create video and canvas nodes in the DOM in order to function
// Here we are adding those nodes a predefined div.
var divRoot = $("#affdex_elements")[0];
var width = 320;
var height = 240;
var faceMode = affdex.FaceDetectorMode.LARGE_FACES;
//Construct a CameraDetector and specify the image width / height and face detector mode.
var detector = new affdex.CameraDetector(divRoot, width, height, faceMode);
//Enable detection of all Emotions
detector.detectAllEmotions();
detector.start()
//Initialise webcam and image listeners
webcamEventListeners()
recivedImageListener()

//Add a callback to notify when camera access is allowed
function webcamEventListeners(){
    //Add a callback to notify when the detector is initialized and ready for runing.
    detector.addEventListener("onInitializeSuccess", function () {
        console.log('#logs', "Load Successful");
        var canvas = document.getElementById('face_video_canvas');
        var ctx = canvas.getContext('2d');
        var img = document.getElementById("scream");
        ctx.drawImage(img, 10, 10)
    });
    detector.addEventListener("onWebcamConnectSuccess", function () {
        console.log('#logs', "Webcam Connected");
        webcamActive = "True"
    });

    //Add a callback to notify when camera access is denied
    detector.addEventListener("onWebcamConnectFailure", function () {
        console.log('#logs', "Webcam Not Connected");
        webcamActive = "False"
    });
}

function recivedImageListener(){
    //Add a callback to receive the results from processing an image.
    //The faces object contains the list of the faces detected in an image.
    //Faces object contains probabilities for all the different expressions, emotions and appearance metrics
    detector.addEventListener("onImageResultsSuccess", function (faces) {
        if (faces.length > 0) {
            var emotions = JSON.stringify(faces[0].emotions, function (key, val) { return val.toFixed ? Number(val.toFixed(0)) : val; })
            emotionName = getEmotion(emotions, emotionName)
            console.log(emotionName)
        }
    });
}

}

...