I have a sprite with Phaser.Physics.P2 enabled, using a custom shape loaded with loadPolygon() from a .json file. I have also activated its debug and debugBody properties, so I can see the custom shape:

as shown here

How could I collect the shape data information when I click on the debug shape?

For example, if I were to click the head of the sprite, can I get the polygon information from the click event?


1 Answer 1


You could take a look at how phaser debug works: https://github.com/photonstorm/phaser/blob/v2.4.2/src/physics/p2/BodyDebug.js

On line 90 you have the 'draw' function that shows you how phaser draw the shapes.

If you take a look at the last part of the function you can have a way to get the verts of the polygons of each shape:

verts = [];
vrot = p2.vec2.create();

for (j = _j = 0, _ref1 = child.vertices.length; 0 <= _ref1 ? _j < _ref1 : _j > _ref1; j = 0 <= _ref1 ? ++_j : --_j)
    v = child.vertices[j];
    p2.vec2.rotate(vrot, v, angle);
    verts.push([(vrot[0] + offset[0]) * this.ppu, -(vrot[1] + offset[1]) * this.ppu]);

this.drawConvex(sprite, verts, child.triangles, lineColor, color, lw, this.settings.debugPolygons, [offset[0] * this.ppu, -offset[1] * this.ppu]);

So what you can do is, on click event, get the X and Y of the click and then, create a polygon for each shape (modifying the code from above) and for each polygon, check if it contains the position of the click.


You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .