Regular Polygon
Draw a Regular Polygon by providing the x and y co-ordinates of the center, the radius of polygon. A Regular Polygon is a polygon that has all its internal angles equal and all sides of the same length.
You can change all the basic properties like stroke and fill.
Syntax
new regpolygon(cx, cy, r, sides, rotation, fill, fill_opacity, stroke, stroke_width);
Parameters
| cx | Number : The x co-ordinate of the center of the polygon. |
| cy | Number : The y co-ordinate of the center of the polygon. |
| r | Number : The radius of the polygon. to be precise , its the distance between the center and the vertices. |
| sides | Number : The number of sides of the polygon. |
| rotation | Number : The rotation of the polygon. |
| fill | Color : fill color of the polygon |
| fill_opacity | Number [0 to 1] or percentage: fill opacity of the polygon |
| stroke | Color : stroke color of the polygon |
| stroke_width | Number : stroke width of the polygon |
Example
new regpolygon(100, HEIGHT/2, 60, 3, 0, "#695fe6", 0.3, "#44d", 2);
new regpolygon(240, HEIGHT/2, 60, 4, 0, "#695fe6", 0.3, "#44d", 2);
new regpolygon(380, HEIGHT/2, 60, 5, 0, "#695fe6", 0.3, "#44d", 2);
new regpolygon(520, HEIGHT/2, 60, 6, 0, "#695fe6", 0.3, "#44d", 2);
new regpolygon(660, HEIGHT/2, 60, 7, 0, "#695fe6", 0.3, "#44d", 2);
var t=0;
function draw(){
clearCanvas();
new regpolygon(100, HEIGHT/2, 60, 3, t, "#F5C7F7", 0.1, "#F5C7F7", 2);
new regpolygon(380, HEIGHT/2, 60, 5, t, "#F5C7F7", 0.1, "#F5C7F7", 2);
new regpolygon(240, HEIGHT/2, 60, 4, t, "#F5C7F7", 0.1, "#F5C7F7", 2);
new regpolygon(520, HEIGHT/2, 60, 6, t, "#F5C7F7", 0.1, "#F5C7F7", 2);
new regpolygon(660, HEIGHT/2, 60, 7, t, "#F5C7F7", 0.1, "#F5C7F7", 2);
t+=0.01;
requestAnimationFrame(draw);
};