Uploaded source code and demos for our ray casting tutorials to GitHub (https://github.com/permadi-com/ray-cast#ray-casting-tutorial-demos). Ray casting is a popular graphic rendering techniques in the 90s, used to render semi-3D worlds in many games.  These repository contain demos for the ray-casting tutorials at permadi.com. https://permadi.com/1996/05/ray-casting-tutorial-table-of-contents/ Read through the tutorial to learn the concept behind ray casting, then […]

This tutorial builds upon the previous tutorial at /2010/10/html5-saving-canvas-image-data-using-php-and-ajax, with additional explanation on how to pass parameters along with the canvas data. We will demonstrate methods of saving the content of a HTML5 Canvas object using server side scripting. PHP will be used in this example, but the technique can be applied in other languages as […]

<<PREVIOUS | TABLE OF CONTENTS BIBLIOGRAPHY Abrash, Michael. Zen of Graphics Programming. Scotsdale, AZ: The Coriolis Group, 1995. Anderson, Greg, et al. More Tricks of the Game Programming Gurus. Indianapolis, Sams Publishing, 1995. Finegan, James. “Implementing Games for Windows.” Dr. Dobbs Sourcebook 239 (1995): 42-47. Foley, James D.,et al. Computer Graphics: Principles and Practice. 2nd ed. […]

<<PREVIOUS | TABLE OF CONTENTS | CONTINUE >> SHADING When an object is farther away from the viewer, the object should appear less/more bright. To accomplish this, a shading effect is needed. But first, we need to know about how colors are represented. The standard 256 color VGA mode registers contains three numbers between 0 to […]

<<PREVIOUS | TABLE OF CONTENTS | CONTINUE >> C. Combined effects. The effects explained above can be combined to create even more interesting motions such as illustrated below. A castle viewed from the sky  <<PREVIOUS | TABLE OF CONTENTS | CONTINUE >>

<<PREVIOUS | TABLE OF CONTENTS | CONTINUE >> B. Flying and crouching. Recall that the player’s height is set to be 32 units. This means that the player’s eyes (imagine the player’s eyes are exactly on top of the player’s head) are looking straight at the walls at point 32. Since 32 is one half of […]

<<PREVIOUS | TABLE OF CONTENTS | CONTINUE >> VERTICAL MOTION: LOOKING UP AND DOWN It is possible to simulate the illusion of looking up and down, as well as flying and crouching on a ray-casting environment. However, note that -and this is important- the trick that is about to be explained in here does not always […]

<<PREVIOUS | TABLE OF CONTENTS | CONTINUE >> HORIZONTAL MOTION The player should be able to move at least in three ways: forward, backward, and turning. The player’s position is defined by a coordinate and a viewing angle. To allow motion, two more attributes are needed. They are the player’s movement speed, and the player’s turning […]

<<PREVIOUS | TABLE OF CONTENTS | CONTINUE >> VARIABLE HEIGHT WALLS So far, all the walls in our world have the same height. With some innovations, we can actually use walls of different height. This makes the world more interesting as illustrated in the next figure. Figure 28: Variable height walls The easiest way to conceptualize […]

<<PREVIOUS | TABLE OF CONTENTS | CONTINUE >> DRAWING CEILINGS To draw the ceiling, the floor-casting process can be reversed. Instead of tracing rays from the bottom of a wall slice in downward direction, trace the ray from the top of the wall in the upward direction. This is actually pretty straightforward once the theory behind […]

<<PREVIOUS | TABLE OF CONTENTS | CONTINUE >> FLOOR CASTING (Continued) The math behind floor-casting is explained in the Figure 25 below. Figure 25: The math behind floor-casting. To reiterate, take a look at the illustration while reading these steps: * Start from the bottom of the wall slice. Take the pixel position (you have this […]

<<PREVIOUS | TABLE OF CONTENTS | CONTINUE >> DRAWING FLOORS To draw floors, we can perform floor-casting (floor-casting refers to a techique of rendering floors). Note however, that it would be wasteful to perform floor-casting without texture mapping or shading. In other words, if the floor is not to be textured or shaded (shading will be […]