2019電腦圖學 Computer Graphics 授課教師: 葉正聖 銘傳大學資訊傳播工程系 每週主題: 程式環境、點線面顏色、移動/旋轉/縮放與矩陣(Matrix)、階層性關節轉動(T-R-T)、做出機器人、打光、貼圖、glu/glut函式、鍵盤、滑鼠、計時器(timer)、讀入3D模型、粒子系統、聲音、特效、投影矩陣、攝影機與運鏡、機器人2.0、期末作品
2019年6月13日 星期四
2019年6月6日 星期四
2019年5月30日 星期四
電腦圖學Week15
電腦圖學Week15
(1)主題 : 攝影機.運鏡
(2)主題 : 投影.矩陣
(3)複習 : 位置移動vs.轉動
(4)複習 : 背景貼圖
(5)期末作品
一.攝影機.運鏡
2.下載data,win32,glut32.dll,放到windows資料夾,打開Projection.exe。
投影各種投影法裡參數改變會對圖像造成什麼影響
gluPerspective(__,__,__,__) 透視投影法
glFrustum(__,__,__,__)
glOrtho(__,__,__,__) 垂直投影法
gluLookAt( __,__,__,<--Eye (人物是主角,鏡頭不會離開主角)--//環繞主角使用第一個參數//
__,__,__,<--Center (視角是主角,主角有可能消失)
__,__,__<--Up ( 相機角度,可以左右傾斜、上下顛倒 )
)
最左邊的參數-->左右變動
中間參數-->上下變動
右邊-->Z軸
二.投影.矩陣
1.做出模型
#include <GL/glut.h>///GLUT 外掛
#include "glm.h"///glm.cpp for 3D model glmReadOBJ(), glmDraw(), glmUnitized()
GLMmodel * pmodel=NULL;///指標
void drawmodel(void)
{
if (!pmodel) {
pmodel = glmReadOBJ("data/al.obj");
if (!pmodel) exit(0);
glmUnitize(pmodel);
glmFacetNormals(pmodel);
glmVertexNormals(pmodel, 90.0);
}
glmDraw(pmodel, GLM_SMOOTH | GLM_MATERIAL);
}
void display(void)
{
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
drawmodel();
glutSwapBuffers();
}
int main(int argc, char** argv)
{
glutInit(&argc, argv);
glutInitDisplayMode(GLUT_DEPTH | GLUT_DOUBLE);
glutInitWindowSize(512,512);
glutInitWindowPosition(50, 50);
glutCreateWindow("week15");
// glutReshapeFunc(reshape);
glutDisplayFunc(display);
glutMainLoop();
return 0;
}
2.打光

#include <GL/glut.h>///GLUT 外掛
#include "glm.h"///glm.cpp for 3D model glmReadOBJ(), glmDraw(), glmUnitized()
GLMmodel * pmodel=NULL;///指標
void drawmodel(void)
{
if (!pmodel) {
pmodel = glmReadOBJ("data/al.obj");
if (!pmodel) exit(0);
glmUnitize(pmodel);
glmFacetNormals(pmodel);
glmVertexNormals(pmodel, 90.0);
}
glmDraw(pmodel, GLM_SMOOTH | GLM_MATERIAL);
}
void display(void)
{
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
drawmodel();
glutSwapBuffers();
}
int main(int argc, char** argv)
{
glutInit(&argc, argv);
glutInitDisplayMode(GLUT_DEPTH | GLUT_DOUBLE);
glutInitWindowSize(512,512);
glutInitWindowPosition(50, 50);
glutCreateWindow("week15");
// glutReshapeFunc(reshape);
glutDisplayFunc(display);
GLfloat light_pos[] = { 0.0, 0.0, -1.0, 0.0 };
glEnable(GL_DEPTH_TEST);
glEnable(GL_LIGHTING);
glEnable(GL_LIGHT0);
glLightfv(GL_LIGHT0, GL_POSITION, light_pos);
glutMainLoop();
return 0;
}
2019年5月23日 星期四
電腦圖學Week14
電腦圖學Week14
(1)主題 : 計時器 Timer
(2)主題 : 內插公式
(3)主題 : 動畫
(4)期末作品
(一)計時器 Timer
1.到https://www.transmissionzero.co.uk/software/freeglut-devel/裡面,點擊 Download freeglut 3.0.0 for MinGW 。
2.解壓縮之後,打開 freeglut 資料夾裡的 lib 資料夾,將裡面的 libfreeglut.a 複製,直接貼上,重新命名為 : libglut32.a ,結果如下圖。
3.下載一個wav音檔,丟入freeglut→bin的資料夾裡。
4.打開CodeBlocks新增Project : GLUT 打程式碼。
2019年5月16日 星期四
電腦圖學Week13
電腦圖學
(1)主題 : 檔案
(2)主題 : 關節.擺動作
(3)主題 : 複習
(4)作業 : 機器人擺動作
(1)主題:檔案
1.打開CodeBlocks新增新專案,選擇Console application 選擇路徑。
2.打程式碼,執行之後會有新的檔案出現在剛剛設定的路徑中。
2019年5月9日 星期四
電腦圖學Week12
電腦圖學2019-05-09
Week12
(1)主題 : 鍵盤
(2)主題 : 聲音.音樂WAV,MP3
(3)複習 : 階層T-R-T骨架
(4)作業 : 能操控的機器人
2.打開CodeBlocks→File→New→Project→Console application→打標題。
3.打程式碼。
#include <windows.h>
#include <mmsystem.h>
#include <stdio.h>
int main()
{
printf("在之前\n");
PlaySoundA("C:\\Users\\user\\Downloads\\glass3.wav",NULL,SND_SYNC);
printf("在中間\n");
PlaySoundA("C:\\Users\\user\\Downloads\\glass3.wav",NULL,SND_SYNC);
printf("在最後\n");
}

