Search the Community

Showing results for tags 'box2d'.

More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


  • HTML5 Game Coding
    • News
    • Game Showcase
    • Coding and Game Design
  • Frameworks
    • Phaser
    • Pixi.js
    • Babylon.js
    • Panda.js
    • melonJS
    • Haxe JS
    • Kiwi.js
  • General
    • General Talk
  • Business
    • Collaborations (un-paid)
    • Jobs (Hiring and Freelance)
    • Services Offered

Found 97 results

  1. Physics bug

    Box2D always calls contact callback twice. Here's an example: Ship with collision category 2 (ship at left) calls contact callback once while ship with collision category 1 (default) calls it twice. I've been trying to fix this for weeks but couldn't find any solution in web, i really need you guys to help me. function create() { game.physics.startSystem(Phaser.Physics.BOX2D); game.stage.backgroundColor = '#2d2d2d'; // User-controlled ship ship1 = game.add.sprite(250, 300, 'ship'); game.physics.box2d.enable(ship1); ship1.body.setCircle(14); // Ship with collision category 2 (triggers contact callback only once, it shouldn't even trigger it) ship2 = game.add.sprite(200, 200, 'ship'); game.physics.box2d.enable(ship2); ship2.body.setCircle(14); ship2.body.setCollisionCategory(2); // Ship with collision category 1 *default, i guess* (triggers contact callback TWICE) ship3 = game.add.sprite(300, 200, 'ship'); game.physics.box2d.enable(ship3); ship3.body.setCircle(14); game.physics.box2d.setBoundsToWorld(true, true, true, true, false); ship1.body.setCategoryContactCallback(1, function(b1,b2,f1,f2,begin){ if (begin){ total += 1; hitText.text = 'Contact callback called '+total+' times'; console.log("CONTACT: ", b2) } }, this); cursors = game.input.keyboard.createCursorKeys(); game.add.text(5, 5, 'Use arrow keys to move.', { fill: '#ffffff', font: '14pt Arial' }); total = 0; hitText = game.add.text(5, 30, 'Contact callback called 0 times', { fill: '#ffffff', font: '14pt Arial' }); } function update() { if (cursors.left.isDown) { ship1.body.rotateLeft(300); } else if (cursors.right.isDown) { ship1.body.rotateRight(300); } else { ship1.body.setZeroRotation(); } if (cursors.up.isDown) { ship1.body.thrust(300); } else if (cursors.down.isDown) { ship1.body.reverse(300); } } function render() { game.debug.box2dWorld(); }
  2. is a fast paced, 2D multiplayer shooter inspired by games like Soldat, Unreal Tournament and N-game. Currently implemented game modes include Capture the Flag and Deathmatch. It uses the Box2D physics engine to enable convincing rigid body simulation. Players can make various moves including backflips, rolls, proning, running, flying and crouching. The game is still under active development and I'm willing to devote a great deal of time to finishing this project. I've made a test server available and you can join it by following these steps: - Go to - Play as Guest - Enter any username and make sure it ends with _dev - Join CTF or Deathmatch. - Select primary and/or secondary weapon Press H to display table of controls. Decrease the size of the browser window in case it runs slow. I've noticed that some laptops and older systems have trouble maintaining adequate fps. It is currently not possible to register a username, but I've been making progress on an account and highscore system. The game server is currently located in Europe. I plan on running additional servers on other continents and for the site to serve as a gateway to the nearest game server when players join in order to minimize latency. Any thoughts, feedback or suggestions would be much appreciated! Thanks.
  3. Hi, Completely new to Phaser but love it. I've purchased and am using the Box2D plugin and have a simple question about the coordinate system. If I create a new game with dimensions width 800 and height 600 like so: var game = new Phaser.Game(800, 600, Phaser.AUTO, 'phaser-example', {preload: preload, create: create, update: update, render: render}); With the following pixels to meter setting: game.physics.box2d.ptmRatio = 100; and create a new Box2D body with a 40 x 20 pixel rectangle fixture (centred on the body) like so: var rect = new Phaser.Physics.Box2D.Body(, null, 400, 0); rect.static = true; rect.addRectangle(40, 20, 20, 10); See the image below: Why is the rectangle not positioned 400 pixels from the left? It looks like it's positioned 200 pixels from the left instead. Is there some scale factor I'm missing here? This is happening on my Retina MacBook Pro and on an external 1920 screen (not Retina). Many thanks in advance,
  4. Hi, I'm creating a game that player can walk over terrains with lots of slopes. How can I make my player rotate accordingly to the angle of the slope? This is how it's currently working: And this is how is must work (I've changed the angle manually): I'm using Box2D plugin to generate the terrain accordingly to an image. That's the reason of all these bodies. Thanks!!
  5. Circular Motion & Gravity

    Hi All, I have implemented planatary gravity using the below link Now i need the object just move over the planet with gravity . How to do it kindly help please ?????????????
  6. Hi I'm working on a top down racing game. Yesterday I decided to buy the box2d plugin for phaser to get collision physics. There is a simple top down racing game included as a tutorial which I tried out and the collision part was good enough for my needs. But the actual driving physics were not because it was more like a spaceship. If you would stop pressing forward the car would continue in current direction until slowed down. But when I turn during this sliding a car should go where the wheels point and not in its current direction like a spaceship. So I decided to add my own driving physics to the demo which makes the car go in the direction of the wheels and instead of activating car.body.thrust(power) on key UP I call my function that ultimately sets car.body.x and car.body.y so it moves correct. The problem is that now I'm not colliding with the walls anymore because the box2d simulation is just getting the coordinates and doesn't move the car any more. I would like to use box2d as much as possible but I couldn't figure out how to make the car not slide like a spaceship and if possible I want to avoid having to create my own collision detection. Any tips on how to approach this?
  7. How to disable distanceJoint box2d Phaser

    hi guys, How can I disable distanceJoint from a created sprite ?? I need to create a game similar to Tower Bloxx, Help Please.
  8. Webgl camera in box2d

    Hello! I am new in Webgl programming, and I am having trubel with moving the camera. I try to create a maze game, and I use three.js and box2D.js. The problem is that the camera is looking from above into the mazze, while I am trying to make it part of the maze (I mean looking like you are trying to escape from the maze). Could anyone, please, help me? I haven't found any ideeas on the web....
  9. Hi everyone, I am making a pinball-like game and there can be more than one ball at once. Is it possible to ignore collision between balls and leave it for some other objects? Many thanks.
  10. Phaser Box2d Bounds are leaving a gap?

    Hi, Does anyone know what can be an issue? I am having a gap on the right and on the bottom with Phaser Box2d.
  11. Using Box2D with PIXI.js

    I am using Box2D physics engine with PIXI.js as the renderer. But I have trouble using it correctly. Box2D is based in MKS(Meters, Kilograms and seconds) But Pixi.js renders everything in pixel. So I need to convert from MKS to pixel when I render sprites/movements. I don't know how to do this properly. I have seen some examples saying I just need to convert the positions using a scale factor in PIXI.js (see this But someone also recommend me to just use stage.scale so that everything in the stage will scale to the particular ratio I choose at the beginning. Anyone has similar experience before? How to render Box2D-based sprites nicely using PIXI.js?
  12. Scaling Box2D sprites and world?

    Hello! I'm new to Phaser and Box2D, but I've looked through as many posts as I could find on scaling box2d and am still struggling to get it working well. I'm trying to scale a bunch of sprites, and on each scale step increase the worldsize as well so that I can reset box2d world bounds. I've gotten the world scaling and the sprites scaling, but the physics bodies stay behind. It looks like this: the sprites are beyond the bounds of the world and they are offset from their box2d bodies. Here's what I've tried - using body.setRectangle() to scale the Box2D rectangle as well. I've also noticed that the sprites are scaling faster than the world and are leaving the world bounds. I've been banging my head against the wall for a while and was hoping someone had some wisdom to share. if (this.cursors.up.isDown) { // An internal function that I use to track world scale. This is working fine this.scaleWorld(1); // Scale all the bodies in the world inside a group called stageGroup this.stageGroup.scale.set(this.worldScale); // Set the world scale & reset bounds;, 0, this.worldSize.width * this.worldScale, this.worldSize.height * this.worldScale); // Reset box2d world bounds; // For all sprites in the sprite group, scale them this.stageGroup.children.forEach(child => { // scale x and y child.position.x = child.position.x * this.worldScale; child.position.y = child.position.y * this.worldScale; // This is what I've tried but it's not working child.body.setRectangle(child.initialSize* this.worldScale, child.initialSize * this.worldScale, 0, 0, 0); }); } Thanks!!
  13. Phaser Box2d Collision Mask and World Bounds

    Trying to convert my project over to Box2d in Phaser and having trouble... Can someone please tell me what I'm doing wrong here? Attached is the example file for World Bounds, I have made some small changes to incorporate collision categories and masks. Everything is working as expected except for the world boundaries. I have been over the docs many times and I think I am doing this as described. Notice how all the collisions are working except for world bounds. TIA world boundstest.html
  14. I have the Box2d plugin, but game.physics.box2d doesn't have autocomplete when I type "game.physics.box2d" in Visual Studio. In phaser.d.ts I see: arcade: Phaser.Physics.Arcade; config: any; game: Phaser.Game; ninja: Phaser.Physics.Ninja; p2: Phaser.Physics.P2; box2d: any; I think it Might be that it thinks game.physics.box2d is any instead of box2d class. How do I get autocomplete?
  15. Box2d

    If I have a custom-player-made drawn image in phaser and I want to make a phyisics body out of it should I use Box2d to set its P2 phyisics body?
  16. I have this error : Uncaught TypeError: c.Physics.Box2D is not a constructor Here is the code
  17. Box2D Painfully Slow Movement

    On certain computers, ones that wouldn't seem like they should lag, movement in my game is slow. When using `game.time.desiredFps = 30;` it also happens. My question is, how can I drop frames instead of making players swim through mud? Instead of looking ugly, it becomes unplayable. I tested this for p2, it also happens with that physics engine.
  18. PhysicsEditor free alt?

    Hey My question is pretty straigh forward, is there any alternative to PhysicsEditor, that is at least Free if not OpenSource. Thanks in advance!
  19. LATEST UPDATE Hi thanks for looking, but I have figured out my issue since posting this question. Here is a codepen with Box2d Phaser physics moving the bottom sprite with a sprite resting on top , and having the top sprite's physics respond - even after it has been inactive or at rest: --------------------------------- New to Phaser JS and trying to build a "simple" game; If you imagine the game brick breaker - just the base and the ball. I want to be able to move the base up and have the ball still sitting on the base. I also want to be able to tilt the base and have the ball "roll" down depending on which side is tilted. Update 2 Here is a codepen of my Box2d Phaser attempt which comes closest to what I'm trying to achieve. If you use the arrow keys immediately to move the base up,down,left, right (while coliding with the box) then physics work as expected. If you wait a few seconds after the box rests on the base, moving the base has no effect on the box; I would like the box to be effected by the base even after the initial wait: Update 1 Using Phaser's default Arcade Physics, I am now able to get the up movement of the base to keep the ball sitting on-top (although there are some brief overlap's that I'd like to keep from happening and not sure how to prevent that at the moment?); I was not able to allow the ball to "roll" down either side while tilting the base. It seems that even though the base is being rotated that the collision area is not being moved and the ball does not know that it needs to "roll" down. Here is an example phaser sanbox with debugging information (move left or right to see the base rotate):
  20. Hullo! Newbie to phaser - please be gentle I've been play with the body-debug-draw ( ) example. The goal is to make a block which is controlled by the user and as such has zero gravity, with other blocks falling on it. I can't figure out how to set gravity for the one item to zero. If I make the object no longer static, it drops off the screen. If I keep it static, I can't move it with the mouse or keys. Suggestions welcome! Edit: Never mind. Silly error on my part. Sorry for the noise
  21. Box2D Bug?

    Some times when leaving my game open or when one player leaves, I get a cryptic box2d error. Is this a bug? It's v102
  22. Strange Flicker with Mobile Canvas

    I have been testing my game on mobile using the chrome remote debugging for Android. With auto/WebGL I was around 48 frames a second. With Canvas close to 59 FPS. Preceived heat was lower as well. One annoying thing is a strange flicker, most notiable on text and buttons. See Gif for example, quality is kinda low, ignore that. Any idea how this could be fixed? It doesn't happen in WebGL
  23. Hello, I'm trying to reuse a tween to simulate resource gathering and delivery between 2 locations. I was able to successfully accomplish that by chaining tweens but I now want to just reuse 1 tween instead of 4. I modified the tween reuse example and wrapped all the tween function into one 1 (tweenAll) and I call it after everything is setup. Now the problem is that the blockSprite is supposed to drop to the beginning of the platform and then go back and forth on the platform, but instead, it goes back to its initial position ( up in the air) at random moments of the tweening. bellow is what the code looks like applied to body-debug-draw var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create, render: render }); function preload() { game.load.image('platform', 'assets/sprites/platform.png'); game.load.image('block', 'assets/sprites/block.png'); } var platformSprite; var blockSprite; var tween; function create() { game.stage.backgroundColor = '#124184'; // Enable Box2D physics game.physics.startSystem(Phaser.Physics.BOX2D); game.physics.box2d.gravity.y = 500; // Static platform platformSprite = game.add.sprite(400, 550, 'platform'); game.physics.box2d.enable(platformSprite); platformSprite.body.static = true; // Dynamic box blockSprite = game.add.sprite(400, 200, 'block'); game.physics.box2d.enable(blockSprite); blockSprite.body.angle = 30; blockSprite.body.kinematic = true tween = game.add.tween(blockSprite.body) tweenAll() } function render() { // Default color is white game.debug.body(platformSprite); // Make falling block more red depending on vertical speed var red = blockSprite.body.velocity.y * 0.5; red = Math.min(Math.max(red, 0), 255); var red = Math.floor(red); var blue = 255 - red; game.debug.body(blockSprite, 'rgb('+red+',0,'+blue+')'); } function tweenAll() { function tween1() { { rotation: 0.5 }, 500, Phaser.Easing.Bounce.Out, true); tween.onComplete.addOnce(tween2, this); } function tween2() { { x: 200, y: platformSprite.y}, 1000, Phaser.Easing.Bounce.Out, true); tween.onComplete.addOnce(tween3, this); } function tween3() { { rotation: -1 }, 500, Phaser.Easing.Bounce.Out, true); tween.onComplete.addOnce(tween4, this); } function tween4() { { x: 600, y: platformSprite.y}, 1000, Phaser.Easing.Bounce.Out, true); tween.onComplete.addOnce(tween1, this); } tween1() } can anyone tell me why is this happening ?
  24. Hello, I'm having some issues with the sprite and physic body being at two different locations, I would like to have them staying together. I used this Phaser example , then added a camera follow and set the bound of the camera to null (for an infinite world). can anyone enlight me as to why this is happening and how to fix that? Thanks var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create, render: render }); function preload() { game.load.image('platform', 'assets/sprites/platform.png'); game.load.image('block', 'assets/sprites/block.png'); } var platformSprite; var blockSprite; function create() { game.stage.backgroundColor = '#124184'; // Enable Box2D physics game.physics.startSystem(Phaser.Physics.BOX2D); game.physics.box2d.gravity.y = 500; // Static platform platformSprite = game.add.sprite(400, 550, 'platform'); game.physics.box2d.enable(platformSprite); platformSprite.body.static = true; // Dynamic box blockSprite = game.add.sprite(400, 200, 'block'); game.physics.box2d.enable(blockSprite); blockSprite.body.angle = 30; blockSprite.body.kinetic = true; game.input.onDown.add(mouseDragStart, this); game.input.addMoveCallback(mouseDragMove, this); game.input.onUp.add(mouseDragEnd, this); = null } function render() { // Default color is white game.debug.body(platformSprite); game.debug.body(platformSprite.body); game.debug.body(blockSprite, 'rgb('+222+',0,'+222+')'); game.debug.cameraInfo(, 500, 32); game.debug.spriteInfo(blockSprite, 32, 32); game.debug.bodyInfo(blockSprite, 32, 132); game.debug.pointer(game.input.mousePointer) game.debug.text("" + 'offset sprite to physic body: '+ blockSprite.body.offset, 2, 14, "#00ff00"); } function mouseDragStart() { game.physics.box2d.mouseDragStart(game.input.mousePointer); } function mouseDragMove() { game.physics.box2d.mouseDragMove(game.input.mousePointer); } function mouseDragEnd() { game.physics.box2d.mouseDragEnd(); }