図形を移動・回転させる のバックアップ(No.1)

• バックアップ一覧
• 差分 を表示
• 現在との差分 を表示
• 現在との差分 - Visual を表示
• ソース を表示
• 図形を移動・回転させる へ行く。
  • 0 (1970-01-01 (木) 09:00:00)
  • 1 (2016-02-02 (火) 15:47:37)

Processingは画面左上を原点(0, 0)とし、右方向と下方向をそれぞれ正としています。
これは、中学・高校の数学で習ってきた「x-y平面」とは異なり、そのため、図形の動かし方や回転の方向を考えるときに混乱してしまうこともあるかもしれません。
　
Processingでは、より直感的に図形を移動させたり、回転させたりする方法が提供されています。
　

translate(200, 100)

　
「translate(x, y)」はこの後に出てくる図形等の位置をまとめて移動させるものです。
例えば次の２つのコードは同じ結果になります。
　

size(300, 300);

ellipse(100, 100, 100, 100);

line(200, 200, 250, 250);

size(300, 300);

translate(100, 100);

ellipse(0, 0, 100, 100);

line(100, 100, 150, 150);