Rendering Real Time 3D Graphics on a 32×32 RGB LED Matrix Panel with a Raspberry Pi and GeeXLab (**Updated**)

In the previous article, I explained how to control the color of a particular LED of the RGB LED matrix panel. Thanks to that knowledge, you can draw simple graphics: points, circles, lines and so on. But how can we easily draw a rotating triangle? Or a mesh like a torus? Or any 3D scene? Answer in this article!

GeeXLab comes with a powerful feature used in almost any 3D game: render targets. In short, a render target allows to draw a 3D scene into a texture and then apply any kind of effects on that texture before displaying it.

That’s cool, but how will a render target help us to draw on our 32×32 RGB LED panel?

Simply by drawing into a 32×32 pixels render target. Once the scene has been rendered in the render target, we can read each pixel of the render target texture and then use the gh_rpi.rgbmatrix_set_pixel_u8() function (see the previous article) to update the LED panel.

All following code samples and demos are available in two places:
– in the gl-21/rpi/rpi_rgb_matrix/ folder of the code sample pack.
– in the demos/rpi_rgb_matrix/ folder included with GeeXLab for Raspberry Pi.

These demos require GeeXLab for Raspberry Pi with OpenGL 2.1 support. This version of GeeXLab can be downloaded from this page.

 
How to run a demo?

In GeeXLab’s folder you will find a file called demos.sh. Edit this file and uncomment/comment the lines that start with sudo. If necessary, update the /demofile parameter with correct path + file name of the demo.

#---------------------------------------------------------
# RGB LED Matrix demos (HUB75) - require root rights
#---------------------------------------------------------
sudo ./GeeXLab /demofile=\"./demos/rpi_rgb_matrix/demo02_rpi_gl21.xml.xml\"
#sudo ./GeeXLab /demofile=\"./demos/rpi_rgb_matrix/demo05_rpi_gl21.xml.xml\"

You can now run the demos.sh file. The demos.sh file has the execution bit set, so you can launch it by double-clicking on it. Or you can run it in command line with:

{GeeXLab_RPi_folder} $ sh ./demos.sh

RGB LED matrix demos requires root level because they use the GPIO to control the RGB Matrix HAT.

 
Here is a code snippet in Lua (you can do the same thing in Python) that shows how to render a rotating triangle on the RGB LED matrix display. rt01 is the render target, vertex_color_prog is a simple vertex color GLSL program, camera is a perspective camera and triangle is a simple mesh made up of 3 vertices.

-- We are rendering to the render target rt01
--
gh_render_target.bind(rt01)
  
-- Binds the perspective camera
--
gh_camera.bind(camera)

-- Clears the color and depth buffers
--
gh_renderer.clear_color_depth_buffers(0.0, 0.0, 0.0, 1.0, 1.0)

-- Bind vertex_color_prog to make it the active GPU program.
--
gh_gpu_program.bind(vertex_color_prog)

-- Render the triangle
--
pitch = 0
yaw = 0
roll = elapsed_time * 40.0
gh_object.set_euler_angles(triangle, pitch, yaw, roll)
gh_object.render(triangle)
  
  
-- Back to regular framebuffer.
--  
gh_render_target.unbind(rt01)



-- rt_tex is the render target texture. rt_tex is initialized in 
-- the INIT script with:
-- rt_tex = gh_texture.create_2d_from_rt(rt01)
--
gh_texture.gpu_mem_to_cpu_mem(rt_tex)

-- Update the 32x32 RGB LED matrix panel
--
for y=0, 31 do
  for x=0, 31 do
    r, g, b, a = gh_texture.get_texel_2d(rt_tex, x, 31-y)
    gh_rpi.rgbmatrix_set_pixel_u8(x, y, r*255.0, g*255.0, b*255.0)
  end
end  

 
You can find the rotating triangle demo in the code sample pack here: gl-21/rpi/rpi_rgb_matrix/demo02_rpi_gl21.xml

 
Now let’s replace the simple RGB triangle by a torus with a Phong shader and a background image. You can find this demo in the code sample pack: gl-21/rpi/rpi_rgb_matrix/demo05_rpi_gl21.xml

 
A simple background image… (available here: gl-21/rpi/rpi_rgb_matrix/demo03_rpi_gl21.xml)

 
And what about some animated text? The following demo (available here: gl-21/rpi/rpi_rgb_matrix/demo04_rpi_gl21.xml) shows an animated text (based on a True Type Font)

 
Render targets are a powerful tool for real time graphics and are the key to easily display 3D stuff on a RGB LED matrix panel with a Raspberry Pi. Render targets are easy to use and are supported by GeeXLab on all platforms including, of course, the Raspberry Pi. As you can see, when you know how to render a 3D scene in a render target, you can draw what you want on a RGB LED matrix panel.

Update (2016.12.19)

I updated the code sample pack with a demo that shows how to render an anti-aliased triangle. The demo is available here: gl-21/rpi/rpi_rgb_matrix/demo06_rpi_gl21.xml

The principle is to render the main scene (here a simple rotating triangle) into a 64×64 render target. The 64×64 render target texture is then copied (with a render target blit function) to a second render target with a size of 32×32 pixels. This second render target will be used to update the RGB LED matrix. The result is a nice rotating triangle. All details are available in the demo source code.

The triangle rendered without anti-aliasing:

 
The same triangle rendered with anti-aliasing: