問題タブ [box2dweb]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
0 に答える
322 参照

javascript - Box2D b2.ContactListener の奇妙さ

Jonas Wagner のJS Box2D ポートを使用しており、形状のユーザーデータに関する奇妙な問題に遭遇しています。オブジェクトがいつ固い地面にあるかを判断するために、衝突形状とセカンダリの「足」センサー形状を持つようにエンティティをセットアップしました。定義は次のようになります。

ここでのアイデアは、フット センサーがエンティティとの衝突を停止したことを検出できるということです。すべてが期待どおりに機能しており、オブジェクトがフット センサーと衝突しなくなったときに、b2.ContactListener が正しく報告しています。問題は、足の形状に割り当てている userData が正しく報告されていないことです。

以下に示すように、b2.ContactListener の Remove コールバックで返されたポイント オブジェクトには、m_userData 属性が「feet」に設定された形状 (shape2) が含まれていることが明らかです。ただし、shape2 オブジェクトをクエリすると、m_userData が null として直接報告されます。

以下に示す console.log を実行する Safari のデバッグ コンソールのスクリーンショットを含めました。何が起きてる?!

ここに画像の説明を入力

0 投票する
1 に答える
231 参照

javascript - Box2DWeb-GetBody()が機能しない

フィクスチャの本体を取得する必要がありますが、fixture.GetBody()関数を呼び出すと、次のエラーが返されます。オブジェクト#にはメソッド'GetBody'がありません。

コードは次のとおりです。

var bodyDef = new b2BodyDef;

提案をありがとう。

0 投票する
2 に答える
5026 参照

box2d - box2djs のスプリング効果

box2djsを使ってスプリング効果をシミュレートしたい。多くの検索の後、そのdistancejointを使用できることがわかりました(わかりません)。次のコードを試しましたが、体の間に関節がありません。

何か案が...

ありがとう

0 投票する
2 に答える
1276 参照

javascript - box2dweb とともに KineticJS を使用する

衝突検出を可能にするために、どうすれば kineticJS を box2dweb と一緒に使用できますか? 同様に、どうすれば kineticJS でレンダリングされた画像の周りに円形の境界を配置し、box2dweb で物理学を適用できますか?

これに関する良いチュートリアルや、私を助けることができるコードはありますか? または、kineticJS 自体で衝突検出を行う効率的な方法はありますか?

0 投票する
0 に答える
193 参照

box2dweb - Box2DWeb 本体と固定具を破壊する

ボディとフィクスチャのリストを作成しました。すべて正常に動作しますが、何らかの理由でオブジェクトを削除できません。これが私のコードです (「id」は、ボディとフィクスチャにリンクされている div の ID です。その情報は本体とフィクスチャのデータを保持): HEEEELLPPPPP!!!

0 投票する
1 に答える
673 参照

box2d - ウィンドウのサイズ変更でワールド境界を変更する

私は Box2D を初めて使用し、Box2DWeb と共に EaselJS を使用する最初のプロジェクトに取り組んでいます。世界の壁と床を構成する標準の静的形状を、サイズ変更時にブラウザー ウィンドウと共に移動/更新することを望んでいます。私はそれを達成するために SetPosition を使用しています。これは、Easel の tick メソッドを実行するたびに呼び出されます。ほとんど機能しています。ブラウザーを大きくすると、すべてが期待どおりに機能します。床が下がり、それに応じて動的オブジェクトが下がります。

ただし、ブラウザーが小さくされると、シーン内のボディは、静的な床のボディを突き抜けて消えてしまうことがよくあります。問題のダイナミック ボディが一時的にウィンドウ ビューの外に出てしまうほどサイズ変更が重要な場合にのみ発生するようです (たとえば、高さを下げるとブラウザ ペインの下に完全に移動します)。ただし、ブラウザのサイズをかなりゆっくりと変更すると...奇妙なことに、機能します。

私の問題に対する良い解決策は思い浮かびません。また、ウェブ上で動作の例を見つけることができませんでした。それはできますか?ご協力いただきありがとうございます。

リー:

まったく - 返信ありがとうございます。これは backbone.js プロジェクトです。例はここで見ることができます:

http://kensonger.com/b2dweb/

基本的なウィンドウ サイズ変更リスナーは、ファイルの下部にあります。

/b2dweb/js/routers/Main.js

... app.box2d を参照します。これがバックボーン ビューです。

/b2dweb/js/views/Box2DView.js

