2022年5月3日 星期二

嘟嘟嘟嘟...... week11

 

week11(持續實作)

🅐要安裝的東西
👉freeglut
👉opencv
👉opencv 咒語















👉開新專案
👉鋼彈.zip(data)解壓縮放freeglut/bin
🅑複習實作(結果)

🅒茶壺貼圖(複製上周的程式碼)
👉myTexture要放在glutMainLoop前
👉程式碼

🅓鋼彈貼圖
👉下載source解壓縮 :將glm.h、glm.c、transformation.c複製,貼到專案將glm.c改成glm.cpp跟main.cpp在同一個目錄下。
👉Add file (glm.cpp)

👉加入程式碼(鋼彈的圖要用小畫家翻轉過來)
👉模型轉動





👉pmodel=glmReadOBJ("data/Gundam.obj");///讀模型,將obj檔放進data資料夾裡

👉程式碼

🅔maya切割圖形
👉查詢關鍵字: maya obj 檔案
將整個模型分解個別存檔。
🅕對特定軸轉動
👉以body為中心hand做轉動
👉程式碼









Different Dimension Demon的契約書 week11

step01

1.File-New-Project,GLUT專案week11-gundam

2.week09 opencv程式

```c++

#include<opencv/highgui.h>

int main()

{

    IplImage * img =cvLoadImage("data/Diffuse.jpg");

    cvShowImage("Week11",img);

    cvWaitKey(0);

}

```


```c++

#include <GL/glut.h>

#include <opencv/highgui.h>

#include <opencv/cv.h>

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

{

    glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);///glutSolidTeapot(0.3);

        glutSolidTeapot(0.3);

    glutSwapBuffers();

}

int main(int argc ,char** argv)

{

    glutInit( &argc, argv);

    glutInitDisplayMode(GLUT_DOUBLE | GLUT_DEPTH);

    glutCreateWindow("week11 gundam");

    glutDisplayFunc(display);

    myTexture("data/Diffuse.jpg");

    glutMainLoop();

}

```


step02

1.http://jsyeh.org/3dcg10下載 source.zip

把glm.c改檔名成glm.cpp,把glm.cpp放到gundam專案

在專案中按右鍵add file加入glm.cpp

main.cpp前面加include兩行

didsplay加多行

```c++

#include <GL/glut.h>

#include <opencv/highgui.h>

#include <opencv/cv.h>

#include "glm.h"

GLMmodel *pmodel=NULL;

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

{

    glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);///glutSolidTeapot(0.3);

    if(pmodel==NULL)///如果是空指標,表示模型沒做好

    {

        pmodel=glmReadOBJ("data/Gundam.obj");///讀模型

        glmUnitize(pmodel);///換算Unit單位,-1,,,+1

        glmFacetNormals(pmodel);///重新計算模型面法向量

        glmVertexNormals(pmodel,90);///重新計算模型頂點法向量

    }

    glmDraw(pmodel,GLM_TEXTURE);

    glutSwapBuffers();

}

int main(int argc ,char** argv)

{

    glutInit( &argc, argv);

    glutInitDisplayMode(GLUT_DOUBLE | GLUT_DEPTH);

    glutCreateWindow("week11 gundam");

    glutDisplayFunc(display);

    myTexture("data/Diffuse.jpg");

    glutMainLoop();

}

```


2.

貼圖上下顛倒了

把data/Diffuse.jpg用小畫家水平翻轉


step03

鋼彈轉動

```c++

#include <GL/glut.h>

#include <opencv/highgui.h>

#include <opencv/cv.h>

#include "glm.h"

GLMmodel *pmodel=NULL;

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;

}

float angle=0;

void display()

{

    glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);///glutSolidTeapot(0.3);

    if(pmodel==NULL)///如果是空指標,表示模型沒做好

    {

        pmodel=glmReadOBJ("data/Gundam.obj");///讀模型

        glmUnitize(pmodel);///換算Unit單位,-1,,,+1

        glmFacetNormals(pmodel);///重新計算模型面法向量

        glmVertexNormals(pmodel,90);///重新計算模型頂點法向量

    }

    glPushMatrix();

        glRotatef(angle,0,1,0);

        glmDraw(pmodel,GLM_TEXTURE);

    glPopMatrix();

    glutSwapBuffers();

    angle+=1;

}

int main(int argc ,char** argv)

{

    glutInit( &argc, argv);

    glutInitDisplayMode(GLUT_DOUBLE | GLUT_DEPTH);

    glutCreateWindow("week11 gundam");

    glutIdleFunc(display);

    glutDisplayFunc(display);

    myTexture("data/Diffuse.jpg");

    glutMainLoop();

}

```

