3
半円形領域をHTMLキャンバスの色付きセグメントに分割しようとしています。 はここ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
代替方法、同心の円弧()セグメントを使用するかもしれないが、私が試したものです。私は今それを試みている。しかし、光を放つことができる人は誰でも大きな助けになるでしょう。
あなたは基本的に円グラフを求めていますか? – Phrogz