ambiser
/
human
mirror of https://github.com/vladmandic/human
9
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

optimize font resizing

pull/280/head
Vladimir Mandic 2020-11-06 22:20:42 -05:00
parent 0670083e92
commit fc85f4a799
2 changed files with 14 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
config.js
View File

@ -108,9 +108,9 @@ export default {
skipFrames: 15, // how many frames to go without re-running the hand bounding box detector, only used for video inputs skipFrames: 15, // how many frames to go without re-running the hand bounding box detector, only used for video inputs
// if model is running st 25 FPS, we can re-use existing bounding box for updated hand skeleton analysis // if model is running st 25 FPS, we can re-use existing bounding box for updated hand skeleton analysis
// as the hand probably hasn't moved much in short time (10 * 1/25 = 0.25 sec) // as the hand probably hasn't moved much in short time (10 * 1/25 = 0.25 sec)
minConfidence: 0.1, // threshold for discarding a prediction minConfidence: 0.2, // threshold for discarding a prediction
iouThreshold: 0.2, // threshold for deciding whether boxes overlap too much in non-maximum suppression iouThreshold: 0.2, // threshold for deciding whether boxes overlap too much in non-maximum suppression
scoreThreshold: 0.1, // threshold for deciding when to remove boxes based on score in non-maximum suppression scoreThreshold: 0.2, // threshold for deciding when to remove boxes based on score in non-maximum suppression
enlargeFactor: 1.65, // empiric tuning as skeleton prediction prefers hand box with some whitespace enlargeFactor: 1.65, // empiric tuning as skeleton prediction prefers hand box with some whitespace
maxHands: 10, // maximum number of hands detected in the input, should be set to the minimum number for performance maxHands: 10, // maximum number of hands detected in the input, should be set to the minimum number for performance
detector: { detector: {

18
demo/browser.js
View File

@ -123,11 +123,16 @@ async function setupCamera() {
let stream; let stream;
const constraints = { const constraints = {
audio: false, audio: false,
video: { facingMode: (ui.facing ? 'user' : 'environment'), resizeMode: 'none' }, video: {
facingMode: (ui.facing ? 'user' : 'environment'),
resizeMode: 'none',
width: { ideal: window.innerWidth },
height: { ideal: window.innerHeight },
},
}; };
try { try {
if (window.innerWidth > window.innerHeight) constraints.video.width = { ideal: window.innerWidth }; // if (window.innerWidth > window.innerHeight) constraints.video.width = { ideal: window.innerWidth };
else constraints.video.height = { ideal: window.innerHeight }; // else constraints.video.height = { ideal: window.innerHeight };
stream = await navigator.mediaDevices.getUserMedia(constraints); stream = await navigator.mediaDevices.getUserMedia(constraints);
} catch (err) { } catch (err) {
if (err.name === 'PermissionDeniedError') msg = 'camera permission denied'; if (err.name === 'PermissionDeniedError') msg = 'camera permission denied';
@ -151,6 +156,9 @@ async function setupCamera() {
canvas.height = video.height; canvas.height = video.height;
canvas.style.width = canvas.width > canvas.height ? '100vw' : ''; canvas.style.width = canvas.width > canvas.height ? '100vw' : '';
canvas.style.height = canvas.width > canvas.height ? '' : '100vh'; canvas.style.height = canvas.width > canvas.height ? '' : '100vh';
// silly font resizing for paint-on-canvas since viewport can be zoomed
const size = 14 + (6 * canvas.width / window.innerWidth);
ui.baseFont = ui.baseFontProto.replace(/{size}/, `${size}px`);
if (live) video.play(); if (live) video.play();
ui.busy = false; ui.busy = false;
// do once more because onresize events can be delayed or skipped // do once more because onresize events can be delayed or skipped
@ -246,8 +254,6 @@ async function detectVideo() {
document.getElementById('canvas').style.display = 'block'; document.getElementById('canvas').style.display = 'block';
const video = document.getElementById('video'); const video = document.getElementById('video');
const canvas = document.getElementById('canvas'); const canvas = document.getElementById('canvas');
const size = 12 + Math.trunc(window.innerWidth / 400);
ui.baseFont = ui.baseFontProto.replace(/{size}/, `${size}px`);
ui.baseLineHeight = ui.baseLineHeightProto; ui.baseLineHeight = ui.baseLineHeightProto;
if ((video.srcObject !== null) && !video.paused) { if ((video.srcObject !== null) && !video.paused) {
document.getElementById('play').style.display = 'block'; document.getElementById('play').style.display = 'block';
@ -266,7 +272,7 @@ async function detectVideo() {
async function detectSampleImages() { async function detectSampleImages() {
document.getElementById('play').style.display = 'none'; document.getElementById('play').style.display = 'none';
human.config.videoOptimized = false; human.config.videoOptimized = false;
const size = Math.trunc(ui.columns * 25600 / window.innerWidth); const size = 12 + Math.trunc(12 * ui.columns * window.innerWidth / document.body.clientWidth);
ui.baseFont = ui.baseFontProto.replace(/{size}/, `${size}px`); ui.baseFont = ui.baseFontProto.replace(/{size}/, `${size}px`);
ui.baseLineHeight = ui.baseLineHeightProto * ui.columns; ui.baseLineHeight = ui.baseLineHeightProto * ui.columns;
document.getElementById('canvas').style.display = 'none'; document.getElementById('canvas').style.display = 'none';