```c++

#include<GL/glut.h>

void hand()

{

    glColor3f(0,1,0);

    glutSolidTeapot(0.2);

}

void body()

{

    glColor3f(1,1,0);

    glutSolidTeapot(0.3);

}

float angle=0;

void display()

{

    glClear(GL_COLOR_BUFFER_BIT|GL_DEPTH_BUFFER_BIT);

    body();

    glPushMatrix();

        glTranslatef(0.5,0.2,0);

        glRotatef(angle,0,0,1);

        glTranslatef(0.3,0,0);

        hand();

    glPopMatrix();

    glutSwapBuffers();

    angle++;

}

int main(int argc,char**argv)

{

    glutInit(&argc,argv);

    glutInitDisplayMode(GLUT_DOUBLE|GLUT_DEPTH);

    glutCreateWindow("week11 TRT");

    glutIdleFunc(display);

    glutDisplayFunc(display);

    glutMainLoop();

}

```




(圖學筆記)電腦圖學Week11

Week11

## step01-1

持續實作 glm 模型相關練習: OpenCV讀圖

1.安裝opencv2.1

#include <opencv/highgui.h>

int main()

{

IplImage * img = cvLoadImage( "data/Diffuse.jpg" );

cvShowImage("week11", img);

}

## step01-2

持續實作 glm 模型相關練習: 把茶壼貼上Gundam的貼圖

1. 複製上週的程式

#include <opencv/highgui.h> 

#include <opencv/cv.h>

#include <GL/glut.h>

int myTexture(char * filename)

{

    IplImage * img = cvLoadImage(filename); 

    cvCvtColor(img,img, CV_BGR2RGB);

    glEnable(GL_TEXTURE_2D);

    GLuint id; 

    glGenTextures(1, &id); 

    glBindTexture(GL_TEXTURE_2D, id); 

    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_REPEAT); 

    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_REPEAT);  

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

{

    glClear(GL_COLOR_BUFFER_BIT|GL_DEPTH_BUFFER_BIT);

    glutSolidTeapot( 0.3 );

    glutSwapBuffers();

}

int main(int argc, char** argv)

{

    glutInit( &argc, argv );

    glutInitDisplayMode( GLUT_DOUBLE | GLUT_DEPTH);

    glutCreateWindow("week11 gundam");

    glutDisplayFunc(display);

    myTexture("data/Diffuse.jpg");

    glutMainLoop();

}


step02-1

持續實作 glm 模型相關練習: 把模型 讀進來, 畫出來

1. 在 jsyeh.org/3dcg10 下載 source.zip

2. 把 glm.c 改檔名成 glm.cpp  把 glm.h glm.cpp 放到 week11

3. 在 week11_gundam  Add Files 加入 glm.cpp 

4. 加入程式碼 

5. main.cpp 在前面 include 2行

6. display() 裡 加入好多行


#include "glm.h"

GLMmodel * pmodel = NULL; 

void display()

{

    glClear(GL_COLOR_BUFFER_BIT|GL_DEPTH_BUFFER_BIT);

    ///glutSolidTeapot( 0.3 );

    if( pmodel == NULL ){ 

        pmodel = glmReadOBJ("data/Gundam.obj"); 

        glmUnitize( pmodel ); 

        glmFacetNormals( pmodel ); 

        glmVertexNormals( pmodel , 90 ); 

    }

    glmDraw( pmodel, GLM_TEXTURE ); 

    glutSwapBuffers();

}

