Where communities thrive

  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
    @jrDevarts_twitter a few different model formats can be used but I've found gltf the easiest!
    Hello Team. Can you help me with how to set "a-nft" label to get the better stability in the 3D model showed as AR? Maybe using the smoth parameters.... Or any other thing that I can do to achieve a stable (with no jitter) 3D AR model. Thanks for your help!!!!
    Micah Haycraft
    is ar.js down? I'm getting a 522 status code for importing the script source
    Micah Haycraft
    looks like githack is down
    Micah Haycraft
    is the aframe-ar.js file from the cdn available somewhere else?
    Micah Haycraft
    nvm githack is back up
    Michael Hussar
    I'm really excited about the prospect of Web based AR. However, despite about 2 weeks of research I can not find any implementation that does not result in jittery, unstable image tracking. I have used every trick and tip in the book, for example suggestions given in articles such as this one: https://medium.com/chialab-open-source/10-tips-to-enhance-your-ar-js-app-8b44c6faffca I have scoured the documentation for AR.js and A-Frame and searched various Github repos but still haven't found the simplest example demonstrating solid, non-shaky tracking. At this point I'd even be willing to hire some one to teach me the hidden secrets of how to accomplish this with WebAR. However, I'm starting to draw the conclusion that it is not yet possible to achieve image tracking stability with WebAR ala AR.js / A-Frame that rivals some of the commercial alternatives out there. This is a very disappointing conclusion to draw and I hope someone can prove me wrong and direct me to a resources with a simple Hello World that can demonstrate solid image tracking with AR.js. Any help is welcome. Thank you in advance!
    I have the same way of thinking. @mhussar which are the commercial alternatives (web based)? Thanks
    Michael Hussar
    @hbaugmentedreality I've been looking at Zapworks for a client of mine. They offer something called Universal AR which does have a browser based Web AR implementation that does not require any additional app. However, it does require a subscription fee which my client is not interested in. I also am not interested in paying for something that should be achievable "for free" via direct WebAR using something like AR.js etc. Again, perplexed how difficult it is to achieve stable image tracking with non-commercial WebAR solutions. I suppose this reveals my lack of technical understanding regarding, how difficult a technological feat it is to achieve stable tracking.
    Christian Sigl
    i'm working on a webrtc based AR streaming solution right now, using ARToolkitx (NFT for now, opencv 2D tracking later) integrated into blender, it already works with software encoding/decoding on the serverside including container-environment, still working on cuda support. right now it is tested with desktop-webcam and android chrome, but will also work with safari. i also did this with unity3D some months ago, however i think that blender is a more natural environment for AR content creation
    @mhussar There is a new open source library that you can try: https://github.com/hiukim/mind-ar-js
    Michael Hussar
    @mattle-ai Thanks!
    Hi everyone! I'm trying to set up multimarkers, but I'm having some trouble. Question here: https://stackoverflow.com/questions/66688333/setting-up-barcode-multimarkers-ar-js
    Hello, has anyone here able to play a model animation using the animation mixer when marker is found?
    @qu1ckdry thanks!
    I figured it out using <a-entity gltf> doesnt work with animation mixer for some reason. Some update must have changed it...
    what works is using <a-gltfmodel > instead...
    Hello wondering if anyone can help me with location based? There's an issue in the old repository that never got a solution, and it looks like I'm not the only person who's been struggling to get it to work: AR-js-org/AR.js#209
    as the 2nd commenter says on there - the augmented objects are fixed to the camera and not to a gps location. I'm using the exact example code from the docs
    Any advice appreciated !
    Dzmitry Haiduk
    Hi everyone! Is it possible to capture a video of an ar.js scene?
    @dhaiduk I think there is a solution in the AR.js github in the issues section where someone solved it...
    Hi everyone custom image not working in nft marker can u please try to help out this issue.

    @nickw1_gitlab https://hikar.org/webapp does not work on my iPhone SE (14.4.1), I can see all the labels which seem to be placed in correct direction, but the camera freezes. The same happen with red-box example in GitHub issue AR-js-org/AR.js#216. The iOS Safari console output the error:
    Unhandled Promise Rejection: NotAllowedError: The request is not allowed by the user agent or the platform in the current context, possibly because the user denied permission. (aframe-ar-nft.js:210535)

    When I replace "videoTexture: true;" with embedded, the camera works but not 'click' and if both "videoTexture: true;" and embedded, then the screen is totally black.

    Any idea what could be the problem? Thx in advance🙏🏽

    Anyone have a working example to click image or models that are shown over a marker. Apparently all the ones I found dont even work anymore and I don't understand why this is not a main usage to be able to interact...
    @max-koa - a belated thank you for the SVG link
    Following up on the comment from Edie @echodeltamoon_twitter - [Location AR not anchoring] I had no trouble getting the Location Based Example working(https://github.com/AR-js-org/AR.js#location-based-example). I was able to change text, text scale, add it to my geolocation HOWEVER, the text locks to the camera and does not anchor to the geolocation. Does anyone have a solution to this or good link they recommend for some custom anchoring attempts to keep the object at the location?
    Joseph Seger
    Hello everyone I was wondering if someone could please help me out with keeping my object still when using the NFT marker/Image Marker with A-frame. I have messed with the smooth Attributes but I still can not seem to keep the object from being extremely jittery. It would be helpful if someone could point me in the right direction.
    Jiří Lýsek

    Hi everyone, I will just post this here if someone has similar issue or want to make a pull-request. I needed to display far objects (>1km) like in the Hikar example. I was fighting with videoTexture: true because the image from camera gets squished and does not maintain aspect ratio. I wanted to maintain aspect ratio and make the image from camera cover whole area. I came up with this solution:

    //main <a-scene> element - you need to wait for loading - use `loaded` event
    var scene = document.getElementById('scene');
    //this is the extra component created by AR.js which puts camera feed into scene without making far objects invisible
    var webcam = document.querySelector("[arjs-webcam-texture]");
    var component = webcam.components['arjs-webcam-texture'];
    //you also need to wait for video to start playing via `loadeddata` event or similar, otherwise the `videoWidth` and `videoHeight` is zero
    var viewportRatio = scene.clientWidth / scene.clientHeight;
    var videoRatio = component.video.videoWidth / component.video.videoHeight;
    var w = Math.max(1, videoRatio / viewportRatio);
    var h = Math.max(1, viewportRatio / videoRatio);
    component.geom.attributes.position.array = new Float32Array([
            -w / 2, h / 2, 0,
            w / 2, h / 2, 0,
            -w / 2, -h / 2, 0,
            w / 2, -h / 2, 0
    component.geom.attributes.position.needsUpdate = true;
    //you should also call this code once the viewport size changes (onresize event of window)

    I am not sure how this code affects placing precision of 3D content in the image (you should probably adjust FOV, but I am not that far yet - outdoor testing required).

    And one small note: you should calculate with magnetic declination when displaying location based augmented content because the device's compass gives you angle to magnetic north which is not true north. You can simply calculate declination with some library (like magvar) and rotate the whole scene a bit like this:

    <a-scene id="scene">
      <!-- mag. declination 5 degs. -->
      <a-entity rotation="0 5 0" id="parent">

    You obviously need to set the rotation attribute dynamically as the declination differs in various locations. Than put all your location based content into the #parent element.

    Thank you @lysek for sharing your solution. I had the same problem, a workaround is to scale up the object when it becomes distant (see AR-js-org/AR.js#204). But it has some limitations, I will definetly try your solution.
    Nick Whitelegg
    @machinegunjoeviterbo this was a bug on ios which has been fixed recently, see AR-js-org/AR.js#235. You have to set the additional option playsinline to true when creating the video element. If you look at the PR you should be able to figure out the code change you need to make, let me know if not,
    @lysek thanks for that, this is a known problem. Are you happy submitting a PR to the repo?
    @KCoulter14 the text should not lock to the camera as long as you create an <a-entity text="..."> or <a-text> and set the gps-entity-place or gps-projected-entity-place component to the appropriate latitude and longitude. If you look at the 'connecting to a web API' example at https://ar-js-org.github.io/AR.js-Docs/location-based-tutorial/ this gives an example of what to do.
    Hello all, I tried for a long time to change the gltf model but it doesn't work... That's why I would like to ask you what is wrong in my code?
    Thnk you for help
    @JoeSeger Did you make any improvements to the stability of the object?
    @julienhirsch You might be having issues access the model or the model itself might be corrupt. Try to download the model and serve it locally
    Joseph Seger
    @qu1ckdry Not really I think I am going to go back to using a marker instead of an image.
    Jiří Lýsek
    @nickw1_gitlab I would rather leave it to somebody who is more oriented and committed in this project, feel free to use my code in any way :-)
    @JoeSeger Do you find stability with the marker good enough? I know it's hard to define what 'good enough' is! gltf files seem to work quite well for me but THREE geometry isn't as good.
    Christopher Warner
    Hi all, Currently working on a augmented reality project using ar.js. Mobile browsers are getting 60FPS consistently. Desktop browser is getting 20-30FPS average. Any body have an advice/experience with this issue?
    Hey guys, this project combines Unity Game Engine with AR.js so you can build AR projects in Unity. This opens up so much possibilities! https://github.com/ToughNutToCrack/ARWT
    The project is looking for devs to help flesh it out! If you have some know how, please help to develop this project even further!
    It currently has only Marker Detection so the other types of detection : Image and location would help to flesh it out. The original devs are slowly working on the project (hasnt been updated since December) since the are swamped with other projects!
    Check out their CrashARDemo, its a really impressive achievement!
    Ashinka Arts

    Hello Everyone -
    I am looking to create a virtual gallery. I want to hang pictures and place objects on surfaces (walls, tables, outside on pavement) and also be location aware. How can I achieve this? Thought using three.js and ar.js would give something. But not sure how to proceed. Mainly surface detection using AR.js. Is it possible to do this with the below libraries?
    (AR.js with Image Tracking + Location Based AR)

    <script src="https://raw.githack.com/AR-js-org/AR.js/master/aframe/build/aframe-ar-nft.js">

    <script src="https://raw.githack.com/AR-js-org/AR.js/master/three.js/build/ar-nft.js">

    Thanks in advance!

    Ashif Ismail
    Hi guys, in aframe for ios i have a weird pink dialog which have no message on loading the site