Example







ウェブ全体から検索 日本語のページを検索 検索オプション | 表示設定 | 言語ツール

Documentation

protoBox2d.jsは物理演算エンジンのBox2DJSを使いやすくしたJavaScript Libraryです。
ややこしい演算の設定はprotoBox2d.jsがすべて吸収しますので、メソッドの呼び出しとHTMLにclass="box2d"を追加するだけで動作します。

必要なライブラリーは以下のとおり。
ただしBox2DJSは30個を超えるファイル数があるため、面倒な方はgist: 92426 - GitHubから圧縮版ダウンロードしてください。
対応ブラウザは以下のとおりです。

サンプルコード

JavaScript

HTML属性のclassに"box2d"が指定された要素をbox2d側のエンジンに知らせます。
以下のコード呼び出しだけで、HTML要素が落下しドラッグすることにより物理的動作を可能にします。

HTML

たとえば↑のExampleの場合は以下のようなHTMLコードになります。
HTMLタグにclass="box2d"を指定してください。

CSS

特にスタイルの縛りはありませんが、box2dで動作させる要素にmarginが含まれていると見えないmargin部分で衝突してしまうため違和感が残る場合があります。

Download