Get the Face Detected

Target SDK

JavaScript

React

Vue

Flutter

ReactNative

Android

iOS

TIP

You can refer to the sample code and the API Reference for more details. Most related API(s) include: VideoFrameProcessedEvent and NormalizedFacebox.

To obtain the face detected for each camera frame, access the event.facebox variable through the onVideoFrameProcessed callback function. This callback function delivers processing results at a rate of 30Hz per second (The rate depends on the frame rate of the camera).

TypeScript

/* Update the onload event handler function */
window.onload = () => {
    /* A reference of the camera that should have been created in the "Camera Setup" step. */
    const cam = createVitalSignCamera({ isActive: true, config, userInfo })
    
    // ...

    /* Add or Update the onVideoFrameProcessed callback function */
    cam.onVideoFrameProcessed = (event: VideoFrameProcessedEvent) => {
        // ...

        /* Get and log the detected normalized face box result to console */
        const facebox = event.facebox;
        console.log(`Normalized Face Box: xCenter=${facebox?.xCenter}, yCenter=${facebox?.yCenter}, width=${facebox?.width}, height=${facebox?.height}`);
    }
}

JavaScript

/* Update the onload event handler function */
window.onload = () => {
    /* A reference of the camera that should have been created in the "Camera Setup" step. */
    const cam = createVitalSignCamera({ isActive: true, config, userInfo })
    
    // ...

    /* Add or Update the onVideoFrameProcessed callback function */
    cam.onVideoFrameProcessed = (event) => {
        // ...

        /* Get and log the detected normalized face box result to console */
        const facebox = event.facebox;
        console.log(`Normalized Face Box: xCenter=${facebox.xCenter}, yCenter=${facebox.yCenter}, width=${facebox.width}, height=${facebox.height}`);
    }
}