使用 Affectiva JS SDK 的错误(帧检测器模式)
Errors using Affectiva JS SDK (Frame Detector Mode)
我在使用 Affectiva (http://developer.affectiva.com/v3_1/javascript/analyze-frames/), specifically in Frame Detector mode. I had no trouble getting the CameraFeed version up & running, they even have a nice example on JSFiddle (https://jsfiddle.net/affectiva/opyh5e8d/show/) 的新 JS SDK 时遇到问题。但是 Frame Detector 模式只从 Web Worker 给了我数百个 "runtime errors"。
<body class='session'>
<div class='col-md-8' id='affdex_elements' style='width:680px;height:480px;'>
<video autoplay id='video'></video>
<canvas id='canvas'></canvas>
</div>
<div id='results' style='word-wrap:break-word;'></div>
<div id='logs'></div>
<script src="https://download.affectiva.com/js/3.1/affdex.js"></script>
<script>
var width = 640;
var height = 480;
var faceMode = affdex.FaceDetectorMode.LARGE_FACES;
var detector = new affdex.FrameDetector(faceMode);
detector.addEventListener("onInitializeSuccess", function() {
console.log('Detector reports initialized.');
// Start with first capture...
captureImage();
});
detector.addEventListener("onImageResultsSuccess", function (faces, image, timestamp) {
console.log( faces );
captureImage();
});
detector.addEventListener("onImageResultsFailure", function (image, timestamp, err_detail) {
console.log( err_detail );
captureImage();
});
detector.detectAllExpressions();
detector.detectAllEmotions();
detector.detectAllEmojis();
detector.detectAllAppearance();
detector.start();
var v = document.getElementById('video');
var c = document.getElementById('canvas');
var t = c.getContext('2d');
c.width = width;
c.height = height;
navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia ||
navigator.mozGetUserMedia || navigator.msGetUserMedia || navigator.oGetUserMedia;
if (navigator.getUserMedia) {
navigator.getUserMedia({video: true}, handleVideo, videoError);
}
function handleVideo(stream) { v.src = window.URL.createObjectURL(stream); }
function videoError(e) { console.log( e ); }
function captureImage() {
console.log('Capturing...');
t.clearRect( 0, 0, c.width, c.height );
t.drawImage( v, 0, 0, width, height );
var imgData = t.getImageData(0, 0, c.width, c.height);
var currentTimeStamp = ( new Date() ).getTime() / 1000;
detector.process( imgData, currentTimeStamp );
}
</script>
为了得到一个简单的工作示例,我删除了所有非必要的内容。同样,我对这个的 CameraFeed 版本没有问题 运行。只是这个不起作用。我错过了什么傻事吗?文档有点轻...
在内部,时间戳被转换为整数进行存储。我认为你可能 运行 进入整数溢出。
您能否缓存初始时间戳,并从后续时间戳中减去它,以便传递给 process() 的第一个时间戳为 0,然后后续值增加幅度。
我在使用 Affectiva (http://developer.affectiva.com/v3_1/javascript/analyze-frames/), specifically in Frame Detector mode. I had no trouble getting the CameraFeed version up & running, they even have a nice example on JSFiddle (https://jsfiddle.net/affectiva/opyh5e8d/show/) 的新 JS SDK 时遇到问题。但是 Frame Detector 模式只从 Web Worker 给了我数百个 "runtime errors"。
<body class='session'>
<div class='col-md-8' id='affdex_elements' style='width:680px;height:480px;'>
<video autoplay id='video'></video>
<canvas id='canvas'></canvas>
</div>
<div id='results' style='word-wrap:break-word;'></div>
<div id='logs'></div>
<script src="https://download.affectiva.com/js/3.1/affdex.js"></script>
<script>
var width = 640;
var height = 480;
var faceMode = affdex.FaceDetectorMode.LARGE_FACES;
var detector = new affdex.FrameDetector(faceMode);
detector.addEventListener("onInitializeSuccess", function() {
console.log('Detector reports initialized.');
// Start with first capture...
captureImage();
});
detector.addEventListener("onImageResultsSuccess", function (faces, image, timestamp) {
console.log( faces );
captureImage();
});
detector.addEventListener("onImageResultsFailure", function (image, timestamp, err_detail) {
console.log( err_detail );
captureImage();
});
detector.detectAllExpressions();
detector.detectAllEmotions();
detector.detectAllEmojis();
detector.detectAllAppearance();
detector.start();
var v = document.getElementById('video');
var c = document.getElementById('canvas');
var t = c.getContext('2d');
c.width = width;
c.height = height;
navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia ||
navigator.mozGetUserMedia || navigator.msGetUserMedia || navigator.oGetUserMedia;
if (navigator.getUserMedia) {
navigator.getUserMedia({video: true}, handleVideo, videoError);
}
function handleVideo(stream) { v.src = window.URL.createObjectURL(stream); }
function videoError(e) { console.log( e ); }
function captureImage() {
console.log('Capturing...');
t.clearRect( 0, 0, c.width, c.height );
t.drawImage( v, 0, 0, width, height );
var imgData = t.getImageData(0, 0, c.width, c.height);
var currentTimeStamp = ( new Date() ).getTime() / 1000;
detector.process( imgData, currentTimeStamp );
}
</script>
为了得到一个简单的工作示例,我删除了所有非必要的内容。同样,我对这个的 CameraFeed 版本没有问题 运行。只是这个不起作用。我错过了什么傻事吗?文档有点轻...
在内部,时间戳被转换为整数进行存储。我认为你可能 运行 进入整数溢出。 您能否缓存初始时间戳,并从后续时间戳中减去它,以便传递给 process() 的第一个时间戳为 0,然后后续值增加幅度。