インタラクションリストに戻る    印刷する

らせん

マウスのx座標により、らせんが成長します。 らせんを描くプログラムは【問題2-3】で作りました。

半径rの円を描く場合、円上の点のx、y座標の計算式は次のようになります。tは時計の3時の位置を0度とした時計回りの角度(度単位)です。

  x = r * cos(radians(t));
  y = r * sin(radians(t));

らせんは円と違い、rの値が一定ではありません。角度tが変化するに従って、a * radians(t) のように変化します。aは係数で、この値を大きくすると、らせんの広がりが大きくなります。らせん上の点の座標を表す式は次のようになります。下のプログラムでは係数aを2.0にしています。

  x = a * radians(t) * cos(radians(t));
  y = a * radians(t) * sin(radians(t));

これはらせんの中央を座標の原点(0,0)にしたときの計算式です。
らせんの中心を画面の中央に置くため、画面の中央の位置のx座標、y座標の値を加えています。

  x = a * radians(t) * cos(radians(t)) + width/2;
  y = a * radians(t) * sin(radians(t)) + height/2;

らせん上の点の位置を表す角度ｔは、らせんを一周すると0度から360度に変化し、二周めで360度から720度に変化します。下の例ではマウスが画面の左端から右端に移動する間にらせんを8周させています。

  t =  map(i, 0, wide, 0, 360*8);

iの値は0からマウスのｘ座標まで変化し、その値を0度から８周分の角度の間に割り付けて(マップして)います。

計算されたx、y座標の点を曲線でつなげて線を描くためにcurveVertex()関数を使っています。

【リストSpiral】
float x,y,t;
float a = 2.0;
int wide=150;        // 画面の高さ

void setup() {
  size(wide, wide);   //描画するための画面
  strokeWeight(3);
}

void draw() { 
  background(255);
  beginShape();
  for(int i=0; i<=mouseX; i++){
     t =  map(i, 0, wide, 0, 360*8);
     x = a * radians(t) * cos(radians(t)) + width/2;
     y = a * radians(t) * sin(radians(t)) + height/2;
     curveVertex(x,y);
  }
  endShape();
}