2025年3月20日 星期四

week05

 

//week05-1-heart

size(300,300);//大小300x300

stroke(255,0,0);//紅色線條

for(int xx=0;xx<300;xx++){

   for(int yy=0;yy<300;yy++){

      float x=(xx-150)/100.0;

      float y=-(yy-150)/100.0;

      float d=x*x+y*y-1;

      if(d*d*d-x*x*y*y*y<=0)

      point(xx,yy); 

   }

}

//week05-1-heart
size(300,300);//大小300x300
stroke(255,0,0);//紅色線條
translate(width/2,height/2);//translate(150,150);
for(int xx=-150;xx<150;xx++){//大的x-150..150
   for(int yy=-150;yy<150;yy++){//大的y -150...150
      float x=(xx)/100.0;//除100 -1.5...+1.5
      float y=-(yy)/100.0;//除100 -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
//角度 degreaa 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
//degrees vs radians 結合 week04-1和 week05-2
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);//把算出來的arc radians拿來用
  textSize(30);
  text("radians:"+a,100,100);//radians弧度/弳度
  text("degrees:"+degrees(a),100,130);//degrees 度
}
//week05-3b
//degrees vs radians 結合 week04-1和 week05-2
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);//負的...零
  else    arc(200,200,200,200,0,a,PIE);//零....正的
  textSize(30);
  text("radians:"+a,100,100);//radians弧度/弳度
  text("degrees:"+degrees(a),100,130);//degrees 度
}



//week05-4-translate-mouseX、mouseY-rotate-radians-frameCount
//比較 rotate 與 translate的順序
void setup(){
  size(400,400);
}
void draw(){
  background(204);
  //請做以下測試:把下面兩行,調一下位置
  //會發現:畫東西之前的translate()才有效果
  //在電腦圖學理,畫圖時會照著之前累積的移動、旋轉來放東西
  translate(mouseX,mouseY);//移動到mouse所在位置
  rotate(radians(frameCount));
  rect(-50,-5,100,10);//寬度100的棒子,但放在左上角
}

  rotate(radians(frameCount));  
translate(mouseX,mouseY);//移動到mouse所在位置
兩行交換

//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();
  //希望在左邊-100的地方也再轉
  pushMatrix();
  translate(width/2-100,height/2);//(把下面這坨)移到畫面中心點
  rotate(radians(frameCount)*10);
  rect(-50,-5,100,10);
  popMatrix();
}


//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-7-many-pushMatrix-popMatrix
void setup(){
  size(500,500);
}
void draw(){
  background(204);
  for(int x=50;x<500;x+=50){//每個距離100
    for(int y=50;y<500;y+=100){//每個距離100
      pushMatrix();
      translate(x,y);//移到對應的x,y
      rotate(radians(frameCount));
      rect(-50,-5,100,10);
      popMatrix();
    }
  }
}


沒有留言:

張貼留言