close

Enter

Log in using OpenID

−Jできれいなグラフィックスを描こう−

embedDownload
J研究会資料
2003-4-26
J ウィンドウズ・グラフィックスへのいざない
−Jできれいなグラフィックスを描こう−
西川 利男
Jはグラフィックスについても極めて強力である.言語としてのJのプログラミングは
強力だがコンパクト過ぎ,ときにはトリッキーですらあり,BASICユーザには仲々な
じめないようだ.しかし,Jのグラフィックスはすなおで伝統的であり,そんなことはな
い.通常 Windows のグラフィックスは VisualBasic で開発されるが,これが必ずしも易し
くはない.フォームの作成,コードの記述など仲々面倒で,従来 DOS-BASIC になじんだユ
ーザをとまどいさせている.これに比べるとJの Windows グラフィックス・プログラミン
グは Form Editor の使用で便利に行え,かつJのコードも見えて直接的で分かり易い.
今回はピックオーバの著「無限へチャレンジ」に紹介されていたラヌンクロイドと呼ぶ
きれいなグラフィックス・パターンの作成を課題としてJの Windows グラフィックスの入
門的解説を行う.
1.Jウィンドウズ・グラフィックスにおける3つの座標表示の方法
・ピクセル座標……………絶対座標
ディスプレイ画面のピクセル値による絶対座標
左上(0, 0) から右 下(224, 200) へ の 長 方 形 内 に 表 示
・Jグラフィックス座標…相対座標
Jの isigraph グラフィックパッケージにおける位置指定の座標
左下(0, 0) から右 上(1000, 1000)への長方形内に表示
・数学座標…………………相対座標
数学計算の値に合わせるため,例えば中心を(0, 0) に,右向きにx,上向きにyを適当
なスケールでとる.
2.Jウィンドウズ・プログラミングのための Form Editor とwdコマンド
一般にウィンドウズのプログラムではユーザ・インターフェースとして直接キーインす
るのではなく,ボタン,エディットボックスなどアイコンにより入力する方式をとる.そ
のためプログラミングの最初の段階として,これらのアイコンを選んだり,割り付けたり
することが必要でこれはフォームと呼ばれる.Jではこれは Form Editor を用いることで
ごく簡単に行われる.
Jのスクリプト( = プ ロ グ ラ ム )作成ウィンドウ画面上で,[Edit] ツ ー ル バ ー か ら[Form
Editor]を選んでクリックすると,Form Editor がただちに起動する.ウィンドウズ・オ
ブジェクトの新規作成,ボタン,エディットボックスなどアイコンの選択,大きさ,位置
- 1 -
などは対話的に簡単に行われる.その編集も容易である.更にそのオブジェクトの上でダ
ブルクリックすると,それに関したコード(=処理プログラム)の作成,入力モードに入
る.もちろんグラフィック・ウィンドウの作成も行われる.
Jのウィンドウズ環境の特徴として,Form Editor で作成したフォームをJのコード定
義として直接見ることが出来るので,細かい指定を意のままに修正することも可能である.
つ ま り Jの ウ ィ ン ド ウ ズ の 命 令 は コ ー デ ィ ン グ と し て は , w d(11!:0) コマンドに文字
列で操作内容を記述することで行われる.
ここでもっとも基本的な操作のwdコマンドの例を示す.
・親(parent) オブジェクトの操作
wd 'pc sample1;pn "My Graphics";'
親オブジェクトを sample1 として定義作成(create)し,"My Graphics" と表示する
wd 'pshow;'
親オブジェクトを画面に出力表示する
・子(child)オブジェクトの操作
wd ' xywh 100 50 34 12;cc ok button;cn "Run";'
ボタンの作成(create) − ピ ク セ ル 位 置(100, 50)から右へ 34 ピクセル,下へ 12 ピ
クセルの大きさのボタンを作成し,"Run"と 表 示 す る
wd 'xywh 20 20 120 100;cc mygraph isigraph;'
グラフィックス作成(create) − ピ ク セ ル 位 置(20, 20) か ら 右 へ 120 ピクセル,下へ
100 ピクセルの大きさの isigraph グラフィックス・ウィンドウを作成する
・Jの isigraph による描画
wd 'glines 500 500 1000 500;'
Jグラフィックス座標で,点(500, 500)から点(1000, 500)へ直線を描く
wd 'gpolygon 1000 500 500 1000 0 500 500 0;'
Jグラフィックス座標で,点 (1000, 500),点(500, 1000),点(0, 500) ,点(0, 500)
を結んで多角形(この場合は直線)を描く
wd 'gshow;'
グラフィックスを表示する
ここで注意すべきことはウィ ンドウ・オブジェクトの位置,大きさなどはピクセル座標
で示し,グラフィックスではJグラフィックス座標で表わすことの違いに注意!
なお,
実際には Form Editor で自動的に生成されるので,ユーザはあまり意識することはないか
もしれないが,しくみを知っておくことは必要である.
3 . ラ ヌ ン ク ロ イ ド(Ranuncloid) グラフィックス
ピックオーバの著「無限へチャレンジ」の「創造の出現」の章の中にラヌンクロイドな
る極座標形式の包絡線で描かれるきれいなグラフィックスが紹介されている.
2つの点を 次 の よ う にするとき
P0 ( x0 , y0 ) : x0 ? r cos ? , y 0 ? r sin ?
P1 ( x1 , y1 ) : x1 ? r cos a? , y1 ? r sin b?
- 2 -
; a, b はパラメータ
これによって出来る線分P 0 P 1 を角度θ の 0°∼ 360°に対して次々と結んでいくことに
よって一種の包絡線群が現れ,これを一般にラヌンクロイドと呼ぶ.ここでパラメータ
a, b の 値 を い ろ い ろ と 変 化 さ せ る と,ち ょ う ど ク モ が 糸 で 巣 を 張 る よ う な き れ い な パ タ ー
ン が 現 れ る . a = 2, b = 2 で は い わ ゆ る 心 臓 形(Cardioid)と な る .こ の よ う な グ ラ フ ィ
ックスの作成をJでやってみる.
まず,ラヌンクロイドの計算値を求めるJの関数 chord は簡単に作られる.いまの場合
r =1とすると,x, y の値の範囲は±1 となるので,この数学の値からJグラフィックス
の値に変換することが必要になる.
数学座標
Jグラフィックス座標
-1.2
0
1.2
0
500
1000
これはJの次の関数で変換される.
adj =: %&[email protected](500&*@(1.2&+))
このようにして得たグラフィックス座標の値を次々結んでいくことでラヌンクロイド・グ
ラフィックスが以下のように描かれる.パ ラ メ ー タ a, b の値をエディットボックスから入
力し,ボタンRunをクリックすることで実行する.
プログラムの詳細は付録にあげた.パラメータ a, b を変えることで,いろいろきれいな
パターンが現れる.実行例としてパラメータ a = 6, b = 6 に対するパターンを示した.
- 3 -
NB. Ranunculoid Graphs
NB.
ピックオーバー著、一松信訳「無限へチャレンジしよう」森北出版(1997)
NB.
第9章
「 創 造 の 出 現 」 p.92-96
NB. base form
GRAPH=: 0 : 0
pc graph closeok;pn "Ranunculoid Graphics";
menupop "File";
menu new "&New" "" "" "";
menu ope n "&Open" "" "" "";
menusep ;
menu exit "&Exit" "" "" "";
menupopz;
xywh 196 64 34 12;cc ok button;cn "Run";
xywh 196 100 34 12;cc cancel button;cn "Exit";
xywh 16 8 164 144;cc ranunuc isigraph;
xywh 187 10 50 10;cc label static;cn "Enter: a";
xywh 188 20 50 11;cc a edit ws_border es_autohscroll;
xywh 188 36 50 10;cc label static;cn "Enter: b";
xywh 188 45 50 11;cc b edit ws_border es_autohscroll;
xywh 196 82 34 12;cc clear button;cn "Clear";
pas 6 6;pcenter;
rem form end;
)
run=: graph_run
graph_run=: 3 : 0
wd GRAPH
NB. initialize form here
wd 'set a 6'
wd 'set b 6'
wd 'gclear'
wd 'pshow;'
)
adj =: %&[email protected](500&*@(1.2&+))
va =: 6
vb =: 6
- 4 -
graph_ok_button=: 3 : 0
wd 'grgb 255 0 0;'
wd 'gpen 1'
i =. 0
while. i < 360
do. wd 'glines ', ": adj (va, vb) chord i
i =. i + 1
end.
wd 'gshow;'
wd 'pshow;'
)
graph_cancel_button=: 3 : 0
wd 'pclose;'
)
chord =: 3 : 0
:
('a';'b') =. x.
n =. y.
deg =. 1r180p1
t0 =. (2, 1)&o. deg * y.
t1 =. (2, 1)&o. (a, b) * deg * y.
t0, t1
)
graph_a_button=: 3 : 0
va =: ". a
)
graph_b_button=: 3 : 0
vb =: ". b
)
graph_clear_button=: 3 : 0
wd 'set a ',' '
wd 'set b ',' '
wd 'gclear'
)
- 5 -
Author
Document
Category
Uncategorized
Views
1
File Size
202 KB
Tags
1/--pages
Report inappropriate content