Processing.JSを使用して3Dテーブルを作成するにはどうすればよいですか？

Question

私は茶色の色の線を持つforループを実行したいと思います。この線は小さくなりますが、小さすぎることはありません。

最終的な画像は、次のようになりますが、テーブルとトップ茶色に着色されている：

//Back wall 
fill(102, 102, 102); 
rect(50,50,300,300); 
//Top Left Corner 
line(50,50,0,0); 
//Top Right Corner 
line(350,50,400,0); 
//Bottom Left Corner 
line(350,350,400,400); 
//Bottom Riight Corner 
line(50,350,0,400); 

//Table 
//Top Left 
fill(48, 17, 0); 
rect(163,312,3,38); 
//Top Right 
fill(48, 17, 0); 
rect(230,312,3,38); 
//Mesa 
fill(48, 17, 0); 
rect(126,322,142,5); 
//Right Side 
line(126,322,168,312); 
//Top Side 
line(234,312,168,312); 
//Right Side 
line(269,322,232,312); 
//Bottom Left Leg 
rect(126,327,5,41); 
line(126,368,126,322); 
//Bottom Right Leg 
rect(263,327,5,41); 
line(269,368,268,322); 

Iループのためにこれを試みた：

for(var x = 200; x > 100; x--){ 

stroke(61, 34, 0); 
line(x,200,x,200); 

} 

x値が減少しますx = 100まで。しかし、background（）を確認した後でも、線が小さくなるのを見せているわけではありません。ループから外れています。

P.S.与えられたコードは別々です。

Answer 1

描画する線の座標をxに変更するだけなので、線は垂直ではなく水平に移動します。

行を垂直方向（表の色にする）と水平方向（「遠くになるほど小さくする」）にする場合は、xとyの両方の値を変更する必要がありますline()機能です。

しかし、これは必要以上に難しくしています。あなたはこの形を得るために一連の線を描く必要はありません。ただbeginShape()関数を使用して、ポリゴンを直接描画します。これは単なる一例であり、あなたは正しい場所に描画する値で遊んする必要がありますことを

beginShape(); 
    vertex(100, 100); //upper-left 
    vertex(200, 100); //upper-right 
    vertex(250, 200); //lower-right 
    vertex(50, 200); //lower=left 
    endShape(CLOSE); 

注：このような何か。しかし、ポイントはポリゴンを描画するためだけに線を描画するためにforループを使う必要がないことです。

3Dシーンを描画しようとしているので、単に3D座標とvertex()関数を使用して3Dで描画することもできます。あなた自身の視点を強制しようとする必要はありません。