Chapter 5: Better Animated NGon

by Stéphane Cabaret

JavaScript

var paper = Raphael(0, 0, 500, 500);

function NGon(x, y, N, side, angle) {
    paper.circle(x, y, 3).attr("fill", "black");
        
    var path = "",
        c, temp_x, temp_y, theta;
    
    for (c = 0; c <= N; c += 1) {
        theta = c / N * 2 * Math.PI;
        temp_x = x + Math.cos(theta) * side;
        temp_y = y + Math.sin(theta) * side;
        path += (c === 0 ? "M" : "L") + temp_x + "," + temp_y;
    }
    return path;
}


var   path = "",
        c, temp_x, temp_y, theta;







function N2Gon(x, y, N, side, angle) {
    paper.circle(x, y, 3).attr("fill", "black");
        
 
    
    for (c = 0; c <=3;c += 1) {
        theta = Math.floor(c / 2) / N * 2 * Math.PI;
        temp_x = x + Math.cos(theta) * side;
        temp_y = y + Math.sin(theta) * side;
        path += (c === 0 ? "M" : "L") + temp_x + "," + temp_y;

    }
    return path;
paper.circle(temp_x,temp_y,3);
//var pentagon = NGon(50, 50, 5, 20);

var pentagon = N2Gon(50, 50, 5, 20);
var decagon = NGon(50, 50, 10, 20);

var agon = paper.path(pentagon);
var r2=paper.rect(50,50,20,20);