HTML 캔버스를 사용하여 반원형 영역을 컬러 세그먼트로 나누는 방법

Question

HTML 캔버스에서 반원형 영역을 컬러 세그먼트로 나누려고합니다. 여기

  ctx.save(); 
      ctx.translate(c.width/2, (c.height/2)-1); 
      ctx.strokeStyle = "red" 
      ctx.lineWidth = 3; 
      ctx.lineCap = "round"; 
      var x=400; // number of times lineTo strokes. Greater the value the better is the smoothness 
      var factor=1; //with =1, the entire semicirular region is filled. 
      for (var i = 0; i < x; i++) { 
       //ctx.rotate(Math.PI); 
       ctx.beginPath(); 

       ctx.strokeStyle = "rgba(255,0,0,1)"; 
       //ctx.rotate(-Math.PI/2); 

       ctx.rotate((-Math.PI * factor)/x); 
       //1st color segment, factor=1 helps to paint 100% of semicircular region 

       ctx.moveTo(122, 0); 
       ctx.lineTo(70, 0); 
       ctx.stroke(); 
       //ctx.rotate(Math.PI); //2nd color segment 

다른 방법, 동심 호() 세그먼트를 사용할 수 있습니다, 내가 뭘하려합니다. 나는 지금 그것을 시도하고있다. 그러나 어떤 빛을 던질 수있는 사람은 큰 도움이 될 것입니다.

Answer 1

http://www.phpied.com/wp-content/uploads/2008/02/canvas-pie.html의 샘플은 내가 찾고있는 샘플이었습니다. 예상대로 동심 원형()을 사용합니다.