Ask Your Question

js cascadeclassifier load always empty

asked 2019-03-03 22:53:40 -0500

SysHacker gravatar image

updated 2019-03-04 22:05:54 -0500

I am trying to load the pretrained models. I am using Vue and the XML is in the public directory


I can load it using axios.get() I then can create a new File() using the data from the get

But no matter what I do, I can not get the classifier not be empty. What is the search path used by classifier? is it local file access or network? If local file then I could use my new File()

    let classifier = new cv2.CascadeClassifier();

    // load pre-trained classifiers
    let b = classifier.load('/models/haarcascades/haarcascade_frontalface_default.xml');
    console.log('NNLOAD', b, classifier.empty())
    let faces = new cv2.RectVector();
    try {
      classifier.detectMultiScale(gray, faces, 1.1, 3, 0)
      console.log('FACE',faces, faces.size(), faces.get(0))
    catch(err) {

``` To test each path I did the following. I know that I need the correct path. That is my question., is there a default path? Where does opencv js look for the files?

  let b = classifier.load('/public/models/haarcascades/haarcascade_frontalface_default.xml')
  console.log('CLASS', process.env.BASE_URL, b, classifier.empty())
  b = classifier.load('/models/haarcascades/haarcascade_frontalface_default.xml')
  console.log('CLASS', process.env.BASE_URL, b, classifier.empty())
  b = classifier.load('models/haarcascades/haarcascade_frontalface_default.xml')
  console.log('CLASS', process.env.BASE_URL, b, classifier.empty())
  b = classifier.load('../../public/models/haarcascades/haarcascade_frontalface_default.xml')
  console.log('CLASS', process.env.BASE_URL, b, classifier.empty())
  b = classifier.load('public/models/haarcascades/haarcascade_frontalface_default.xml')
  console.log('CLASS', process.env.BASE_URL, b, classifier.empty())
  b = classifier.load('haarcascade_frontalface_default.xml')
  console.log('CLASS', process.env.BASE_URL, b, classifier.empty())

They all returned false and .empty() true.

edit retag flag offensive close merge delete


public/models/haarcascades/ vs /models/haarcascades/ -- do you see the mismatch ?

and where exactly is the public folder ?

berak gravatar imageberak ( 2019-03-04 02:34:41 -0500 )edit

I can load it using axios.get() I then can create a new File() using the data from the get

that's unfortunately useless, problem here is: you need a correct filename

berak gravatar imageberak ( 2019-03-04 02:37:06 -0500 )edit

did you check, if your cascade file is valid ?

berak gravatar imageberak ( 2019-03-05 03:08:56 -0500 )edit

I cloned the opencv repo and used those xml files. I assume that it is a valid file.

SysHacker gravatar imageSysHacker ( 2019-03-05 12:15:44 -0500 )edit

try to put html and xml into the same folder, load your html from there, and use 'haarcascade_frontalface_default.xml'

apart from that, only the 1st and last of all the paths (and maybe the one with ../.. in it, idk) are correct, think of it ..

berak gravatar imageberak ( 2019-03-05 12:22:12 -0500 )edit

I copied the xml file into every directory, /public, /src/assets, /src, src/components, still nothing. I am going to try to "import it and see what that does. I even cloned v4.0.0 and built a new opencv.js and now I am trying that.version. More later

SysHacker gravatar imageSysHacker ( 2019-03-06 20:33:38 -0500 )edit

1 answer

Sort by ยป oldest newest most voted

answered 2019-03-07 12:20:55 -0500

SysHacker gravatar image

OK. What I did was to look at the online face demo and pull code from that. the port it to Vue and axios. This is just a hard coded version but using the same concept it can be made generalized.

  createFileFromURL(file, url, cb) {
    .then((resp) => {
      let rtn = this.$cv.FS_createDataFile('/', file,, true, false, false)
    .catch((err) => {
      // eslint-disable-next-line
edit flag offensive delete link more
Login/Signup to Answer

Question Tools

1 follower


Asked: 2019-03-03 22:53:40 -0500

Seen: 93 times

Last updated: Mar 07