特徴

  • ブラウザだけで手軽にプログラミングをはじめることができます。
  • Rubyの構文により、HTML5の Canvas APIの機能を利用することができます。
  • グラフィックアートやインフォメーショングラフィックなどのほか、
    ゲームなどのインタラクティブなアプリケーションも作成することができます。
  • 作成したプログラムは、画像データも含めた単一の HTMLファイルとして
    保存することができます。
  • プログラムが保存された HTMLファイルは、Nyle-canvas用のエディタを介さずに
    そのままブラウザ上で実行することができます。
  • グラフィックライブラリのインターフェースとして、
    下記の2つのスタイルが用意されています。 (お好みの方でプログラミングをしてください)

    Nyleスタイル Ruby/GTK3ベースのグラフィックライブラリ「Nyle」に準じたAPI構成およびテンプレート
    DXRubyスタイル Rubyのゲームライブラリ「DXRuby」に準じたAPI構成(サブセット)およびテンプレート

    いずれも、若干の部分的な調整をすることによって
    Nyleや DXRubyを使ったデスクトップアプリケーションのプログラムが
    ほぼそのままブラウザ上で動作します。

留意事項

  • 速さが求められるゲームや大量の描画要素が出現するようなものには適していません。
  • Canvas APIのすべての機能がラップされているわけではないため、
    こまかな描画処理などは Contextのメソッドなどを直接呼び出す必要があります。
  • エディタ上でのファイルの保存や読込みなどの挙動はブラウザの種類や
    設定内容に依存するため、ブラウザ間で操作性が同じにならないケースがあります。
  • Opalを用いて Rubyから JavaScriptへの変換をしているため、
    本来の Rubyの言語仕様とは異なる挙動になるケースがあります。
  • エラーメッセージなどのハンドリングにまだ課題が残るため、
    デバッグの作業がしづらいものになっています(今後改善予定)。

おもな機能

  • 基本図形の描画
  • 画像の読み込みおよび描画
  • 文字列の表示
  • マウスおよびキーボードのイベント処理
  • 座標系の移動・回転・拡大/縮小およびそれらの状態保持

動作環境

OS ブラウザ
Windows Chrome(推奨) / Firefox / Edge
macOS Chrome(推奨) / Firefox / Safari
Linux Chrome(推奨) / Firefox
Android
(試験確認)
Chrome
(タップなどの操作には未対応)


【参考】内部構成の概略

Link to GitHub