PIXI.Projection Transform problem

[DubMan]

PIXI.Projection problem

Hello, I am battling with PIXI.Projection

 

I want to get the Transform of one object and use its world transform to add it to another container with the same dimesions.

Basically I want to copy the exact object and pasting it on the other container should then match.

 

So all is fine if I get the worldTransform of one object, and prepend the world transformation of the container, then creating an object by decomposing into a Transform.

 

 

Stack 1 is the object i am copying from

 

let cont = new PIXI.projection.Container3d();
let cont1 = new PIXI.projection.Container3d();
cont.addChild(cont1);
let stack1Obj = new TableGame.Widget.ChipStack({amount:10});
let stack1 =stack1Obj.view;

stack1.y -= 200;
cont1.addChild(stack1);
cont1.scale.set(3);

cont1.x = 0;
tableCont.addChild(cont);
cont.x = 500;
cont.y = 800;
cont.alpha = 0.5;

let m = new PIXI.projection.Matrix3d();
stack1.worldTransform.copyTo(m);

let wt = new PIXI.projection.Matrix3d();
tableCont.worldTransform.copyTo(wt);
wt = wt.invert();

m.prepend(wt);

let m2 = new PIXI.Matrix();
m.copyTo(m2);

let t = new PIXI.Transform();
m2.decompose(t);

let stack3Obj = new TableGame.Widget.ChipStack({amount: 10});
let stack3 = stack3Obj.view;
stack3.setTransform(t.position.x, t.position.y, t.scale.x, t.scale.y, t.rotation, t.skew.x, t.skew.y, t.pivot.x, t.pivot.y);
tableCont.addChild(stack3);

 

This code all works above to create a replica of an object and copy it to the table container.

The moment I add in a camera with a euler on the x, the above doesn't work anymore.

let camera = new PIXI.projection.Camera3d();
camera.setPlanes(800, 10, 10000, false); // true if you want orthographics projection
camera.position.set(gameWidth / 2, gameHeight / 2 - 200);
camera.euler.x = Sys.MathUtils.degToRad(deg); // Works with this commented out 
//camera.position3d.z = 0;
//camera.y = 220;
camera.addChild(tableCont);

I know it has do with the current camera not being taking into account with all the previous matrix calculations.

 

Lines up,

There are no real docs on PIXI.projection so I'm a bit stuck.

With a camera and euler angle I get this:

 

Can anyone help, or knows what else I need to do here.

 

 

 

[ivan.popelyshev]

pixi projection has some special hacks that allow it to copy its matrices to usual 3x2 format, which is not good in your case

instead "copyTo" you can use "copyTo2dOr3d"

IF that's not enough, please make minimal demo for me at codepen, jsfiddle or somewhere else, i'll help you to find what works there (i didnt have that task before). You can reference "pixijs.io/examples/pixi-plugins/pixi-projection.js" in those demos.

[DubMan]

Thanks for the help.

No problems, I realized if I add the item at 0,0 position, it looks like an exact copy. But then as soon as I try to move it somewhere on screen, the camera projection gets added to it.

So if there was a way to an object to the screen and stop it from applying the camera projections that would work.

I also noticed there is no decompose method for Matrix3D/Matrix2D which isn't nice, because then I need to first copy it to a  PIXI.Matrix before getting a transform.

Edited October 16, 2020 by DubMan

[DubMan]

Ivan 

You are a life saver, the copyTo2dor3d works.