2023電腦圖學二乙: *mian𓃹 Week16

一。點線面色彩複習

step1. 打開一個GLUT專案，命名為week16_all

➊

➋

step2. 打上茶壺程式，跑出白色茶壺

#include <GL/glut.h>

void display()

{

glClear(GL_COLOR_BUFFER_BIT|GL_DEPTH_BUFFER_BIT);

glColor3f(1,1,0); ///圖2 幫茶壺上色

glutSolidTeapot(0.3);

glutSwapBuffers();

}

int main(int argc,char** argv)

{

glutInit(&argc,argv);

glutInitDisplayMode(GLUT_DOUBLE|GLUT_DEPTH);

glutCreateWindow("week16");

glutDisplayFunc(display);

glutMainLoop();

}

step3. 補上程式碼，作背景色

#include <GL/glut.h>

void display()

{

glClear(GL_COLOR_BUFFER_BIT|GL_DEPTH_BUFFER_BIT);

glColor3f(1,1,0); //背景黃色

glBegin(GL_POLYGON);

glVertex2f(1,1);

glVertex2f(-1,1);

glVertex2f(-1,-1);

glVertex2f(1,-1);

glEnd();

glColor3f(0,1,0); //茶壺綠色

glutSolidTeapot(0.3);

glutSwapBuffers();

}

int main(int argc,char** argv)

{

glutInit(&argc,argv);

glutInitDisplayMode(GLUT_DOUBLE|GLUT_DEPTH);

glutCreateWindow("week16");

glutDisplayFunc(display);

glutMainLoop();

}

step4. 完成修改後先上傳到GitHub

-git status

-git add .

-git status

-git commit -m week16

-git config --global user.email yuanm.2775@gmail.com

-git config --global user.name mian9116

-git commit -m week16

-git push

二。階層性轉動複習

part1 移動

stap1. 承上程式，修改程式碼完成可以移動的茶壺

#include <GL/glut.h>

float teapotX=0,teapotY=0;

void motion(int x,int y)

{

teapotX=(x-150)/150.0;

teapotY=(150-y)/150.0;

glutPostRedisplay();

}

void display()

{

glClear(GL_COLOR_BUFFER_BIT|GL_DEPTH_BUFFER_BIT);

glPushMatrix();

glTranslatef(teapotX,teapotY,0);

glutSolidTeapot(0.3);

glPopMatrix();

glutSwapBuffers();

}

int main(int argc,char** argv)

{

glutInit(&argc,argv);

glutInitDisplayMode(GLUT_DOUBLE|GLUT_DEPTH);

glutCreateWindow("week16");

glutDisplayFunc(display);

glutMotionFunc(motion);

glutMainLoop();

}

part2 以原點為中心轉動

step1. 承上程式，修改程式碼完成可以旋轉的茶壺

#include <GL/glut.h>

float teapotX=0,teapotY=0,angle=0,oldX=0,oldY=0;

void mouse(int button,int state,int x,int y)

{

oldX=x;

oldY=y;

}

void motion(int x,int y)

{

///teapotX=(x-150)/150.0;

///teapotY=(150-y)/150.0;

angle+=x-oldX;

oldX=x;

glutPostRedisplay();

}

void display()

{

glClear(GL_COLOR_BUFFER_BIT|GL_DEPTH_BUFFER_BIT);

glPushMatrix();

glRotatef(angle,0,0,1);///glTranslatef(teapotX,teapotY,0);

glutSolidTeapot(0.3);

glPopMatrix();

glutSwapBuffers();

}

int main(int argc,char** argv)

{

glutInit(&argc,argv);

glutInitDisplayMode(GLUT_DOUBLE|GLUT_DEPTH);

glutCreateWindow("week16");

glutDisplayFunc(display);

glutMotionFunc(motion);

glutMouseFunc(mouse);

glutMainLoop();

}

part3 以特定點為中心轉動

stap1. 承上程式，先修改程式在白色茶壺上再做出一個小茶壺，並透過Translatef移動白色茶壺得把手到小茶壺上

#include <GL/glut.h>

float teapotX=0,teapotY=0,angle=0,oldX=0,oldY=0;

