0

I had a web Project that used Emscripten to build c++ Code and use "Module.ccall.." to call my c++ function, the main feature is to render by using OpenGL ES, now I want to add MediaPipe's Gesture recognition to my Project using JavaScript, but I have to called "GestureRecognizer.createFromOptions.." 2~3 times, the process will go ahead is the first problem, and the second is after process can go ahead, but when I call "Module.ccall..", it will show message "Uncaught TypeError: Cannot read properties of undefined (reading 'ccall')", some one can help? Thanks!, the code is bellow:

import { FilesetResolver, GestureRecognizer } from "https://cdn.jsdelivr.net/npm/@mediapipe/[email protected]";

async function startGestureDetection() {

const videoElement = document.getElementById('webcam');
const canvasElement = document.getElementById('webcam_preview');
const canvasCtx = canvasElement.getContext('2d');


videoStream = await navigator.mediaDevices.getUserMedia({ video: true });
videoElement.srcObject = videoStream;

try {
    console.log("[ges] FilesetResolver: ", FilesetResolver);
    const vision = await FilesetResolver.forVisionTasks(
        "https://cdn.jsdelivr.net/npm/@mediapipe/[email protected]/wasm"
    );
    console.log("[ges] vision: ", vision);

    console.log("[ges] GestureRecognizer: ", GestureRecognizer);
    gestureRecognizer = await GestureRecognizer.createFromOptions(vision, {
        baseOptions: {
           ,
            modelAssetPath: "./models/gesture_recognizer.task",
            delegate: "GPU"
        },
        runningMode: "VIDEO"
    });
} catch (error) {
    console.error("Error initializing hand detection:", error);
}

console.log("[ges][startGestureDetection] gestureRecognizer: ", gestureRecognizer);

videoElement.addEventListener('loadeddata', async () => {
    while (isGestureDetectionActive) {

        const results = await gestureRecognizer.recognizeForVideo(videoElement, performance.now());

        canvasCtx.clearRect(0, 0, canvasElement.width, canvasElement.height);
        canvasCtx.drawImage(videoElement, 0, 0, canvasElement.width, canvasElement.height);

        if (results.gestures.length > 0) {
            const categoryName = results.gestures[0][0].categoryName;
            const categoryScore = parseFloat(results.gestures[0][0].score * 100).toFixed(2);
            canvasCtx.fillStyle = 'red';
            canvasCtx.font = '20px Arial';
            canvasCtx.fillText(`${categoryName} (${categoryScore})`, 10, 30);
        }
        await new Promise(requestAnimationFrame);
    }
});

}

I want Module.ccall.. to work

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.