week17_陳彥儒

Week 17 一權的上課筆記

(1)背景貼圖示範

(2)打光貼圖示範

(3)讀檔內插示範

STEP 1：
         1.使用notepad++加入以下幾行程式碼:

        2.專案資料夾內要有以下這幾個檔案:

STEP 2：貼圖(使用FB下載老師的專案檔練習)
         1、一個圓形，貼上地球儀

      2、修改程式碼，將地球貼在平面背景

       3、匯入模型，加入以下程式碼

4、完成打光

Week17 浩丁週街的上課筆記

第17週上課筆記

Week 17 語璇電圖

示範 myEarth.zip變 背景貼圖
  freeglut裝桌面\freeglut\include
                                        \lib
                                        \bin
  openCV2.1裝C:\OpenCV2.1\include
                                                 \lib
                                                 \bin
把display裡 註解掉(///) 畫地球
glBegin(GL_POLYGON)
   glTexCoord2f(0,0);glVertex3f(-1,+1,0);
   

glTexCoord2f(1,0);glVertex3f(+1,+1,0);
  

 glTexCoord2f(1,1);glVertex3f(+1,-1,0);
  

 glTexCoord2f(0,1);glVertex3f(-1,-1,0);
 

 glEnd();

04163022_溫洺漢, week17

1.期末作品示範
2.背景貼圖示範
3.打光,貼圖切換
4.讀檔內插示範
5.學期總複習

必須先下載OpenCV 2.1 並安裝到桌面
還需要cv210 / cxcore210 / highgui210 這三個檔案

void display()
{   
glEnable(GL_DEPTH_TEST); ///要啟動 Detph Test 深度值的測試,3D顯示才正確
    glClear(GL_COLOR_BUFFER_BIT  | GL_DEPTH_BUFFER_BIT);
    glPushMatrix();
        glBegin(GL_POLYGON);
            glTexCoord2f(0,0); glVertex3f(-1,+1,0);///前面是貼圖座標，後面是3D頂點
            glTexCoord2f(1,0); glVertex3f(+1,+1,0);
            glTexCoord2f(1,1); glVertex3f(+1,-1,0);
            glTexCoord2f(0,1); glVertex3f(-1,-1,0);
        glEnd();
    glPopMatrix();
    glFlush();
}

void myInit()
{
    quad = gluNewQuadric();
    id = myTexture("images.jpg");///id為貼圖，這樣就可以讀到貼圖的路徑

}




int myTexture(char *filename)
{
    IplImage * img = cvLoadImage(filename); ///OpenCV讀圖
    cvCvtColor(img,img, CV_BGR2RGB); ///OpenCV轉色彩 (需要cv.h)
    glEnable(GL_TEXTURE_2D); ///1. 開啟貼圖功能
    GLuint id; ///準備一個 unsigned int 整數, 叫 貼圖ID
    glGenTextures(1, &id); /// 產生Generate 貼圖ID
    glBindTexture(GL_TEXTURE_2D, id); ///綁定bind 貼圖ID
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_REPEAT); /// 貼圖參數, 超過包裝的範圖T, 就重覆貼圖
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_REPEAT); /// 貼圖參數, 超過包裝的範圖S, 就重覆貼圖
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_NEAREST); /// 貼圖參數, 放大時的內插, 用最近點
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_NEAREST); /// 貼圖參數, 縮小時的內插, 用最近點
    glTexImage2D(GL_TEXTURE_2D, 0, GL_RGB, img->width, img->height, 0, GL_RGB, GL_UNSIGNED_BYTE, img->imageData);
    return id;

}

 

week17_陳18

期末作品展示

網址:https://youtu.be/0zkt-zwhfpA

Week17 閻覃的期末作品展示

Week 17 碩碩

期末展:

2017 Week18 ID張凱盛

https://www.youtube.com/watch?v=PvPFtOViZHk

Week17 魚安的筆記

1.期末作品示範
2.背景貼圖示範
3.打光,貼圖切換
4.讀檔內插示範
5.學期總複習

必須先下載OpenCV 2.1 並安裝到桌面
還需要cv210 / cxcore210 / highgui210 這三個檔案

