Why are the faces of a cubemap labelled px, nx, py, ny, pz, nz?

Question

I am using a cubemap on a WebGL project and my colleague provided me the image assets for the faces labelled front, back, left, right, top and bottom. However Three.js's example code uses images labelled with 2 letters. p or n followed by x, y or z.

With a bit of trial and error I worked out my colleague's assets map accordingly:

• px = left
• nx = right
• py = top
• ny = bottom
• pz = back
• nz = front

So looking at that, it's obvious x, y and z refer to the axes but p and n are not so obvious. I was thinking positive and negative but that theory falls down when you look at the x-axis which is traditionally shown as increasing from left to right. z-axis makes my head hurt because I don't know if I'd expect an object to move closer to me or further away as the value of z increases. Instinct says closer.

My obsessively logical side thinks this is a more appropriate translation to "everyday" language:

• px = right
• nx = left
• py = top
• ny = bottom
• pz = front
• nz = back

Has my colleague provided a non-standard set of assets? Is this the exact reason we don't use everyday language (left, right, top, etc) in 3D modelling? Should I request they provide them labelled px, nx, py, etc?

Some guidance from a seasoned expert would be appreciated.

Answer 1

By convention -- likely based on the RenderMan spec from the 1990's -- cube maps are specified by WebGL (and three.js) in a coordinate system in which positive-x is to the right when looking up the positive-z axis -- in other words, in a left-handed coordinate system. By continuing this convention, preexisting cube maps continued to render correctly.

three.js uses a right-handed coordinate system. So environment maps used in three.js appear to have px and nx swapped. (This is the case for every three.js cube map example.)

three.js r.87