pdiddles03 Posted January 18, 2016 Share Posted January 18, 2016 How does pixijs achieve it's repeating background patterns and animating them using 2D canvas? Quote Link to comment Share on other sites More sharing options...
d13 Posted January 18, 2016 Share Posted January 18, 2016 Using a TilingSprite: http://pixijs.github.io/docs/PIXI.extras.TilingSprite.html You can see it in action here: http://pixijs.github.io/examples/index.html?s=basics&f=tiling-sprite.js&title=Tiling%20Sprite Quote Link to comment Share on other sites More sharing options...
pdiddles03 Posted January 18, 2016 Author Share Posted January 18, 2016 sorry, should clarify. Because pixijs had a 2d context fallback from webgl, how is the canvas tiling sprite achieved. I am not asking how to make one in pixijs Quote Link to comment Share on other sites More sharing options...
bubamara Posted January 18, 2016 Share Posted January 18, 2016 via canvas createPattern()https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/createPattern Quote Link to comment Share on other sites More sharing options...
pdiddles03 Posted January 18, 2016 Author Share Posted January 18, 2016 ok, do you know if it using translate to animate the tile position? Quote Link to comment Share on other sites More sharing options...
bubamara Posted January 18, 2016 Share Posted January 18, 2016 yes, it does EDIT: looking at source code https://github.com/pixijs/pixi.js/blob/master/src/extras/TilingSprite.js#L263 it uses setTransform Quote Link to comment Share on other sites More sharing options...
pdiddles03 Posted January 18, 2016 Author Share Posted January 18, 2016 11 minutes ago, bubamara said: yes, it does EDIT: looking at source code https://github.com/pixijs/pixi.js/blob/master/src/extras/TilingSprite.js#L263 it uses setTransform AWESOME! thank you for your help Quote Link to comment Share on other sites More sharing options...
bubamara Posted January 18, 2016 Share Posted January 18, 2016 EDIT: sorry all for confusion, post removed https://github.com/pixijs/pixi.js/blob/master/src/extras/TilingSprite.js#L284-L288 Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.