Search the Community

Showing results for tags 'p2'.

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 295 results

  1. Hi all, I'm working on a little racing game and using this map: I'm using p2 physics. Whenever the car touches the gras it should become slower. In order to achieve that I cut out the inner gras and created a polygon shape for it. /*Adding car*/ car = game.add.sprite(1100,300,'car');"car"; car.width=100; car.height=175; game.physics.p2.enable(car); car.body.angle = 90;; inner_gras = game.add.sprite(1320, 940, 'gras'); game.physics.p2.enable(inner_gras); inner_gras.body.kinematic = true; inner_gras.body.clearShapes(); inner_gras.body.loadPolygon('collision', 'inner_gras');"inner_gras"; For the collision detection I use game.physics.p2.setPostBroadphaseCallback(): game.physics.p2.setPostBroadphaseCallback(hitGras, this); function hitGras(body1,body2){ if(( === "inner_gras" && === "car") ||( === "car" && === "inner_gras")){ console.log(body1);//console.log(body2.sprite); return true; } else{ return false; } } The collision detection works fine, but whenever I try to do something else than returning true, for example changing the speed or something else, a contact between the car and the inner_gras sprite is detected, where they shouldn't have any contact. It seems like the inner_gras sprite does still have the rectangular shape, although applying clearShapes(). Any ideas or suggestions on how to solve this problem, or what to use instead? Thanks in advance!
  2. Hello! I am the P2 physics. I have a sprite scaled. My problem is that the polygon loaded to the sprite does not scale with it. It is possible to scale the polygon?
  3. Hello, everybody! As usually, I'm a newbie in Phaser and JS (and English, as well) :-) Now I'm trying to achieve this approach in Phaser-CE 2.7.8. Slow spinning wheel (actually N-gon, with 12 sides for now) shuffling bunch of balls (30-50) inside of it. When the hole on the wheel's edge reaches some bottom point one ball must fall out (random bal, with random number on it, got from the server. I don't know yet how much sides the wheel will be, and to apply same polygon to p2.body.polygon I put all the points into array (lines).Next I rearrange lines and it's directions to form "seamless polygon": end point of one line is start point of next line. And here I faced first problem: last line not drawn (top left green line). This poly drawn at line 85. But in the console log i can see that line coords! Second problem: adding sprite converted from graphics (via generateTexture()) and putting at specified coords work well, but if I uncomment sprite.body.addPoligon at line 93, sprite moved across X and Y axis, looks little thicker, and body(.addPolygon) not collinear with a sprite! May be I'm completely wrong and that wheel can be made much easier? Here is my code:
  4. /** * Takes the collision data defined in the collision editor of Tiled and applies it to * and exisiting tilemap for use with P2 physics bodies. * * Tilemap json data MUST be loaded in the Preload state/function using game.load.json() before this function is called * map must only have ONE tileset * each tile can only have ONE polyline set for it's collision * the polyline MUST be a complete shape (the last point is indentical to the first) * * @param {Phaser.Tilemap} map - this is the map which you want polylines added to * @param {string} key - this is the key for the raw json tilemap data loaded in the preload state * @param {bool} [roundValues=true] - Will round the x,y coordinates for the polylines to nearest integer */ addPolylineCollision: function (map, key, roundValues) { if (roundValues === undefined) { roundValues = true; } // json with the collision data that was omitted by phaser let data =; //console.log(data); let collisionData = data.tilesets[0].tiles; // array of the collision polygons that will get added to the tilemap var polygons = []; // tiles in the Collision Layer that will help define the polygons let mapData = map.layers[map.getLayer('Collision Layer')].data; for (let row in mapData) { for (let col in mapData[row]) { var wall = collisionData[mapData[row][col].index - 1]; if (wall !== undefined) { for (let i in wall.objectgroup.objects) { let poly = { height: 0, name: "", polyline: [], properties: undefined, type: "", visible: true, width: 0, x: mapData[row][col].x * map.tileWidth, y: mapData[row][col].y * map.tileHeight }; for (let j in wall.objectgroup.objects[i].polyline) { var coords = [wall.objectgroup.objects[i].polyline[j].x, wall.objectgroup.objects[i].polyline[j].y]; if (roundValues) { coords[0] = Math.round(coords[0]); coords[1] = Math.round(coords[1]); } poly.polyline.push(coords); } polygons.push(poly); } } } } console.log(polygons); map.collision['Collision Layer'] = polygons; } I'm writing a function to support Tiled's Collision editor and P2 physics. Everything seems fine but the values for all the polygons I defined get mangled to the same values. I thought it was a scope issue but nothing seems to work: pic: (Links to an external site.)Links to an external site. paste: (Links to an external site.)Links to an external site. By the time execution reaches line 57, the console.log call, all the values in the polyline arrays are totally messed up, they're set to values between -1 and 1, and are always set to the same values every time. At every other previous point in this functions lifetime everything works exactly as expected.
  5. Hi, I loaded my tiles with game.physics.p2.convertTilemap() and it works. However, each tile is a square block and my "player" is floating on slanted tiles (similer to problem mentioned in here). Using Tiled editor's "Tile Collision Editor", i defined the polygon I want but Phaser does not seem to pick it up. Part of the exported JSON looks like this (tells me that the polyline was created): "tilesets":[ { "firstgid":1, "image":"tiles.png", "imageheight":374, "imagewidth":374, "margin":0, "name":"tiles", "properties": { }, "spacing":2, "tileheight":32, "tiles": { "57": { "objectgroup": { "draworder":"index", "height":0, "name":"", "objects":[ { "height":0, "name":"", "polyline":[ { "x":0, "y":0 }, { "x":32, "y":-32 }], "properties": { }, "rotation":0, "type":"", "visible":true, "width":0, "x":0, "y":32 }], "opacity":1, "type":"objectgroup", "visible":true, "width":0, "x":0, "y":0 } } }, "tilewidth":32 }, { "firstgid":122, "image":"items.png", "imageheight":270, "imagewidth":270, "margin":0, "name":"items", "properties": { }, "spacing":2, "tileheight":32, "tilewidth":32 }, { "firstgid":186, "image":"sprites.png", "imageheight":100, "imagewidth":238, "margin":0, "name":"sprites", "properties": { }, "spacing":2, "tileheight":32, "tilewidth":32 }]How do I load the tile's collision polyline/polygon in Phaser when loading the tiled layer?
  6. I have a "bouncy" ball that will hit a fixed world surface and act as you would expect. However, when the world moves upward to the ball, the bouncing slows and if the world is moving fast enough, the bouncing stops completely and the ball "hugs" the world surface. What I'd like to happen is to transfer the upward velocity of the world to the ball. So if the ball is falling and the world is moving up, I want the ball to act as if it has been hit by a swinging baseball bat. Right now, the ball acts as if it has been contacted by a magnet. I just can't seem to find the right properties to make this type of collision happen. Thanks! And thank you to all who have asked and answered the many questions I had while I was building my game. Such a great resource!
  7. Hi, I want to make a pinball game with phaser and p2 js physics. I have a probleme with flips. To make the rotation movement, i must to change anchor to 0,0 with : this.flipGauche.anchor.set(0); but with this the sprite the anchor'sprite change but no the body
  8. overlap

    How can I check if two sprite are overlapping or not at a given moment if both of them has special shape with loadpolygon? (eg. crosshairs rectangle vs. enemy on a click) Do I need to use P2? Maybe the solution is obvious, but I am absolutely beginner in Phaser.
  9. Is there a way to get collisions to work with p2, or to go through the list of active bullets and get thier x and y location, Or what do I loose if I switch from p2 to arcade. Thanks
  10. Hi All, I have just uploaded my new game Quick Pinball. It is classic pinball game. I used Phaser P2 Physics and Cocoon for wrapper. Here is the link: I hope you like the game
  11. How to use P2 Physics with each layer object? Code this.saws =; this.saws.enableBody = true;'saws', 4, 'saw', 0, true, false, this.saws); this.saws.forEach(function(saw) { saw.body.clearShapes(); saw.body.loadPolygon('physicsData', 'saw'); });
  12. Check out our new tutorial, Phaser Cars & Trucks with P2: We will cover constraining wheels to the truck body, increasing wheel grip, and creating a bouncy chassis effect that is seen in many popular games today. See what you will learn to create:
  13. Our new tool, Loon Physics, has just been released to open beta for free! Try it now to export P2 Physics body polygons for Phaser. Use a URL to test live without exporting files. Use Loon Physics here: Learn how to make a game with P2 Physics using this brand new tutorial:
  14. Hello, In the tiled map editor is a tilecollision editor i was just wondering if there is any way to get the stuff u do in there to work in phaser, or any other way to set a specific collision polygon to a tile.
  15. I'm working on a Pachinko-like game and have a question about physics. I'm new to Phaser, so if this is an obvious answer, sorry! I have a star-shaped pin wheel thing. I need it to be stationary but rotate around its anchor point when hit by an object (based on physics). How would I go about making it stationary, but allowing it to be rotated based on objects colliding with it? (I know how to get the polygon collision using the Physics Editor, I'm just not sure about the rotation part). Any help will be greatly appreciated! Thanks.
  16. Loon Ride, the epic loon game, has received major updates on all platforms! Collect loons, shoot cacti, and soar through endless mode. This game was made using Phaser. Read more about the game here: Play the game in your browser here: Get the game on Google Play here: Promo video:
  17. We recently released a tool for editing P2 Phyics body polygons called Loon Physics. Check it out here: Read a tutorial about P2 Physics bodies and Loon Physics here: Do you find Loon Physics useful? Do you encounter any bugs when using the tool? Any suggestions?
  18. hi, i'm coding a pinball game in js with phaser and p2physics. I search how i can do rotation with a anchor point. I want create the rotation for the flipper but method rotateLeft or rotateRight do the rotation by the center's sprites. I want create a rotation around topleft and top right point of the sprite to do a flipper movement. orry for my bad english, thx.
  19. I made an example of how you can mimic a skeleton/bodyparts using LockConstraints in P2 physics. I thought it might be useful to share it/ add to the Phaser examples , for people looking for ways to use joints/ lock constraints in their game. here is the example: The sprites I used are from my own game, but you could very well replace it with any other sprites... In the code I also explained how it works.
  20. Hello guys I'm making a platformer game, I struggled with making collision between the player and objects created in tiled but after that I got it working with a function I created, however, when I make the rectangle rotated in tiled, in the game it comes out away from its position, take a look: this is on tiled in the game it comes out like this here is my code, createCollisionObjects is where the magic happens var game = new Phaser.Game(70 * 10, 70 * 7, Phaser.AUTO, 'game', { preload: preload, create: create, update: update, render: render }); function preload() { // tilemap game.load.tilemap( 'map', 'assets/tilemaps/maps/lvl-1.json', null, Phaser.Tilemap.TILED_JSON ); // tilemap images game.load.image('new', 'assets/tilemaps/tiles/new.png'); game.load.image('sheet', 'assets/tilemaps/tiles/sheet.png'); game.load.image('s9af', 'assets/tilemaps/tiles/s9af.png'); // player spritesheet game.load.atlasJSONHash( 'player', 'assets/spritesheets/player_walk.png', 'assets/spritesheets/player_walk.json' ); } /* * GLOBAL VARIABLES */ var map; var player; var playerSpeed = 400; var jumpTimer = 0; function create() { game.physics.startSystem(Phaser.Physics.P2JS); game.physics.p2.setBoundsToWorld(true, true, true, true, false); game.physics.p2.gravity.y = 300; game.physics.p2.restitution = 0; game.stage.backgroundColor = '#ffffff'; map = createMap().map; var start = map.objects.objective[0]; player = createPlayer({x: start.x, y: start.y}); cursors = game.input.keyboard.createCursorKeys(); } function update() { player.body.setZeroVelocity(); if (cursors.up.isDown && > jumpTimer && checkIfCanJump()) { player.body.velocity.y = 600; jumpTimer = + 750; } if(cursors.left.isDown) { player.body.velocity.x = -playerSpeed;'walk'); } else if (cursors.right.isDown) { player.body.velocity.x = playerSpeed;'walk'); } else { player.body.velocity.x = 0; player.animations.stop(); player.frame = 0; }; } function render() { } function createMap() { var m, g, f, b, c; m = game.add.tilemap('map'); var mWidth = m.widthInPixels; var mHeight = m.heightInPixels;, 0, mWidth, mHeight); m.addTilesetImage('sheet', 'sheet'); m.addTilesetImage('new', 'new'); m.addTilesetImage('s9af', 's9af'); g = m.createLayer('ground'); f = m.createLayer('fringe'); b = m.createLayer('background'); g.resizeWorld(); f.resizeWorld(); b.resizeWorld(); createCollisionObject(m.objects.objects); return { map: m, ground: g, fringe: f }; } function createPlayer(pos) { var p = game.add.sprite(pos.x, pos.y, 'player', 'Symbol 2 instance 10000'); //p.scale.setTo(0.4, 0.4); game.physics.p2.enable(p); p.body.setZeroDamping(); p.body.fixedRotation = true; p.body.x+=p.width/2; p.body.y+=p.height/2; // animation p.animations.add( 'walk', Phaser.Animation.generateFrameNames('Symbol 2 instance 1000', 0, 7, '', 1), 10, true, false); //'walk-left'); return p; } function createCollisionObject(objects) { if (objects) { for(var i=0; i < objects.length; i++) { var p2 = game.physics.p2; var obj = objects[i]; var sprite = game.add.sprite(obj.x, obj.y, null); sprite.width = obj.width; sprite.height = obj.height; sprite.angle = obj.rotation; game.physics.p2.enable(sprite, false); sprite.body.x = sprite.x + sprite.width / 2; sprite.body.y = sprite.y + sprite.height / 2; sprite.body.rotation = obj.rotation; sprite.body.static = true; sprite.body.debug = true; } } } function checkIfCanJump() { var yAxis = p2.vec2.fromValues(0, 1); var result = false; for (var i = 0; i <; i++) { var c =[i]; if (c.bodyA === || c.bodyB === { var d =, yAxis); // Normal dot Y-axis if (c.bodyA === d *= -1; if (d > 0.5) result = true; } } return result; }
  21. Hi, I am getting some unwanted behaviour with groups and p2 physics. When the sprites is leaving the screen, I want to kill them and reset new ones. But when I kill the first one, and reset a new one, the physics goes haywire. Anyone got a suggestion on how to fix this? Check this pen for an example:
  22. I need to check if one object (Sprite/p2 body/shape) contains another object. In p2 documentation I found only Contact event, but I need to know when body inside sensor or other area. In Phaser I found Phaser.rectangle.containsRect, this is what I need but Rectangle do not support rotation as I understand. So fail (( With AS3 and Nape I did it this way: if(Geom.contains(outShape, inShape)){.....} How I can do it in Phaser and/or p2 physics ?
  23. Hi to you all. Hi have a question. I'm making a platformer game using phaser and , for now, arcade physics. I make my level in Tiled and export them in JSON. I noticed that since Tiled work with png tileset and that tiles are square. My character do not detect a slope or slante corner. It stands on a invisible cube border. What i was wondering is, is it possible for phaser to detect slanted slope using arcade or should i move to P2JS. Also how do I tell phaser to ignore the transparent part and collide only with the image? I tried making object layer coutouring all the platform for a more precise collision but it seems i'm not able to create a collision layer with a Tiled object layer. or maybe i'm doing it wrong. function create() { map = game.add.tilemap('niveau2'); map.addTilesetImage('tileset','background'); map.addTilesetImage('hints','hints'); backgroundLayer = map.createLayer('background'); collisionLayer = map.objects.evenement.find( o => == 'platform'); collisionLayer.visible = false; console.log(collisionLayer); map.setCollisionByExclusion([],true,collisionLayer); collisionLayer.resizeWorld(); //map.setCollision(1) player = game.add.sprite(32, - 150, 'star'); game.physics.arcade.enable(player); player.body.collideWorldBounds = true; player.body.gravity.y=10050; // Our controls. cursors = game.input.keyboard.createCursorKeys(); } function update() { game.physics.arcade.collide(player, collisionLayer); //more code }
  24. Hi, 1 month ago, I started looking into physics coz I've wanted to make a pinball game (I own 5 real games and am a bit of Pinball freak). So I started looking at physics, which I never had used before (I made some other Phaser games before) Anyway, P2 seemed good enough and I also found this demo by forum member george : So I worked from that and I now have this : Still a work in progress, but It plays quite nicely I think.. What I would like to add is *active* elements that not just bounce the ball back, but kick it back when hit. I can register a hit and then need the bumpers and slingshots to kick the ball away (on top of the bounce) What would be the best way to achieve this ? I tried using body,reverse but that is producing strange effects.. I can think of these options : always apply the same restitution value for bumpers and slingshots (so not dependent on speed of ball) - but that's probably not possible create a virtual kicker using P2 that kicks the ball (seems pretty hard to do for a bumper because it's a circle that can be hit from any direction) create a reverse force for the pinball Anyone has any ideas or pointers ? Besides this - would box2d be better for pinball then P2 ? thanks for any input or feedback.
  25. Hi guys! I'd like to make a computer object in my game, such that when player approches to the computer,it triggers onEnter callback ( where I can for example show a message on screen to press certain key ) and when player goes away it triggers onLeave callback ( where I can hide the message ). In order to achieve that I need two colliders, one for regular collision ( red one ), and the other to detect if the player entered computer's zone ( green one, this is the one that I want to trigger callback ). = 9 * TILE_WIDTH + COMPUTER_WIDTH / 2, TILE_HEIGHT + COMPUTER_HEIGHT / 2, 'computer' ); ); = true; TILE_WIDTH, TILE_HEIGHT, COMPUTER_WIDTH / 2, COMPUTER_HEIGHT / 2 ); this.computersCollisionGroup = ); this.playerCollisionGroup, () => console.log( 'player in range' ) ); this.player.body.collides( this.computersCollisionGroup ); My question is: How do I turn off physical collision in green collider and what to do to make green collider trigger onEnter and onLeave callbacks ?