week05_01_i_love_you
size(300,300); //大小300X300
stroke(255,0,0); //紅色的線條
for(int xx=0;xx<300;xx++){ ////大的x 0..300
for(int yy=0;yy<300;yy++){ //大的y 0..300
float x = (xx-150)/100.0; //減一半 除100
float y = -(yy-150)/100.0; //減一半 除100
//0..300變-150..+150 變-1.5..+1.5
float d=x*x+y*y-1;
if(d*d*d-x*x*y*y*y<0)point(xx,yy);
}
}
week05_01b_i_love_you
size(300,300); //大小300X300
stroke(255,0,0); //紅色的線條
translate(width/2,height/2); //translate(150,150);
for(int xx=-150;xx<150;xx++){ ////大的x 0..300
for(int yy=-150;yy<150;yy++){ //大的y 0..300
float x = xx/100.0; //減一半 除100
float y = -yy/100.0; //減一半 除100
//0..300變-150..+150 變-1.5..+1.5
float d=x*x+y*y-1;
if(d*d*d-x*x*y*y*y<0)point(xx,yy);
}
}
week05_2_for_for_ellipse_arc_arc_radians_360
//角度 degrees 度 vs. radians 弧度/弳度
size(600,600);
background(0);
for(int i=0;i<6;i++){
for(int j=0;j<6;j++){
int now = i*6+j; //每個圓的編號
ellipse(50+j*100,50+i*100,80,80);
arc(50+j*100,50+i*100,60,60,0,now,PIE);
arc(50+j*100,50+i*100,40,40,0,radians(now*10),PIE);
text(now,j*100,i*100+30);
}
}
week05_3_atan2_dy_dx_text_radians_degrees
//角度 degrees 度 vs. radians 弧度/弳度 結合week04_01 & week05_02
void setup(){
size(400,400);
}
void draw(){
background(128);
line(200,200,400,200);
line(200,200,mouseX,mouseY);
float dx = mouseX-200,dy = mouseY-200;
float a = atan2(dy,dx); //神奇的三角函式,可找到arc弧的radians
//atan2()出來的值,介於-PI...+PI中間
arc(200,200,200,200,0,a,PIE); //把算出來的arcradians拿來用
textSize(30);
text("radians: " + a,100,100); //radians 弧度/弳度
text("degrees: " + degrees(a),100,130); //degrees 度
}
week05_3b_atan2_dy_dx_text_radians_degrees
//角度 degrees 度 vs. radians 弧度/弳度 結合week04_01 & week05_02
void setup(){
size(400,400);
}
void draw(){
background(128);
line(200,200,400,200);
line(200,200,mouseX,mouseY);
float dx = mouseX-200,dy = mouseY-200;
float a = atan2(dy,dx); //神奇的三角函式,可找到arc弧的radians
//atan2()出來的值,介於-PI...+PI中間
if(a<0) arc(200,200,200,200,a,0,PIE); //負的~0
else arc(200,200,200,200,0,a,PIE); //0~正的
textSize(30);
text("radians: " + a,100,100); //radians 弧度/弳度
text("degrees: " + degrees(a),100,130); //degrees 度
}
week05-4_translate_mouseX_mouseY_roatate_radians_frameCount
//比較rotate & translate的順序
void setup(){
size(400,400);
}
void draw(){
background(204);
//請做以下測試:把下面2行,調一下順序
//會發現:畫東西之前的translate()才有效果
//在電腦圖學裡,畫圖時會照著之前"累積的移動 旋轉"來放東西
translate(mouseX,mouseY); //移動mouse所在位置
rotate(radians(frameCount)*20); //1秒有60個frame,轉60度,要變radians單位
rect(-50,-5,100,10); //寬度100的棒子,但放在左上角
}
將第20行的數值*越大,棒子轉越快(跟著滑鼠轉)
week05-5_roatate_radians_frameCount_translate_mouseX_mouseY
//比較rotate & translate的順序
void setup(){
size(400,400);
}
void draw(){
background(204);
//請做以下測試:把下面2行,調一下順序
//會發現:畫東西之前的translate()才有效果
//在電腦圖學裡,畫圖時會照著之前"累積的移動 旋轉"來放東西
rotate(radians(frameCount)*20); //1秒有60個frame,轉60度,要變radians單位
translate(mouseX,mouseY); //移動mouse所在位置
rect(-50,-5,100,10); //寬度100的棒子,但放在左上角
}
滑鼠離視窗左上角越遠,轉越快
week05_6_pushMatrix_popMatrix_bad
//因為有很多得移動、旋轉,大腦會亂掉,所以用"分階層"做事
void setup(){
size(400,400);
}
void draw(){
background(204);
translate(width/2,height/2); //(把下面這坨)移到畫面中心
rotate(radians(frameCount)*10);
rect(-50,-5,100,10); //好的
//希望在左邊-100的地方,也在轉,但是他亂掉了!!
translate(width/2-100,height/2); //(把下面這坨)移到畫面中心
rotate(radians(frameCount)*10);
rect(-50,-5,100,10);
}
week05_6_pushMatrix_popMatrix_good
//因為有很多得移動、旋轉,大腦會亂掉,所以用"分階層"做事
void setup(){
size(400,400);
}
void draw(){
background(204);
pushMatrix(); //
translate(width/2,height/2); //(把下面這坨)移到畫面中心
rotate(radians(frameCount)*10);
rect(-50,-5,100,10); //好的
popMatrix();
pushMatrix(); //
translate(width/2-100,height/2); //(把下面這坨)移到畫面中心
rotate(radians(frameCount)*10);
rect(-50,-5,100,10);
popMatrix();
}
week05_7_many_pushMatrix_popMatrix
void setup(){
size(500,500);
}
void draw(){
background(204);
for(int x=50;x<500;x+=100){
for(int y=50;y<500;y+=100){
pushMatrix();
translate(x,y);
rotate(radians(frameCount));
rect(-50,-5,100,10);
popMatrix();
}
}
}







沒有留言:
張貼留言