jeromeetienne / AR.js

Efficient Augmented Reality for the Web - 60fps on mobile!
MIT License
15.79k stars 2.22k forks source link

Markers with data(maybe QR) #484

Closed pjc0247 closed 5 years ago

pjc0247 commented 5 years ago

Hi, I want to play some videos with AR.js. Videos can be very various, So I want to recognize QR code or something and retrieve URL from it.

Is there any possible way to accomplish this?

nicolocarpignoli commented 5 years ago

Hi I made in article about AR.js, markers and QR Code integration. Take a look at this: https://medium.com/chialab-open-source/how-to-deliver-ar-on-the-web-only-with-a-qr-code-e24b7b61f8cb

Let me know if it helps you

pjc0247 commented 5 years ago

@nicolocarpignoli Thanks! Can we carry more complex data with barcode type marker? at least thousands possibilities

nicolocarpignoli commented 5 years ago

@pjc0247 I don't understand the question sorry, what do u mean?

pjc0247 commented 5 years ago

@nicolocarpignoli

From your article, Barcode marker representing number 6.

I need to represent at least thousands with barcode type markers.

So, my first question is, I want to retrieve an URL from QR code, not just integrate with markers. If this is not possible, I'll try barcode markers as you did, and give it to an identifier(number) which points an URL from my database.

Thanks.

nicolocarpignoli commented 5 years ago

QRCode are not a AR.js thing, a QRCode may contain a link: in fact, is the main use of QRCodes :) You can generate QRCode with free online tools.

Markers, instead, can be used on AR.js in two types: barcode markers (representing numbers) and pattern markers, with a lot of limitations with the latters.

pjc0247 commented 5 years ago

Sure, QR is not a AR thing. However it would be great to add QR code recognization with mobile AR.

I'm currently making an application which shows user uploaded contents. So I need to bring various sources of fbx, mp4 or mp3 files to my AR view. That's why I asked the question here.

Currently, I have done with following method: /somearapp.html?media_src=SOME_MP4_LOCATION.

Thanks!

janpio commented 5 years ago

You can also create markers (rectangle with thick black border) that contain a QR code in the empty space in the middle, which AR.js can recognize via a pattern created from the marker file. You can then e.g. use the QR code to open a specific URL (which can be whatever you want) and then load AR.js on that page which is from a parameter of the URL gets what pattern to look for and then display the correct content.

Possible Problem: marker/pattern recognition of such markers is not very good or stable. But it might be good enough for you.

nicolocarpignoli commented 5 years ago

@janpio I don't think that a pattern marker with a QR code in his center can be recognizable. Although It can seems 'recognizable', when the marker generator create the .patt file the output may be very complex (e.g. trying to create a marker which contains an image representing a word will create a very unrecognizable pattern, a QR Code is far more complex).

But this is only my experience, and one thing with AR.js I learned is that with so many variables the only thing that matter is: to try and find the best compromise for every solution :)

I suggest @pjc0247 to try also this solution and let us know the results, it will be very useful

janpio commented 5 years ago

It does indeed work, but as I wrote recognition is not very good or stable. (I actually think it works more by accident. The same pattern for example is triggered by different markers with different QR codes - but that might not be a problem depending on what you want to implement. If the QR code URL contains e.g. arjs.html?asset=1, the loaded AR.js scene can just look for that one pattern for that one asset and be fine. [meaning depending on the asset param, it is looking for just one different pattern each time])

nicolocarpignoli commented 5 years ago

Interesting! Can you please link the .patt file and the qrcode, in order to see what the marker generator has generated?

I have done and documented a marker INSIDE QRCode, but never a QRCode inside a marker. I was thinking that putting something complex inside the shape of the marker would have generate a too complex .patt file

janpio commented 5 years ago

Not the one I used, but I can try to recreate one later. The .patt file is always of the same complexity, as it always represents the same "dot matrix". It's just that the recognition and stability goes down, the less "explicit" the pattern gets.

andreyrd commented 5 years ago

Having the data in the URL query is probably your best bet. Does require the person to use whatever QR scanner they used for each video separately.

Recognizing QR codes on the fly though is not possible with artoolkit at least. The detected and tracked pattern is only 16x16 pixels, which is far less data than in the original QR code.

I have used a QR code inside of a marker, and it works very well. But you can't expect it to differentiate very well between different QR codes, as the 16x16 pattern can only store so much.