Tips/tricks related to Computer Graphics, GPUs and other programming

Posts tagged ‘texture mapping’

Android OpenGL ES 2.0 – Shadow Mapping

NOTE: This tutorial builds up on my previous 2 tutorials: how to setup OpenGL ES 2.0 on Android and how to render to texture.

I’ll first link to the apk, source code and the repository:
apk here.
Source code here.
Google Code Repository  here. NOTE: Branch is “shadowMapping”


Thanks to Henry’s comment below I was able to fix most of the artifacts showing up. Turns out I had dithering enabled, so I had to disable it to remove the dithering effect [ GLES20.glDisable(GLES20.GL_DITHER) ]. Updated images below – it works but has very slight artifacts when it comes to the mesh’s self-shadows.


Shadow Mapping is a popular technique for rendering shadows in games and other real-time applications. Given how GPUs on mobile devices (iPhone/Android/whatever) are getting more and more powerful every day I thought I might try implementing it on my Samsung Captivate (Galaxy S).

While my implementation “works”, it does not good look at all. Shadow-mapping is prone to many artifacts , which I wasn’t able to properly fix (UPDATE: Main artifacts fixed).I am posting this without the fix in the hopes that somebody can help me out too as to what I am doing wrong.

Here are the updated images (I changed the color of the plane to get a better contrast):

Textured Cube (with proper shadows)

Dragon Head


Here are the old images:

Octahedron Mesh (.OFF) with shadows + artifacts

Dragon-head Mesh (.OFF)

Textured Cube (.OBJ)

I would like to credit Fabien Sanglard for his shadow mapping tutorials which I used as a basis for my code. I looked at his DEngine code as an example. In any case let’s begin.

What is Shadow Mapping?

If you are reading this chances are that you already know what shadow mapping is and how it works, but let me give a quick overview of the steps involved:



Android OpenGL ES 2.0 – Render To Texture

NOTE: This tutorial builds up on my previous tutorial on how to setup OpenGL ES 2.0 on Android.

I’ll first link to the apk, source code and the repository:
apk here.
Source code here.
Google Code Repository  here. NOTE: Branch is “renderToTex”

Rendering to a texture is important when it comes to various graphics techniques and algorithms (Shadow Mapping, cube map generation, Deferred Shading, etc.) So this quick tutorial will demonstrate how to setup a texture for rendering (and then how to display that texture on screen).

What is rendered to the texture?
We are going to render the same objects as in the previous tutorial (where you can choose between gouraud/phong/normal mapping shaders). The texture is going to be a simple quad which will then be displayed on the full screen. I have a Samsung Captivate(Samsung Galaxy S) which has a screen resolution of 800 X 480, so I use those values as the height and width of my texture. Adjust accordingly to your phone (I was a tad lazy to read in the values from the system itself). Let’s begin: