2019電腦圖學A

2019年6月10日星期一

耀鑫的筆記Week15

1.首先先到小葉老師的網站把[data][win32] glut32.dll並照著之前的步驟把該解壓縮的解壓縮，然後把Projection.exe把開來檢查看看。
2.下載freeglut並把它照之前的步驟解壓縮，然後把原本的程式碼刪掉換成以下程式碼即可得到一個沒有顏色的模型:

#include <GL/glut.h>

#include "glm.h" ///for glmReadOBJ(), glmDraw(), glmUnitized()....

GLMmodel * pmodel=NULL;///NOW

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_DOUBLE | GLUT_DEPTH);

    glutInitWindowSize(500,500);

    glutCreateWindow("week15");

    glutDisplayFunc(display);

    glutMainLoop();

}

3.然後將程式碼加上藍色的部分，讓模型的顏色顯示出來

#include <GL/glut.h>

#include "glm.h" ///for glmReadOBJ(), glmDraw(), glmUnitized()....

GLMmodel * pmodel=NULL;///NOW

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_DOUBLE | GLUT_DEPTH);

glutInitWindowSize(500,500);

glutCreateWindow("week15");

glutDisplayFunc(display);

GLfloat light_pos[] = { 0.0, 0.0, -1.0, 0.0 };///NOW2 打光的位置

glEnable(GL_DEPTH_TEST);///NOW2 有立體的功能

glEnable(GL_LIGHT0); ///NOW2 打光後變立體的彩色的

glEnable(GL_LIGHTING); ///NOW2 打光後變立體的彩色的

glLightfv(GL_LIGHT0, GL_POSITION, light_pos);///NOW2 打光的位置

glutMainLoop();

}

4.模型的顏色設定好之後接下來是旋轉

#include <GL/glut.h>

#include "glm.h" ///for glmReadOBJ(), glmDraw(), glmUnitized()....

GLMmodel * pmodel=NULL;///NOW

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();

}

#include <math.h>

float eyeX=1, eyeY=0, eyeZ=0;

void timer(int t)///NOW3

{

glutTimerFunc(33, timer, t+1);///NOW3

float angle=t/180.0*3.1415926;///NOW3 算出一個角度

eyeX=cos(angle); eyeZ=sin(angle);///NOW3

glMatrixMode(GL_PROJECTION);///NOW4

glLoadIdentity();///NOW4

glOrtho(-1,+1, -1,+1, -10,+10);///NOW4 可以看到範圍比較大的投影法

glMatrixMode(GL_MODELVIEW);///NOW3

glLoadIdentity();///NOW3

gluLookAt(eyeX, eyeY, eyeZ, ///NOW3 LookAt的 eye

0.0, 0.8, 0.0, ///NOW3 LookAt的 center

0, 1, 0);///NOW3 LookAt的 up

glutPostRedisplay();///NOW3 Re-display

}

int main(int argc, char**argv)

{

glutInit(&argc, argv);

glutInitDisplayMode(GLUT_DOUBLE | GLUT_DEPTH);

glutInitWindowSize(500,500);

glutCreateWindow("week15");

glutDisplayFunc(display);

glutTimerFunc(33, timer, 0);///NOW3

GLfloat light_pos[] = { 0.0, 0.0, -1.0, 0.0 };///NOW2 打光的位置

glEnable(GL_DEPTH_TEST);///NOW2 有立體的功能

glEnable(GL_LIGHT0); ///NOW2 打光後變立體的彩色的

glEnable(GL_LIGHTING); ///NOW2 打光後變立體的彩色的

glLightfv(GL_LIGHT0, GL_POSITION, light_pos);///NOW2 打光的位置

glutMainLoop();

}

5.最後調整攝影機視角

#include <GL/glut.h>
#include "glm.h" ///for glmReadOBJ(), glmDraw(), glmUnitized()....
GLMmodel * pmodel=NULL;///NOW
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();
}
#include <math.h>
float eyeX=1, eyeY=0, eyeZ=0;
void timer(int t)///NOW3
{
glutTimerFunc(33, timer, t+1);///NOW3
float angle=t/180.0*3.1415926;///NOW3 算出一個角度
eyeX=cos(angle); eyeZ=sin(angle);///NOW3

glMatrixMode(GL_PROJECTION);///NOW4
glLoadIdentity();///NOW4

gluPerspective(60, 1, 0.001, 1000);///NOW5

///glOrtho(-1,+1, -1,+1, -10,+10);///NOW4 可以看到範圍比較大的投影法

glMatrixMode(GL_MODELVIEW);///NOW3
glLoadIdentity();///NOW3
gluLookAt(eyeX, eyeY, eyeZ, ///NOW3 LookAt的 eye
0.0, 0.6, 0.0, ///NOW3 LookAt的 center
0, 1, 0);///NOW3 LookAt的 up

glutPostRedisplay();///NOW3 Re-display
}
int main(int argc, char**argv)
{
glutInit(&argc, argv);
glutInitDisplayMode(GLUT_DOUBLE | GLUT_DEPTH);
glutInitWindowSize(500,500);
glutCreateWindow("week15");

glutDisplayFunc(display);
glutTimerFunc(33, timer, 0);///NOW3

GLfloat light_pos[] = { 0.0, 0.0, 1.0, 0.0 };///NOW2 打光的位置
glEnable(GL_DEPTH_TEST);///NOW2 有立體的功能
glEnable(GL_LIGHT0); ///NOW2 打光後變立體的彩色的
glEnable(GL_LIGHTING); ///NOW2 打光後變立體的彩色的
glLightfv(GL_LIGHT0, GL_POSITION, light_pos);///NOW2 打光的位置

glutMainLoop();
}

喬巴的補交作業

計時器Timer

#include <GL/glut.h> #include <mmsystem.h>///Now (1) #include <stdio.h>///printf() void display() { glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT); glutSolidTeapot( 0.3 ); glutSwapBuffers(); } void timer(int t)///NOW timer!!!! { glutTimerFunc(1000, timer, t+1 );///NOW timer!!!! 起床要播下一個鬧鐘 printf("timer(t) 的 t是 %d\n", t);///順便印一下現在的t是多少 準確地告訴你放第幾次屁 PlaySoundA("fart.wav", NULL, SND_ASYNC);///Now (2) ///NOW timer!!!! } ➜去wav檔案下載尋找檔案 int main(int argc, char**argv) { glutInit(&argc, argv); glutInitDisplayMode(GLUT_DOUBLE | GLUT_DEPTH); glutInitWindowSize(500,500);///變大了 glutCreateWindow("week 14 timer"); glutDisplayFunc(display); glutTimerFunc(3000, timer, 0);///NOW timer!!!! glutMainLoop(); }

內插公式

#include <GL/glut.h> #include <mmsystem.h>///Now (1) float angle=0; float nowX=0;///NOW2 void display() { glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT); glPushMatrix(); ///glRotatef(angle, 0,0,1); glTranslatef(nowX, 0, 0);///NOW2 glutSolidTeapot( 0.3 ); glPopMatrix(); glutSwapBuffers(); } void timer(int t)///NOW timer!!!! { /// 1000 ms = 1 sec, 30 ms = 1/33 sec , 33 fps glutTimerFunc(30, timer, t+1 );///NOW timer!!!! 起床要播下一個鬧鐘 float alpha = (t%33) / 33.0;///NOW2 alpha 內插 nowX = alpha* 1 + (1-alpha)* -1 ;///NOW2 angle += 1; glutPostRedisplay();///系統重繪畫面 } int main(int argc, char**argv) { glutInit(&argc, argv); glutInitDisplayMode(GLUT_DOUBLE | GLUT_DEPTH); glutInitWindowSize(500,500);///變大了 glutCreateWindow("week 14 timer"); glutDisplayFunc(display); glutTimerFunc(1000, timer, 0);///NOW timer!!!! glutMainLoop(); }

動畫

2019年6月9日星期日

學渣的奮鬥史-最終回

附上睡過頭沒上到課的我
醒來後
朋友傳給我的第一句話

還好老師有錄影片

從影片中可以知道今天的重點是關於運鏡的使用方法及掌握

第一部分(投影矩陣)

照慣例的要從老師給的網址

[http://www.cmlab.csie.ntu.edu.tw/~jsyeh/3dcg10/]

下載3個東西

[win32][glut32.dll][data]

在其中打開projection

在轉移矩陣跟備份矩陣後面所寫的函式內容會跟以前有所不同

分別換成了GL_PROJECTION以及GL_MODELVIEW

在下載回來的WINDOWS程式中

打開projection後能發現能發現有幾個數值能夠調整

分別是[fovy][aspect][][]

fovy是調整視野

aspect是調整寬、高比例

在垂直投影法gluPerspective(視野角度，寬跟高的比例，zNear，zFar)

第二部分(用codeblock做出projection的效果)

顯示3D模型的方法

用之前上課的函式將3D模型帶入

程式碼如下

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();

}

