2017電腦圖學: Week06

顯示具有 Week06 標籤的文章。顯示所有文章

2017年7月1日星期六

Week 06 語璇電圖

一、期中考題介紹

二、旋轉
1.進入老師的網站下載：
http://www.cmlab.csie.ntu.edu.tw/~jsyeh/3dcg10/

2.解壓縮 data, windows, glut32，然後開啟Transformation

3.研究各個數值的改變所產生的變化

4.改變移動和旋轉的程式碼順序所產生的變化

上到下：(移動-旋轉)
移動軸心，物體在軸心上旋轉。

(旋轉-移動)
移動物體，物體繞著軸心旋轉。

2017年4月10日星期一

week 06 楊語琛的上課筆記ﾚ(ﾟ∀ﾟ;)ﾍ=З=З=З

1.期中模擬考+複習考試內容:

glPushMatrix()://備份矩陣

glRotatef(angle, x, y, z);//旋轉
glTranslatef(x,y,z);//移動
glScalef(x,y,z);//縮放
glBegin(GL_POLYGON);//開始畫
glNormal3f(nx.ny.nz);打光的法向量
glTexCoord2f(tx,ty);//貼圖的座標
glColor3f(r,g,b)//顏色
glVertex3f(x,y,z);//頂點
glEnd();//結束畫
glPopMatrix();//還原矩陣

2.茶壺打光

先畫一個茶壺，後續要新增功能

一　先打光
　

二　調整GLfloat light_position（打光數值）
　

三　讓茶壺旋轉
　

四　使他自動旋轉
　

（自動旋轉的程式碼為glutIdleFunc(display);）

Week06陳冠霖的上課筆記

本周課程:

複習上周期中考內容

glPushMatrix();備份矩陣

glRotatef(angle,x,y,z);旋轉

glTranslatef(x,y,z);移動

glScalef(x,y,z);縮放

glBeing(GL_POLYGON);開始畫多邊形

glColor3f(r,g,b);顏色

glNormal3f(nx,ny,nz);打光的法向量

glTexCoord2f(tx,ty);貼圖座標

glVertex3f(x,y,z);頂點

glEnd();結束畫多邊形

glPopMatrix();還原矩陣

用CodeBlocks產生GLUT project。

打光的茶壺

將GLUT project多餘的程式碼刪掉，要留下打光的程式碼(關鍵字light)，把display裡的程式碼進行修改。

以下是程式碼(紅色是重點):

static void display(void)

{

glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);~~~去除之前的顏色，去除之前的深度

glPushMatrix();~~~備份矩陣

glutSolidTeapot(0.3);~~~畫茶壺

glPopMatrix();~~~還原矩陣

glutSwapBuffers();

}

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 */

int main(int argc, char *argv[])

{

glutInit(&argc, argv);

glutInitDisplayMode(GLUT_RGB | GLUT_DOUBLE | GLUT_DEPTH);

glutCreateWindow("GLUT Shapes");

glutDisplayFunc(display);

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;

}

改了數值，打光的茶壺

將上面打光的茶壺中的const GLfloat light_position[] = { 2.0f, 5.0f, 5.0f, 0.0f };改變數值，改成const GLfloat light_position[] = { 2.0f, -5.0f, 0.0f, 0.0f };就能得到不同的打光效果

會旋轉的打光茶壺

將上面打光的茶壺程式碼，在display函式中加入glTranslatef、glRotatef，在int main()的主程式碼裡加入glutIdleFunc。

程式碼如下:(紅色是新加入的程式碼)

#include <GL/glut.h>

float angle = 0;~~~宣告角度

static void display(void)

{

angle++;~~~每跑一次就加一

glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);

glPushMatrix();

glTranslatef(0,0.5,0);~~~移動

glRotatef(angle,0,1,0);~~~旋轉

glutSolidTeapot(0.3);

glPopMatrix();

glutSwapBuffers();

}

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, 0.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 */

int main(int argc, char *argv[])

{

glutInit(&argc, argv);

glutInitDisplayMode(GLUT_RGB | GLUT_DOUBLE | GLUT_DEPTH);

glutCreateWindow("GLUT Shapes");

glutIdleFunc(display);~~~閒置(沒有動作)，就從跑display。

glutDisplayFunc(display);

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;

}

有兩個茶壺

在上面的旋轉茶壺程式碼中加入glPushMatrix();、glutSolidTeapot(0.3);、glPopMatrix();，就能再多產生一個不會動的茶壺，兩者就能比較。

程式碼如下:(紅色是新加入的程式碼)

static void display(void)

{

angle++;

glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);

