function setup() {
createCanvas(400, 400);
}
function draw() {
background(220);
petals();
noStroke(); //the center of flower = white circle
fill(255);
ellipse(200, 200, 130, 130);
function petals() { //flower leaves -> I wanna fill them with rainbow colors each in shortly
push()
translate(200, 200);
rotate(radians(90));
noStroke();
rotate(radians(45));
ellipse(100, 0, 250, 60)
rotate(radians(45));
ellipse(100, 0, 250, 60)
rotate(radians(45));
ellipse(100, 0, 250, 60)
rotate(radians(45));
ellipse(100, 0, 250, 60)
rotate(radians(45));
ellipse(100, 0, 250, 60)
rotate(radians(45));
ellipse(100, 0, 250, 60)
rotate(radians(45));
ellipse(100, 0, 250, 60)
rotate(radians(45));
ellipse(100, 0, 250, 60)
pop()
}
}<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.4.1/p5.js"></script>我怎樣才能給這些葉子上色？
我補充說fill('red')，fill('blue')在每個橢圓前面，不知何故，只有一種顏色支配著所有的花瓣。
另外，我希望它以恒定的速度旋轉。
uj5u.com熱心網友回復：
填充似乎作業正常。（并添加了一個更簡潔的回圈）...
function setup() {
createCanvas(400, 400);
}
function draw() {
background(220);
petals();
noStroke(); //the center of flower = white circle
fill(255);
ellipse(200, 200, 130, 130);
function petals() { //flower leaves -> I wanna fill them with rainbow colors each in shortly
push()
translate(200, 200);
noStroke();
const colors = ['red', 'yellow', 'blue', 'green'];
for (let i=0; i<8; i ) {
let color = colors[i%4];
fill(color)
ellipse(100, 0, 250, 60)
rotate(radians(45));
}
pop()
}
}<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.4.1/p5.js"></script>轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/488242.html
標籤：javascript 动画 回转 p5.js