4.滑鼠右鍵點擊標題選擇 Build options → Linker settings → add 輸入winmm 確定之後就可以執行了。


5.執行結果會聽見剛剛下載的聲音。

用鍵盤來控制播放聲音
1.到https://www.transmissionzero.co.uk/software/freeglut-devel/裡面,點擊 Download freeglut 3.0.0 for MinGW 。
2.解壓縮之後,打開 freeglut 資料夾裡的 lib 資料夾,將裡面的 libfreeglut.a 複製,直接貼上,重新命名為 : libglut32.a ,結果如下圖。
3.打開CodeBlocks新增Project : GLUT 打程式碼。
#include <GLUT/glut.h>
#else
#include <GL/glut.h>
#endif
#include <stdlib.h>
static int slices = 16;
static int stacks = 16;
/* GLUT callback Handlers */
static void resize(int width, int height)
{
const float ar = (float) width / (float) height;
glViewport(0, 0, width, height);
glMatrixMode(GL_PROJECTION);
glLoadIdentity();
glFrustum(-ar, ar, -1.0, 1.0, 2.0, 100.0);
glMatrixMode(GL_MODELVIEW);
glLoadIdentity() ;
}
static void display(void)
{
const double t = glutGet(GLUT_ELAPSED_TIME) / 1000.0;
const double a = t*90.0;
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
glColor3d(1,0,0);
glPushMatrix();
glTranslated(-2.4,1.2,-6);
glRotated(60,1,0,0);
glRotated(a,0,0,1);
glutSolidSphere(1,slices,stacks);
glPopMatrix();
glPushMatrix();
glTranslated(0,1.2,-6);
glRotated(60,1,0,0);
glRotated(a,0,0,1);
glutSolidCone(1,1,slices,stacks);
glPopMatrix();
glPushMatrix();
glTranslated(2.4,1.2,-6);
glRotated(60,1,0,0);
glRotated(a,0,0,1);
glutSolidTorus(0.2,0.8,slices,stacks);
glPopMatrix();
glPushMatrix();
glTranslated(-2.4,-1.2,-6);
glRotated(60,1,0,0);
glRotated(a,0,0,1);
glutWireSphere(1,slices,stacks);
glPopMatrix();
glPushMatrix();
glTranslated(0,-1.2,-6);
glRotated(60,1,0,0);
glRotated(a,0,0,1);
glutWireCone(1,1,slices,stacks);
glPopMatrix();
glPushMatrix();
glTranslated(2.4,-1.2,-6);
glRotated(60,1,0,0);
glRotated(a,0,0,1);
glutWireTorus(0.2,0.8,slices,stacks);
glPopMatrix();
glutSwapBuffers();
}
#include <mmsystem.h>
static void key(unsigned char key, int x, int y)
{
if(key=='1') PlaySoundA("C:\\Users\\user\\Downloads\\do.wav",NULL,SND_ASYNC);
if(key=='2') PlaySoundA("C:\\Users\\user\\Downloads\\re.wav",NULL,SND_ASYNC);
if(key=='3') PlaySoundA("C:\\Users\\user\\Downloads\\mi.wav",NULL,SND_ASYNC);
if(key=='4') PlaySoundA("C:\\Users\\user\\Downloads\\fa.wav",NULL,SND_ASYNC);
if(key=='5') PlaySoundA("C:\\Users\\user\\Downloads\\so.wav",NULL,SND_ASYNC);
switch (key)
{
case 27 :
case 'q':
exit(0);
break;
case '+':
slices++;
stacks++;
break;
case '-':
if (slices>3 && stacks>3)
{
slices--;
stacks--;
}
break;
}
glutPostRedisplay();
}
static void idle(void)
{
glutPostRedisplay();
}
const GLfloat light_ambient[] = { 0.0f, 0.0f, 0.0f, 1.0f };
const GLfloat light_diffuse[] = { 1.0f, 1.0f, 1.0f, 1.0f };
const GLfloat light_specular[] = { 1.0f, 1.0f, 1.0f, 1.0f };
const GLfloat light_position[] = { 2.0f, 5.0f, 5.0f, 0.0f };
const GLfloat mat_ambient[] = { 0.7f, 0.7f, 0.7f, 1.0f };
const GLfloat mat_diffuse[] = { 0.8f, 0.8f, 0.8f, 1.0f };
const GLfloat mat_specular[] = { 1.0f, 1.0f, 1.0f, 1.0f };
const GLfloat high_shininess[] = { 100.0f };
/* Program entry point */
#include <mmsystem.h>
int main(int argc, char *argv[])
{
PlaySoundA("C:\\Users\\user\\Downloads\\glass3.wav",NULL,SND_ASYNC);
glutInit(&argc, argv);
glutInitWindowSize(640,480);
glutInitWindowPosition(10,10);
glutInitDisplayMode(GLUT_RGB | GLUT_DOUBLE | GLUT_DEPTH);
glutCreateWindow("GLUT Shapes");
glutReshapeFunc(resize);
glutDisplayFunc(display);
glutKeyboardFunc(key);
glutIdleFunc(idle);
glClearColor(1,1,1,1);
glEnable(GL_CULL_FACE);
glCullFace(GL_BACK);
glEnable(GL_DEPTH_TEST);
glDepthFunc(GL_LESS);
glEnable(GL_LIGHT0);
glEnable(GL_NORMALIZE);
glEnable(GL_COLOR_MATERIAL);
glEnable(GL_LIGHTING);
glLightfv(GL_LIGHT0, GL_AMBIENT, light_ambient);
glLightfv(GL_LIGHT0, GL_DIFFUSE, light_diffuse);
glLightfv(GL_LIGHT0, GL_SPECULAR, light_specular);
glLightfv(GL_LIGHT0, GL_POSITION, light_position);
glMaterialfv(GL_FRONT, GL_AMBIENT, mat_ambient);
glMaterialfv(GL_FRONT, GL_DIFFUSE, mat_diffuse);
glMaterialfv(GL_FRONT, GL_SPECULAR, mat_specular);
glMaterialfv(GL_FRONT, GL_SHININESS, high_shininess);
glutMainLoop();
return EXIT_SUCCESS;
}
4.執行之後跑出範例圖片就能利用鍵盤的1.2.3.4.5分別出現Do Re Mi Fa So的聲音。
2019年5月2日 星期四
電腦圖學Week11_
電腦圖學week11
(1)小考:T-R-T轉動
(2)主題:階層.轉動.骨架
(3)主題:鍵盤按鍵
1.到https://www.transmissionzero.co.uk/software/freeglut-devel/裡面,點擊 Download freeglut 3.0.0 for MinGW 。
2.解壓縮之後,打開 freeglut 資料夾裡的 lib 資料夾,將裡面的 libfreeglut.a 複製,直接貼上,重新命名為 : libglut32.a ,結果如下圖。
3.打開CodeBlocks 打程式碼
#include <GL/glut.h>float angle=0;
void display()
{
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
glColor3f(255,255,255);///白色
glutSolidTeapot( 0.3 );///身體
///右邊的手臂
glPushMatrix();
glTranslatef(0.2, 0,0 );///(3)往右移動, 掛在身體的右肩
glRotatef(angle, 0,0,1);///(2)旋轉
glTranslatef(0.28, 0,0);///(1)往右推,把茶壼的柄,放到中心,變 轉動軸
glColor3f(255,0,0);///紅色
glutSolidTeapot( 0.2 );///手臂
glPopMatrix();
glutSwapBuffers();
angle++;
}
int main(int argc, char**argv)
{
glutInit(&argc, argv);
glutInitDisplayMode(GLUT_DOUBLE | GLUT_DEPTH);
glutCreateWindow("week11 TRT");
glutIdleFunc(display);///Now!!!!
glutDisplayFunc(display);
glutMainLoop();
}
4.階層轉動
#include <GL/glut.h>float angle=0;
void display()
{
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
glColor3f(255,255,255);///白色
glutSolidTeapot( 0.3 );///身體
glPushMatrix();///右邊的手臂
glTranslatef(0.2, 0,0 );///(3)往右移動, 掛在身體的右肩
glRotatef(angle, 0,0,1);///(2)旋轉
glTranslatef(0.28, 0,0);///(1)往右推,把茶壼的柄,放到中心,變 轉動軸
glColor3f(255,0,0);///紅色
glutSolidTeapot( 0.2 );///上手臂
glPushMatrix();///右下手臂
glTranslatef(0.2, 0,0 );///(3)往右移動, 掛在身體的右肘
glRotatef(angle, 0,0,1);///(2)旋轉
glTranslatef(0.28, 0,0);///(1)往右推,把茶壼的柄,放到中心,變 轉動軸
glColor3f(255,0,0);///紅色
glutSolidTeapot( 0.2 );///上手臂
glPopMatrix();
glPopMatrix();
glPushMatrix();///左邊的手臂
glTranslatef(-0.2, 0,0 );///(3)往左移動, 掛在身體的左肩
glRotatef(angle, 0,0,1);///(2)旋轉
glTranslatef(-0.28, 0,0);///(1)往左推,把茶壼的柄,放到中心,變 轉動軸
glColor3f(255,0,0);///紅色
glutSolidTeapot( 0.2 );///上手臂
glPushMatrix();///左下手臂
glTranslatef(-0.2, 0,0 );///(3)往左移動, 掛在身體的左肘
glRotatef(angle, 0,0,1);///(2)旋轉
glTranslatef(-0.28, 0,0);///(1)往左推,把茶壼的柄,放到中心,變 轉動軸
glColor3f(255,0,0);///紅色
glutSolidTeapot( 0.2 );///上手臂
glPopMatrix();
glPopMatrix();
glutSwapBuffers();
angle++;
}
int main(int argc, char**argv)
{
glutInit(&argc, argv);
glutInitDisplayMode(GLUT_DOUBLE | GLUT_DEPTH);
glutCreateWindow("階層轉動");
glutIdleFunc(display);///Now!!!!
glutDisplayFunc(display);
glutMainLoop();
}
5.用滑鼠控制手臂轉動
#include <GL/glut.h>float angle=0;
void display()
{
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
glColor3f(255,255,255);///白色
glutSolidTeapot( 0.3 );///身體
glPushMatrix();///右邊的手臂
glTranslatef(0.2, 0,0 );///(3)往右移動, 掛在身體的右肩
glRotatef(angle, 0,0,1);///(2)旋轉
glTranslatef(0.28, 0,0);///(1)往右推,把茶壼的柄,放到中心,變 轉動軸
glColor3f(255,0,0);///紅色
glutSolidTeapot( 0.2 );///上手臂
glPushMatrix();///右下手臂
glTranslatef(0.2, 0,0 );///(3)往右移動, 掛在身體的右肘
glRotatef(angle, 0,0,1);///(2)旋轉
glTranslatef(0.28, 0,0);///(1)往右推,把茶壼的柄,放到中心,變 轉動軸
glColor3f(255,0,0);///紅色
glutSolidTeapot( 0.2 );///上手臂
glPopMatrix();
glPopMatrix();
glPushMatrix();///左邊的手臂
glTranslatef(-0.2, 0,0 );///(3)往左移動, 掛在身體的左肩
glRotatef(-angle, 0,0,1);///(2)旋轉
glTranslatef(-0.28, 0,0);///(1)往左推,把茶壼的柄,放到中心,變 轉動軸
glColor3f(255,0,0);///紅色
glutSolidTeapot( 0.2 );///上手臂
glPushMatrix();///左下手臂
glTranslatef(-0.2, 0,0 );///(3)往左移動, 掛在身體的左肘
glRotatef(-angle, 0,0,1);///(2)旋轉
glTranslatef(-0.28, 0,0);///(1)往左推,把茶壼的柄,放到中心,變 轉動軸
glColor3f(255,0,0);///紅色
glutSolidTeapot( 0.2 );///上手臂
glPopMatrix();
glPopMatrix();
glutSwapBuffers();
///angle++;///Now2!!!
}
void motion(int x, int y)///Now2!!!
{
angle = x;///Now2!!!
display();///Now2!!!
}
int main(int argc, char**argv)
{
glutInit(&argc, argv);
glutInitDisplayMode(GLUT_DOUBLE | GLUT_DEPTH);
glutCreateWindow("week11 TRT");
glutIdleFunc(display);///Now!!!!
glutDisplayFunc(display);
glutMotionFunc(motion);///Now2!!!
glutMainLoop();
}
6.利用數字1.2.3.4分別控制每個茶壺
#include <GL/glut.h>float angle1=0, angle2, angle3, angle4;///Now3!!!
int jointID=1;///1,2,3,4///Now3!!!
void display()
{
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
glColor3f(255,255,255);///白色
glutSolidTeapot( 0.3 );///身體
glPushMatrix();///右邊的手臂
glTranslatef(0.2, 0,0 );///(3)往右移動, 掛在身體的右肩
glRotatef(angle1, 0,0,1);///(2)旋轉
glTranslatef(0.28, 0,0);///(1)往右推,把茶壼的柄,放到中心,變 轉動軸
glColor3f(255,0,0);///紅色
glutSolidTeapot( 0.2 );///上手臂
glPushMatrix();///右下手臂
glTranslatef(0.2, 0,0 );///(3)往右移動, 掛在身體的右肘
glRotatef(angle2, 0,0,1);///(2)旋轉
glTranslatef(0.28, 0,0);///(1)往右推,把茶壼的柄,放到中心,變 轉動軸
glColor3f(255,0,0);///紅色
glutSolidTeapot( 0.2 );///下手臂
glPopMatrix();
glPopMatrix();
glPushMatrix();///左邊的手臂
glTranslatef(-0.2, 0,0 );///(3)往左移動, 掛在身體的左肩
glRotatef(-angle3, 0,0,1);///(2)旋轉
glTranslatef(-0.28, 0,0);///(1)往左推,把茶壼的柄,放到中心,變 轉動軸
glColor3f(255,0,0);///紅色
glutSolidTeapot( 0.2 );///上手臂
glPushMatrix();///左下手臂
glTranslatef(-0.2, 0,0 );///(3)往左移動, 掛在身體的左肘
glRotatef(-angle4, 0,0,1);///(2)旋轉
glTranslatef(-0.28, 0,0);///(1)往左推,把茶壼的柄,放到中心,變 轉動軸
glColor3f(255,0,0);///紅色
glutSolidTeapot( 0.2 );///下手臂
glPopMatrix();
glPopMatrix();
glutSwapBuffers();
///angle++;///Now2!!!
}
void motion(int x, int y)///Now2!!!
{
if(jointID==1) angle1 = x;///Now2!!!///Now3!!!
if(jointID==2) angle2 = x;///Now2!!!///Now3!!!
if(jointID==3) angle3 = x;///Now2!!!///Now3!!!
if(jointID==4) angle4 = x;///Now2!!!///Now3!!!
display();///Now2!!!
}
void keyboard(unsigned char key, int x, int y)
{///Now3!!!
if(key=='1') jointID=1;///Now3!!!
if(key=='2') jointID=2;///Now3!!!
if(key=='3') jointID=3;///Now3!!!
if(key=='4') jointID=4;///Now3!!!
}
int main(int argc, char**argv)
{
glutInit(&argc, argv);
glutInitDisplayMode(GLUT_DOUBLE | GLUT_DEPTH);
glutCreateWindow("week11 TRT");
glutIdleFunc(display);///Now!!!!
glutDisplayFunc(display);
glutMotionFunc(motion);///Now2!!!
glutKeyboardFunc(keyboard);///Now3!!!
glutMainLoop();
}
7.
2019年4月25日 星期四
電腦圖學W10
電腦圖學W10
複習:移動.旋轉.縮放
1.先到http://www.cmlab.csie.ntu.edu.tw/~jsyeh/3dcg10/中,接著下載[data],[win32],[glut32.dll],解壓縮之後放到windows資料夾中。

2.打開transformation.exe,右鍵選擇Swap translate/rotate ,調整數值。

3.到CodeBlocks 打上程式碼
#include <GL/glut.h>
float angle=0;
void display()
{
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
glPushMatrix();
glTranslated(0,0.5,0);
glutSolidTeapot(0.3);
glPopMatrix();
glPushMatrix();
glTranslatef(0.50,0.625,0);
glRotatef(angle,0,0,1);
glTranslatef(0.6,0,0);
glRotatef(-90,0,1,0);
glutSolidCone(0.2,0.6,30,30);
glPopMatrix();
glutSwapBuffers();
}
void motion(int x,int y)
{
angle =x;
display();
}
int main(int argc,char**argv)
{
glutInit(&argc,argv);
glutInitDisplayMode(GLUT_DOUBLE | GLUT_DEPTH);
glutCreateWindow("電腦圖學week10");
glutDisplayFunc(display);
glutMotionFunc(motion);
glutMainLoop();
}

訂閱:
文章 (Atom)