void mouse(int button,int state,int x,int y)

{

oldX=x;

oldY=y;

}

void motion(int x,int y)

{

teapotX=(x-150)/150.0;

teapotY=(150-y)/150.0;

angle+=x-oldX;

oldX=x;

glutPostRedisplay();

}

void display()

{

glClear(GL_COLOR_BUFFER_BIT|GL_DEPTH_BUFFER_BIT);

glPushMatrix();

glColor3f(1,1,1);

glTranslatef(teapotX,teapotY,0);

///glRotatef(angle,0,0,1); *先不要轉動!!

glutSolidTeapot(0.3);

glPopMatrix();

glColor3f(1,1,0);

glutSolidTeapot(0.02);

glutSwapBuffers();

}

int main(int argc,char** argv)

{

glutInit(&argc,argv);

glutInitDisplayMode(GLUT_DOUBLE|GLUT_DEPTH);

glutCreateWindow("week16");

glutDisplayFunc(display);

glutMotionFunc(motion);

glutMouseFunc(mouse);

glutMainLoop();

}

stap2. 透過Translatef移動白色茶壺得把手到小茶壺上，但不知此時的白色茶壺座標，因此利用printf將座標印出

#include <stdio.h>

#include <GL/glut.h>

float teapotX=0,teapotY=0,angle=0,oldX=0,oldY=0;

void mouse(int button,int state,int x,int y)

{

oldX=x;

oldY=y;

}

void motion(int x,int y)

{

teapotX=(x-150)/150.0;

teapotY=(150-y)/150.0;

angle+=x-oldX;

oldX=x;

glutPostRedisplay();

printf("glTranslatef(%.2f,%.2f,0);\n",teapotX,teapotY);

}

void display()

{

glClear(GL_COLOR_BUFFER_BIT|GL_DEPTH_BUFFER_BIT);

glPushMatrix();

glColor3f(1,1,1);

glTranslatef(teapotX,teapotY,0);

///glRotatef(angle,0,0,1);

glutSolidTeapot(0.3);

glPopMatrix();

glColor3f(1,1,0);

glutSolidTeapot(0.02);

glutSwapBuffers();

}

int main(int argc,char** argv)

{

glutInit(&argc,argv);

glutInitDisplayMode(GLUT_DOUBLE|GLUT_DEPTH);

glutCreateWindow("week16");

glutDisplayFunc(display);

glutMotionFunc(motion);

glutMouseFunc(mouse);

glutMainLoop();

}

stap3. 用上步驟取得的座標放入程式碼，將茶壺移動到該位置後即可旋轉

#include <stdio.h>

#include <GL/glut.h>

float teapotX=0,teapotY=0,angle=0,oldX=0,oldY=0;

void mouse(int button,int state,int x,int y)

{

oldX=x;

oldY=y;

}

void motion(int x,int y)

{

teapotX=(x-150)/150.0;

teapotY=(150-y)/150.0;

angle+=x-oldX;

oldX=x;

glutPostRedisplay();

printf("glTranslatef(%.2f,%.2f,0);\n",teapotX,teapotY);

}

void display()

{

glClear(GL_COLOR_BUFFER_BIT|GL_DEPTH_BUFFER_BIT);

glPushMatrix();

glColor3f(1,1,1);

///glTranslatef(teapotX,teapotY,0);

glRotatef(angle,0,0,1);

glTranslatef(0.42,-0.06,0);

glutSolidTeapot(0.3);

glPopMatrix();

glColor3f(1,1,0);

glutSolidTeapot(0.02);

glutSwapBuffers();

}

int main(int argc,char** argv)

{

glutInit(&argc,argv);

glutInitDisplayMode(GLUT_DOUBLE|GLUT_DEPTH);

glutCreateWindow("week16");

glutDisplayFunc(display);

glutMotionFunc(motion);

glutMouseFunc(mouse);

glutMainLoop();

}

stap4. 試著將第一個glTranslatef放出來

#include <stdio.h>

#include <GL/glut.h>

float teapotX=0,teapotY=0,angle=0,oldX=0,oldY=0;

void mouse(int button,int state,int x,int y)