注意!!!模型需打光，沒有打光模型就會變白色

要有打光效果需注意是否有以下兩行程式碼

glEnable(GL_DEPTH_TEST);///讓模型變立體
glEnable(GL_LIGHT0);///打光後讓立體的模型有顏色
GLfloat light_pos[] = { 0.0, 0.0, -1.0, 0.0 };

glEnable(GL_LIGHTING);///打光後讓立體的模型有顏色

glLightfv(GL_LIGHT0, GL_POSITION, light_pos);///打光的位置

第三部分(攝影機運鏡)

利用gluLookAt函式調整參數達到運鏡的效果

利用三角函數調整運行的軌跡

讓鏡頭可以成圓形的運行軌跡

下課

沒上到課好後悔阿QQ

Perspective 素描

2019年6月8日星期六

神のノト - Week15

{\__/}

( • - •)

/ > ❤️

------------------------------------------------------------------------------------------------------------

今天課題!

「攝影機與運鏡」

「投影矩陣」

--------------------------------------------------------------------------------------------------------------------------

➤先準備好模擬器~

1. http://www.cmlab.csie.ntu.edu.tw/~jsyeh/3dcg10/

2. data.zip / windows.zip / glut32.dll download

3. windows / data | windows / glut32.dll

--------------------------------------------------------------------------------------------------------------------------

➤今天上課主軸 "Projection" (投影)

➣有分三種投影方式 1. Ortho 正交投影

2. Frustum 四角椎投影 (是圖學的函式) (效果類似透視投影)

3. Perspective 透視投影

➣運鏡用到的函式 gluLookAt( x1,y1,z1(eye) , x2,y2,z2(center) , x3,y3,z3(up) ) ;

解釋參數：

eye→ ( x , y , z ) → 攝影機的座標

center → ( x , y , z ) → 聚焦的點

up → ( x , y , z ) → 指定攝影機 y 軸(上方) 的向量

--------------------------------------------------------------------------------------------------------------------------

➤試著打出Projection效果的程式

➣ 前置作業：

→ 回到 http://www.cmlab.csie.ntu.edu.tw/~jsyeh/3dcg10/

→ 下載 source.zip

需要source檔案裡面的 "glm.c"、"glm.h"、"projection.c"

➣ 測試projection的程式碼
→打開 glut 專案

→將專案資料夾中，放入source內的 "glm.c"、"glm.h"、"projection.c"

→將 glm.c 檔名改為 glm.cpp

→新增檔案進專案內

→將projection.c 的程式碼，開始notepad++複製程式碼

→將程式碼取代原專案內 main.cpp 的程式碼

→發現錯誤，freeglut\bin內，沒有找到data資料夾中的al.obj檔案

→將data資料夾 (模型的obj檔案) 丟入freeglut\bin中即可！

--------------------------------------------------------------------------------------------------------------------------

➤做出自己想要的運鏡，配合projection內的程式碼

1. 先讀入模型

2. 打光，讓模型變成立體 (開啟打光Enable，設定好光線的向量(位置) Position)

3.加入timer，讓模型轉起來，和LookAt函式，調整好eye和center來聚焦在頭部

4.搭配投影方式，正確投影出模型旋轉的樣子 (正交投影)

Q. 破圖原因？

A. glOrtho( left , right ,bottom, top , near , far ) 指定正交投影的投影範圍

如果不再投影範圍內，會破圖

5.測試不同投影 (透視投影)

gluPerspective ( fovy視野 , aspect長寬比例 , zNear , zFar )

→fovy 調視野能見角度

→ aspect 調視窗的長:寬比例

→ 如果視窗拉大拉小，aspect比例沒調好，模型會變形

Class Computer Graphics

The End .. Q^Q

Final Project -------> Coming Soon ..

訂閱：文章 (Atom)

2019年6月10日 星期一

耀鑫的筆記Week15

喬巴的補交作業

計時器Timer

內插公式

動畫

2019年6月9日 星期日

學渣的奮鬥史-最終回

2019年6月8日 星期六

神のノト - Week15

今天課題!

「攝影機與運鏡」

「投影矩陣」

➤先準備好模擬器~

➤今天上課主軸 "Projection" (投影)

➤試著打出Projection效果的程式

➤做出自己想要的運鏡，配合projection內的程式碼

Class Computer Graphics

The End .. Q^Q

Final Project -------> Coming Soon ..

2019年6月10日星期一

2019年6月9日星期日

2019年6月8日星期六