Step 8 : fishbowl effect

Before drawing the wall, there is one problem that must be taken care of. This problem is known as the “fishbowl effect.” Fishbowl effect happens because ray-casting implementation mixes polar coordinate and Cartesian coordinate together. Therefore, using the above formula on wall slices that are not directly in front of the viewer will gives a longer distance. This is not what we want because it will cause a viewing distortion such as illustrated below.

Thus to remove the viewing distortion, the resulting distance must be multiplied by cos(BETA); where BETA is the angle of the ray that is being cast relative to the viewing angle. On the figure above, the viewing angle (ALPHA) is 90 degrees because the player is facing straight upward. Because we have 60 degrees field of view, BETA is 30 degrees for the leftmost ray and it is -30 degrees for the rightmost ray.
  • Let us code the correction of the distance to the wall.
      
      	FishbowlCorrection : function(distancetowall,rayangle) 
      			{
      				beta=this.POVrad-rayangle;
      				return distancetowall*Math.cos(beta);
      			},
      			
      

    Next: Step 9: Let us turn around

  • step9.html

    Back: Step 7

  • step7.html