glPushMatrix();

glTranslatef(0,0.5,0);

glRotatef(angle,0,1,0);

glutSolidTeapot(0.3);

glPopMatrix();

glPushMatrix();~~~備份矩陣

glutSolidTeapot(0.3);~~~畫茶壺

glPopMatrix();~~~還原矩陣

glutSwapBuffers();

}

一個茶壺，一個正方形

把display函式裡資料進行修改，把原本不會動的茶壺改成正方形，程式碼茶壺glutSolidTeapot(0.3);改成正方形glutSolidCube(0.3);。

程式碼如下:(紅色是新加入的程式碼)

static void display(void)

{

angle++;

glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);

glPushMatrix();

glTranslatef(0,0.5,0);

glRotatef(angle,0,1,0);

glutSolidTeapot(0.3);

glPopMatrix();

glPushMatrix();

glColor3f(0,0,1);

glutSolidCube(0.3);~~~畫正方形

glPopMatrix();

glutSwapBuffers();

}

一個茶壺，一個圓錐

把display函式裡資料進行修改，把原本正方形改成圓錐，程式碼正方形glutSolidCube(0.3);改成圓錐glutSolidCone(0.4,0.4,5,15);。

程式碼如下:(紅色是新加入的程式碼)

static void display(void)

{

angle++;

glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);

glPushMatrix();

glTranslatef(0,0.5,0);

glRotatef(angle,0,1,0);

glutSolidTeapot(0.3);

glPopMatrix();

glPushMatrix();

glColor3f(0,0,1);

glRotatef(angle,0,1,0);

glutSolidCone(0.4,0.4,5,15);~~~畫圓錐(底半徑，高度，slice柳丁切，stack堆疊)

glPopMatrix();

glutSwapBuffers();

}

一個茶壺，一個透明圓錐

把display函式裡資料進行修改，把原本實體圓錐改成透明圓錐，程式碼實體圓錐glutSolidCone(0.4,0.4,5,15);改成透明圓錐glutWireCone(0.4,0.4,5,15);。

程式碼如下:(紅色是新加入的程式碼)

static void display(void)

{

angle++;

glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);

glPushMatrix();

glTranslatef(0,0.5,0);

glRotatef(angle,0,1,0);

glutSolidTeapot(0.3);

glPopMatrix();

glPushMatrix();

glColor3f(0,0,1);

glRotatef(angle,0,1,0);

glutWireCone(0.4,0.4,5,15);~~~畫透明圓錐(底半徑，高度，slice柳丁切，stack堆疊)

glPopMatrix();

glutSwapBuffers();

}

[電腦圖學]Week06 松賢的上課筆記

本週主題:

(1.)期中考模擬考

(2.)T-R-T轉動

(3.)打光

(4.)機器人

1.期中考模擬考

請複習10行重點程式碼:

glPushMatrix(); //備份矩陣

glRotatef(angle,x,y,z);//旋轉

glTranslatef(x,y,z);//移動

glScalef(x,y,z);//縮放

glBegin(GL_POLYGON);//開始畫

glNormal3f(nx,ny,nz);//打光的法向量

glTexCoord2f(tx,ty);//貼圖座標

glColor3f(r,g,b);//顏色

glVertex3f(x,y,z);//頂點

glEnd();//結束畫

glPopMatrix();//還原矩陣

2&3.T-R-T轉動以及打光效果

請用CodeBlocks新增一個GLUT專案(步驟不賛述)，完成後保留以下程式碼:

#include <GL/glut.h>

static void display(void)

{

glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);

glPushMatrix();

glutSolidTeapot(0.3);

glPopMatrix();

glutSwapBuffers();

}

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 */

int main(int argc, char *argv[])

{

glutInit(&argc, argv);

glutInitDisplayMode(GLUT_RGB | GLUT_DOUBLE | GLUT_DEPTH);

glutCreateWindow("GLUT Shapes");

glutDisplayFunc(display);

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;

}

主要重點---紅色部分為主，不要誤刪

執行結果如下:

可以看到一個彷彿有點立體的茶壺，這是因為有光線的原因。要更改光線的投射方向，請更改此行數值:

const GLfloat light_position[] = { 2.0f, 5.0f, 5.0f, 0.0f };

light_position顧名思義就是光線位置

課堂小作業-做兩個茶壺(一個旋轉、一個靜止)，示意圖如下:

Step1: 宣告浮點數型態angle為全域變數

Step2: 修改display函式:

float angle = 0;

static void display(void)

{

angle++;

glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);

/*上面的茶壺*/

glPushMatrix();

glTranslatef(0,0.6,0);

