Questions tagged [ar.js]

AR.js is an open source framework for three.js, and a-frame, enabling the creation of augmented reality apps / websites.

AR.js is an open-source lightweight Augmented Reality framework, coming with features like Image Tracking, Marker Tracking and Location based AR, and enabling the creation of apps and websites. It works great with its satellites three.js and aframe.io.

For anything related to AR.js - Efficient Augmented Reality for the Web.

321 questions
10
votes
2 answers

A-Frame & ar.js: Multiple markers & boxes

Is there any proof of concept of how to implement multiple AR markers w/ A-Frame? Ex. Something like this: https://www.youtube.com/watch?v=Y8WEGGbLWlA The first video in this post from Alexandra Etienne is the effect I’m aiming for (multiple…
Victor
  • 868
  • 1
  • 9
  • 24
8
votes
2 answers

Any way to make AR.js camera less sensitive to movement?

After testing with default and custom marker/model of various size and distance, I concluded that the reason my AR models are having seizure (jittering/flickering/shaking like mad) is because of my hand movement. When the (phone) camera is at rest,…
Mr J Wolf
  • 91
  • 1
  • 5
7
votes
2 answers

A-Frame, AR.JS. How to position object within the NFT-Marker?

I have a problem with positioning video element right within the NFT marker area. Digged through AR.JS and AFRAME documentation with no luck. The problem: on each device with different screen resolution and camera resolution video is positioned…
alpha-helix
  • 89
  • 3
  • 5
5
votes
1 answer

In Aframe AR.js Show A Preloading Screen Till All The Assets Loads And Renders

I Want To Show A Preloading Screen Till All Assets Loads And Renders. I Tried Using Assets Event loaded but its not working . When We Augment 3d Model , Image and video , So These Assets Are Almost 50-60mb . So it takes time to load the assets and…
Aryan
  • 83
  • 1
  • 13
5
votes
2 answers

How does Google launch the AR Animals ARCore app from a browser link?

TL;DR; Google's new AR animals appear as if they are AR on the web (like AR.js or 8thWall), but are actually native ARCore applications. The sleight of hand is that a link in a browser (actually a button with a very obfuscated event handler chain)…
Joshua Honig
  • 12,925
  • 8
  • 53
  • 75
5
votes
1 answer

How to listen to a global event triggered by WebCam Error: NotAllowedError

I'm using ar.js which uses the users webcam and issues a permission prompt to do so. What I want is to listen to a global event triggered by this dialogue if the user either allows or denies access to the webcam or has done so previously. I've…
droid001
  • 163
  • 10
5
votes
2 answers

Scan QR code with AR.js and display objects based on scanned value

In my web application, want to implement Augmented Reality with QR code scanned value. After QR code is scanned get data from the server based on QR code value and show image or objects based on the response. I have gone through A-Frame blog able to…
prasannaboga
  • 1,004
  • 1
  • 14
  • 36
5
votes
1 answer

AR.js: How to enable/disable camera and show/hide AR content on click of a button

All the examples and code that demonstrates AR.js AR capabilities over browser, works as soon as the web page is loaded. However, I would like to provide an option to the user, to manually start and stop the scanning process and the hide AR…
Vjay
  • 111
  • 9
5
votes
2 answers

How to remove the alerts 'trackingBackend' and 'markersAreaEnabled' with AR.js?

On my AR.JS example https://github.com/ybinstock/aframe_ar (github) https://ybinstock.github.io/aframe_ar (live site), I'm getting these two boxes seen in the attached image. Here's my aframe scene
Yoni Binstock
  • 241
  • 4
  • 19
4
votes
1 answer

Problems with changing color of gltf object

With this answer as a reference, I have succeeded in changing the color of the gltf model. (Change the color of an object (.dae or gltf) in "AR.JS") However, the model texture will disappear. why?
sktkgw
  • 43
  • 4
4
votes
0 answers

How do I get multiple .gltf models to work in three.js webxr_ar_hittest example?

I'm using this example https://threejs.org/examples/?q=webxr#webxr_ar_hittest from three.js and the example works very well but when I change the cylinder to a model it just lets me put one model instead of letting me put several models in the place…
4
votes
2 answers

AR.js help/trouble using custom AR markers

I need some help with using custom AR markers with AR.js. We have been running into some problems getting objects to initialize over the markers, after downloading the .patt file from the custom markers generator page. Everything is being tested…
4
votes
0 answers

AR.JS: How Do I Return a Marker Camera's World Position in Arjs?

I want to return the position of a marker-camera as it moves around in a scene. I've tried the following AFRAME component: AFRAME.registerComponent('getworlddir',{ tick: function(time, timeDelta){ var worldDir =…
4
votes
2 answers

How to create custom marker in Ar.js?

I Was wondering how things work in Ar.js , But i was stuck with creating custom Markers and custom shapes , is there any way to customize things. this is What i have got things to getting started.
Gopinath Kaliappan
  • 6,929
  • 8
  • 37
  • 60
4
votes
2 answers

a-marker does not work with aframe

I installed (npm) the aframe and ar.js libaries; however, when I try to use the or , I get the following error: Unknown custom element: I was able to import the aframe library, but when I want to import…
Fenno
  • 41
  • 4
1
2 3
21 22