void display()
{   
glEnable(GL_DEPTH_TEST); ///要啟動 Detph Test 深度值的測試,3D顯示才正確
    glClear(GL_COLOR_BUFFER_BIT  | GL_DEPTH_BUFFER_BIT);
    glPushMatrix();
        glBegin(GL_POLYGON);
            glTexCoord2f(0,0); glVertex3f(-1,+1,0);///前面是貼圖座標，後面是3D頂點
            glTexCoord2f(1,0); glVertex3f(+1,+1,0);
            glTexCoord2f(1,1); glVertex3f(+1,-1,0);
            glTexCoord2f(0,1); glVertex3f(-1,-1,0);
        glEnd();
    glPopMatrix();
    glFlush();
}

void myInit()
{
    quad = gluNewQuadric();
    id = myTexture("images.jpg");///id為貼圖，這樣就可以讀到貼圖的路徑

}




int myTexture(char *filename)
{
    IplImage * img = cvLoadImage(filename); ///OpenCV讀圖
    cvCvtColor(img,img, CV_BGR2RGB); ///OpenCV轉色彩 (需要cv.h)
    glEnable(GL_TEXTURE_2D); ///1. 開啟貼圖功能
    GLuint id; ///準備一個 unsigned int 整數, 叫 貼圖ID
    glGenTextures(1, &id); /// 產生Generate 貼圖ID
    glBindTexture(GL_TEXTURE_2D, id); ///綁定bind 貼圖ID
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_REPEAT); /// 貼圖參數, 超過包裝的範圖T, 就重覆貼圖
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_REPEAT); /// 貼圖參數, 超過包裝的範圖S, 就重覆貼圖
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_NEAREST); /// 貼圖參數, 放大時的內插, 用最近點
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_NEAREST); /// 貼圖參數, 縮小時的內插, 用最近點
    glTexImage2D(GL_TEXTURE_2D, 0, GL_RGB, img->width, img->height, 0, GL_RGB, GL_UNSIGNED_BYTE, img->imageData);
    return id;

}

郭羽筆記week17

1. 糾正貼圖出現的錯誤：
貼圖部分的程式碼如下：
int myTexture(char *filename)
{
    IplImage * img = cvLoadImage(filename); ///OpenCV讀圖
    cvCvtColor(img,img, CV_BGR2RGB); ///OpenCV轉色彩 (需要cv.h)
    glEnable(GL_TEXTURE_2D); ///1. 開啟貼圖功能
    GLuint id; ///準備一個 unsigned int 整數, 叫 貼圖ID
    glGenTextures(1, &id); /// 產生Generate 貼圖ID
    glBindTexture(GL_TEXTURE_2D, id); ///綁定bind 貼圖ID
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_REPEAT); /// 貼圖參數, 超過包裝的範圖T, 就重覆貼圖
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_REPEAT); /// 貼圖參數, 超過包裝的範圖S, 就重覆貼圖
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_NEAREST); /// 貼圖參數, 放大時的內插, 用最近點
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_NEAREST); /// 貼圖參數, 縮小時的內插, 用最近點
    glTexImage2D(GL_TEXTURE_2D, 0, GL_RGB, img->width, img->height, 0, GL_RGB, GL_UNSIGNED_BYTE, img->imageData);
    return id;
}

void display(){
    ...
    glPushMatrix();
        glBegin(GL_POLYGON);
        //前面是贴图坐标，后面是3d坐标
        glTexCoord2f(0,0); glVertex3f(-2.5,+2,-1);
        glTexCoord2f(1,0); glVertex3f(+2.5,+2,-1);
        glTexCoord2f(1,1); glVertex3f(+2.5,-2,-1);
        glTexCoord2f(0,1); glVertex3f(-2.5,-2,-1);
    glEnd();
    glPopMatrix();
    ...
}

int main(){
    ....
    id = myTexture("image.jpg");
    glutMainLoop();
}

但是貼圖完成後會出現原來的機器人色彩變暗的現象。原因是貼圖和3D模型部分使用的是不同的光效方式，所以需要在貼圖前後進行轉換。

修改後的程式碼如下：
void display(){
    ...
    glEnable(GL_TEXTURE_2D);
    glDisable(GL_LIGHTING);
    glPushMatrix();
    glBegin(GL_POLYGON);
    //前面是贴图坐标，后面是3d坐标
        glTexCoord2f(0,0); glVertex3f(-2.5,+2,-1);
        glTexCoord2f(1,0); glVertex3f(+2.5,+2,-1);
        glTexCoord2f(1,1); glVertex3f(+2.5,-2,-1);
        glTexCoord2f(0,1); glVertex3f(-2.5,-2,-1);
    glEnd();
    glPopMatrix();
    glDisable(GL_TEXTURE_2D);
    glEnable(GL_LIGHTING);
    ....
}



