Hi everyone! I’ve been trying to integrate this port of CSS3DRenderer into my project, but am stuck trying to use it with useRightHandedSystem = true. It seems like the matrices generated with the CSS3D code don’t align correctly with the planes. I think the cameraCSSMatrix created might be right, but don’t know what’s wrong with the objectCSSMatrix created. Does anyone have any insight?
Here’s my playground:
https://playground.babylonjs.com/#PQ0PUD#5
Here’s the playground that works with the left handed system:
https://playground.babylonjs.com/#PQ0PUD#4
Well I was able to get the elements to align with the planes, but the CSS isn’t visible for some reason: https://playground.babylonjs.com/#PQ0PUD#6
I thought it might be hidden under the game canvas, but even after increasing the div’s zIndex it still isn’t visible.
Could it be solved with some CSS property change? The elements are there when I inspect, just invisible in the page view. I did try doing something like this post suggested, but it didn’t work. https://stackoverflow.com/questions/31026892/dom-elements-are-there-but-not-visible-until-some-css-property-is-changed
Maybe there’s something else that needs to be changed?
Fixed it! I just had to negate the matrix indices 11-14 within getObjectCSSMatrix()