「onStageResize」メソッドは、ワールド境界を配置しています。このクラスの一番下にある update メソッドは、/b2dweb/js/routers/Main.js の tick メソッドを介して 45/sec と呼ばれます。

作業全体の zip がここに圧縮されています。

http://kensonger.com/b2dweb/box2d_experiment.zip

ブラウザ ペインのサイズをすばやく上向きに変更し、次に下向きにすばやく変更すると、box2d/easel オブジェクトが床を通過するのがわかります。下方向にサイズ変更しないと、オブジェクトは通り抜けて消えてしまいます。ただし、そうすると、床がもう一度通過し、落下物をキャッチします。

繰り返しますが、洞察に感謝します-大歓迎です。

0 投票する
1 に答える
1942 参照

html5-canvas - AndroidブラウザでBox2DJS物理エンジンを使用してオブジェクトを移動する際のパフォーマンスの遅れを解決するにはどうすればよいですか?

Box2D jsフレームワークを使用して、AndroidおよびiPhoneプラットフォームを対象としたHTML5-Canvasベースのクロスプラットフォームゲームの開発を計画しています。私のゲームにはいくつかの優れた物理的な動きが含まれているため、Box2D JS(http://box2d-js.sourceforge.net/)を選択しました。

そこで、最近、Androidフォン/AndroidタブレットでBox2DHTMLの例(http://box2d-javascript-fun.appspot.com/ )をいくつか実行しました。基本的な物理学の動きを実行している間、私はこれらのページのパフォーマンスが低いと本当に感じました。

誰かがそれを解決する方法を提案できますか?

Box2Dのような物理学の動きを適用したに違いない優れたパフォーマンスを提供できる他のエンジンを誰かが提案できますか?

PS:私のAndroidタブレットには、1GHzのプロセッサと512MBのRAMが搭載されています。私がページの上を走っている間、ほぼ240MBは無料でした。

0 投票する
4 に答える
163 参照

javascript - js スコープと外部クラスに関する疑問

私はjsでoopするのが初めてです。私は Box2dWeb を使用して HTML5 ゲームに取り組んでおり、完全に oop ベースにする必要があると判断しました。そこで、このような物理クラスを別のファイルに作成しましたphysics.js

これで、ゲームの物理、グラフィック、アセットなどをすべて初期化するメインgame.jsファイルができました。内容は次のとおりです。

このファイルは、物理オブジェクトを問題なく初期化します。最終的にこれが私が欲しいものです。すごい!しかし、これ以前のファイルはこのようなもので、init()機能はありませんでした。

これは明らかにエラーを投げましたUncaught TypeError: Cannot call method 'getContext' of null。これは、私が呼び出さなくても、物理コンストラクターが呼び出されていたことを意味します (そして当然element、この時点では null でした)。それはどのように可能でしたか?私の自己実行関数は、オブジェクトを正しくgame.js初期化する必要がありましたか? Physics私は何が欠けていますか?

0 投票する
0 に答える
71 参照

javascript - Box2dweb と CreateJS でジョイント (Distance,Revolute..) を作成する

CreateJS での Box2dweb の使用に関するこのクールなチュートリアルを見つけましたhttp://gotoandlearn.com/play.php?id=176 私はジョイントを作成しようとしていますが、うまくいきません。

0 投票する
1 に答える
387 参照

javascript - 迅速な位置変更のための IE10 遅延レンダリング

Canvas ではなくページ上の要素を使用してレンダリングする box2djs 用のレンダリング エンジンを作成しています。これは、Canvas に同じ効果を実装するよりも、要素のスタイルを設定して操作する方がはるかに簡単だからです。

とにかく、Chrome(いつものように最高)は常に60fpsで完璧にレンダリングします.IE10は、多くの要素(私のマシンでは約20以上)を処理すると遅れ始めます.

問題は、IE10 が WebKit Sunspider で V8 (Chrome の JS エンジン) を打ち負かすことです。そのため、Chrome よりも IE10 の方が遅れる理由がわかりません。

Chromeの方が速いのに、IE10が遅れ始めるのはなぜですか?

私の唯一の推測は、IE10 はページのレンダリングが遅く、それほど多くの再描画 (1 秒間に 60 回) を処理できないということです。

これが私のレンダリングコードです:

JS

box2d に慣れていない場合、この関数は各形状に対してdrawWorld()呼び出さdrawWorld()れ、各ティックで呼び出されます。ティックを 1000/60 ミリ秒、つまり 1 秒あたり 60 フレームに設定しています。