Processing/2.ちょっと発展/5.座標変換
をテンプレートにして作成
[
トップ
] [
新規
|
一覧
|
検索
|
最終更新
|
ヘルプ
|
ログイン
]
開始行:
#navi(Processing/2.ちょっと発展)
* 2-5 座標変換 [#k5c8a46c]
Processingの図形は座標を元にして描いている。何も指定しな...
それを元にして、例えば、
rect(100,150,20,20);
は、点(100,150)と(120,170)を対角線とする長方形を描く。
Processingでは座標を任意に指定することができる。
原点を点(x0,y0)に移動するには、translate(x0,y0)を用いる。
原点を中心として座標軸をthラジアンだけ回転させるには、rot...
座標の単位をsピクセルにするには、scale(s)を用いる。
次の2つのスケッチは同じ結果を与える。
size(200,200);
rect(100,150,20,20);
size(200,200);
translate(100,150);
rect(0,0,20,20);
座標変換は組み合わせて使うことができる。次の例は、原点を...
translate(100,100);
rotate(radians(30));
また、変換の順序を逆にして
rotate(radians(30));
translate(100,100);
とした結果は下の図の右下となる。このように変換を組み合わ...
#ref(http://www.ist.aichi-pu.ac.jp/lab/qua/~qua/pbl/proce...
長方形をその中心の周りに回転させてみよう。
それには、長方形の中心に原点を移動して、座標を回転させ、...
translate(200,300);
rotate(radians(30));
rect(-20,-10,40,20);
幅30、高さ50の長方形を点(100,200)を中心に45度回転させて描...
translate(100,200);
rotate(radians(45));
rect(-15,-25,30,50);
それぞれを別々のスケッチで実行させればうまくいくが、2つと...
size(400,400);
line(100,200,200,300);
noFill();
pushMatrix();
translate(200,300);
rotate(radians(30));
rect(-20,-10,40,20);
popMatrix();
translate(100,200);
rotate(radians(45));
rect(-15,-25,30,50);
#ref(http://www.ist.aichi-pu.ac.jp/lab/qua/~qua/pbl/proce...
次のスケッチでは、画面中央の四角形が回転する。drawが実行...
float th=0;
void setup(){
size(400,400);
}
void draw(){
background( 128 );
translate( width/2, height/2 );
rotate( th );
rect( -100, -100, 200, 200 );
th = th + 0.01;
}
以前実施した以下のスケッチでは座標を指定して〇を描いてい...
float x, y, dx;
void setup(){
size(400,400);
x = 0;
y = height / 2;
dx = 2;
}
void draw(){
background(64);
circle(x, y, 20);
if( x < 0 || x > width ) { dx = -dx; }
x = x + dx;
}
これは座標変換を用いて、次のようにも書くことができる。
float x, y, dx;
void setup(){
size(400,400);
x = 0;
y = height / 2;
dx = 2;
}
void draw(){
background(64);
translate(x, y);
circle(0, 0, 20);
if( x < 0 || x > width ) { dx = -dx; }
x = x + dx;
}
終了行:
#navi(Processing/2.ちょっと発展)
* 2-5 座標変換 [#k5c8a46c]
Processingの図形は座標を元にして描いている。何も指定しな...
それを元にして、例えば、
rect(100,150,20,20);
は、点(100,150)と(120,170)を対角線とする長方形を描く。
Processingでは座標を任意に指定することができる。
原点を点(x0,y0)に移動するには、translate(x0,y0)を用いる。
原点を中心として座標軸をthラジアンだけ回転させるには、rot...
座標の単位をsピクセルにするには、scale(s)を用いる。
次の2つのスケッチは同じ結果を与える。
size(200,200);
rect(100,150,20,20);
size(200,200);
translate(100,150);
rect(0,0,20,20);
座標変換は組み合わせて使うことができる。次の例は、原点を...
translate(100,100);
rotate(radians(30));
また、変換の順序を逆にして
rotate(radians(30));
translate(100,100);
とした結果は下の図の右下となる。このように変換を組み合わ...
#ref(http://www.ist.aichi-pu.ac.jp/lab/qua/~qua/pbl/proce...
長方形をその中心の周りに回転させてみよう。
それには、長方形の中心に原点を移動して、座標を回転させ、...
translate(200,300);
rotate(radians(30));
rect(-20,-10,40,20);
幅30、高さ50の長方形を点(100,200)を中心に45度回転させて描...
translate(100,200);
rotate(radians(45));
rect(-15,-25,30,50);
それぞれを別々のスケッチで実行させればうまくいくが、2つと...
size(400,400);
line(100,200,200,300);
noFill();
pushMatrix();
translate(200,300);
rotate(radians(30));
rect(-20,-10,40,20);
popMatrix();
translate(100,200);
rotate(radians(45));
rect(-15,-25,30,50);
#ref(http://www.ist.aichi-pu.ac.jp/lab/qua/~qua/pbl/proce...
次のスケッチでは、画面中央の四角形が回転する。drawが実行...
float th=0;
void setup(){
size(400,400);
}
void draw(){
background( 128 );
translate( width/2, height/2 );
rotate( th );
rect( -100, -100, 200, 200 );
th = th + 0.01;
}
以前実施した以下のスケッチでは座標を指定して〇を描いてい...
float x, y, dx;
void setup(){
size(400,400);
x = 0;
y = height / 2;
dx = 2;
}
void draw(){
background(64);
circle(x, y, 20);
if( x < 0 || x > width ) { dx = -dx; }
x = x + dx;
}
これは座標変換を用いて、次のようにも書くことができる。
float x, y, dx;
void setup(){
size(400,400);
x = 0;
y = height / 2;
dx = 2;
}
void draw(){
background(64);
translate(x, y);
circle(0, 0, 20);
if( x < 0 || x > width ) { dx = -dx; }
x = x + dx;
}
ページ名: