How to make use of it:

1. Download and load the polyshadow.js within the doc.

<script type="text/javascript" src="polyshadow.js"></script>

2. Creates a rectangle shadow shader and a rectangle vertex buffer for subsequent draw rectangle.

var rectangleShader = PolyShadow.createRectangleShader(gl);

3. Draws a rectangle shadow (a solid-color blurred rectangle) with the next parameters.

PolyShadow.drawRectangle(gl, rectangleShader, rectangle, transformation, sigma, fillColor = [0.0, 0.0, 0.0, 1.0], bgColor = [0.0, 0.0, 0.0, 0.0], cutoff = 1.0/512);

4. Deletes a rectangle shader when it’s not needed.

PolyShadow.deleteRectangleShader(gl, rectangleShader);

5. Creates a triangle shadow shader used to draw triangle mesh shadows.

var triangleShader = PolyShadow.createTriangleShader(gl);

6. Creates a drawable triangle mesh. Its particular person triangles should not overlap!

var triangleMesh = PolyShadow.createTriangleMesh(gl, triangles);

7. Draws a triangle mesh shadow (solid-color blurred triangles).

PolyShadow.drawTriangleMesh(gl, triangleShader, triangleMesh, transformation, sigma, fillColor = [0.0, 0.0, 0.0, 1.0], bgColor = [0.0, 0.0, 0.0, 0.0], cutoff = 1.0/512.0);

8. Delete a triangle mesh when it’s not needed.

PolyShadow.deleteTriangleMesh(gl, triangleMesh);

9. Delete a triangle shader when it’s not needed.

PolyShadow.deleteTriangleShader(gl, triangleShader);

Draw Precise And Efficient Shadows Of Polygons, PolyShadow js Plugin/Github

See Demo And Download