Anypixel

🚀 AnyPixel.js 紹介

AnyPixel.js はオープンソースのソフトウェアとハードウェアのライブラリで、Web を使って大規模で独特なインタラクティブな表示デバイスを作成することができます。誰でもコードと回路図をフォークして、任意の規模で独自の表示デバイスを作成することができます。

このプラットフォームは、Google NYC オフィスの第8大通りのロビーで初めて使用されました。このインスタレーションを作成するために、5880個の市販のゲームボタンを使用し、各ボタンの内部に LED を配置してピクセルとして利用しました。AnyPixel.js のシンプルで直感的なソフトウェアとハードウェアのフレームワークにより、任意のインタラクティブな表示デバイスを簡単に構築することができます。

✨ 主な機能

含まれる内容

• /hardware - EAGLE の回路図、回路基板レイアウト、CAD ファイル、配線図、青写真が含まれています。
• /firmware - STM32 デバイスファミリー用に書かれたマイクロコントローラーのコードです。
• /backend - ハードウェアと通信するための Node.js と Chrome アプリケーションです。
• /frontend - ブラウザ上のアプリケーションフレームワーク、プレビューア、および Google の社員や世界中の友人たちによって書かれた12個のサンプルアプリケーションが含まれています。

🚀 クイックスタート

サンプルの確認

第8大通りのニューヨーク展示ホールの表示デバイス用に、Google の社員や他の人たちによって書かれた12個のサンプルアプリケーションが含まれています。これらを確認するには、プレビューア をインストールし、サンプル の1つを実行してください。

独自のアプリケーションの作成

AnyPixel フレームワークを使って独自のアプリケーションを作成するのは簡単です。始めるには、フレームワークのドキュメント と サンプルアプリケーション を参照してください。

var anypixel = require('anypixel'); 
var ctx = anypixel.canvas.getContext2D();

var colors = ['#F00', '#0F0', '#00F'];

/**  
 * ボタンが押されたイベントを監視し、イベントの位置に2x2の矩形を描画します。
 */
document.addEventListener('onButtonDown', function(event) {   
	ctx.fillStyle = colors[Math.floor(Math.random() * colors.length)];
	ctx.fillRect(event.detail.x - 1, event.detail.y - 1, 2, 2);
}); 

🤝 貢献者

• Jeremy Abel
• Kyle Phillips
• Nick Fox-Gieg
• Jeramy Morrill
• Manny Tan
• Felix Woitzel
• Anders Hoff
• Dimitry Bentsionov
• Nick Stahlnecker

⚠️ 注意事項

サードパーティのディレクトリには、異なる（Apache 2.0 以外の）ライセンスが適用される場合があります。