OpenGL的几何变换3之内观察全景图

继续上一篇文章的例子:OpenGL的几何变换2之内观察立方体

上一篇是通过绘图方式得到的立方体,没有贴图,这次加上纹理贴图。

通过纹理贴图有两种方案:

1、图片分割化,即是把一张完整的全景图片(就是支持720度全景图片)人工的分隔成前后左右上下六张图片(静态),然后分别加载这六张图片;

2、数据分割化,即是保留一张完整的全景图片,加载图片以后,对图片数据进行上下左右前后进行数据切割,或者应该说进行图片切割(动态)。

这一篇文章主要用到的技术点是纹理映射,具体不再累述,可以参考OpenGL的glTexCoord2f纹理坐标配置

 

本篇文章的案例主要是采用第一种(图片分割化),先附上代码:

  1 #include 
  2 #include 
  3 #include     //引用相关包
  4 #include 
  5 
  6 GLfloat  xangle = 0.0;    //X 旋转量
  7 GLfloat  yangle = 0.0;    //Y 旋转量
  8 GLfloat  zangle = 0.0;    //Z 旋转量
  9 GLuint  texturesArr[6];    //存储6个纹理
 10 
 11 //交叉点的坐标
 12 int cx = 0;
 13 int cy = 0;
 14 
 15 //载入位图图象
 16 AUX_RGBImageRec *loadBMP(CHAR *Filename)
 17 {
 18     FILE *File = NULL;    //文件句柄
 19     if (!Filename)    //确保文件名已提供
 20     {
 21         return NULL;    //如果没提供,返回 NULL
 22     }
 23 
 24     File = fopen(Filename,"r");    //尝试打开文件
 25     if (File)    //文件存在么?
 26     {
 27         fclose(File);    //关闭句柄
 28         return auxDIBImageLoadA(Filename);    //载入位图并返回指针
 29     }
 30     return NULL;    //如果载入失败,返回 NULL
 31 }
 32 
 33 //载入位图(调用上面的代码)并转换成纹理
 34 int loadGLTextures()
 35 {
 36     int Status = FALSE;    //状态指示器
 37     char *imgArr[6] = {
 38         "pano/pano_f.bmp",    //前面
 39         "pano/pano_b.bmp",    //后面 
 40         "pano/pano_u.bmp",     //顶面
 41         "pano/pano_d.bmp",     //底面
 42         "pano/pano_r.bmp",     //右面
 43         "pano/pano_l.bmp"    //左面
 44     };
 45     AUX_RGBImageRec *textureImage[6];    //创建纹理的存储空间
 46 
 47     memset(texturesArr, 0x0, sizeof(texturesArr));
 48     memset(textureImage,0,sizeof(textureImage));    //将指针设为NULL
 49 
 50     for (int i = 0; i < 6; i++) {
 51         Status = FALSE;
 52         //载入位图,检查有无错误,如果位图没找到则退出
 53         if (textureImage[i] = loadBMP(imgArr[i]))
 54         {
 55             Status = TRUE;    //将 Status 设为 TRUE
 56             glGenTextures(1, &texturesArr[i]);    //创建纹理
 57 
 58             //使用来自位图数据生成 的典型纹理
 59             glBindTexture(GL_TEXTURE_2D, texturesArr[i]);
 60             //生成纹理
 61             glTexImage2D(GL_TEXTURE_2D, 0, 3, textureImage[i]->sizeX, textureImage[i]->sizeY, 0, GL_RGB, GL_UNSIGNED_BYTE, textureImage[i]->data);
 62 
 63             glTexParameteri(GL_TEXTURE_2D,GL_TEXTURE_MIN_FILTER,GL_LINEAR);    //线形滤波
 64             glTexParameteri(GL_TEXTURE_2D,GL_TEXTURE_MAG_FILTER,GL_LINEAR);    //线形滤波
 65         }
 66 
 67         if (textureImage[i])    //纹理是否存在
 68         {
 69             if (textureImage[i]->data)    //纹理图像是否存在
 70             {
 71                 free(textureImage[i]->data);    //释放纹理图像占用的内存
 72             }
 73             free(textureImage[i]);    //释放图像结构
 74         }
 75         if (Status == FALSE) {
 76             break;
 77         }
 78     }
 79     return Status;    //返回 Status
 80 }
 81 
 82 //从这里开始进行所有的绘制
 83 void drawCube(void)
 84 {
 85     glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);    //清除屏幕和深度缓存
 86     glMatrixMode(GL_MODELVIEW);
 87     glLoadIdentity();    //重置当前的模型观察矩阵
 88 
 89     glPushMatrix();
 90     {
 91         gluLookAt(0, 0, -5, 0, 0, 0, 0, 1, 0);
 92         glTranslatef(0.0f, 0.0f, -5.0f);    //移入屏幕 5 个单位
 93         glRotatef(xangle, 1.0f, 0.0f, 0.0f);    //绕X轴旋转
 94         glRotatef(yangle, 0.0f, 1.0f, 0.0f);    //绕Y轴旋转
 95         glRotatef(zangle, 0.0f, 0.0f, 1.0f);    //绕Z轴旋转
 96 #if (0)    //显示反面
 97         glBindTexture(GL_TEXTURE_2D, texturesArr[0]);    //选择纹理
 98         glBegin(GL_QUADS); {
 99             //前面:逆时针
100             glTexCoord2f(0.0f, 0.0f); glVertex3f(-1.0f, -1.0f,  1.0f);    //纹理和四边形的左下
101             glTexCoord2f(1.0f, 0.0f); glVertex3f( 1.0f, -1.0f,  1.0f);    //纹理和四边形的右下
102             glTexCoord2f(1.0f, 1.0f); glVertex3f( 1.0f,  1.0f,  1.0f);    //纹理和四边形的右上
103             glTexCoord2f(0.0f, 1.0f); glVertex3f(-1.0f,  1.0f,  1.0f);    //纹理和四边形的左上
104         }glEnd();
105     
106         glBindTexture(GL_TEXTURE_2D, texturesArr[1]);    //选择纹理
107         glBegin(GL_QUADS); {
108             //后面:逆时针
109             glTexCoord2f(0.0f, 0.0f); glVertex3f( 1.0f, -1.0f, -1.0f);    //纹理和四边形的左下
110             glTexCoord2f(1.0f, 0.0f); glVertex3f(-1.0f, -1.0f, -1.0f);    //纹理和四边形的右下
111             glTexCoord2f(1.0f, 1.0f); glVertex3f(-1.0f,  1.0f, -1.0f);    //纹理和四边形的右上
112             glTexCoord2f(0.0f, 1.0f); glVertex3f( 1.0f,  1.0f, -1.0f);    //纹理和四边形的左上
113         }glEnd();
114     
115         glBindTexture(GL_TEXTURE_2D, texturesArr[2]);    //选择纹理
116         glBegin(GL_QUADS); {
117             //顶面:逆时针
118             glTexCoord2f(0.0f, 0.0f); glVertex3f(-1.0f,  1.0f,  1.0f);    //纹理和四边形的左下
119             glTexCoord2f(1.0f, 0.0f); glVertex3f( 1.0f,  1.0f,  1.0f);    //纹理和四边形的右下
120             glTexCoord2f(1.0f, 1.0f); glVertex3f( 1.0f,  1.0f, -1.0f);    //纹理和四边形的右上
121             glTexCoord2f(0.0f, 1.0f); glVertex3f(-1.0f,  1.0f, -1.0f);    //纹理和四边形的左上
122         }glEnd();
123     
124         glBindTexture(GL_TEXTURE_2D, texturesArr[3]);    //选择纹理
125         glBegin(GL_QUADS); {
126             //底面:逆时针
127             glTexCoord2f(0.0f, 0.0f); glVertex3f(-1.0f, -1.0f, -1.0f);    //纹理和四边形的左下
128             glTexCoord2f(1.0f, 0.0f); glVertex3f( 1.0f, -1.0f, -1.0f);    //纹理和四边形的右下
129             glTexCoord2f(1.0f, 1.0f); glVertex3f( 1.0f, -1.0f,  1.0f);    //纹理和四边形的右上
130             glTexCoord2f(0.0f, 1.0f); glVertex3f(-1.0f, -1.0f,  1.0f);    //纹理和四边形的左上
131         }glEnd();
132     
133         glBindTexture(GL_TEXTURE_2D, texturesArr[4]);    //选择纹理
134         glBegin(GL_QUADS); {
135             //右面:逆时针
136             glTexCoord2f(0.0f, 0.0f); glVertex3f( 1.0f, -1.0f,  1.0f);    //纹理和四边形的左下
137             glTexCoord2f(1.0f, 0.0f); glVertex3f( 1.0f, -1.0f, -1.0f);    //纹理和四边形的右下
138             glTexCoord2f(1.0f, 1.0f); glVertex3f( 1.0f,  1.0f, -1.0f);    //纹理和四边形的右上
139             glTexCoord2f(0.0f, 1.0f); glVertex3f( 1.0f,  1.0f,  1.0f);    //纹理和四边形的左上
140         }glEnd();
141     
142         glBindTexture(GL_TEXTURE_2D, texturesArr[5]);    //选择纹理
143         glBegin(GL_QUADS); {
144             //左面:逆时针
145             glTexCoord2f(0.0f, 0.0f); glVertex3f(-1.0f, -1.0f, -1.0f);    //纹理和四边形的左下
146             glTexCoord2f(1.0f, 0.0f); glVertex3f(-1.0f, -1.0f,  1.0f);    //纹理和四边形的右下
147             glTexCoord2f(1.0f, 1.0f); glVertex3f(-1.0f,  1.0f,  1.0f);    //纹理和四边形的右上
148             glTexCoord2f(0.0f, 1.0f); glVertex3f(-1.0f,  1.0f, -1.0f);    //纹理和四边形的左上
149         }glEnd();
150 #else    //显示正面
151         glBindTexture(GL_TEXTURE_2D, texturesArr[0]);    //选择纹理
152         glBegin(GL_QUADS); {
153             //前面:纹理顺时针,立方体逆时针
154             glTexCoord2f(0.0f, 0.0f); glVertex3f( 1.0f, -1.0f,  1.0f);    //纹理和四边形的左下
155             glTexCoord2f(0.0f, 1.0f); glVertex3f( 1.0f,  1.0f,  1.0f);    //纹理和四边形的左上
156             glTexCoord2f(1.0f, 1.0f); glVertex3f(-1.0f,  1.0f,  1.0f);    //纹理和四边形的右上
157             glTexCoord2f(1.0f, 0.0f); glVertex3f(-1.0f, -1.0f,  1.0f);    //纹理和四边形的右下
158         }glEnd();
159     
160         glBindTexture(GL_TEXTURE_2D, texturesArr[1]);    //选择纹理
161         glBegin(GL_QUADS); {
162             //后面:纹理顺时针,立方体逆时针
163             glTexCoord2f(0.0f, 0.0f); glVertex3f(-1.0f, -1.0f, -1.0f);    //纹理和四边形的左下
164             glTexCoord2f(0.0f, 1.0f); glVertex3f(-1.0f,  1.0f, -1.0f);    //纹理和四边形的左上
165             glTexCoord2f(1.0f, 1.0f); glVertex3f( 1.0f,  1.0f, -1.0f);    //纹理和四边形的右上
166             glTexCoord2f(1.0f, 0.0f); glVertex3f( 1.0f, -1.0f, -1.0f);    //纹理和四边形的右下
167         }glEnd();
168     
169         glBindTexture(GL_TEXTURE_2D, texturesArr[2]);    //选择纹理
170         glBegin(GL_QUADS); {
171             //顶面:纹理顺时针,立方体逆时针
172             glTexCoord2f(0.0f, 0.0f); glVertex3f( 1.0f,  1.0f,  1.0f);    //纹理和四边形的左下
173             glTexCoord2f(0.0f, 1.0f); glVertex3f( 1.0f,  1.0f, -1.0f);    //纹理和四边形的左上
174             glTexCoord2f(1.0f, 1.0f); glVertex3f(-1.0f,  1.0f, -1.0f);    //纹理和四边形的右上
175             glTexCoord2f(1.0f, 0.0f); glVertex3f(-1.0f,  1.0f,  1.0f);    //纹理和四边形的右下
176         }glEnd();
177     
178         glBindTexture(GL_TEXTURE_2D, texturesArr[3]);    //选择纹理
179         glBegin(GL_QUADS); {
180             //底面:纹理顺时针,立方体逆时针
181             glTexCoord2f(0.0f, 0.0f); glVertex3f( 1.0f, -1.0f, -1.0f);    //纹理和四边形的左下
182             glTexCoord2f(0.0f, 1.0f); glVertex3f( 1.0f, -1.0f,  1.0f);    //纹理和四边形的左上
183             glTexCoord2f(1.0f, 1.0f); glVertex3f(-1.0f, -1.0f,  1.0f);    //纹理和四边形的右上
184             glTexCoord2f(1.0f, 0.0f); glVertex3f(-1.0f, -1.0f, -1.0f);    //纹理和四边形的右下
185         }glEnd();
186     
187         glBindTexture(GL_TEXTURE_2D, texturesArr[5]);    //选择纹理
188         glBegin(GL_QUADS); {
189             //右面:纹理顺时针,立方体逆时针
190             glTexCoord2f(0.0f, 0.0f); glVertex3f( 1.0f, -1.0f, -1.0f);    //纹理和四边形的左下
191             glTexCoord2f(0.0f, 1.0f); glVertex3f( 1.0f,  1.0f, -1.0f);    //纹理和四边形的左上
192             glTexCoord2f(1.0f, 1.0f); glVertex3f( 1.0f,  1.0f,  1.0f);    //纹理和四边形的右上
193             glTexCoord2f(1.0f, 0.0f); glVertex3f( 1.0f, -1.0f,  1.0f);    //纹理和四边形的右下
194         }glEnd();
195     
196         glBindTexture(GL_TEXTURE_2D, texturesArr[4]);    //选择纹理
197         glBegin(GL_QUADS); {
198             //左面:纹理顺时针,立方体逆时针
199 
200             glTexCoord2f(0.0f, 0.0f); glVertex3f(-1.0f, -1.0f,  1.0f);    //纹理和四边形的左下
201             glTexCoord2f(0.0f, 1.0f); glVertex3f(-1.0f,  1.0f,  1.0f);    //纹理和四边形的左上
202             glTexCoord2f(1.0f, 1.0f); glVertex3f(-1.0f,  1.0f, -1.0f);    //纹理和四边形的右上
203             glTexCoord2f(1.0f, 0.0f); glVertex3f(-1.0f, -1.0f, -1.0f);    //纹理和四边形的右下
204         }glEnd();
205 #endif
206     }glPopMatrix();
207     glFlush();
208 }
209 
210 //初始化
211 void init(void)
212 {
213     glClearColor (0.0, 0.0, 0.0, 0.0);    //清理颜色,为黑色,(也可认为是背景颜色)
214 
215     glCullFace(GL_FRONT);    //背面裁剪(背面不可见)
216     glEnable(GL_CULL_FACE);    //启用裁剪
217     glEnable(GL_TEXTURE_2D);
218     loadGLTextures();    //载入纹理贴图
219 }
220 
221 void display(void)
222 {
223     glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);    //清楚颜色数据和深度数据(清屏)
224     glLoadIdentity();    //Reset The View
225 
226     drawCube();
227 
228     glutSwapBuffers();    //交换缓冲区。显示图形
229     
230     //xangle += 0.3f;
231     //yangle += 0.3f;
232     //zangle += 0.3f;
233     Sleep(10);
234 }
235 
236 //当窗口大小改变时,会调用这个函数
237 void reshape(GLsizei w,GLsizei h)
238 {
239     //这里小说明一下:矩阵模式是不同的,他们各自有一个矩阵。投影相关
240     //只能用投影矩阵。(只是目前情况下哦,等我学多了可能就知道为什么了。)
241     
242     glViewport(0,0,w,h);    //设置视口
243     glMatrixMode(GL_PROJECTION);    //设置矩阵模式为投影变换矩阵,
244     glLoadIdentity();    //变为单位矩阵
245     gluPerspective(90, (GLfloat)w / h, 0.1f, 100.0f);    //设置投影矩阵
246     glMatrixMode(GL_MODELVIEW);    //设置矩阵模式为视图矩阵(模型)
247     glLoadIdentity();    //变为单位矩阵
248 }
249 
250 //处理鼠标点击
251 void Mouse(int button, int state, int x, int y)
252 {
253     if(state == GLUT_DOWN) //第一次鼠标按下时,记录鼠标在窗口中的初始坐标
254     {
255         //记住鼠标点击后光标坐标
256         cx = x;
257         cy = y;
258         //printf("Mouse: x=%d, y=%d, oldx_Translatef=%f, oldy_Translatef=%f\n", x, y, oldx_Translatef, oldy_Translatef);
259     }
260 }
261 
262 //处理鼠标拖动
263 void onMouseMove(int x, int y)
264 {
265     float offset = 0.18;
266     //计算拖动后的偏移量,然后进行xy叠加减
267     yangle -= ((x - cx) * offset);
268 
269     if (xangle < 90 && y > cy) {//往下拉
270         xangle += ((y - cy) * offset);
271     } else if (xangle > -90 && y < cy) {//往上拉
272         xangle += ((y - cy) * offset);
273     }
274     //printf("Move: x=%d(%d)[%d], y=%d(%d)[%d], xangle=%f, yangle=%f\n", 
275     //    x, cx, x-cx, 
276     //    y, cy, y-cy, 
277     //    xangle, yangle);
278     glutPostRedisplay();
279 
280     //保存好当前拖放后光标坐标点
281     cx = x;
282     cy = y;
283 }
284 
285 //键盘输入事件函数
286 void keyboard(unsigned char key,int x,int y)
287 {
288     switch(key)
289     {
290         case 'x':        //当按下键盘上d时,以沿X轴旋转为主
291             if (xangle < 85.0f)
292             {
293                 xangle += 1.0f;    //设置旋转增量
294             }
295             break;
296         case 'X':
297             if (xangle > -85.0f)
298             {
299                 xangle -= 1.0f;    //设置旋转增量
300             }
301             break;
302         case 'y':
303             yangle += 1.0f;
304             break;
305         case 'Y':
306             yangle -= 1.0f;
307             break;
308         //case 'z':
309         //    zangle += 1.0f;
310         //    break;
311         //case 'Z':
312         //    zangle -= 1.0f;
313         //    break;
314         default:
315             return;
316     }
317     glutPostRedisplay();    //重绘函数
318 }
319 
320 //特殊按键
321 void specialKey(int key, int x, int y)
322 {
323     float offset = 1.5;
324     printf("key=%d\n", key);
325     switch (key)
326     {
327     case GLUT_KEY_UP:    //脑袋向上往前看
328         if (xangle < 90.0f)
329         {
330             xangle += offset;    //设置旋转增量
331         }
332         break;
333     case GLUT_KEY_DOWN:    //脑袋向下往前看
334         if (xangle > -90.0f)
335         {
336             xangle -= offset;    //设置旋转增量
337         }
338         break;
339     case GLUT_KEY_LEFT:    //脑袋想左往前看
340         yangle -= offset;
341         break;
342     case GLUT_KEY_RIGHT:    //脑袋向右往前看
343         yangle += offset;
344         break;
345     default:
346         break;
347     }
348     glutPostRedisplay();
349 }
350 
351 int main(int argc, char *argv[])
352 {
353     printf("可通过↑↓←→按键或者鼠标控制全景图绕旋转\n");
354 
355     glutInit(&argc, argv);    //固定格式
356     glutInitDisplayMode(GLUT_RGB | GLUT_SINGLE); 
357     glutInitWindowSize(1024/2, 1024/2);    //显示框的大小
358     glutInitWindowPosition(100,100);    //确定显示框左上角的位置
359     glutCreateWindow("OpenGL纹理贴图");
360 
361     init();    //初始化资源,这里一定要在创建窗口以后,不然会无效。
362     glutDisplayFunc(display);
363     //glutIdleFunc(display);
364     glutReshapeFunc(reshape);    //绘制图形时的回调
365     //glutKeyboardFunc(keyboard);
366     glutMouseFunc(Mouse);
367     glutMotionFunc(onMouseMove);
368     glutKeyboardFunc(keyboard);
369     glutSpecialFunc(specialKey); //特殊按键
370     glutMainLoop();
371     return 0;
372 }

 

附上全景图片:

OpenGL的几何变换3之内观察全景图_第1张图片

附上代码运行结果:

OpenGL的几何变换3之内观察全景图_第2张图片OpenGL的几何变换3之内观察全景图_第3张图片

最后附上可执行的EXE链接: https://pan.baidu.com/s/1dGf0GAt 密码: xzd5

 

最后测试结果还发现个问题:

这是立方体,所以在屏幕窗口的宽高不想等时,拖动图片时立方体面与面连接点看到的效果会很别扭,初步的猜测是承载贴图的图形问题,比如可以改成球体,或者等宽高固定化。

转载于:https://www.cnblogs.com/1024Planet/p/5667031.html

你可能感兴趣的:(OpenGL的几何变换3之内观察全景图)