These are chat archives for pixijs/pixi.js

12th
Dec 2018
Adrian Castravete
@adrian-castravete
Dec 12 2018 06:56

Hello, everybody! I'm trying to wrap my head around the RenderTexture concept.
I've checked the example at the RenderTexture documentation but failed to make it work in a jsfiddle. I then looked towards the examples; that's when I saw that my idea was totally different than what it actually does.

The thing I'm trying to achieve is: when I load a game level I want to create the background plane and currently, because I didn't manage to get RenderTexture to work, I worked around it by creating an HTML5 canvas, drawing the full map on it and then creating a Sprite with a Texture.fromCanvas(cvs).

Creating a Container with all the Sprites looks a bit counter intuitive, and a bit wasteful. Should I have, for example, a 1024x1024 tile level, would the 1048576 Sprites not slow the drawing process at all?
Adrian Castravete
@adrian-castravete
Dec 12 2018 08:14
OK, can anyone point out what I'm doing wrong here? https://jsfiddle.net/adrian_c/5omq0bdy/ I tried to do it as close as possible to the example.
Adrian Castravete
@adrian-castravete
Dec 12 2018 08:28
In comparison https://jsfiddle.net/adrian_c/ry1dpk4m/ the canvas based solution I mentioned. (you'll notice it's 256 times as many tiles).
Chad Engler
@englercj
Dec 12 2018 16:24
If you inspect one of your sprites, you can see the rotation is NaN and therefore the transform is filled with NaNs.
You used Math.pi which is undefined. Changing it to Math.PI fixes your issue.
Adrian Castravete
@adrian-castravete
Dec 12 2018 22:12
Thanks, @englercj ! Yes, when building the second example I also stumbled on the error; this of course does little to my problem with (or wrong understanding of) the RenderTexture. On the second example the Sprites were simply left unrotated because of that bug :).