Image based AR tracking

Hello, I made an AR demo using ARToolkit, but my client wants an image based tracking, what options do I have with PlayCanvas to do an Image based tracking? Is ARToolkit able to do it ? I coudln´t find any way to that with ARToolkit…
I found 8thWall 's option, but the price is too high…

Thank you !!

With ARToolkit.js you can do marker based tracking only right now. ARToolkit.js comes with a number of predefined marker matrices which you can use and incorporate as part of your image design.

For image based tracking you would have to either go for the expensive 8th Wall SDK or use a native app.

1 Like

Thank you, yes that was the problem… It looks like we are forced to use 8th Wall if we want to create a web based solution with PlayCanvas…

There are a couple of other options too:


Thanks… I will check them !!!

Edit: Actually, ARToolkit.js can do image tracking:

1 Like

Great !.. thanks…

That solution indeed is good to have, though last time I’ve tried it I wouldn’t easily recommend it for production ready image tracking.

@Diego_Lopez-Mobilia if you like share your feedback if you give it a try.


Yes I’ll do… thanks… I will check the different options and write back… in some days…

1 Like

Hello Yaustar, this is a related question so I continue here instead of opening a new tread.
Could you please explain how to incorporate ARToolkit into Playcanvas? (or AR.js), I am guessing is just a matter of integrating code into a js file, but I didn´t get it to work this way. Does this have to be done in a specific location (meaning script order) or something? please advice.

Thank you so much.

@Haykap There is an old example project that uses ARToolkit here:

I haven’t tried it for a long while nor has it been updated recently.

1 Like

Some additional notes on marker-tracking:
The markers can be relatively small (2cm / 1inch), so if you integrate them nicely into a design they usally can still be an option. See an older (ar.js) example of what I mean here:
But don’t change the color of the marker, as it can get you into trouble (especially under low lighting conditions)

Another trick is to use the QR-code of the webApp’s URL as a marker. This adds the benefit of the qr-code activation functionality (and maybe that could be an argument for the client as well)


Thanks a lot, I will check this up. :grinning: