四角形で線路を描く

==========================================================================================
グラフィックコマンドのLineで四角形を描き、線路に見立てることにチャレンジしてみます。
ゲームの背景なんかに応用できるかもしれません。

==========================================================================================

Lineで長方形を描きそれを線路の枕木に見立てます。遠近法で奥の長方形ほど小さく描くことでそれらしく見えることを
目指します。BASICはN88互換BASIC for Windows95を使っていますが、基本的には他のBASICでもほぼそのまま
でいいと思います。

（参考）Lineの使い方の参考ページ
グラフィックの基本
 BASICのグラフィック命令の違い（Linr,Circle)

(1)シンプルな形

一番手前の長方形から奥に行くほど小さく描いていきます。
基本的に使うBASICの命令はLineだけです。Line命令の基本形は以下の式①のようであり、
四角形の左上の座標(X1,Y1)と右下の座標(X2,Y2)をどう変化させるかだけです。

Line(X1,Y1)-(x2,Y2)　・・・式①

最初はX1は150に固定で、Y1,X2,Y2を変化させてみます。
見る人の視点が左側の赤い線（x=150）にあるイメージです。

（図１）
（※）赤い線と座標は参考までに後から書き加えたものです。

このプログラムではscaleという変数を変化量を表すのに使い、scaleをだんだん小さくしていくことで
奥に行くほど変化量が一定割合で小さくなっていくようにしています。
やっていることはシンプルなのであとはプログラムをみて下さい。

10 cls
20 x=150:y=350
30 w=400: h=20
40 scale=1
50 for i=0 to 25
60 line(x,y)-(x+w*scale,y+h*scale),7,BF
70 scale=scale*0.89
80 y=y-h*scale*2-1
90 next

（２）　自然にカーブ
やっているｋとはリスト1とほぼ同じです。
180行目で、x=x+5　として左上のx座標（つまり式①のX1）を一定量少し変化させています。
奥行つまりy座標の変化量はscaleが小さくなるにつれ小さくなっていくので、自然と右にカーブしている
感じになります。

（図２）

130 cls
140 x=150:y=350:w=400:h=20:scale=1
150 for i=0 to 25
160 line(x,y)-(x+w*scale,y+h*scale),6,BF
170 scale=scale*0.89
180 y=y-h*scale*2-1:x=x+5
190 next

（３）　線路の真ん中に視点を持ってくる
線路の真ん中に視点を持ってくるようにしてみます。
線路の幅は左右均等に短くなっていきます。

線路の幅をwとすると、次の線路の幅はw*scaleすなわちw*0.89に縮小しています。
よって左右ともにw*0.0505づつ短くなるイメージで描画すれば、線路の真ん中に視点をもってきたイメージ
になります。

そこで280行目で左上のx座標（つまり式①のX1）の変化を、x=x+20*scaleという式で変化させていくことにしました。
多少の誤差はありますが、w*0.0505づつ短くなるイメージを近似できていると思います。

（図３）

230 cls
240 x=150:y=350:w=400:h=20:scale=1
250 for i=0 to 25
260 line(x,y)-(x+w*scale,y+h*scale),5,BF
270 scale=scale*0.89
280 y=y-h*scale*2-1:x=x+20*scale
290 next

（４）　もう少し変化させてみる

xの変化にsin関数も使って、右に左にともう少し変化をつけてみた。

（図４）

330 cls
340 x=150:y=350:w=400:h=20:scale=1
350 for i=0 to 25
360 line(x,y)-(x+w*scale,y+h*scale),4,BF
370 scale=scale*0.89
380 y=y-h*scale*2-1:x=x+5*scale-8*sin(3.14*i/20)
390 next

（１）　
スタート直後は図２のような線路ですが、最終的には図５のように変化させてみます。

（画像５）

動画でみるとこんな感じ
表示とキャプチャツールの能力、CPUパワーの能力がちょっと不足しているためちょっと動画がカクカクしてますが
実際の画面はもっとなめらかに動いています。

プログラムの基本構造はリスト4を使っています。
リスト4に更に変数tを加えて、tの変化で線路のカーブの仕方を少しづつ変化させています。

10 cls
20 for t=0 to 100
30 x=150:y=350:w=400:h=20:scale=1
40 cls
50 for i=0 to 25
60 line(x,y)-(x+w*scale,y+h*scale),4,BF
70 scale=scale*0.89
80 y=y-h*scale*2-1:x=x+5-4*(scale*t/50)-8*sin(3.14*i/20)*t/50
90 next i
100 next t