Converting obj data to CSS3D
Posted
by
Don Boots
on Game Development
See other posts from Game Development
or by Don Boots
Published on 2012-11-09T20:50:22Z
Indexed on
2012/11/09
23:26 UTC
Read the original article
Hit count: 179
I found a ton of formulae and what not, but 3D isn't my forte so I'm at a loss of what specifically to use. My goal is to convert the data in an 3D .obj file (vertices, normals, faces) to CSS3D (width, height, rotateX,Y,Z and/or similar transforms).
For example 2 simple planes
g plane1
# simple along along Z axis
v 0.0 0.0 0.0
v 0.0 0.0 1.0
v 0.0 1.0 1.0
v 0.0 1.0 0.0
g plane2
# plane rotated 90 degrees along Y-axis
v 0.0 0.0 0.0
v 0.0 1.0 0.0
v 1.0 1.0 0.0
v 1.0 0.0 0.0
f 1 2 3 4
f 5 6 7 8
Could this data be converted to:
#plane1 {
width: X;
height: Y;
transform: rotateX(Xdeg) rotateY(Ydeg) rotateZ(Zdeg) translateZ(Zpx)
}
#plane2 {
width: X;
height: Y;
transform: rotateX(Xdeg) rotateY(Ydeg) rotateZ(Zdeg) translateZ(Zpx)
}
/* Or something equivalent such as transform: matrix3d() */
In summary, while this may be too HTML/CSS-y for game development, the core question is how to get the X/Y/Z-rotation of a 4 point plane from it's matrix of x,y,z coordinates?
© Game Development or respective owner