2. 糾正視角轉換中出現的錯誤：
剛開始的時候我的（個人）機器人模型在使用gluPerspective函式透視效果後會出現機器人模型色彩混亂的現象，在小葉老師的幫助下，我知道了這是由於我找的模型有打光正反向混亂的問題。解決的方法是使內外兩面都給光就好了，並且修改原來的打光方向：

display函式中添加：glLightModeli(GL_LIGHT_MODEL_TWO_SIDE, GL_TRUE);
全局光效數組：
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 };

Week17_魚筆記

複習之所做過的機器人相關程式碼，好讓我們可以成功完成會動的機器人

作業一

貼上背景圖

1.下載openCV 2.1版本並安裝

2.在my earth檔案中修改程式碼讓自己的圖片成功跑出

#include <opencv/highgui.h> ///for cvLoadImage()

#include <opencv/cv.h> ///for cvCvtColor()

#include <GL/glut.h> ///3D glut

#include <stdio.h>

GLUquadric * quad;

GLuint id;

float angle=0;

void display()

{   glEnable(GL_DEPTH_TEST); ///要啟動 Detph Test 深度值的測試,3D顯示才正確

    glClear(GL_COLOR_BUFFER_BIT  | GL_DEPTH_BUFFER_BIT);

    glPushMatrix();///自動轉很帥

        glBegin(GL_POLYGON);

            glTexCoord2f(0,0); glVertex3f(-1,+1,0);

            glTexCoord2f(1,0); glVertex3f(+1,+1,0);

            glTexCoord2f(1,1); glVertex3f(+1,-1,0);

            glTexCoord2f(0,1); glVertex3f(-1,-1,0);

    glPopMatrix();///自動轉很帥

    glFlush();

}

void timer(int t)

{   glutTimerFunc(20, timer, 0);/// 1000 msec   50fps:20msec

    angle+=1;///自動轉很帥

    glutPostRedisplay();

}

int myTexture(char *filename)

{

    IplImage * img = cvLoadImage(filename); ///OpenCV讀圖

    cvCvtColor(img,img, CV_BGR2RGB); ///OpenCV轉色彩 (需要cv.h)

    glEnable(GL_TEXTURE_2D); ///1. 開啟貼圖功能

    GLuint id; ///準備一個 unsigned int 整數, 叫 貼圖ID

    glGenTextures(1, &id); /// 產生Generate 貼圖ID

    glBindTexture(GL_TEXTURE_2D, id); ///綁定bind 貼圖ID

    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_REPEAT); /// 貼圖參數, 超過包裝的範圖T, 就重覆貼圖

    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_REPEAT); /// 貼圖參數, 超過包裝的範圖S, 就重覆貼圖

    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_NEAREST); /// 貼圖參數, 放大時的內插, 用最近點

    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_NEAREST); /// 貼圖參數, 縮小時的內插, 用最近點

    glTexImage2D(GL_TEXTURE_2D, 0, GL_RGB, img->width, img->height, 0, GL_RGB, GL_UNSIGNED_BYTE, img->imageData);

    return id;

}

void myInit()

{   

    quad = gluNewQuadric();

    id = myTexture("we1.jpg");

}

int main(int argc, char**argv)

{   glutInit(&argc, argv);

    glutCreateWindow("3D");

    glutDisplayFunc(display); ///顯示

    glutTimerFunc(0, timer, 0);

    myInit(); ///我的 init 初始化 把貼圖準備好 前面OpenCV 2行, 後面 OpenGL 9行

    glutMainLoop();

}

3.將my earth和自己機器人的專案檔(.cbp)用notepad++開啟，並複製my earth部分程式碼進去自己專案內

<?xml version="1.0" encoding="UTF-8" standalone="yes" ?>

<CodeBlocks_project_file>

<FileVersion major="1" minor="6" />

<Project>

<Option title="04160116_FinalProject" />

<Option pch_mode="2" />

<Option compiler="gcc" />

<Build>

<Target title="Debug">

