BASICでお絵かき

高二

BASICという昔のプログラミング言語を使用して絵を描いたので記録として書いてみた。

いきさつ

日課である倉庫の整理をしていたところ、何故か椅子の上にPC98が置いてあったので中身を漁ることに。結果いくつかのイラストを発見。大昔は座標を指定して線を引いたりすることで絵を描いたりしていたとTwitterで見た記憶と結びつき、自分もやってみることに。

やること

BASICというプログラミング言語を使用した絵の描画。

PC98/BASICについて

PC98はNECが1980年代から販売していたパソコンの総称。今の一般的なパソコンとRAM容量で比較すると約1万倍性能に差がある。ちなみに物理部には4台のPC98が眠っている。
BASICは1964年に誕生した初期のプログラミング言語の1つ。Beginner's All-purpose Symbolic Instruction Code(初心者向け汎用記号命令コード)の頭文字を取って名付けられた。これのいくつかある派生形の1つであるMicrosoftが開発したGWBASICを今回は使用する。

実行準備

GWBASICは太古の遺物なのでもちろん今のWindowsPCでは動作しない。年代を合わせて物理部にあるPC98でコードを書いても良いのだが、自宅での作業を考慮して今回は自分のWindowsPCを使用する。 Windows11上で動作させるためにDOSBoxというエミュレータを使用。また、描く対象については直線が多く描きやすそうだったので物理部のロゴに決定。

APCロゴ

描画

使用する関数紹介

座標などの数値を入力したら線を引いてくれる関数がGWBASICには備わっているのでそれを用いて絵を描いていく。そんな関数たちの紹介。

  • LINE 直線を引く。点Aから点Bまで線を引くには LINE(\(X_{A}\),\(Y_{A}\))-(\(X_{B}\),\(Y_{B}\)) と書く。
  • CIRCLE 楕円を描く。楕円の中心\(O\)、x軸方向の半径\(r\)、始点の傾角\(θ_1\)、終点の傾角\(θ_2\)、楕円の縦横比\(a\)を指定する必要がある。 CIRCLE(\(X_o,Y_o\)),\(r\),2,\(θ_!\),\(θ_2\),\(a\) と書くと楕円の一部を描画してくれる。
  • PAINT 塗りつぶす。図形の内側の座標を代入するとそれを塗りつぶしてくれる。PAINT(\(X,Y\)) と書くだけでいい。楽!

この3つの関数のみで図形を描くことができる(らしい)。 しかしロゴの各点を座標でおかないとこれらの関数が使えなく、がんばって計測した。

設計図写真

実際描いてみて

A

ものすごく簡単。直線を引くだけ。PAINT関数も正常に動作した。

P,C

結構めんどい。単純な直線の部分をとりあえず描画。曲線部を弧としたときの中心とx,yが最大・最小になる点の座標を調べてGeminiAIくんに投げたら式を考えてくれた、優秀!

Gemini

周りの枠みたいなやつ

Aとほとんどやることは同じだが、右下にあるネジの描画に手間がかかった。やることはP、Cと同じだがサイズが小さく調整が難しかった。

できあがったもの。

なんか微妙。右下の部分のクオリティをもっと上げられると良いかも。

おわりに

本当はPC98でコード実行したかったのだが、別の作業をPC98上で行っていたところ壊れてしまったので仮想環境での実行になってしまった。残念。 原理的にはSVGから直接変換できそうだなーと思ったので興味を持った人は実装してみてください。 ここまで読んでいただきありがとうございました。 以下にGWBASICのコードとおまけ話を載せています。気が向いたら読んでみてください。

実際のコード

 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
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
0 REM A描画
10 LINE(47,20)-(73,20)
20 LINE(73,20)-(122,163)
30 LINE(122,163)-(96,163)
40 LINE(96,163)-(86,131)
50 LINE(86,131)-(36,131)
60 LINE(36,131)-(26,163)
70 LINE(26,163)-(0,163)
80 LINE(0,163)-(47,20)
90 LINE(60,54)-(78,106)
100 LINE(78,106)-(44,106)
110 LINE(44,106)-(60,54)
111 PAINT(50,50)

115 REM P描画
120 LINE(96,37)-(145,37)
130 PI=3.14159
140 CIRCLE (145, 69), 32, , 3*PI / 2,  PI / 2, 1.48
150 LINE(145,101)-(115,101)
160 LINE(115,101)-(115,131)
170 LINE(115,131)-(96,76)
180 LINE(96,76)-(96,36)
190 LINE(115,54)-(145,54)
200 CIRCLE (145, 69), 14, , 3*PI / 2,  PI / 2, 3
210 LINE(145,84)-(115,84)
220 LINE(115,84)-(115,54)
230 PAINT(100,40)

240 REM C描画
250 CIRCLE(211,88),54,2,0.4,2*PI-.4,1.317
260 CIRCLE(211,88),36,2,0.4,PI*2-.4,1.565
270 LINE(249,64)-(231,74)
280 LINE(249,112)-(231,102)
290 PAINT(211,40)

300 REM 枠部分
310 LINE(273,0)-(273,144)
320 LINE(273,144)-(280,144)
330 LINE(280,144)-(280,163)
340 LINE(280,163)-(273,163)
350 LINE(273,163)-(273,171)
360 LINE(273,171)-(259,171)
370 LINE(259,171)-(259,163)
380 LINE(259,163)-(125,163)
390 LINE(125,163)-(120,144)
400 LINE(120,144)-(259,144)
405 LINE(259,144)-(259,0)
410 REM 右下ネジ描画
411 LINE(262,148)-(272,148)
412 CIRCLE(267, 148), 5, PI, 0, 3.1415
413 LINE(262,150)-(272,150)
414 CIRCLE(267,150),5,2*PI,PI,3.1415
415 LINE(266,156)-(266,162)
416 CIRCLE(266,159),6,PI/2,3*PI/2,1
417 LINE(268,156)-(268,162)
418 CIRCLE(268,159),6,3*PI/2,PI/2,1
420 PAINT(270,120)

430 LINE(113,20)-(256,34),2,BF
440 LINE(96,34)-(99,34)
450 LINE(102,34)-(105,34)
460 LINE(108,34)-(111,34)
470 LINE(96,34)-(96,31)
480 LINE(96,31)-(99,29)
490 LINE(99,29)-(99,34)
500 LINE(102,34)-(102,27)
510 LINE(102,27)-(105,25)
520 LINE(105,25)-(105,34)
530 LINE(108,34)-(108,23)
540 LINE(108,23)-(111,21)
550 LINE(111,21)-(111,34)
560 PAINT(97,33)
570 PAINT(103,33)
580 PAINT(109,33)

細かい話

パス指定

MS-DOSでは9文字以上のパスを単純に入力できず、以下の規則に従って指定するパスで入力しなければならない。(例:Documents→Docume~1) ここで問題になるのが~(チルダ)である。DOSBoxでのテキストの入力は普段我々が使用しているキーボードと配列が違っている。その関係上~を入力することができないので、わざわざ設定を弄る必要がある。といってもキーボードのキー割り当てを変更するだけだが。


座標の特定

ロゴのSVGファイルを持っていたのでそれを製図ソフトに挿入し、座標を調べた。使用したのはAutodeskFusion

BASIC実行画面

何もしないと画像のようにログが溜まって描画された図が見えづらくなるが、CLSコマンドを使用してログ表示を消去することができる。

実行画面

次へデスノート人狼という呪物について>
前へ遅刻について>