opencv.js building WASM cv.face.createFacemarkLBF()

asked 2019-08-20 21:21:33 -0600

kavikode gravatar image

updated 2019-08-20 21:22:43 -0600

When using the detectMultiScale function, it throws a binding error.

I understand that OpenCV.js loads and fires the onload event before it's really initialized. To wait until OpenCV.js is really ready, we have to do: cv['onRuntimeInitialized']=()=>{ // do all your work here };

I understand that files need to be created in memory and OpenCV.js has an non-advertised utility class called Utils that can be used for exactly that and other useful operations.

So I did the following;

        // do all your work here
        let utils = new Utils('errorMessage');
        let faceCascadeFile = 'haarcascade_frontalface_alt2.xml';
        let faceCascade = new cv.CascadeClassifier();
        let src = cv.imread('imageSrc');
        let gray = new cv.Mat();
        cv.cvtColor(src, gray, cv.COLOR_RGBA2GRAY, 0);
        let faces = new cv.RectVector();
        let msize = new cv.Size(0, 0);
        console.log("face CascadeClassifier");
        utils.createFileFromUrl(faceCascadeFile, faceCascadeFile, () => {
            faceCascade.detectMultiScale(gray, faces, 1.1, 3, 0, msize, msize);

            let facemark = new cv.face.createFacemarkLBF();
            console.log('yes cascade ready to load.');


I get the following error: Uncaught TypeError: Cannot read property 'createFacemarkLBF' of undefined

Is there any work around solution to solve this?

Thanks in advance!

edit retag flag offensive close merge delete



wait, wait, the opencv_contrib face module was never wrapped for javascript, you cannot use the facemark code without adding your own bindings for it here

berak gravatar imageberak ( 2019-08-21 02:53:51 -0600 )edit
  1. Added the following def get_cmake_cmd(self): of opencv/platforms/js/

  2. Appended js inside ocv_define_module of opencv_contrib/modules/face/CMakeLists.txt.

  3. Added the face module in the opencv/modules/js/src/

    face = {'': ['createFacemarkLBF', 'createFacemarkAAM', 'createFacemarkKazemi', 'drawFacemarks'], 'Facemark': ['fit', 'loadModel'], 'FacemarkLBF': [], 'FacemarkAAM'': [], 'FacemarkKazemi': [], }

  4. Added the face module to the makeWhiteList in the opencv/modules/js/src/

    white_list = makeWhiteList([core, imgproc, objdetect, video, dnn, features2d, photo, aruco, calib3d, face])

  5. Added "using namespace face;" in core_bindings.cpp

kavikode gravatar imagekavikode ( 2019-08-21 04:54:52 -0600 )edit

Keep in mind that the facemark code was developed during GSoC2017 and is still since then in contrib module because of the fact it was not fully complete. Furthermore, in current GSoC2019, there is an active project rearranging everything, so watch out with putting in to much effort. that being said, the opencv.js bindings for this module have never been tested/debugged so far, so no guarantee it will work at all.

StevenPuttemans gravatar imageStevenPuttemans ( 2019-08-21 06:14:35 -0600 )edit