LBH的計圖學習筆記_week 18

計算機圖學期末專題展示  -  3D迷宮

LBH的計圖學習筆記_week 17

一 、 上課內容

1. 期末專題製作

LBH的計圖學習筆記_week 16

一 、 上課內容

1. 期末專題製作

LBH的計圖學習筆記_week 15

一 、 上課內容

1. Antialias

2. 期末作品 Q & A

LBH的計圖學習筆記_week 14

一 、 上課內容
1. rasterization  =>  把每個pixel塗上顏色

2. 用p語言寫rasterization的範例程式碼 :

   size(600,600,P3D);
   background(255); /// 背景為白色
   beginShape(TRIANGLE);   ///  畫三角形
       fill(填顏色);  vertex(二維座標);
       fill(填顏色);  vertex(二維座標);
       fill(填顏色);  vertex(二維座標);
   endShape();

LBH的計圖學習筆記_week 13

一、 上課內容
1. VR設備體驗
2. 用p語言產生色彩系統
    colorMode(RGB 或 HSB , 255);
    程式碼 :
    size(255,255);
    colorMode(HSB,255);
    for(int x=0;x<255;x++){
         for(int j=0;j<255;j++){
              stroke(x,y,255);
              point(x,y);
         }
    }
3. opengl讀多張圖片時，要在main裡讀完，不能放在display裡。
4. 畫面等速 : 運用glutTimerFunc

LBH的計圖學習筆記_week 12

一 、 上課內容
1. 編譯上課下載的程式
    (1) 要把.txt檔放進專案中，這樣程式才讀的到
    (2) 加程式碼 :
          glutInit(&argc,argv);
          glutInitDisplayMode(GLUT_RGB|GLUT_DOUBLE|GLUT_DEPTH);
    (3) 成功執行


2. 主題 : Scene場景、Mocap、Skeleton、Model
    用processing 3執行3D範例程式
    下載testBVH檔案，並執行看看

LBH的計圖學習筆記_week 11

一、讓程式有聲音

1. 只能播放wav音樂
#include<mmsystem.h> /// 使用Multimedia System多媒體系統
PlaySoundA("放檔名",NULL,SND_ASYNC);
 /// 檔名、在哪裡、如何播(SND_SYNC、SND_ASYNC)前者需等聲音播完才執行之後的
     程式，後者不用等

2. 播mp3音樂
下載CMP3_MCI.h，放到專案檔
程式碼 :
#include"CMP3_MCI.h"
int main(){
    mps.Load("檔名"); /// 讀入mp3檔
    mp3.Play(); /// 播放mp3檔
}

3. processing 3 播mp3音樂
下載Minim  libraries
程式碼 :
import dff.minim.*; // use ddf's minim music library
Minim minim; // int a; the whole system
AudioPlayer player; // corresponding to one mp3 file
void setup(){
     minim = new Minim(this); // constructor of Minim Object
     player = minim.loadFile("檔名"); // minim load to player
     player.play();
}

LBH的計圖學習筆記_week 10

一、 上課內容

1. 觀看SIGGRAPH 影片

2. 寫寫看 android 程式
(1)  processing更改mode方式 : 右上角點添加模式，選android，安裝。

(2)  程式碼 :

(滑鼠點擊，螢幕切換顏色)
void setup(){
     fullscreen();  ///   全螢幕
}
void draw(){
     if(mousePressed){
            background(255,0,0); ///  改背景顏色(紅)
     }
      else{
            background(0,255,0);///  改背景顏色(綠)
     }

}

LBH的計圖學習筆記_week 09

一、上課內容

1. bump mapping :凹凸貼圖
2. 去 http://www.openprocessing.org/sketch/249457 觀摩別人的程式碼
3. 下載processing 3壓縮檔，執行processing.exe，貼程式碼上去跑跑看

4.  程式碼 :

PImage img=loadImage("圖片檔案名"); ///讀圖檔，把圖片檔拖曳進視窗，即可把圖檔存進去

size(600,600); ///把視窗大小設成 600 X 600

fill("數字"); ///填充顏色(點選工具-> 顏色選擇器 複製16進位的數字)

image(img,0,0,600,600); ///顯示圖片，在(0,0)的地方，畫出600 X 600 的圖片

rect(10,10,50,50); ///畫正方形，在(10,10)的地方，畫出50 X 50 的正方形


隨著滑鼠移動，一直印出圖片
PImage img;
void setup(){
     size(1280,800);
     img=loadImage("dora.png");
}
void draw(){
    image(img,mouseX,mouseY);
}

LBH的計圖學習筆記_week 08

1. 執行Texture，嘗試變動參數

2. 下載opencv 2.1(vs 2008版本)，並安裝。安裝時，路徑選項要選第三個。

3. 找好地球的圖片，放在專案檔裡
4. 打開codeblocks，建立專案，點 Console application。對專案檔按右鍵，點build options

