Start a new topic


Hi Wikitude Team : 

I do some research on JS Sdk sample qrcode these days

and I can see the qrcode decoded part is in BarcodePlugin.cpp and it passes the data to qrandbarcode.js WorldLoaded function

I am confused with if we would like to put model on qrcode when user aims at it (like sample surfer with imageOne model) , except import the qrcode as target image in Wikitude Studio , because it can only detected the qrcode image that is in .wtc file.

If I would like to scan any qrcode and when user aims at it , it appears the model  , do you have any suggestions?

can I do this in javascript code?

because If I add model in android (java) code class , the model moves  with the camera , so how can I know the right position in phone screen of the qrcode?

ps. The attachment is I set the qrcode as target image in Wikitude Studio and put the wtc file in the project , so that if I aim at this qrcode , it will appear model on it. But I hope it can contains any qrcodes. that is my question. 

Thank you Wikitude team!


(103 KB)

Hello Milly, 

I'm looking for the similar use-case. Did you figure it out what to use to render 3D models in QR code?

Thank you!

Good morning Milly,

I believe you will want to read through the documentation of the Plugins API. That should answer your questions.

Plugins API

If you're working on Android, you need to recompile the library that contains the plugin code for any changes to take effect.

- Daniel

Hi Daniel :

I go through the Market Tracking sample

But I`m confused how does MarketTracking.cpp works with market_tracking.js

I tried to add log and modify code in MarketTrackging.cpp , but seems it doesn`t work 

and keep the same result before I modified.

Could you tell me more detail about this?

thank you!

Hi Milly,

yes, the first step is to have a C++ QR marker tracking implementation. Make sure to use a library that provides you with a pose/matrix, not just corner points.

If you have that, I'd suggest using the marker tracking plugin as a reference to implement your plugin.

I'm afraid I can't offer you any more direct channels of communication. This will have to be sufficient.

- Daniel

Okay Daniel.I see.

Can I figure out that if the first step I need to do is add QRCode plugin with c++ code?

Or modify the c++ code in Market tracking.

Sorry , does Wikitude team has slack? Thank you!

Hi Milly,

I see. I'm afraid you're really going to have to go down the path I outlined previously. I don't see this working out without a QR core tracking algorithm that provides a pose.

What you had in mind with our QR code plugin and instant tracking might work to some extent, but that would not really track the marker. If you were to move the marker, things would fall apart since Instant tracking simply track the environment and not a specific thing in it.

- Daniel

Sure Daniel. Thank you!

I would like to make a sample that if I aim at every QRCode , it shows the related Model with information

for example : If after QRCode decoded and it contains URL , I expect 

1. it will show the model on QRCode

2. if user click the model , it opens browser and links to the url

and if the QRCode contains video/audio information , it will display the video/audio on QRCode directly.

So I would like to detect there is an QRCode on the mobile screen.

and it can be decoded with information.

after that I need to show model on QRCode

if user click the model , it has some reaction for it.

Here is the detail of use case.

Thank you Daniel !!

Hi Milly,

you could send the four corner points of the QR code from Java into the JavaScript world, but they would not be of any value for your purpose, I believe.

In the Wikitude JavaScript SDK you can transform augmentations within a coordinate system that has previously been established by a tracking algorithm. If such a coordinate system has not yet been set up due to the lack of any tracking going on in the background, you'll lack this point of reference.

With image tracking, for example, the origin of your coordinate system is set up to always be in the center of the image. Any transformations applied to an augmentations will be relative to the image center.

You could maybe make that work somehow with the native SDKs, but the JavaScript SDK simply does not allows you to arbitrarily draw augmentations like this.

Would you mind describing your use-case to me in detail; what you'd like it to do, exactly? Maybe I can suggest an alternative approach for what you're trying to achieve.

- Daniel

Hi Daniel :

I have a thought that need you to verify for me

If I can get the QRCode 4 points in java code

Can I send them to marker tracking js file to render model on the area with these points

but the question is I need to use QRCode View that with Custom cameraPreView in library

so that I can start to scan the QRCode

but from the Wikitude Sdk , I also need to use ArchitectView to register plugin "markettracking".

How can I combine ArchitectView with QRCode Custom View.

can you give me any suggestions?

and Is this the possible way to make the result?

Thank you Daniel!

Hi Milly,

I realise that the C++ plugin implementation is quite daunting, but that's the only way you can do it, I'm afraid. Take your time and get back to me when you're ready.

I don't think you could use the QRCode plugin we have in our sample app, simply because the third-party library we're using does not provide any tracking data on the markers it found. It just evaluates the markers and bar code values.

- Daniel

1 person likes this

Hi Daniel ,

Thanks for your detail information , I appreciate of it.

But I should say sorry for that I do not have experience of c++ code , so I need time to research for that

Can I ask since Wikitude already has QRCode plugin , 

can I combine QRCode plugin with instant tracking and Positionable API

, is that also possible to make it by this way?

I really would like to make sample like this , Can I ask for your skype account to ask for more detail?

Thanks for your help , Daniel!

Hi Milly,

the sample preloads the car.wt3 file, which is a 3D model, not a target collection (.wtc). That's simply the augmentation we're showing on top of the marker.

What I meant by using the maker tracking sample, is just having the sample as a starting point and replacing its current tracking (supplied by the aruco library) with your tracking (supplied by your QR code library). So you'd just change the MarkerTrackingPlugin.h/.cpp files to not track aruco markers anymore, but QR codes.

Does that make sense?

Broadly, the plugin would work like this:

  1. in the plugin's cameraFrameAvailable function: receive the camera frame data we provide and give that to the QR code library
  2. the library will tell you whether it found any QR codes and, if so, give you some kind of tracking data on them; presumably a matrix
  3. in the plugin's updatePositionables function: set the tracking data you've been given on one of the positionables, which you created in JavaScript

A positionable is simply a link between external tracking data (QR codes in your case) and Wikitude SDK augmentations (models, images, etc.). You create it and attach augmentations to it in JavaScript and you set its transformation from a C++ plugin. That allows you to connect a custom tracking algorithm with the regular Wikitude SDK rendering.

It behaves like an InstantTarget/ObjectTarget/ImageTarget, but receives its data not from the Wikitude SDK, but from a plugin.

- Daniel


Thanks for your patience Daniel.

But I am confused for the sample marker tracking.

it preloads the marker as resource in project and I also saw the file **

since there are a lot of QRCode in market , how can I use marker tracking sample

with multiple target images?

Is this sample for preload resource and then the image can be tracked.

How can I do with various kind of markers (QRCode)

Thanks Daniel.

Hi again Milly,

I haven't tried creating a new plugin in a while and I believe some of the build steps have changed since then, but what you said sounds about right.

What I recommend you do is simply use the Architect sample app and change the marker tracking sample in a way to use your QR code tracking and worry about including it in your own application at a later point in time. The library we're using for the marker tracking is called aruco. If you search for that in the sample app, it should give you a decent idea of where you need to apply changes to the build setup.

If you have any specific issues or error logs when building or running the sample, I'd be happy to have a closer look.

- Daniel

Thanks for your detail information Daniel.

Can I ask if I need to add another plugin for QRCode 

After I add .h and .cpp files ,  just like MarkerTrackingPlugin

I need to add the library in CMakeLists.txt 

and including it in so that I can use this plugin , is that correct?

Sorry , I am not familiar with C++  integrated with Java

Another question :

Can I add another View(like QRCode View) in ArchitectView?

How can I do it?

Thanks Daniel

Login or Signup to post a comment