Need help! I have a bug with cacheAsBitmap = true

[vdddslep]

Hi, friends 

I am working on the game where I have more than 10 thousand objects in 9 different layers on the scene. 

Thank God that I can easily cache it, to do that I split each layer up into small pieces, I called them chunks.
 

So, I cached each chunk using cacheAsBitmap = true and everything was great, until I changed the scene.

Of course, I recached the chunk: 

let chunk:PIXI.Container = this.chunkGrid[chunkPosition.x][chunkPosition.y];
if (chunk.cacheAsBitmap) {
    chunk.cacheAsBitmap = false;
}
if(chunk.width > 0 && chunk.height > 0) {
    chunk.cacheAsBitmap = true;
}

But after I do it, chunk position is changing (See the screenshot).
I have no idea why and how could I deal with it 

I'll be appreciate for any help

Best regards,

Denis 

[ivan.popelyshev]

Yep, that's serious. Wanna try to make a minimal demo of it?

[vdddslep]

I will try to do it

[vdddslep]

It weird, but in my demo it just works, I will try to figure it out 

[ivan.popelyshev]

That code always was a problem, I know that its not easy to make a demo.

[vdddslep]

YES!

I did it!

I spent hours before I found the way to reproduce it. 
Somehow it is reproduced only with turret and only if it has a gun as a child of it

To better reproduction scroll the scene all the way down using WASD

and try to build(mouse click) the turret there 

And thank you for your help.

Test.zip

[ivan.popelyshev]

According to https://github.com/pixijs/pixi.js/blob/dev/src/extras/cacheAsBitmap.js#L173 its not snapping the coords, and that's part of the problem. If we somehow ensure that localbounds are integers, filtering bug will go away. As for other, i dont know yet

I created an issue: https://github.com/pixijs/pixi.js/issues/4170

[vdddslep]

As I understand localbounds is not integers because I use

this.cannonClip.anchor.set( 0.5, 0.3);

despite the fact that sizes of all textures are power of 2 after using anchor.set localbounds becomes not integers.

So, how can I set the anchor to keep localbounds integers?

 

[vdddslep]

Looks like it works for me as a workaround: 

getLocalBounds(rect?: PIXI.Rectangle): PIXI.Rectangle {
    let bounds:PIXI.Rectangle = super.getLocalBounds(rect);
    return new PIXI.Rectangle(Math.round(bounds.x), Math.round(bounds.y), Math.round(bounds.width), Math.round(bounds.height));
}

If I put it to the Chunk class.

Thank you for your collaboration, without it I would never found it. 

[ivan.popelyshev]

It will be better if you use "floor" on x1,y1, "ceil" on x2,y2 and then recalculate height and width.

Feel free to look around inside the pixi, and you'll be helping others too :)

[vdddslep]

Yep, someday,

PIXI is pure JS, I came from Java and for now I am still struggling even with TypeScript 

[ivan.popelyshev]

Yeah, you are right typescript is easier to understand coming from Java world.

I'm using both JDK and Ecmascript: Java6 to Java9/Kotlin/Scala/Groovy, and ActionScript/JS/TS.