CubeMap天空盒的方向与调整 _坐标

参考：
参考：
参考：
(Owed by: 春夜喜雨 )
讨论天空盒之前, 先明确下坐标系:
对于View投影坐标系, 与采用了不同的坐标系, 采用的View坐标系(右手坐标系)-Y-up坐标系的front为-z( z), 采用的View坐标系(左手坐标系)-Y-up坐标系的front为+z( z).
天空盒6张图片组装盒子时, 均以front为中心进行的组装.
TOPLeftFrontRightBackBottom
下面讨论的基础以Front为-z方向进行讨论(如果是Front为+z情况,需要反转+z/-z的位置);
另外不考虑flip-y的情况(flip-y情况-所有图片方向颠倒, 图片的Top/放置图片需要置换, 例如盒子倒过来后, 上面的盖子要移到下面)
1. 构造
对于来说，构造一个完整的的基本代码为：
a. 先创建一个纹理，并绑定为类型纹理
b. 为CUBE纹理设置前后左右上下的贴图
var texture = gl.createTexture();gl.activeTexture(gl.TEXTURE0);gl.bindTexture(gl.TEXTURE_CUBE_MAP, texture);gl.texImage2D(gl.TEXTURE_CUBE_MAP_NEGATIVE_Z, 0, ..., dataFront);gl.texImage2D(gl.TEXTURE_CUBE_MAP_POSTIVE_Z, 0, ..., dataBack);gl.texImage2D(gl.TEXTURE_CUBE_MAP_NEGATIVE_X, 0, ..., dataLeft);gl.texImage2D(gl.TEXTURE_CUBE_MAP_POSTIVE_X, 0, ..., dataRight);gl.texImage2D(gl.TEXTURE_CUBE_MAP_POSTIVE_Y, 0, ..., dataTop);gl.texImage2D(gl.TEXTURE_CUBE_MAP_NEGATIVE_Y, 0, ..., dataBottom);
2. 的方向
可以看到：
前对应的-z轴，后对应+z轴，左对应-x轴，右对应+x轴，上对应正y轴，下对应-y轴
Front
Back
Left
Right
Top
这个是著名的Y-up坐标系，和Model-View-的View-坐标系很相似， +Y指向相机的上方向， -Z指向镜头观察的方向， X+指向相机的右侧方向。
3. 图片的连接
特别需要关注的是，图片的连接方式：
我们都知道这六张图要拼接成一个正方体，图与图之间是要连接到一块的；
但是如何连接，以那张图为中心连接，这会决定了图片的上方向是否需要调整；正常情况以Front作为连接的中心，但例如改为以底部图片作为连接的中心，那么左右侧的连接边就会和变化，从而导致图片需要旋转90度/-90度才能连接上。
下面是连接方式经典的图形：以Front为中心连接其它的图片
----------- T O P -------------
LEFT -> FRONT ->RIGHT
-----------------------
(Back图片放在Top上/下/Left左/Right右均可）
4. 作为天空盒的位置
作为天空盒时，需要具备天空盒的一些特点，如始终在天空盒的内部，天空盒的方向稳定。
已知：View投影矩阵把世界坐标系转换到以相机点为中心， -Z指向相机观察方向， +Y指向相机上方向；
实现：相机放在的中心位置
我们希望时钟把相机放在的中心位置，那么可以在的的着色器中，仅保留相机View矩阵的旋转量作为的View矩阵，从而让相机可以旋转观察内部。
实现：方向固定
盒子的位置固定，主要是采样信息的固定，采样坐标使用的点坐标，相机的采样点和的原始点统一，保证固定点的采样值时钟不变，方向固定。
attribute vec3 a_pos;varying vec3 v_coord;uniform mat4 viewRotate;void main(){v_coord = a_pos;vec4 pos = viewRotate * vec4(aPos, 1.0);gl_Position = vec4(pos.xy, 1.0, 1.0);}
天空盒的方向调整
的坐标系是Y-Up；创建模型时通常创建的Z-Up的模型坐标系，场景中我们也经常使用Z-Up的场景坐标系；
实现的是Y-Up ，以Front为中心连接各个图片， Front指向-Z 。
要实现：使用Z-Up坐标采样到天空盒
对于天空盒的旋转，我们可以考虑几种做法来调整采样的方向：
修改天空盒的照片， Front(-Z)放图片，其它图片，修改方向，匹配连接到图片上。这样，图片对应的为Z-Up结构。修改旋转量， Z-Up与Y-Up的转换，可以以x轴为中心旋转90度得到，为添加上该旋转量，从而采样时调整方向采样。修改采样坐标值，盒子不变的情况下，把采样坐标值调整90度，从而上方采样到y轴图片。
【CubeMap天空盒的方向与调整】(Owed by: 春夜喜雨 )