点を描いてみる

前回と同じようにProcessingを立ち上げ以下を記述し、実行してみてください。

point(50,50);

以下のようにウィンドウの真ん中に小さな点が打たれているはずです。

このpoint命令は指定した位置に点を打つ命令です。カッコの中の50,50とは X座標とY座標を指しています。ちなみに今回ウィンドウの大きさを設定していませんが、 特に設定しない場合は横幅100ピクセル、縦幅100ピクセルのウィンドウが表示されます。 つまり今回描かれた点はウィンドウの真ん中に描かれているので、ちゃんと 縦50ピクセル、横50ピクセルの位置に描かれていることがわかります。

point(横のピクセル数,縦のピクセル数);

座標について

Processingにおけるウィンドウの座標について説明します。 Processingの座標でも数学で使うのと同じように横方向がX座標で 下方向がY座標となっています。X座標の場合は右にいくほど座標値が大きくなります。 Y座標は下にいくほど座標値が大きくなります。以下は横200px、縦200pxの場合の例になります。


線を描く

線を描くにはlineという命令を使います。記述方法は以下のようになっています。

line(始点のX座標,始点のY座標,終点のX座標,終点のY座標);

例えばX座標が0、Y座標が0の位置からX座標が200、Y座標200の位置に線を引きたい場合は 以下のように記述します。今回は先にウィンドウのサイズを設定しておきます。

size(200,200);
line(0,0,200,200);

【結果】

広告