HTML5によってWeb上での表現力が高くなり、これまでFlashなどを使わないとできなかったようなアニメーション表現がWeb標準だけで実現できるようになっています。とは言え、ただアニメーションするだけでは面白くありません。 面白いのはよりインタラクティブな、マウスやキーボードを使って自分で操作できるものでしょう。今回はそんなグラフィックスを実現するg9を紹介します。

g9の使い方

g9のデモです。マウスで一つのドットを動かすと全体が連動します。

こんな幾何学曲線もJavaScriptなら計算も容易でしょう。

三次元モデルをマウス操作。

時計。

より複雑な幾何学模様です。

ドットの固まりが見事に制御されています。

さらにピストンもg9で描けます。

g9は複数のオブジェクトが連携し合うようなグラフィックスが描けます。マウスで操作して大きさを変えたり、向きを変えたりと様々な表現が可能です。Web上での表現力が増す、面白いライブラリです。

g9はHTML5/JavaScript製のオープンソース・ソフトウェア(MIT License)です。

g9 Gallery | Automatically Interactive Graphics bijection/g9: Automatically interactive graphics for the web. ?✨