tommasoturchi / react-three-mind

MindAR components for @react-three/fiber
37 stars 12 forks source link

ARFaceMesh #20

Closed maxrpark closed 9 months ago

maxrpark commented 9 months ago

Hello! First of all thank your work!

I want to try to build something using ARFaceMesh, where I could actually add a model, similar of how it is done on MindAr.


  const mindarThree = new MindARThreeFaceTracking({
    container: document.body,
  });

const anchorOcluder = mindarThree.addAnchor(6);
  anchorOcluder.group.add(occluder);

  const anchor = mindarThree.addAnchor(6);
  anchor.group.add(modelObject);

So I took a similar approach using React Componets and loading the occluder model and the model I want to display. But the occluder is not really working.

Plus, I was wondering if there is option to position the model in certain position of the face like it is done in mindAr, mindarThree.addAnchor(6);

Do you happend to have an example using a model together ARFaceMesh?

Thanks a lot!

tommasoturchi commented 9 months ago

Hi! Glad you enjoy this! I think you're referencing a newer version of mindar. This library is still stuck at version 1.1.5, because mindar moved to vitejs, and I couldn't find a way to integrate properly the newest versions (there's a WIP pull request here https://github.com/tommasoturchi/react-three-mind/pull/18 but it has some problems I couldn't manage to fix yet). As for anchoring an object to a specific position of the face, when in face tracking mode, you can use ARAnchor's target to anchor it to a specific anchor point of the face model. Hope I was clear! Cheers,

Tommaso

maxrpark commented 9 months ago

Thank you so much for your answer. I will try that!