toxiclibs.jsはtoxiclibsをJavaScriptにポーティングするプロジェクトです。

コンピュータでプログラミングされたデザインを描き出すフレームワークにProcessingを用いたtoxiclibsがあります。それはJavaで開発されているのですが、何とJavaScriptにポートしたプロジェクトが登場しました。それがtoxiclibs.jsです。


こんな感じにボールが舞い降りてきます。


マウスの動作に追従して円の大きさが変化します。


マウスを動かすと色が変化します。


鎖を引っ張って動かします。


クリックするとアニメーションしながら一直線になります。


マウスの動きで変化します。


渦巻き模様がマウスの動きで大きくなったり小さくなったりします。


マウスで適当に引いたラインがスムーズに描かれます。


クリックする度に三角形が増えていきます。


マウスでワイヤーを操ります。


3D空間に描かれたオブジェクトが変化します。


こんなリアルな造形も。


こちらやフレームで描かれています。


時間が経過するごとに色が変わっていきます。


こちらもマウスで絵を描きます。


マウスに追従してオブジェクトが動きます。


オブジェクトをぐりぐり動かせます。


コードです。何とJava(Processing用のコード)がそのまま書かれています。

toxiclibs.jsではCanvasタグにtoxiclibsの内容をそのまま記述して動かしているようです。全ての機能がサポートされている訳ではないと思われますが、それでもProcessing用に書いたコードがそのままWeb上でも動かせるというのはとても面白いです。

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

MOONGIFTはこう見る

何でもJavaScriptという風潮が広がっていますが、それでも実用性を出すためにはさらにもう一二歩速度が改善されないと厳しいかもしれません。とはいえWebブラウザも日々進化しているので、間もなくネイティブアプリに劣らない性能を出せるようになるでしょう。

IEであればActiveXやChromeであればNative Clientなど、Webブラウザとは一歩離れた技術もありますが、やはり本命はJavaScriptによるネイティブに劣らない実行環境の実現でしょう。既存のローカルアプリケーションをWebブラウザ上で実現する、それだけで世の中の注目は十分に集められるでしょう。

Toxiclibs.js - Open-Source Library for Computational Design

hapticdata/toxiclibsjs - GitHub