<Option output="bin/Debug/04160011_hw1" prefix_auto="1" extension_auto="1" />

<Option working_dir="." />

<Option object_output="obj/Debug/" />

<Option type="1" />

<Option compiler="gcc" />

<Compiler>

<Add option="-g" />

</Compiler>

</Target>

<Target title="Release">

<Option output="bin/Release/04160011_hw1" prefix_auto="1" extension_auto="1" />

<Option working_dir="." />

<Option object_output="obj/Release/" />

<Option type="0" />

<Option compiler="gcc" />

<Compiler>

<Add option="-O2" />

</Compiler>

<Linker>

<Add option="-s" />

</Linker>

</Target>

</Build>

<Compiler>

<Add option="-Wall" />

<Add directory="c:/opencv2.1/include" />

<Add directory="C:\Users\user\Desktop\freeglut\include" />

</Compiler>

<Linker>

<Add library="cv210" />

<Add library="cxcore210" />

<Add library="highgui210" />

<Add library="glut32" />

<Add library="opengl32" />

<Add library="glu32" />

<Add library="winmm" />

<Add library="gdi32" />

<Add directory="c:/opencv2.1/lib" />

<Add directory="C:\Users\user\Desktop\freeglut\lib" />

</Linker>

<Unit filename="glm.cpp">

<Option compilerVar="CC" />

</Unit>

<Unit filename="main.cpp" />

<Extensions>

<code_completion />

<envvars />

<debugger />

<lib_finder disable_auto="1" />

</Extensions>

</Project>

</CodeBlocks_project_file>

4.將my earth讀程式碼加進去自己專案中，成功跑出背景圖來

int myTexture(char *filename)

{

    IplImage * img = cvLoadImage(filename); ///OpenCV讀圖

    cvCvtColor(img,img, CV_BGR2RGB); ///OpenCV轉色彩 (需要cv.h)

    glEnable(GL_TEXTURE_2D); ///1. 開啟貼圖功能

    GLuint id; ///準備一個 unsigned int 整數, 叫 貼圖ID

    glGenTextures(1, &id); /// 產生Generate 貼圖ID

    glBindTexture(GL_TEXTURE_2D, id); ///綁定bind 貼圖ID

    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_REPEAT); /// 貼圖參數, 超過包裝的範圖T, 就重覆貼圖

    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_REPEAT); /// 貼圖參數, 超過包裝的範圖S, 就重覆貼圖

    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_NEAREST); /// 貼圖參數, 放大時的內插, 用最近點

    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_NEAREST); /// 貼圖參數, 縮小時的內插, 用最近點

    glTexImage2D(GL_TEXTURE_2D, 0, GL_RGB, img->width, img->height, 0, GL_RGB, GL_UNSIGNED_BYTE, img->imageData);

    return id;

}

void myInit()

{   

    id = myTexture("we1.jpg");

}

void display()

{   glEnable(GL_DEPTH_TEST); ///要啟動 Detph Test 深度值的測試,3D顯示才正確

    glClear(GL_COLOR_BUFFER_BIT  | GL_DEPTH_BUFFER_BIT);

    glPushMatrix();///自動轉很帥

        glBegin(GL_POLYGON);

            glTexCoord2f(0,0); glVertex3f(-1,+1,0);

            glTexCoord2f(1,0); glVertex3f(+1,+1,0);

            glTexCoord2f(1,1); glVertex3f(+1,-1,0);

            glTexCoord2f(0,1); glVertex3f(-1,-1,0);

        glEnd();

    glPopMatrix();///自動轉很帥

    glFlush();

}

#include <opencv/highgui.h> ///for cvLoadImage()

#include <opencv/cv.h> ///for cvCvtColor()

#include <GL/glut.h> ///3D glut

GLuint id;

 myInit(); ///我的 init 初始化 把貼圖準備好 前面OpenCV 2行, 後面 OpenGL 9行

5.打光，讓自己的模型不受圖檔點影響
glEnable(GL_TEXTURE_2D);///開2D貼圖
glDisable(GL_LIGHTING);///關掉打光
glDisable(GL_TEXTURE_2D);///關掉貼圖，才不因為最後貼圖點影響你的模型
glEnable(GL_LIGHTING);///打開打光

6.移3個檔案進自己的專案資料夾中

作業二

