タートルグラフィクス

ここではタートルグラフィクス(Turtle Graphics)という枠組みに基づいて，キャンバスに絵を描くプログラムを作成する方法について説明します．

タートルグラフィクスは1967年にPapertらによって開発されたプログラミング言語Logoに組み込まれた描画の仕組みで(Logo History)，プログラミング教育で広く用いられています．

本科目はRubyで動作する「Gtr」というタートルグラフィクスのパッケージを利用します． Gtrは本科目のために担当者が独自に開発したものです． 利用するには標準のRubyにパッケージを追加でインストールする必要があります． そこでこのページのプログラムを動かしてみる場合には，予め「初期設定」を完了させておいてください． なおGtrは一般公開していません(ネットからは入手できません)．

もくじ

1. はじめに
2. プログラムの例
3. 亀の動作の記述方法
4. 亀の描画機能
5. キャンバスの座標系
6. 亀のデータ入出力機能(*)
7. その他の機能(*)
8. テンプレートファイル(*)
9. サンプルプログラム(*)
10. Colortable(色サンプル)(*)

上の項目のうち(*)をつけたものは，まず読み飛ばしても問題ありません． また「亀の描画機能」では描画に利用できる機能を一覧にして紹介していますが，それらの全てを理解しなければプログラムが作れないわけではありません．

はじめに

タートルグラフィクスとは，画面上のタートル(亀)を動かして，亀の通った跡に線をひくことで絵を描く枠組みです． 亀の動きをプログラムで指示することでさまざまな絵を描くことができます． 次にタートルグラフィクスプログラムの実行画面の例を示します．

亀の動作の基本となるのが「前へ進む」と「向きを変える」という指示です． ただこれらだけでは描ける絵が限定されますので， ここで紹介するタートルグラフィクスパッケージGtrでは， たとえば，線を描かずに移動すること，あるいは指定した範囲を塗りつぶすことなどができるようになっています． 詳しくは「亀の機能」を参照してください．

プログラムの例

次に簡単なサンプルプログラムを示します． これは黄色の線で正方形(の枠)を描くプログラム(gtr_square.rb )です．なお正方形を描画した後，描画開始時に亀が向いていた方向に亀の向きを戻すようにしています．

require 'gtr/turtle' # Gtrパッケージの読み込み

include Gtr # プログラムの記述を(若干)簡潔にするための設定

## 亀の動作の記述
class Turtle
  def draw

    # アニメーションのスピード設定
    set_speed(10)

    # 線の色指定
    set_color(255,192,0)

    # 動作記述(正方形を描く)
    forward(200) # 200進む
    turn(90)     # (反時計回りに)90度回転する
    forward(200) 
    turn(90)    
    forward(200) 
    turn(90)    
    forward(200) 
    turn(90)    
  end
end

# キャンバスの幅と高さ
WIDTH  = 800
HEIGHT = 600

# キャンバスを用意する(大きさ＝WIDTH×HEIGHT)
wrl = World.new(WIDTH,HEIGHT)

# 亀を用意する
t = Turtle.new()

# キャンバス上に亀を置く
# t: 亀
# (WIDTH/2,HEIGHT/2): 亀を置く場所(この場合はキャンバスの中央)
# 0: 亀を置く向き(0を上向きとして反時計回りの角度(degree)で指定する)
wrl.register(t,WIDTH/2,HEIGHT/2,0) 

# ウインドウを表示する
wrl.open

プログラムの最初に「require」でGtrのパッケージを読み込んでいます． こうすることで，(標準のRubyには含まれていない)Gtrの機能をプログラムで利用できるようになります． それにつづいてプログラムでは亀の動作を定めています(詳細は以下で説明します)． プログラムの後半では，キャンバスの大きさの設定，最初に亀がいる場所と向きの指定など， 絵を描くための準備を行っています(「キャンバスの設定など」を参照のこと)．

