Illuminated.jsは光とオブジェクトの影を自動計算するJavaScriptライブラリです。RPGゲームやアクションゲームで効果的です。

光があるところには必ず影がある、どこかの大魔王もそういってやられていきました。ということでJavaScriptを使ってオブジェクトと光、そして影を計算するライブラリIlluminated.jsを紹介します。


デモです。オブジェクトやライトを配置していきます。


まずライトを配置してみました。


次にオブジェクトを配置します。ライトとオブジェクトの配置によって光と影が変化しています。


別な光源を配置しました。さらに複雑な計算になっているはずです。


オブジェクトを動かすと自動で影が変化します。


色を変更した場合です。光源の強さも変更できます。

Illuminated.jsではオブジェクトや光源をドラッグで移動すると、それに合わせて影も自動的に変化します。これによって何ができるかというとHTML5製ゲームなどでキャラクターの動きに合わせた影の変化やランプが揺れて影が動くようなアニメーションが簡単に実現できるということです。

Illuminated.jsはJavaScript製、LGPLのオープンソース・ソフトウェアです。

MOONGIFTはこう見る

HTML5ゲームが盛り上がってきています。かつての携帯電話向けゲームのようなキーを押すだけのものではなく、アクションやRPG、パズルと言ったジャンルのゲームに注目が集まっています。そんなゲーム開発に乗り出しても良いですが、開発者であれば関連ライブラリを作るのもまた面白いでしょう。

慣性を計算するもの、重力、キーボード入力、3D…既にあるライブラリもあれば、まだまだ足りないライブラリもたくさんあります。まさに今、求められていると言っても過言ではないでしょう。フレームワークのような大型のものは数あれど、ごく小さな便利ライブラリを作ってみるのもお勧めです。

Illuminated.js - 2D lights and shadows rendering engine with HTML5 Canvas

gre/illuminated.js