Search the Community

Showing results for tags 'offset'.

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

  1. Hi, I was wondering if someone had experienced slight differences in "offsets" using sprite2D texture and wether it might be related to caching. As an example I have a fairly small texture of 16*16 here in svg, but i tried also using png, same problem. That's the begining of the sprite texture zoomed in 4800% When using it in chrome with a code like this: const crossSheet = taskObject.cloneAssetIntoScene(R.get.crossSheet, scene) crossSheet.hasAlpha = false const cross = new BABYLON.Sprite2D(crossSheet, { parent: canvas, id: 'cross', marginAlignment: 'v: center, h: center', spriteSize: new BABYLON.Size(16, 16), spriteLocation: new BABYLON.Vector2(0, 0), }) cross.spriteFrame = R.get.cross_predict The texture is at the center of the screen here, in chrome the top misses 0.5px In Safari there is a difference in colors and width of strokes: If now I am using a 16,17 sprite size i get a correct sprite in chrome: But somehow it is seems worst in safari: Any clue ? Do you think it is related to the caching strategy ? @Nockawa Here is the link to the texture: Here is a playground, on the playground it is the BOTTOM 0.5px that get cutoff..
  2. Is there any way to get the absolute position of a sprite? I have a group holding several sprites and I want to move one of them. The group will be moved as a whole. The sprite's position is relative to the group, but I would like the position relative to the world, or more precisely, relative to the activePointer. I have tried using physics.arcade methods, such as angleToPointer, but those methods do not take inte account the object's offset, that is its parents' positions (the group's position). Is there any way built into Phaser to accomplish this? Or do I need to iterate over all parents and calculate the absolute position in my own function?
  3. Hello, I've got this issue and I'm not able to find any answers. I have 2 images - background and a soft edged circle for a mask. Background stays in same place, but the circle should be able to move. As far as I understand I can send mask coordinates when using alphaMask(source, mask, sourceRect, maskRect) by sending maskRect settings, but if I create rectangle (var rect2 = new Phaser.Rectangle(200, 200, 300, 300);) before applying alphaMask, the mask doesn't work. How can I send maskRect options? Or I should approach this somehow differently? Current code I have: var bmd = game.make.bitmapData(2141, 800); bmd.alphaMask('BG_Dark', 'Mask'); game.add.image(0, 0, bmd); Now it simply places both the BG and Mask at 0,0. But I need the mask to be, for example, at 300,300;
  4. View the jsfiddle demonstrating the issue (just click and drag the circle - relevant code on line 102). When I add a circle to the stage with Pixi.Graphics and drawCircle( 150, 100, 50 ), the circle when dragged becomes offset by it's position ( +150, +100 ) in the Graphics container. (and if we request the circle.position it's also inaccurate) What's the best way to add a shape to the screen and set it's position if it's not through a Graphics container?
  5. Hola hola, So I am working on a 2D basketball game. I am using 2 small sprites (with circular physics bodies) on each side of the basket rim for collision detection with the ball. I parented the 2 sprites to the backboard so I could move them all together (as shown in the child sprite example). I turned on the debug draw for the physics bodies and found the 2 bodies were not in the same position as the sprites. //Load net sprite =, 200, 'net');; //Add hoop children markers this.leftMarker =, 60, 'marker')); this.leftMarker.anchor.setTo(0.5); this.rightMarker =, 60, 'marker')); this.rightMarker.anchor.setTo(0.5); I parent them like so.. but my physics bodies don't act as if they are parented. They should be at the same position as the sprite, but instead they are (-66, 60) and (66, 60) from the top left corner (0, 0) instead of (-66, 60) and (66, 60) from the parents position (world center x, 200). You can see the attached image as an example. Is there something I am missing? Is this the way it's supposed to be? Can I somehow update the physics bodies to line up with the sprites easily?
  6. Hi, I'm new to phaser. I'm trying to make a very simple game where you must avoid collisions. I started with Arcade Physics and I managed to make everything I wanted easily. But then I added complex characters and I needed more than a rectangle body to have accurate collisions. So I switched to P2 Physics and found out how to set my character's body as a polygon : player = game.add.sprite(0, 0, 'character')game.physics.p2.enable(player, true)player.body.clearShapes()player.body.addPolygon({}, [[0, -50], [-50, 0], [0, 50], [50, 0]])Which results in That's pretty cool, but I can't create a polygon that will perfectly fit my character since it is automatically "centered", and because of the character's animation, he isn't centered in the sprite. So I looked for a way to set an offset to my player body's polygon. I saw that there were offset arguments on `addRectangle` and `addCircle`, but not on `addPolygon` (automatically computed). I also saw the `addShape` method which takes a `p2.Shape` as first argument (btw I didn't find any documentation on this class). I tryed to use it with a Phaser.Polygon, but it failed. Any idea ?
  7. Hello everyone So i have been messing around with tilemaps on the mobile device but i seem to be running into a centering issue. I have tried doing rest on the tilemaplayer but that doesnt work or setting the anchor point. attached is the screen shot of what I am talking about. the code is as follow map = game.add.tilemap('map');map.addTilesetImage('wall'); layer = map.createLayer('Tile Layer 1'); game.load.image('wall', 'maze/wall.png'); game.load.tilemap('map', 'maze/map.json', null, Phaser.Tilemap.TILED_JSON); anyone have any suggestions on centering this? thanks
  8. Hi, I'm relatively new to Pixi. I have a problem similar to the one mentioned in this post: I used the code from the post and it worked seamlessly. However, when i began rotating the Sprites the offset became wrong, and the sprite jumps to another location when i begin dragging it. Do i have to use some trigonometric function to reverse the rotation? How can I do this? Here is a version with rotation: Here without rotation: Thanks in advance! Felix
  9. if this is even possible how do i accomplish this? thx in advance!
  10. Hello. I am migrating to version 2.0.0 and have problems with my tileMap. The problem is that it seems the collision of the tiles is offset but the image is positioned correctly. Can anyone help me with this? In version 1.1.6 worked properly....