Research On Real-time Shadow Rendering Algorithm Based On Web

The emergence of HTML5 has enriched the types of content displayed on web pages.In addition to displaying static content,it can also display dynamic content after the introduction of scripting languages such as JavaScript.In particular,with the development of computer graphics technology and WebGL,web pages can draw 3D images with the help of WebGL.An important factor that affects the realism of 3D images is shadows.However,how to efficiently draw high-quality shadows on the Web is still a problem.The shadow image generated by the traditional shadow mapping algorithm has aliasing defects of shadow acne and shadow jagged border.In order to solve these two aliasing defects,an optimized anti-aliasing shadow mapping algorithm is proposed.The core idea of the algorithm is to eliminate the effects of aliasing by using the corresponding efficient anti-aliasing techniques for two different aliasing defects.There are two main sources of shadow acne.The first is that the depth values in the texels are different from the depth values in the pixels,which results in calculation errors when the texels and pixels are compared in depth,which results in shadow acne.Second is the limitation of the low resolution of the depth shadow map.Due to the low resolution of the depth shadow map,multiple pixels will be compared with the same texel in the depth comparison.This incorrect correspondence will inevitably lead to inaccurate calculation results,which in turn will cause shadow acne.In order to eliminate shadow acne,an offset method is added to the depth map,and experiments have been concluded: when the offset value is near the 8-bit floating point precision value,shadow acne can be eliminated well;the offset is too large.The assembly causes abnormal shadow drawing;too small does not eliminate shadow acne.There are two sources of jagged aliasing of shadow boundaries,which are low resolution and low sampling rate of depth shadow maps.The traditional method is to solve the shadow jagged boundary by increasing the sampling rate,but this method will consume a lot of computing resources in large scenes.Therefore,a multi-sampling algorithm based on Poisson disk is proposed,which combines the improvement of the sampling rate and the optimization of the sampling structure,and can achieve the elimination of jagged aliasing on the shadow boundary with a small number of samples.The anti-aliasing shadow mapping algorithm solves the defects of the traditional shadow mapping algorithm;and compared with the percentage filtering algorithm,the algorithm has a high drawing speed and the quality of the generated shadow image is better.