search

justadudewhohacks / face-api.js

JavaScript API for face detection and face recognition in the browser and nodejs with tensorflow.js
MIT License
16.65k stars 3.7k forks source link

How to I get current coordinates by viewport for a detected face for different devices #933

Open harundogan01 opened 9 months ago

harundogan01 commented 9 months ago

Hi,

My goal is to take a photo of the face detected in the mobile browser when it hovers over the red image that is fixed in the middle of the page. But I am encountering a problem here. Coordinate values change on different devices and I cannot detect the face exactly. I have to manually adjust the resolution but there are hundreds of phones with different resolutions. I want to solve this situation with a fixed coordinate. Regardless of the resolution, I want to check the hover status of the image in the middle of the page by comparing the coordinates of the two, and if the coordinates are equal, I want to take a photo of the face. However, the coordinates I have for the face do not give the current position on the page. What can I do?

image

Thanks

LeonardoMachado30 commented 7 months ago

Hello Harundogan01, I believe you can do what I did, I set a resolution of 720p with the width size 360px and 400px height for the capture, the video is at 720p and the size of the video doesn't matter, what matters is when you go to capture the image and set it on the canvas, you should resize, this solves part of the problem of device adaptability, I couldn't test on all devices but currently all the ones I tested worked

Dsalomon-16 commented 3 months ago

redimensiona en proporción y usa vh para las medidas metes el lienzo dentro de un div contenedor y el lienzo se ajusta a ese div, así limitas y usas medidas de acuerdo al dispositivo.