optimize font resizing

pull/293/head
Vladimir Mandic 2020-11-06 22:20:42 -05:00
parent 481b89ec9c
commit 69201984c1
2 changed files with 14 additions and 8 deletions

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
// 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)
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
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
maxHands: 10, // maximum number of hands detected in the input, should be set to the minimum number for performance
detector: {

View File

@ -123,11 +123,16 @@ async function setupCamera() {
let stream;
const constraints = {
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 {
if (window.innerWidth > window.innerHeight) constraints.video.width = { ideal: window.innerWidth };
else constraints.video.height = { ideal: window.innerHeight };
// if (window.innerWidth > window.innerHeight) constraints.video.width = { ideal: window.innerWidth };
// else constraints.video.height = { ideal: window.innerHeight };
stream = await navigator.mediaDevices.getUserMedia(constraints);
} catch (err) {
if (err.name === 'PermissionDeniedError') msg = 'camera permission denied';
@ -151,6 +156,9 @@ async function setupCamera() {
canvas.height = video.height;
canvas.style.width = canvas.width > canvas.height ? '100vw' : '';
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();
ui.busy = false;
// do once more because onresize events can be delayed or skipped
@ -246,8 +254,6 @@ async function detectVideo() {
document.getElementById('canvas').style.display = 'block';
const video = document.getElementById('video');
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;
if ((video.srcObject !== null) && !video.paused) {
document.getElementById('play').style.display = 'block';
@ -266,7 +272,7 @@ async function detectVideo() {
async function detectSampleImages() {
document.getElementById('play').style.display = 'none';
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.baseLineHeight = ui.baseLineHeightProto * ui.columns;
document.getElementById('canvas').style.display = 'none';