5. 按照圖片依序進行設定 (compiler 對 include ，linker 對 lib)



6. 輸入程式碼，執行，即可看到圖片顯示出來
#include<opencv/highgui.h>
int main(){
    IplImage * img= cvLoadImage("earth.jpg");
    cvNamedWindow("hello");
    cvShowImage("hello",img);
    cvWaitKey(0);
    return 0;
}

7. 下載 week08-3earth.zip ，執行程式，出現會旋轉的地球

LBH的計圖學習筆記_week 07

一、 程式碼 (先開啟 glut 內建範例程式碼)

1. 改變長寬比 (視窗放大縮小不會影響比例)

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

   }

2. 用滑鼠改變光源 「x座標 」位置，全域變數光源位置的陣列 (GLfloat light_position[]) 前面 

    的 const 要刪掉，主函式 main() 加上 glutMotionFunc(motion);

    GLfloat light_position[] = { 2.0f, 5.0f, 5.0f, 0.0f }; /// 光的位置

    void motion(int x,int y){

       light_position[0]=(x-150)/150.0;

       light_position[1]=-1*(y-150)/150.0;

       glLightfv(GL_LIGHT0, GL_POSITION, light_position);

       glutPostRedisplay();

   }

   

   執行結果 :

LBH的計圖學習筆記_week 06

一 、 控制鍵盤事件程式碼

/// 放全域
int rotateX=0,rotateY=0,rotateZ=0;
int oldX=0,oldY=0;

 /// 放主函式glutDisplayFunc後
glutMouseFunc(mouse);
glutMotionFunc(motion);
glutKeyboardFunc(keyboard);

void keyboard(unsigned char key,int x,int y){  /// 參數依序是(按鍵字元，x座標，y座標)
      if(key=='1'){
        rotateX++;
      }
      if(key=='2'){
        rotateY++;
      }
      if(key=='3'){
        rotateZ++;
      }
      glutPostRedisplay(); /// 貼出公告，請電腦有空時，把畫面重新 re-display
}
void display(){
    glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
    glPushMatrix();
        glRotatef(rotateX,1,0,0);
        glRotatef(rotateY,0,1,0);
        glRotatef(rotateZ,0,0,1);
        drawmodel();
    glPopMatrix();
    glutSwapBuffers();
}
void mouse(int button,int state,int x,int y){
    if(state==GLUT_DOWN){ /// 滑鼠按下去
        oldX=x;
        oldY=y;
    }
}
void motion(int x,int y){
    rotateY+=(-1*(x-oldX));
    rotateX+=(-1*(y-oldY));
    oldX=x;
    oldY=y;
    glutPostRedisplay();
}

二 、 課堂練習  

1. 編譯執行Tranformation 程式(若卡在strdup()，修改complier設定，把c++ 11的選項取消掉，
    即可成功執行)




2. 開啟打光功能
    程式碼 :  (全域變數)
                   (1) GLfloat pos[]={0.0,0.0,-1.0,0.0};

                   (放在glutCreateWindow之後，glutMainLoop之前)
                   (2) glEnable(GL_DEPTH_TEST);
                   (3) glEnable(GL_LIGHT0); /// 打開打光功能
                   (4) glEnable(GL_LIGHTING);
                   (5) glLightfv(GL_LIGHT0,GL_POSITION,pos);

LBH的計圖學習筆記_week 05

一 、課堂練習

1. 進入網址 jsyeh.org/3dcg10 ， 下載 Eeamples中的 data , win32以及 glut32.dll，把全部東西解
    壓縮放在同一個資料夾，執行 Transformation ，使用裡頭的功能



2. 執行先前資料夾裡的  Projection (按右鍵可以選擇投影模式)
    gluPerspective(控制視野大小 , 長寬(x,y)比 ,  z軸靠近的平面  , z軸遠離的平面)  : 透視投影
    gluLookat(眼睛位置(x,y,z) , 被看的人的位置(x,y,z) , up方向(x,y,z))
    glOrtho(左邊界,右邊界,上邊界,下邊界, z軸靠近的平面  , z軸遠離的平面) : 垂直投影

LBH的計圖學習筆記_week 04

一 、 函式

1. glTranslated(移動x座標多少距離、移動y座標多少距離、移動z座標多少距離) : 可以改變位
    置(會影響之後的程式碼)
2. glRotated(度數、旋轉軸) : 一直旋轉，ex: glRotated(60,1,0,0) => 對x軸旋轉60度(右手座標系
    統)(座標軸的座標會自動正規劃)

二 、 程式碼

控制滑鼠事件 :

float dx,dy,dz; /// 我要畫的3D位置
int oldx,oldy,oldz; /// 舊的x,y,z位置

