Feb 08
It is quite interesting to see how technology moves in circles. With canvas being the new fun toy to play with for creating browser-based games we have to find solutions to fake a 3D environment to be really fast (sure there is Canvas 3D but it is overkill for most games). The trick is to dig into the tricks arsenal of old-school game development on machines full of win like the Commodore 64 or Amiga.
Louis Gorenfeld some very detailed explanations on how to fake 3D including some of the formulas used in the days of 8 bit.
He is also working on some demo code which you can help him with by providing some JS/Canvas demos:
CODE:
-
current_x = 160 // Half of a 320 width screen
-
dx = 0 // Curve amount, constant per segment
-
ddx = 0 // Curve amount, changes per line
-
-
for each line of the screen from the bottom to the top:
-
if line of screen‘s Z Map position is below segment.position:
-
dx = bottom_segment.dx
-
else if line of screen’s Z Map position is above segment.position:
-
dx = segment.dx
-
end if
-
ddx += dx
-
current_x += ddx
-
this_line.x = current_x
-
end for
-
-
// Move segments
-
segment_y += constant * speed // Constant makes sure the segment doesn’t move too fast
-
if segment.position <0 // 0 is nearest
-
bottom_segment = segment
-
segment.position = zmap.length – 1 // Send segment position to farthest distance
-
segment.dx = GetNextDxFromTrack() // Fetch next curve amount from track data
-
end if