{

oldX=x;

oldY=y;

}

void motion(int x,int y)

{

teapotX=(x-150)/150.0;

teapotY=(150-y)/150.0;

angle+=x-oldX;

oldX=x;

glutPostRedisplay();

printf("glTranslatef(%.2f,%.2f,0);\n",teapotX,teapotY);

}

void display()

{

glClear(GL_COLOR_BUFFER_BIT|GL_DEPTH_BUFFER_BIT);

glPushMatrix();

glColor3f(1,1,1);

glTranslatef(-0.42,0.06,0);

glRotatef(angle,0,0,1);

glTranslatef(0.42,-0.06,0);

glutSolidTeapot(0.3);

glPopMatrix();

glColor3f(1,1,0);

glutSolidTeapot(0.02);

glutSwapBuffers();

}

int main(int argc,char** argv)

{

glutInit(&argc,argv);

glutInitDisplayMode(GLUT_DOUBLE|GLUT_DEPTH);

glutCreateWindow("week16");

glutDisplayFunc(display);

glutMotionFunc(motion);

glutMouseFunc(mouse);

glutMainLoop();

}

二。鋼彈複習

stap1. 承上程式碼，修改得到讀取鋼彈圖

step2. 將model資料夾入week16_all

step3. 將第十週的glm.cpp和glm.h放入week16_all

#include <stdio.h>

#include <GL/glut.h>

#include "glm.h"

GLMmodel*gundam=NULL;

float teapotX=0,teapotY=0,angle=0,oldX=0,oldY=0;

void mouse(int button,int state,int x,int y)

{

oldX=x;

oldY=y;

}

void motion(int x,int y)

{

teapotX=(x-150)/150.0;

teapotY=(150-y)/150.0;

angle+=x-oldX;

oldX=x;

glutPostRedisplay();

printf("glTranslatef(%.2f,%.2f,0);\n",teapotX,teapotY);

}

void display()

{

glClear(GL_COLOR_BUFFER_BIT|GL_DEPTH_BUFFER_BIT);

glPushMatrix();

glmDraw(gundam,GLM_MATERIAL);

glPopMatrix();

glColor3f(1,1,0);

glutSolidTeapot(0.02);

glutSwapBuffers();

}

int main(int argc,char** argv)

{

glutInit(&argc,argv);

glutInitDisplayMode(GLUT_DOUBLE|GLUT_DEPTH);

glutCreateWindow("week16");

glutDisplayFunc(display);

glutMotionFunc(motion);

glutMouseFunc(mouse);

gundam=glmReadOBJ("model/Gundam.obj");

glutMainLoop();

}

step4. 在前一步驟可以看到鋼彈太大以致無法看到全貌，因此利用glScales縮小

#include <stdio.h>

#include <GL/glut.h>

#include "glm.h"

GLMmodel*gundam=NULL;

float teapotX=0,teapotY=0,angle=0,oldX=0,oldY=0;

void mouse(int button,int state,int x,int y)

{

oldX=x;

oldY=y;

}

void motion(int x,int y)

{

teapotX=(x-150)/150.0;

teapotY=(150-y)/150.0;

angle+=x-oldX;

oldX=x;

glutPostRedisplay();

printf("glTranslatef(%.2f,%.2f,0);\n",teapotX,teapotY);

}

void display()

{

glClear(GL_COLOR_BUFFER_BIT|GL_DEPTH_BUFFER_BIT);

glPushMatrix();

glColor3f(1,0,0); ///改一下顏色比較清楚!!

glScalef(0.04,0.04,0.04);

glmDraw(gundam,GLM_MATERIAL);

glPopMatrix();

glColor3f(1,1,0);

glutSolidTeapot(0.02);

glutSwapBuffers();

}

int main(int argc,char** argv)

{

glutInit(&argc,argv);

glutInitDisplayMode(GLUT_DOUBLE|GLUT_DEPTH);

glutCreateWindow("week16");

glutDisplayFunc(display);

glutMotionFunc(motion);

glutMouseFunc(mouse);

gundam=glmReadOBJ("model/Gundam.obj");

glutMainLoop();

}

