JavaやProcessingでSVGシェイプをいくつかのシェイプに分割するにはどうすればよいですか？

Question

たとえば、5点が等間隔に配置された円のSVG形状が与えられているとします。私は、これらの点に基づいて円を5つの円弧に分割したいと思います。下の画像では、それらのアークの1つが赤です。それをどうやって行うのですか？特に、Processing（処理）のgeomerativeライブラリを使用したいと考えていますが、Javaの他のソリューションにもオープンしています。

Answer 1

なぜ単に処理のarc()機能を使用して5つの弧を描くありませんか？ あなただけの5つのセクションごとに72度の角度増分のカウントを保持する必要があります。

int sides = 5; 
//360 degrees/5 sides, but in radians (what arc() likes) 
float angleIncrement = TWO_PI/sides; 
float diameter = 350; 

void setup(){ 
    size(400,400); 
    colorMode(HSB,sides,100,100); 
    noFill(); 
    strokeWeight(30); 
    strokeCap(SQUARE); 
} 
void draw(){ 
    background(0,0,100); 

    for(int i = 0 ; i < sides; i++){ 
    //72 degrees * each side to which we subtract a 90 degrees offset to first point is towards the top, not the side 
    float angle = (angleIncrement * i)-HALF_PI; 

    stroke(i,100,100); 
    arc(200,200,diameter,diameter,angle,angle+angleIncrement); 
    } 
} 

あなたが実際に怒鳴るのデモとして、これを実行することができます。

var sides = 5; 
 
//360 degrees/5 sides, but in radians (what arc() likes) 
 
var angleIncrement; 
 
var diameter = 350; 
 

 
function setup(){ 
 
    createCanvas(400,400); 
 
    colorMode(HSB,sides,100,100); 
 
    noFill(); 
 
    strokeWeight(30); 
 
    strokeCap(SQUARE); 
 
    
 
    angleIncrement = TWO_PI/sides; 
 
} 
 
function draw(){ 
 
    background(0,0,100); 
 
    
 
    for(var i = 0 ; i < sides; i++){ 
 
    //72 degrees * each side to which we subtract a 90 degrees offset to first point is towards the top, not the side 
 
    var angle = (angleIncrement * i)-HALF_PI; 
 
    
 
    stroke(i,100,100); 
 
    arc(200,200,diameter,diameter,angle,angle+angleIncrement); 
 
    } 
 
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.7/p5.min.js"></script>