2017電腦圖學 Computer Graphics 授課教師: 葉正聖 銘傳大學資訊傳播工程系 每週主題: 程式環境、點線面顏色、移動/旋轉/縮放與矩陣(Matrix)、階層性關節轉動(T-R-T)、做出機器人、打光、貼圖、glu/glut函式、鍵盤、滑鼠、計時器(timer)、讀入3D模型、粒子系統、聲音、特效、投影矩陣、攝影機與運鏡、機器人2.0、期末作品
2017年7月2日 星期日
Week18 奶爸的筆記
影片網址:https://www.youtube.com/watch?v=NLkXfPMJJdo
心得:
這個作業花了我很多的時間及心力,大部分在找程式碼的錯誤及問題,所以其實並沒有辦法很順利的將作業完成,在音樂這部分,因為真的做不出來,所以就將音樂給捨棄了。
不過在最後做出來的時候,我覺得非常有成就感,因為這些都是我一步一步慢慢的做出來的東西,雖然說很普通很沒有創意又很爛,但這都是我自己做出來的,老師也許覺得我的作品是屬於不好的,但這是我自己做出來的成果,我很高興。
2017年6月12日 星期一
2017年6月5日 星期一
Week13 奶爸的筆記
作業一
老師講解內插法





利用內插法,將內插法放入期末作品的程式碼
存檔程式碼
讀檔程式碼
老師講解內插法