step5.從week07-2中剪貼部分程式碼，讓貼圖可以順利使用

💡要記得安裝OpenCV

#include <opencv/cv.h>

#include <GL/glut.h>

int myTexture(char * filename)

{

IplImage * img = cvLoadImage(filename);

cvCvtColor(img,img, CV_BGR2RGB);

glEnable(GL_TEXTURE_2D);

GLuint id;

glGenTextures(1, &id);

glBindTexture(GL_TEXTURE_2D, id);

glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_REPEAT);

glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_REPEAT);

glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_NEAREST);

glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_NEAREST);

glTexImage2D(GL_TEXTURE_2D, 0, GL_RGB, img->width, img->height, 0, GL_RGB, GL_UNSIGNED_BYTE, img->imageData);

return id;

}

step6. 打開Srtting-Compiller setting

1.進入Search directories-Linker輸入C:\OpenCV2.1\lib

2.進入Search directories-Compiller輸入C:\OpenCV2.1\include

3.進入Linker setting分別輸入cv210、cxcore210、highgui210

step7. 修改程式碼得到一個暗暗的鋼彈模型

#include <opencv/highgui.h>

#include <opencv/cv.h>

#include <GL/glut.h>

int myTexture(char * filename)

{

IplImage * img = cvLoadImage(filename);

cvCvtColor(img,img, CV_BGR2RGB);

glEnable(GL_TEXTURE_2D);

GLuint id;

glGenTextures(1, &id);

glBindTexture(GL_TEXTURE_2D, id);

glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_REPEAT);

glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_REPEAT);

glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_NEAREST);

glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_NEAREST);

glTexImage2D(GL_TEXTURE_2D, 0, GL_RGB, img->width, img->height, 0, GL_RGB, GL_UNSIGNED_BYTE, img->imageData);

return id;

}

#include <stdio.h>

#include <GL/glut.h>

#include "glm.h"

GLMmodel*gundam=NULL;

float teapotX=0,teapotY=0,angle=0,oldX=0,oldY=0;

void mouse(int button,int state,int x,int y)

{

oldX=x;

oldY=y;

}

void motion(int x,int y)

{

teapotX=(x-150)/150.0;

teapotY=(150-y)/150.0;

angle+=x-oldX;

oldX=x;

glutPostRedisplay();

printf("glTranslatef(%.2f,%.2f,0);\n",teapotX,teapotY);

}

void display()

{

glClear(GL_COLOR_BUFFER_BIT|GL_DEPTH_BUFFER_BIT);

glPushMatrix();

glColor3f(1,0,0);S

glScalef(0.04,0.04,0.04);

glmDraw(gundam,GLM_MATERIAL);

glPopMatrix();

glColor3f(1,1,0);

glutSolidTeapot(0.02);

glutSwapBuffers();

}

int main(int argc,char** argv)

{

glutInit(&argc,argv);

glutInitDisplayMode(GLUT_DOUBLE|GLUT_DEPTH);

glutCreateWindow("week16");

glutDisplayFunc(display);

glutMotionFunc(motion);

glutMouseFunc(mouse);

gundam=glmReadOBJ("model/Gundam.obj");

myTexture("model/Diffuse.jpg");

glutMainLoop();

}

step8. 將顏色修改成白色，並新增貼圖進去

step9. 原本沒有立體概念，頭和身體不同面，加入程式碼修正

step10. 加入glRotate讓3D鋼彈可以旋轉

step7.

2023電腦圖學二乙

2023年6月1日星期四

*mian𓃹 Week16

一。點線面色彩複習

二。階層性轉動複習

part1 移動

stap1. 承上程式，修改程式碼完成可以移動的茶壺

part2 以原點為中心轉動

part3 以特定點為中心轉動

二。鋼彈複習

沒有留言:

張貼留言

2023年6月1日 星期四

*mian𓃹 Week16

一。點線面色彩複習

二。階層性轉動複習

part1 移動

stap1. 承上程式，修改程式碼完成可以移動的茶壺

part2 以原點為中心轉動

part3 以特定點為中心轉動

二。鋼彈複習

沒有留言:

張貼留言

2023年6月1日星期四