glutSolidTeapot(0.3);

glPopMatrix();

/*下面的茶壺*/

glPushMatrix();

glTranslatef(0,0,0);

glRotatef(angle,0,1,0);

glutSolidTeapot(0.3);

glPopMatrix();

glutSwapBuffers();

}

Step3: 在main函式中的glutDisplayFunc(display);下面一行新增一個函式:

glutIdleFunc(display); //閒置的函式

4.機器人

同樣修改display函式:

static void display(void)

{

angle++;

glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);

glColor3f(1,0,0); ///add color

glPushMatrix();

glTranslatef(0,0.6,0);

glutSolidTeapot(0.3);

glPopMatrix();

glPushMatrix();

glTranslatef(0,0,0);

glRotatef(angle,0,1,0);

glutSolidCube(0.3); ///新增cube

glPopMatrix();

glutSwapBuffers();

}

就會顯示一個茶壺、一個方塊，並渲染成紅色(因新增glColor3f(1,0,0))

(補充: 或者是自己變出新的形狀)

亦可以運用以下函式做圖

glutSolidCone()

glutSolidCube()

glutSolidSphere()

Week06 從前有一個下巴叫謝佩，的筆記(ﾟ∀。)

一、準備考試，十行程式碼

glPushMatrix(); ///轉移矩陣

glTranslatef(x,y,z); ///移動

glRotatef(angle,x,y,z); ///角度

glScalef(x,y,z); ///縮放

glBegin(GL_POLYGON); ///開始畫

glColor3f(r,g,b); ///顏色

glNormal3f(nx,ny,nz); ///打光法向量

glTexCoord2f(tx,ty); ///貼圖座標

glVertex3f(x,y,z); ///頂點

glEnd(); ///結束

glPopMatrix(); ///還原矩陣

二、打光

1. 開啟GLUT並刪除程式碼，出現有打光的茶壺

2. 更改「GLfloat light_position」的數值，改變打光的程度

3.做出兩個茶壺

4.讓第二個茶壺旋轉：使用「glutIdleFunc(display);」

5. 製作出一個特殊形，放在茶壺下方

week06 陶軒宇課堂筆記

作業一

複習期中考和測驗

作業二:

畫出茶壺做打光測驗:

1.開啟glut專案

2.刪除不必要程式碼並畫出茶壺

3.更改打光數值可畫出不同茶壺

作業三

1.做出兩個茶壺,一個會轉,一個不會

作業四

試著做不同圖形

1.方形

glutSolidCube(大小):

2.筒狀

glutSolidCone(底r,高h,slice柳丁切,stack堆疊);

3.圓

glutSolidSphere(r,slice,stack);

Week06 20170410 芷萱的課堂筆記

作業一:

練習打光

基本茶壺程式碼

#include <GL/glut.h>

static void display(void)

{

glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);

glPushMatrix();

glutSolidTeapot(0.3);

glPopMatrix();

glutSwapBuffers();

}

利用內建的GLUT內的程式-可更改打光方向

const GLfloat light_position[] = { 2.0f, 5.0f, 5.0f, 0.0f };

試著將此行程式碼數值改成

const GLfloat light_position[] = { 2.0f, 5.0f, 0.0f, 0.0f };

同時畫出兩個茶壺-個別加入Translatef . Rotatef做出不同變化

增加後的程式碼→只要多增加一組 glPushMatrix();

glPopMatrix();即可畫出另一個茶壺

#include <GL/glut.h>

float angle=0;

static void display(void)

{

angle++;

glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);

glPushMatrix();

glTranslatef(0,0.6,0);

glutSolidTeapot(0.3);

glPopMatrix();

glPushMatrix();

glRotatef(angle,0,1,0);

glutSolidTeapot(0.3);

glPopMatrix();

glutSwapBuffers();

}

● 確認下方程式碼有glutIdleFunc(display);-讓視窗閒置時即可執行display{}

畫出各種基礎幾何多邊形

1. glutSolidTeapot(大小); ///茶壺

2. glutSolidCube(大小); ///方塊

3. glutSolidCone(底 r , 高 h , slice , stack); ///圓錐 (slice柳丁切 stack堆疊)

4. glutSolidSphere(r , slice,stack); ///圓球

5. glutDedocahedron(); ///十二面體

6. glutIcosahedron(); ///二十面體

訂閱：文章 (Atom)

2017年7月1日 星期六

2017年4月10日 星期一

本週主題:

1.期中考模擬考

2&3.T-R-T轉動以及打光效果

4.機器人

2017年7月1日星期六

2017年4月10日星期一