/ / Použitie KineticJS spolu s box2dweb - javascript, html5, kineticjs, box2dweb

Používanie KineticJS spolu s box2dweb - javascript, html5, kineticjs, box2dweb

Ako môžem používať kineticJS spolu s box2dweb takže môžem zistiť kolíziu? Ako napríklad môžem okolo kruhu vykresleného okolo kinetickej JS vytvoriť kruhovú hranicu a aplikovať fyziku cez box2dweb?

Existujú nejaké dobré návody na tento alebo nejaké kódy, ktoré mi môžu pomôcť? Alebo existuje nejaký efektívny spôsob, ako dokážem detekovať kolíziu so samotnou kineticJS?

odpovede:

9 pre odpoveď č. 1

Čo robíte, je:

  1. Vytvorte „svet“ box2d - premýšľajte o svete ako o miestnosti na Zemi (alebo akejkoľvek inej planéte)

  2. Pridajte do sveta „telá“ - telá sú pohyblivé alebo stacionárne objekty, ktoré sa správajú podľa fyziky, ktorú ste im priradili.

  3. Každému telu box2d priraďte „kožu“ kinetického J - vzhľady sú „peknými“ tvarovými objektmi kinetického J, ktoré budú na plátno vykresľované kineticJs. Napríklad v hre môže byť kožou futbalový loptu.

  4. Dajte svetu box2d do pohybu a počúvajteudalosť „tick“ box2d - udalosť tick sa spustí, keď box2d zistí fyziku, ktorá sa vyskytla počas zadaného času. V tomto bode box2d pozná polohu a rotáciu každého tela box2d vo svete box2d.

  5. V prípade začiarknutia políčka box2d skontrolujte polohu / rotáciu každého tela box2d a nakreslite kožu kinetickej J v rovnakej polohe / rotácii na box2dbody.

Veľmi dobrý príklad je na: http://www.luxanimals.com/blog/article/combining_easel_box2d

Tento príklad používa easelJs na kreslenie na plátne, ale konverzia do knižnice kineticJs je veľmi jednoduchá - presný platia rovnaké pojmy.

[upravené na poskytnutie ďalších informácií]

Tiež, ak nepotrebujete všetku fyziku v box2d, tu je veľmi jednoduchý kolízny test s dvoma kruhmi pomocou kineticJs.

function CirclesAreColliding(circle1,circle2){
var dx = circle2.getX() - circle1.getX();
var dy = circle2.getY() - circle1.getY();
if( Math.sqrt( dx*dx + dy*dy ) <= ( circle1.getRadius() + circle2.getRadius() ) {
return true;
}
return false;
}

1 pre odpoveď č. 2

toto je návod. veľa štastia http://www.codeproject.com/Articles/571743/Box2D-and-JavaScript-Part-3