利用內插法,將內插法放入期末作品的程式碼
存檔程式碼
if(key=='s'||key=='S'){
if(fout==NULL){
fout=fopen("file.txt","w+");
printf("現在我產生一個file.txt的檔案在目錄裡\n");
}
fprintf(fout,"%.3f
%.3f %.3f %.3f %.3f %.3f %.3f %.3f
%.3f\n",angle[0],angle[1],angle[2],angle[3],angle[4],angle[5],angle[6],angle[7],angle[8]);
printf("現在我把一些數字印到檔案裡%.3f %.3f %.3f %.3f %.3f %.3f %.3f %.3f
%.3f\n",angle[0],angle[1],angle[2],angle[3],angle[4],angle[5],angle[6],angle[7],angle[8]);
}
讀檔程式碼
if(key=='r'||key=='R'){
if(fin==NULL){
fin=fopen("file.txt","r");
printf("現在我產生一個file.txt的檔案在目錄裡\n");
}
fscanf(fin,"%.3f %.3f %.3f %.3f %.3f %.3f %.3f %.3f
%.3f\n",&angle[0],&angle[1],&angle[2],&angle[3],&angle[4],&angle[5],&angle[6],&angle[7],&angle[8]);
glutPostRedisplay();
}
2017年5月22日 星期一
Week12 奶爸的筆記
作業一
用CodeBlocks開啟並且調整參數
(忘記截圖....)
作業二
glutTimerFunc( sec , timer , 0 );
用CodeBlocks開啟並且調整參數
(忘記截圖....)
作業二
glutTimerFunc( sec , timer , 0 );
#include <stdio.h>
void timer(int t) /*鬧鐘叫醒時要做什麼事~*/
{
glutTimerFunc(10,timer,t+1);
/*代表先設定下一次什麼時候鬧鐘會叫醒*/
angle++;
printf("現在時間是 %d ",t);
glutPostRedisplay();
/*提醒電腦有空要畫一下畫面哦哦哦*/
}
/*再度進入沉睡時間*/
2017年5月15日 星期一
Week11 奶爸的筆記
作業一 複習TRT
要從下面往上看
glPushMatrix();

作業二
下載Opencv https://sourceforge.net/projects/opencvlibrary/files/opencv-win/2.1/
安裝第三個

從CodeBlocks新增貝殼專案
#include <opencv/highgui.h>
要從下面往上看
glPushMatrix();
glTranslatef( 0.4 , 0.5 , 0 );
glRotatef( 30 , 0 , 0 , 1 );
glTranslatef( 0.5 , 0.3 , 0 );
glPopMatrix();

作業二
下載Opencv https://sourceforge.net/projects/opencvlibrary/files/opencv-win/2.1/
安裝第三個

從CodeBlocks新增貝殼專案
#include <opencv/highgui.h>
int main()
{
IplImage * img = cvLoadImage("C:/img.png");
cvShowImage("a",img);
cvWaitKey(0);
}
作業三
將myEarth解壓縮候用CodeBlocks開啟專案
2017年5月8日 星期一
Week10 奶爸的筆記
2017年5月1日 星期一
Week09 奶爸的筆記
HW1
1.先到網站下載3D Exploration(3D 模擬器)

2.下載3D Exploration來獲得3D模型

3.File - Save As

4.存檔類型 存成cpp Open GL code

5.選擇Sample APP,在將3D Exploration放入CodeBlocks
#include <string.h>
1.先到網站下載3D Exploration(3D 模擬器)

2.下載3D Exploration來獲得3D模型

3.File - Save As

4.存檔類型 存成cpp Open GL code

5.選擇Sample APP,在將3D Exploration放入CodeBlocks
#include <string.h>
#include <stdlib.h>
#include <GL/glut.h>
#include "glm.h"
GLMmodel* pmodel1 = NULL;
GLMmodel* pmodel2 = NULL;
GLMmodel* pmodel3 = NULL;
float angle=0;
void display()
{
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
glPushMatrix();
angle++;
glRotatef(angle, 0,1,0);
if (!pmodel1) {
pmodel1 = glmReadOBJ("data/dolphin1.obj");
if (!pmodel1) exit(0);
glmUnitize(pmodel1);
glmFacetNormals(pmodel1);
glmVertexNormals(pmodel1, 90.0);
}
if (!pmodel2) {
pmodel2 = glmReadOBJ("data/dolphin2.obj");
if (!pmodel2) exit(0);
glmUnitize(pmodel2);
glmFacetNormals(pmodel2);
glmVertexNormals(pmodel2, 90.0);
}
if (!pmodel3) {
pmodel3 = glmReadOBJ("data/dolphin3.obj");
if (!pmodel3) exit(0);
glmUnitize(pmodel3);
glmFacetNormals(pmodel3);
glmVertexNormals(pmodel3, 90.0);
}
glPushMatrix();
glTranslatef(0.5,0,0);
glScalef(0.4,0.4,0.4);
glmDraw(pmodel1, GLM_SMOOTH | GLM_MATERIAL);
glPopMatrix();
glPushMatrix();
glTranslatef(0.5,0,0);
glScalef(0.4,0.4,0.4);
glmDraw(pmodel2, GLM_SMOOTH | GLM_MATERIAL);
glPopMatrix();
glPushMatrix();
glTranslatef(0.5,0,0);
glScalef(0.4,0.4,0.4);
glmDraw(pmodel3, GLM_SMOOTH | GLM_MATERIAL);
glPopMatrix();
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 };
int main(int argc, char**argv)
{
glutInit(&argc, argv);
glutInitDisplayMode(GLUT_DOUBLE | GLUT_DEPTH | GLUT_RGB);
glutCreateWindow("Yes, 3D Model Here");
glutDisplayFunc(display);
glutIdleFunc(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();
}
2017年4月10日 星期一
Wee06 奶爸的筆記
考試重點:
HW1 打光
1.跟前幾周一樣,先開一個GLUT的專案
2.刪除程式碼,留下的程式碼就可以變成有打光的茶壺
3.增加幾行程式碼,就可以旋轉了
4可以加其他圖形的程式碼,就可以呈現出來,有實心跟空心
2017年3月27日 星期一
Week05 奶爸的筆記
期中考考題及題目:
HW1
利用右手安培定理來當竹籤,大拇指是竹籤方向,其他手指是轉動方向
竹先是轉軸,改變轉軸方向,嘗試不同的角度,
竹籤從下面往上插,轉90度
在實作的程式裡,程式碼是:
glRotatef(角度,x,y,z);
竹籤從上面往下插,轉-90度
口訣:負負得正(轉負的角度)
口訣:左耳碰左肩,從下往上讀,畫圈圈
越接近的先做
程式碼:
glPushMatrx();//備份矩陣
glTranslatef(x,y,z);//移動
glRotate(角度,x,y,z);//旋轉
glScalef(x,y,z);//縮放
glBegin(GL_POLYGON);//開始
glColor(r,g,b);//顏色
glNormal3f(nx,ny,nz);//法向量
glTexcoord3f(tx,ty);//貼圖作標
glVertex3f(x,y,z);//頂點
glEnd();//結束
glPopMatrix();//還原矩陣
***從下往上看的步驟:***
1. 有一台車
2. 有一台可以改變大小車
3. 有一台可以改變大小,且會轉動的車
4. 有一台可以改變大小,且可以跟著圓心轉動的車
2017年3月20日 星期一
Week04 奶爸的筆記
今日主題
1.旋轉 Rotate
2.移動 Translat
3.縮放 Scale
4.實作 Push matrix. PopMatrix
HW1
1.先在這個網站下載三個檔案
http://www.cmlab.csie.ntu.edu.tw/~jsyeh/3dcg10/
2.將檔案解壓縮後,都放到window的檔案裡
3.將Tranformation 打開後就可以用了
HW2
1.利用上周交的茶壺專案來做今天的課堂作業
並且自己寫程式碼,讓茶壺移動位置
#include <GL/glut.h>
void display()
{
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
glPushMatrix();
glTranslatef(0.5,0,0);
glutSolidTeapot(0.3);
glPopMatrix();
glutSwapBuffers();
}
int main(int argc, char **argv)
{
glutInit(&argc, argv);
glutInitDisplayMode(GLUT_RGB | GLUT_DOUBLE | GLUT_DEPTH);
glutCreateWindow("04162753");
glutDisplayFunc(display);
///glutMouseFunc(mouse);
///glutMotionFunc(motion);
glutMainLoop();
}
2.加上程式碼讓茶壺隨著滑鼠移動
#include <GL/glut.h>
float mouseX=0, mouseY=0;
void display()
{
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
glPushMatrix();
glTranslatef(mouseX,mouseY,0);
glutSolidTeapot(0.3);
glPopMatrix();
glutSwapBuffers();
}
void motion(int x,int y)
{
mouseX = (x-150)/150.0;
mouseY = -(y-150)/150.0;
glutPostRedisplay();
}
int main(int argc, char **argv)
{
glutInit(&argc, argv);
glutInitDisplayMode(GLUT_RGB | GLUT_DOUBLE | GLUT_DEPTH);
glutCreateWindow("04162753");
glutDisplayFunc(display);
///glutMouseFunc(mouse);
glutMotionFunc(motion);
glutMainLoop();
}
3.把程式碼的一個改掉
glTranslatef(mouseX,mouseY,0);
改成 glScalef(mouseX,mouseY,0);
2017年3月13日 星期一
Week03 奶爸的筆記
HW1
1.一樣先複習上周的茶壺
先建立一個專案後,依照Week01的步驟製作出專案,並且將程式碼刪除到勝十行
並改為茶壺的程式碼
#include <GL/glut.h>
static void display(void)
{
glutSolidTeapot(0.3);
glutSwapBuffers();
}
int main(int argc, char *argv[])
{
glutInit(&argc, argv);
glutInitDisplayMode(GLUT_RGB | GLUT_DOUBLE | GLUT_DEPTH);
glutCreateWindow("I am superman 04162753");
glutDisplayFunc(display);
glutMainLoop();
}

2.將滑鼠的座標在小黑窗顯示 並且按一下就會有兩個數值

3.加上一段程式碼 並且可以讓茶壺隨著滑鼠點的位置變色
加上:
glColor3f(1,x/300.0,y/300.0);
glutPostRedisplay();

4.再加上一個函式 讓顏色跟著滑鼠的移動而改變
加上:
void motion(int x, int y)
{
printf("%d %d\n",x,y);
glColor3f(1,x/500.0,y/500.0);
glutPostRedisplay();
}

5.可以在加上一段程式碼來自己畫圖
將畫茶壺的那段程式碼複製的座標
並且頭尾加上: glBegin(GL_TRIANGLE_FAN);
glEnd();
6.再加上一段畫圓的函式 就可以設定元的大小及範圍
(1)畫圓的函式:(這個是畫實心的圓)
void display()
{
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
glBegin(GL_LINE_LOOP);
for(float angle=0;angle<3.1415926*2;angle+=0.001){
glVertex2f(cos(angle),sin(angle));
}
glEnd();
glutSwapBuffers();
}

(2)畫圓的函式:(這個是畫空心的圓)
void display()
{
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
glBegin(GL_POLYGON);
for(float angle=0;angle<3.1415926*2;angle+=0.001){
glVertex2f(cos(angle),sin(angle));
}
glEnd();
glutSwapBuffers();
}
1.一樣先複習上周的茶壺
先建立一個專案後,依照Week01的步驟製作出專案,並且將程式碼刪除到勝十行
並改為茶壺的程式碼
#include <GL/glut.h>
static void display(void)
{
glutSolidTeapot(0.3);
glutSwapBuffers();
}
int main(int argc, char *argv[])
{
glutInit(&argc, argv);
glutInitDisplayMode(GLUT_RGB | GLUT_DOUBLE | GLUT_DEPTH);
glutCreateWindow("I am superman 04162753");
glutDisplayFunc(display);
glutMainLoop();
}

2.將滑鼠的座標在小黑窗顯示 並且按一下就會有兩個數值

3.加上一段程式碼 並且可以讓茶壺隨著滑鼠點的位置變色
加上:
glColor3f(1,x/300.0,y/300.0);
glutPostRedisplay();

4.再加上一個函式 讓顏色跟著滑鼠的移動而改變
加上:
void motion(int x, int y)
{
printf("%d %d\n",x,y);
glColor3f(1,x/500.0,y/500.0);
glutPostRedisplay();
}

5.可以在加上一段程式碼來自己畫圖
將畫茶壺的那段程式碼複製的座標
並且頭尾加上: glBegin(GL_TRIANGLE_FAN);
glEnd();
6.再加上一段畫圓的函式 就可以設定元的大小及範圍
(1)畫圓的函式:(這個是畫實心的圓)
void display()
{
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
glBegin(GL_LINE_LOOP);
for(float angle=0;angle<3.1415926*2;angle+=0.001){
glVertex2f(cos(angle),sin(angle));
}
glEnd();
glutSwapBuffers();
}

(2)畫圓的函式:(這個是畫空心的圓)
void display()
{
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
glBegin(GL_POLYGON);
for(float angle=0;angle<3.1415926*2;angle+=0.001){
glVertex2f(cos(angle),sin(angle));
}
glEnd();
glutSwapBuffers();
}
8.改數字可以把圓變成是橢圓
2017年3月6日 星期一
Week02 奶爸的筆記
上周上課複習1
上周上課複習2

上課作業1
將GLUT的程式碼縮減為只剩10行的程式碼,並且將程式執行
#include <GL/glut.h>
static void display(void)
{
glutSolidTeapot(0.3);
glutSwapBuffers();
}
int main(int argc, char *argv[])
{
glutInit(&argc, argv);
glutInitDisplayMode(GLUT_RGB | GLUT_DOUBLE | GLUT_DEPTH);
glutCreateWindow("I am superman 04162753");
glutDisplayFunc(display);
glutMainLoop();
}

上課作業2
換茶壺顏色在程式碼加上
glColor3f(0,0,0);
第一個數字是紅 第二個是綠 第三個是藍(皆以0-1表示)

上課作業3
利用作業2的顏色加上座標來更改點 線 面的程式碼,做一個彩色的三角形

上周上課複習2

上課作業1
將GLUT的程式碼縮減為只剩10行的程式碼,並且將程式執行
#include <GL/glut.h>
static void display(void)
{
glutSolidTeapot(0.3);
glutSwapBuffers();
}
int main(int argc, char *argv[])
{
glutInit(&argc, argv);
glutInitDisplayMode(GLUT_RGB | GLUT_DOUBLE | GLUT_DEPTH);
glutCreateWindow("I am superman 04162753");
glutDisplayFunc(display);
glutMainLoop();
}

上課作業2
換茶壺顏色在程式碼加上
glColor3f(0,0,0);
第一個數字是紅 第二個是綠 第三個是藍(皆以0-1表示)

上課作業3
利用作業2的顏色加上座標來更改點 線 面的程式碼,做一個彩色的三角形

2017年2月20日 星期一
Week1 奶爸的筆記
訂閱:
文章 (Atom)



































