◆PROCESSING 逆引きリファレンス
カテゴリー：図形描画
直線を描画するには
【解説】
PROCESSINGは、様々な図形を簡単に描画できるのが特徴です。
その1つに直線を描画する命令があります。
【構文】
●線を描く
line(x1, y1, x2, y2) ;
line(x1, y1, z1, x2, y2, z2) ;
【パラメータ】
●線を描く
x1 float: 1 番目の点の x 座標
y1 float: 1 番目の点の y 座標
x2 float: 2 番目の点の x 座標
y2 float: 2 番目の点の y 座標
z1 float: 1 番目の点の z 座標
z2 float: 2 番目の点の z 座標
【戻り値】
void
【注意】
PROCESSINGの座標系は以下のようになっています（クリックすると拡大します）。
z座標を用いた直線はsize() 関数で P3Dを指定した場合に利用します。
線の太さは初期状態では1ピクセルです。 また線の色は初期状態では黒（RGBでcolor(0,0,0)）になるようです。
【関連記事】
第２章：図形を描いてみよう
●2Dの線を描画する例：
|
1 2 |
size(100,100); line( 20,30,70,80); |
X座標20、Y座標30の位置から、X座標70、Y座標80に向けて線を描画しています。
＜出力サンプル＞
●線の色を変更する例：
|
1 2 3 4 5 6 7 8 9 |
size(100,100); stroke(0,0,0); //黒 line( 20,20,20,80); stroke(255,0,0); //赤 line( 20,80, 80,80); stroke(0,0,255); //青 line( 80,80, 80,20); |
色を黒、赤、青に変えながら3本の線を描画しています。
＜出力サンプル＞
●線の太さを変更する例：
|
1 2 3 4 5 6 7 8 9 10 11 12 |
size(100,100); strokeWeight(1);//初期値1ピクセル stroke(0,0,0); //黒 line( 20,20,20,80); strokeWeight(4); //4ピクセル stroke(255,0,0); //赤 line( 20,80, 80,80); strokeWeight(8); //8ピクセル stroke(0,0,255); //青 line( 80,80, 80,20); |
上記の例に線の太さを変更する命令を追加しています。
＜出力サンプル＞
●3Dの線を描画する例：
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 |
void setup() { size(800, 600, P3D); } void draw() { // カメラを設定（上から見下ろす位置で、手前に引く） camera(0, -100, 600, 0, 0, 0, 0, 1, 0); background(255); /* ====================== */ /* 地面の描画 */ /* ====================== */ stroke(100); noFill(); final int step = 30; for(int x = -width*2; x < width*2; x += step) { //奥から手前へ線を引く line( x,0,-width, x,0,width); for(int z = -width; z <= width; z += step) { //横線を引く line( -width*2, 0, z, width*2,0,z ); } } } |
上記は Tercel::Diary 様に掲載されていたプログラムを vertex から line に置き換えて改編したものです。
一昔前の3Dゲームに登場しそうなラインアートの地面が描かれます。
＜出力サンプル＞
本ページで利用しているアイコン画像は、下記サイト様より拝借しております。各画像の著作権は、それぞれのサイト様および作者にあります。