使用Timer播放

接續自己專案檔的程式碼，新增計時器的函式

void timer(int t)
{
    glutTimerFunc(100,timer,t+1);

    if(fin==NULL){

        fin=fopen("file.txt","r");   //開啟檔案，檔名準備好，而且是用read模式

        printf("Now open a file.txt for read Mode\n");

        fscanf(fin,"%f %f %f %f %f %f %f %f %f %f",&newAngle[0],&newAngle[1],&newAngle[2],&newAngle[3],&newAngle[4],&newAngle[5],&newAngle[6],&newAngle[7],&newAngle[8],&newAngle[9]

);

    }

    if(alpha>=1.0){

       for(int i=0;i<10;i++) oldAngle[i]=newAngle[i];

       fscanf(fin,"%f %f %f %f %f %f %f %f %f %f",&newAngle[0],&newAngle[1],&newAngle[2],&newAngle[3],&newAngle[4],&newAngle[5],&newAngle[6],&newAngle[7],&newAngle[8],&newAngle[9]

);

       printf("Now read angle[]\n");

       alpha=0.0;

    }

    for(int i=0;i<10;i++){

       angle[i]=alpha*newAngle[i]+(1-alpha)*oldAngle[i];

    }

    alpha+=0.1;

 

    glutPostRedisplay();

}
int main()
{
    ....
    glutTimerFunc(1000,timer,0);
    ....
}

#week17- tp6vü[電腦圖學上課筆記]

[1]
程式碼:

void display()
{   
glEnable(GL_DEPTH_TEST); ///要啟動 Detph Test 深度值的測試,3D顯示才正確
    glClear(GL_COLOR_BUFFER_BIT  | GL_DEPTH_BUFFER_BIT);
    glPushMatrix();
        glBegin(GL_POLYGON);
            glTexCoord2f(0,0); glVertex3f(-1,+1,0);///前面是貼圖座標，後面是3D頂點
            glTexCoord2f(1,0); glVertex3f(+1,+1,0);
            glTexCoord2f(1,1); glVertex3f(+1,-1,0);
            glTexCoord2f(0,1); glVertex3f(-1,-1,0);
        glEnd();
    glPopMatrix();
    glFlush();
}


另外必須先下載OpenCV 2.1 並安裝到桌面
還需要cv210 / cxcore210 / highgui210 這三個檔案

void myInit()
{
    quad = gluNewQuadric();
    id = myTexture("images.jpg");///id為貼圖，這樣就可以讀到貼圖的路徑

}

[2]

int myTexture(char *filename)
{
    IplImage * img = cvLoadImage(filename); ///OpenCV讀圖
    cvCvtColor(img,img, CV_BGR2RGB); ///OpenCV轉色彩 (需要cv.h)
    glEnable(GL_TEXTURE_2D); ///1. 開啟貼圖功能
    GLuint id; ///準備一個 unsigned int 整數, 叫 貼圖ID
    glGenTextures(1, &id); /// 產生Generate 貼圖ID
    glBindTexture(GL_TEXTURE_2D, id); ///綁定bind 貼圖ID
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_REPEAT); /// 貼圖參數, 超過包裝的範圖T, 就重覆貼圖
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_REPEAT); /// 貼圖參數, 超過包裝的範圖S, 就重覆貼圖
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_NEAREST); /// 貼圖參數, 放大時的內插, 用最近點
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_NEAREST); /// 貼圖參數, 縮小時的內插, 用最近點
    glTexImage2D(GL_TEXTURE_2D, 0, GL_RGB, img->width, img->height, 0, GL_RGB, GL_UNSIGNED_BYTE, img->imageData);
    return id;

}

這也是有關貼圖的程式碼

week17 貼圖

1.期末作品
2.背景貼圖
3.打光、貼圖
4.讀檔內插示範
5.學期總複習

TODO:
介紹 my Earth.zip  便背景貼圖

20170612 Weel17 上課筆記

一、匯入openCV
1.打開專案cpb檔，匯入以下圖片程式碼

2.資料夾要有以下檔案


三、更改專案名稱
1.打開cpb檔改title

2.另存專案


二、背景貼圖示範(FB下載myEarth)
1.未修改前，圓的地球儀


2.修改程式碼，把貼圖貼在球改成平的背景圖


3.把模型匯入，複製重要程式碼