なおプログラムで#からその行の末尾までは「コメント」として解釈されます． コメントにはプログラムを読んで理解するための補足説明を示しています． コメントは人間が読むものです． プログラムを実行したときにコメントの記述はすべて無視されます． そこでコメントの記述内容を変更しても，コメントを(#を含めて)丸ごと削除してもプログラムの動作は変わりません． プログラムにどのようにコメントを書くのかは(文法上許される範囲で)自由に決められます．

プログラムの実行方法

(すでに初期設定が完了しているとして)このサンプルプログラムは次のように実行します．

  $ ruby gtr_square.rb

画面にウインドウが表示されたら，メニュー[Operation]の[Draw]を選ぶことで，プログラムで指示された絵が描かれます． またメニュー[Operation]の[Quit]でプログラムを終了できます．

亀の動作の記述方法

亀の動作は次の形式で記述します．

include Gtr

class Turtle
  def draw

    # 「def draw〜end」の間に亀の動作を順に記述する

  end
end

「def draw」の次の行から「end」の前の行までで亀の動作を書きます． 動作は好きなだけ書くことができます． 動作スピード，線の色，線の幅，線の種類などの指定， あるいはメッセージの表示やデータの取り込みも「def draw」から「end」の間に記述します． プログラムを実行すると，記述した内容が上の行から順に読み取られて，その指示の通りに順番に亀が動くことになります． 亀の具体的な動かし方については別途説明します(「亀の描画機能」を参照のこと)．

亀の描画機能

ここではタートル(亀)の描画機能について説明します． 基本となる機能は「前へ進む」(forward)と「向きを変える」(turn)です． 描画に使う色はset_colorで指定します(参考: Colortable(色サンプル))． まずこれらを使うだけでもいろいろな絵を描くことができるでしょう． さらに以下に示すfill，hover等々を利用すればさらにバラエティに富んだ絵を描けるようになります． なお上の例でも指定してあるように最初に描画スピードを設定(set_speed)しておくとよいでしょう．

キャンバスの座標系

キャンバスでは原則として左下角が原点(0,0)となっています． 右向きにx軸，上向きにy軸がとられています． またy軸正方向を0として反時計回りで角度(degree)により方位を表します． 0が北，90が西，180が南，270が東になります． 360は，また北になります． もちろん中間の方位も角度で表すことができます．

なお座標系の原点を別途指定することもできます(以下の「キャンバスの設定など」を参照のこと)．

亀のデータ入出力機能(*)

タートルグラフィクスでデータを読み込んだり，メッセージを表示したりする方法を紹介します．

その他の機能

Gtrパッケージにはここまでで紹介したもの以外にもさまざまな機能もあります． なお演習を行うために以下で紹介する機能について理解する必要はありません．

プログラムでは次のようにして亀を用意します．

キャンバスを作る，亀をキャンバスに配置するといったキャンバスに関する設定を行うには，キャンバスの次のような機能を使います．

テンプレートファイル(*)

亀の動作以外の部分を書いたプログラムのテンプレートを用意しました． 名前を適宜変えて保存して利用してください．

• gtr_template.rb

サンプルプログラム(*)

以下のサンプルプログラムを用意しました． ダウンロードして実行してみてください． またemacsでダウンロードしたプログラムの内容を見て参考にしてください．

• gtr_simple_star.rb(星形を描く)
• gtr_two_stars.rb(星形を二つ描く; hoverの例)
• gtr_square_fill.rb(塗りつぶされた正方形を描く; fillの例)
• gtr_sprout.rb(植物の芽を描く; circle,mark,backの例)

• gtr_simple_star_fill.rb(塗りつぶされた星形を描く)
• gtr_meta.rb(亀を描く)

Colortable(色サンプル)(*)

タートルでは描画色をRGB(赤，緑，青)の成分の強さを組み合わせて指定します．

  set_color(r,g,b)

各成分(r,g,b)の値は0〜255の整数で指定します(値が大きいほど，その成分が強くなります)． 次のページでR,G,Bの値と色のサンプルを示していますので参考にしてください．

• Colortable