void  motion(int x,int y){  /// 用來拖著移動時
dx+=(x-oldx)/150.0;
dy+= -1*(y-oldy)/150.0;
oldx=x;
oldy=y;
glutPostRedisplay(); /// 貼便利貼  請電腦重畫
}
void mouse(int button,int state,int x,int y){
if(state==GLUT_DOWN){
oldx=x,oldy=y; /// 紀錄點擊時的座標
}
int main(){
        glutInit(&argc, argv);
        glutInitWindowSize(640,480);
        glutInitWindowPosition(10,10);
        glutInitDisplayMode(GLUT_RGB | GLUT_DOUBLE | GLUT_DEPTH);
        glutCreateWindow("GLUT Shapes");
        glutMouseFunc(mouse);
        glutMotionFunc(motion);
        glutMainLoop();
}

display函式裡 :

glPushMatrix(); /// 備份矩陣
        glTranslated(-2.4,1.2,-6); /// 移動
        glRotated(60,1,0,0); /// 轉一次
        glRotated(a,0,0,1); /// 隨時間一直轉
        glScalef(1.5,1.5,1.5); /// 改變大小
        glColor3d(0,1,0);
        glutSolidTeapot(1);
        glColor3d(1,0,0);
glPopMatrix(); /// 還原矩陣

三 、 課堂練習

1. 修改glut專案範例程式碼，在display函式中，glPushMatrix()跟glPopMatrix()中間加入
    glutSolidTeapot(1)並註解glutSolidSphere，使程式執行時，畫出會旋轉的茶壺。



2. 把所有glRotated先註解掉，留下控制左上角的glRotated，執行後可以發現只有左上角的圖案
    在旋轉。

3. 修改glut專案範例程式碼，在display函式中，第一個glPushMatrix()跟glPopMatrix()中間加入
    glScalef(1.5,1.5,1.5)，執行後會發現左上角的圖案放大1.5倍。



4. 運用上方滑鼠事件的程式碼，讓圖案可以隨著滑鼠點擊移動。

LBH的計圖學習筆記_week 03

一、 程式技巧

1. fscanf 少放在常用到的函式或迴圈中，速度會變慢
2. 讀檔時，要讀的檔案要放在 freeglut 資料夾的 bin 裡面

二、 3D模型

1. 找一個3D模型，用 3D exploration 開啟


2. 存檔，格式為 .cpp


3. 最上方選 Simple App，然後選 ok


4.  開啟 opengl 專案


5. 把剛剛產生的cpp檔程式碼貼上，刪掉舊的程式碼，然後執行

LBH的計圖學習筆記_week 02

一、 畫茶壺
程式碼 :
#include <GL/glut.h> /// 呼叫函式庫(外掛)
void Display()
{
    glClearColor(1,0,0,0); /// 標示背景用的色彩  紅色(參數依序 紅 綠 藍 透明度)
    glClear(GL_COLOR_BUFFER_BIT|GL_DEPTH_BUFFER_BIT); /// 清 顏色|3D
    glColor3f(1,0,1); /// 用來設定物件的顏色  3表示3個參數  f為浮點數
    glutSolidTeapot(0.3); /// 畫出實心的茶壺
    glutSwapBuffers(); /// 交換繪圖buffer(記憶體)
}
int main(int argc, char *argv[])
{
    glutInit(&argc, argv); /// 初始化(用主函式參數)
    glutInitDisplayMode(GLUT_RGB | GLUT_DOUBLE | GLUT_DEPTH); /// 設定顯示模式
    glutCreateWindow("GLUT Shapes"); /// 創造GLUT_3D視窗
    glutDisplayFunc(Display); /// 註冊Display函式
    glutMainLoop(); /// 主要迴圈(讓程式一直跑)
    return 0;
}

執行結果 :


二、 畫三角形(點、線、面)
程式碼 :
#include <GL/glut.h> 
void Display()
{
    glClearColor(1,0,0,0);
    glClear(GL_COLOR_BUFFER_BIT|GL_DEPTH_BUFFER_BIT);
    glColor3f(1,0,1);
    glBegin(GL_POLYGON); /// 開始畫(多邊形)
    glVertex3f(-1,1,0); /// Vertex為點 3為3個參數 x,y,z
    glVertex3f(1,1,0);
    glVertex3f(0,-1,0);
    glEnd(); /// 結束
    glutSwapBuffers();
}
int main(int argc, char *argv[])
{
    glutInit(&argc, argv);
    glutInitDisplayMode(GLUT_RGB | GLUT_DOUBLE | GLUT_DEPTH);
    glutCreateWindow("GLUT Shapes");
    glutDisplayFunc(Display);
    glutMainLoop();
    return 0;

}

執行結果 :

LBH的計圖學習筆記_week 01

一 、 opengl

1. 建專案


2.點擊opengl 建立專案


3. 打開程式碼


4.按F9執行，出現畫面


二、 glut

1. 複製一個libfreeglut.a，並把檔名改成libglut32


2.點擊glut 建立專案


3.把路徑改成C:\Users\user\Desktop\freeglut


4.點開程式碼 按F9執行