Augmented Reality: Place virtual objects on top and below of real object (Android/Cordova)

Question

I'm trying to place two virtual objects on top and bellow of one object in augmented reality.

example

I have to read characters from visiting card then according to the visiting card data i have to place two objects as shown in bellow image

I have completed reading characters from visiting card but i'm facing problem with placing two objects on top and below of the visiting card.

To achieve this i have two requirements

1. Need open source library (Checked with OpenCV library but i'm unable to place the objects)
2. Have to remove the virtual objects when visiting card is not in front of the camera

Answer 1

You can render 3D virtual objects via OpenGL ES on Android platforms. It is an open source computer graphics rendering application programming interface (API) for rendering 2D and 3D computer graphics. However, if you want to render a 3D model such as .obj file, you have to parse it firstly. You can get the vertex, normal, and face coordinates by parsing it. Then, you can render 3D model by OpenGL ES. You can find .obj parser on the official OpenGL tutorial web page but you should convert c++ to java for using it on Android or you can develop your own parser to parse 3D models. Also, this and this may help you for 3D model rendering on Android.

You should develop feature matching system to render the virtual objects when visiting card is in front of the camera and to remove the virtual objects when visiting card is not in front of the camera. In your case, you can read characters from visiting card to implement feature matching system. Moreover markers can be used to detect visiting cards and it can be easier than reading characters. You can use OpenCV for Android to develop feature matching system.