feature request: using mind-ar with native threejs (without a-frame)

[hiukim]

feature request: using mind-ar with native threejs (without a-frame)

[hiukim]

@ThorstenBux

Yes, totally. I have been planning on doing this for a long time. Just separated aframe extension from the core in the latest release 1.0.0.

Will try to write up something.

[ThorstenBux]

Awesome, thank you 😊 Get Outlook for iOS<https://aka.ms/o0ukef>

…

________________________________ From: HiuKim Yuen ***@***.***> Sent: Thursday, October 7, 2021 7:23:33 AM To: hiukim/mind-ar-js ***@***.***> Cc: Thorsten Bux ***@***.***>; Mention ***@***.***> Subject: Re: [hiukim/mind-ar-js] feature request: using mind-ar with native threejs (without a-frame) (#56) @ThorstenBux<https://apac01.safelinks.protection.outlook.com/?url=https%3A%2F%2Fgithub.com%2FThorstenBux&data=04%7C01%7C%7Cc431d08afcbc423bdb6508d988f6682a%7C84df9e7fe9f640afb435aaaaaaaaaaaa%7C1%7C0%7C637691414180266223%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C1000&sdata=%2F66LQmvjuL6ddVBd3BkaZOIge%2BwLKfUoYDrCf%2BaL1Pg%3D&reserved=0> Yes, totally. I have been planning on doing this for a long time. Just separated aframe extension from the core in the latest release 1.0.0. Will try to write up something. — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub<https://apac01.safelinks.protection.outlook.com/?url=https%3A%2F%2Fgithub.com%2Fhiukim%2Fmind-ar-js%2Fissues%2F56%23issuecomment-936844638&data=04%7C01%7C%7Cc431d08afcbc423bdb6508d988f6682a%7C84df9e7fe9f640afb435aaaaaaaaaaaa%7C1%7C0%7C637691414180276180%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C1000&sdata=2J9899fTbVeoFrVp5Y9qRvow1oiBLdJBrBYPZLsKTfw%3D&reserved=0>, or unsubscribe<https://apac01.safelinks.protection.outlook.com/?url=https%3A%2F%2Fgithub.com%2Fnotifications%2Funsubscribe-auth%2FAD765PEZUTJNDUYZSPPLJB3UFSH2LANCNFSM5FNZPKJQ&data=04%7C01%7C%7Cc431d08afcbc423bdb6508d988f6682a%7C84df9e7fe9f640afb435aaaaaaaaaaaa%7C1%7C0%7C637691414180286141%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C1000&sdata=1zh0duOKsnfi83FBDTbbFc6AaaM0KGsyi6RRUoiLc0Q%3D&reserved=0>.

[akhrarovsaid]

Hey @ThorstenBux ,

I recently integrated ThreeJS + React + MindAR using a Context Provider. I did this, however, before the last major release. The code is essentially just a rewrite of the aframe wrapper in the src. Let me know if you'd like to know more - I'd be happy to run you through the process.

Cheers

[ThorstenBux]

Hi @akhrarovsaid ,

That is awesome. Yes please let me know how you did it. I got somewhere with my approach but always have an offset of the virtual content on the marker that I can't fix.
Thank you 🙏

[ThorstenBux]

Hi @hiukim, have you had a chance to look into this?

[hiukim]

@ThorstenBux Yes, I'm working on it, but probably need a bit more time. Need to make the API right before officially releasing something, otherwise it will be hard to maintain in the long run, or break backward compatibility.

[ThorstenBux]

Yes true, I highly appreciate it. Let me know if you have some dev-repo or anything somewhere. Happy to contribute.

[gjcope]

Great project! Interested in this feature as well.

[akhrarovsaid]

Hey guys,

Thanks for your patience! If you're still looking for a way to use MindAR with Three, I've made a small repo that you can look at here. It uses Typescript and works with a single marker. Should be relatively straight forward to lift state or add multi-nft support. It effectively just uses useEffect hooks to init MindAR then start the experience.

Let me know if you have any questions / issues.

@ThorstenBux @gjscope

[ThorstenBux]

@akhrarovsaid, thank you very much for that. I've created a PR to your repo which fixes issues with iOS devices. Other than that it looks very promising. I'll integrate it into my use case and see how it goes.

Many thanks again, I very much appreciate it.

[hiukim]

@ThorstenBux @akhrarovsaid

threejs integration is added in latest release. You can check out this installation guide:

https://hiukim.github.io/mind-ar-js-doc/installation

and a quick example:

https://hiukim.github.io/mind-ar-js-doc/more-examples/threejs-image