p5.js

概要 †

• 簡単に JavaScript でお絵描きする方法

リンク †

• p5.js リファレンス, Web エディタ (draw 関数の中にコマンドを入れていく)
• C++ で p5.js コマンドを生成するライブラリ（ローカル・プライベートの使用に留める）

コマンド †

• 時間命令→スタイル指定→図形の順番で呼び出すのが良い

時間命令 †

• 常に出したいものは always()を読んでから、時間指定したいものは time() を読んでから行う。

スタイル指定 †

• 長方形のような図形も文字も、fill と stroke を持っている（文字で fill なし stroke ありだと、中抜きの文字が表示される）
• fill(r, g, b, a)
  • noFill()
• stroke(r, g, b, a)
  • noStroke()

図形 †

• circle(x,y,d)
• line(x1,y1,x2,y2)
• point(x,y)
• rect(x,y,w,h)
• text(str, x, y)

• 注意
  • 時間命令やスタイル指定は次に呼び出すまで副作用を与えて残るので、図形コマンドを実行する前には時間・fill スタイル・stroke スタイルを明示的に指定するのが安全