knervous / tiled-pixi-react

Combining Tiled maps, PixiJS and React
8 stars 4 forks source link

tile rotation and flipping #1

Open styk-tv opened 4 years ago

styk-tv commented 4 years ago

Hi, Could you please confirm both rotation and flipping is working? I'm having some issues where flipped tiles are not rendered at all using latest version of tiled-pixi-react.

Especially for the tiles that have flipping data encoded in gid (according to tmx spec) - those bottom 3 high gid numbers.

The highest three bits of the gid store the flipped states. Bit 32 is used for storing whether the tile is horizontally flipped, bit 31 is used for the vertically flipped tiles and bit 30 indicates whether the tile is flipped (anti) diagonally, enabling tile rotation. These bits have to be read and cleared before you can find out which tileset a tile belongs to.

http://doc.mapeditor.org/en/stable/reference/tmx-map-format/#tile-flipping

 <objectgroup id="2" name="Object Layer 1">
  <object id="1" gid="91" x="200" y="300" width="100" height="100"/>
  <object id="2" gid="91" x="600" y="300" width="100" height="100" rotation="90"/>
  <object id="3" gid="91" x="1000" y="300" width="100" height="100" rotation="180"/>
  <object id="4" gid="91" x="1400" y="300" width="100" height="100" rotation="270"/>
  <object id="5" gid="91" x="1800" y="300" width="100" height="100" rotation="360"/>
  <object id="6" gid="91" x="100" y="700" width="100" height="100"/>
  <object id="7" gid="2147483739" x="500" y="700" width="100" height="100"/>
  <object id="8" gid="1073741915" x="900" y="700" width="100" height="100"/>
  <object id="9" gid="3221225563" x="1300" y="700" width="100" height="100"/>
 </objectgroup>

Screenshot from Tiled (not rendered with tiled-pixi-react)

Screenshot 2020-04-09 at 18 23 42
knervous commented 4 years ago

@styk-tv Thanks for noticing this, must have slipped by my use cases - this repo is still in pretty early development. I could get this fixed up sometime this weekend or if you wanted to give it a go that works as well, let me know what you think

styk-tv commented 4 years ago

@knervous wow, that's great Paul, as soon as you push the commit. Lots of potential for this lib. You're doing the right thing.