```



step02-2

發現問題:

1. 貼圖上下倒過來 身體是藍色,腳是白色

2. 所以,把 data\Diffuse.jpg 用小畫家改一下

step03-1

float angle=0;

void display()

{

    glClear(GL_COLOR_BUFFER_BIT|GL_DEPTH_BUFFER_BIT);


    if( pmodel == NULL ){ 

        pmodel = glmReadOBJ("data/head.obj"); 

        glmUnitize( pmodel ); 

        glmFacetNormals( pmodel );

        glmVertexNormals( pmodel , 90 );

    }

    glPushMatrix();

        glRotatef(angle, 0,1,0);

        glmDraw( pmodel, GLM_TEXTURE ); 

    glPopMatrix();

    glutSwapBuffers();

    angle += 1;

}

step03-2

#include <GL/glut.h>

void hand(){

    glColor3f(0,1,0);

    glutSolidTeapot( 0.2 );

}

void body(){

    glColor3f(1,1,0);

    glutSolidTeapot( 0.3 );

}

float angle=0;

void display()

{

    glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);

    body();

    glPushMatrix();

        glTranslatef(0.5, 0.2, 0);

        glRotatef(angle, 0,0,1);

        glTranslatef(0.3, 0, 0);

        hand();

    glPopMatrix();

    glutSwapBuffers();

    angle++;

}

int main(int argc, char**argv)

{

    glutInit( &argc, argv );

    glutInitDisplayMode(GLUT_DOUBLE | GLUT_DEPTH);

    glutCreateWindow("week11 TRT");

    glutIdleFunc( display );

    glutDisplayFunc( display );

    glutMainLoop();

}


2022年5月2日 星期一

電腦圖學week10筆記

 開始做

1.
第一步:
1.開一個新檔案: Week10_texture_background
2.把上週的程式碼複製並貼上

#include <opencv/highgui.h>
#include <opencv/cv.h>
#include <GL/glut.h>
int myTexture(char * filename)
{
    IplImage * img = cvLoadImage(filename);
    cvCvtColor(img,img, CV_BGR2RGB);
    glEnable(GL_TEXTURE_2D);
    GLuint id;
    glGenTextures(1, &id);
    glBindTexture(GL_TEXTURE_2D, id);
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_REPEAT);
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_REPEAT);
    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()
{
    glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
    glutSolidTeapot( 0.3 );
    glutSwapBuffers();
}
int main(int argc, char**argv)
{
    glutInit( &argc, argv );
    glutInitDisplayMode(GLUT_DOUBLE | GLUT_DEPTH);
    glutCreateWindow("week09 texture");

    glutDisplayFunc(display);
    myTexture("sky.png");

    glutMainLoop();
}

第二步:
設定OpenCV

(1)Settings => compiler => Search directories => Compiler
(2)Settings => compiler => Search directories => Linker
(3)Settings => compiler => Linker settings
(4)把圖檔放到工作目錄
(上週的程式)

第三步:
修改程式碼,把茶壺變成正方形
#include <opencv/highgui.h>
#include <opencv/cv.h>
#include <GL/glut.h>
int myTexture(char * filename)
{
    IplImage * img = cvLoadImage(filename);
    cvCvtColor(img,img, CV_BGR2RGB);
    glEnable(GL_TEXTURE_2D);
    GLuint id;
    glGenTextures(1, &id);
    glBindTexture(GL_TEXTURE_2D, id);
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_REPEAT);
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_REPEAT);
    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()
{
    glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
    ///glutSolidTeapot( 0.3 );
    glBegin(GL_POLYGON);
        glTexCoord2f(0,1); glVertex2f(-1,-1);
        glTexCoord2f(1,1); glVertex2f(+1,-1);
        glTexCoord2f(1,0); glVertex2f(+1,+1);
        glTexCoord2f(0,0); glVertex2f(-1,+1);
    glEnd();
    glutSwapBuffers();
}
int main(int argc, char**argv)
{
    glutInit( &argc, argv );
    glutInitDisplayMode(GLUT_DOUBLE | GLUT_DEPTH);
    glutCreateWindow("week10 texture background");

    glutDisplayFunc(display);
    myTexture("sky.png");

    glutMainLoop();
}


2.
第一步:
1.開一個新檔案:week10_texture_earth
2.把剛剛的程式碼抄下來並做修改

#include <opencv/highgui.h>
#include <opencv/cv.h>
#include <GL/glut.h>
GLUquadric * sphere = NULL;
int myTexture(char * filename)
{
    IplImage * img = cvLoadImage(filename);
    cvCvtColor(img,img, CV_BGR2RGB);
    glEnable(GL_TEXTURE_2D);
    GLuint id;
    glGenTextures(1, &id);
    glBindTexture(GL_TEXTURE_2D, id);
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_REPEAT);
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_REPEAT);
    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()
{
    glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
    gluQuadricTexture(sphere, 1);
    gluSphere( sphere, 1, 30, 30 );
    glutSwapBuffers();
}
int main(int argc, char**argv)
{
    glutInit( &argc, argv );
    glutInitDisplayMode(GLUT_DOUBLE | GLUT_DEPTH);
    glutCreateWindow("week10 texture earth");

    glutDisplayFunc(display);
    myTexture("earth.jpg");
    sphere = gluNewQuadric();
    glutMainLoop();
}

第二步:
讓地球旋轉
#include <opencv/highgui.h>
#include <opencv/cv.h>
#include <GL/glut.h>
GLUquadric * sphere = NULL;
int myTexture(char * filename)
{
    IplImage * img = cvLoadImage(filename);
    cvCvtColor(img,img, CV_BGR2RGB);
    glEnable(GL_TEXTURE_2D);
    GLuint id;
    glGenTextures(1, &id);
    glBindTexture(GL_TEXTURE_2D, id);
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_REPEAT);
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_REPEAT);
    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;
}
float angle=0;
void display()
{
    glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
    glPushMatrix();
        glRotatef(angle,0,0,1);
        gluQuadricTexture(sphere,1);
        gluSphere(sphere,1,30,30);
    glPopMatrix();
    glutSwapBuffers();
    angle+=0.01;
}
int main(int argc, char**argv)
{
    glutInit( &argc, argv );
    glutInitDisplayMode(GLUT_DOUBLE | GLUT_DEPTH);
    glutCreateWindow("week10 texture earth");

    glutIdleFunc(display);
    glutDisplayFunc(display);
    myTexture("earth.jpg");
    sphere = gluNewQuadric();
    glutMainLoop();
}
(地球會自己轉動)

第三步:
最後的修改
#include <opencv/highgui.h>
#include <opencv/cv.h>
#include <GL/glut.h>
GLUquadric * sphere = NULL;
int myTexture(char * filename)
{
    IplImage * img = cvLoadImage(filename);
    cvCvtColor(img,img, CV_BGR2RGB);
    glEnable(GL_TEXTURE_2D);
    GLuint id;
    glGenTextures(1, &id);
    glBindTexture(GL_TEXTURE_2D, id);
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_REPEAT);
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_REPEAT);
    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;
}
float angle=0;
void display()
{
    glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
    glPushMatrix();
        glRotatef(90,1,0,0);
        glRotatef(angle,0,0,1);
        gluQuadricTexture(sphere,1);
        gluSphere(sphere,1,30,30);
    glPopMatrix();
    glutSwapBuffers();
    angle+=0.01;
}
int main(int argc, char**argv)
{
    glutInit( &argc, argv );
    glutInitDisplayMode(GLUT_DOUBLE | GLUT_DEPTH);
    glutCreateWindow("week10 texture earth");

    glEnable(GL_DEPTH_TEST);
    glutIdleFunc(display);
    glutDisplayFunc(display);
    myTexture("earth.jpg");
    sphere = gluNewQuadric();
    glutMainLoop();
}
(把地球轉正)





VERY BEAUTIFUL, VERY POWERFUL

一.     一樣先安裝且設定好freeglut,OpecCV, 開啟CodeBlocks建立新專案 week11_gundam,                 把 MyGundam.zip下載解壓縮後的data資料夾放到freeglut/bin裡面 把week09_openc...