2023年3月30日 星期四

打一百首~ week07 貼圖 Texture

 

WEEK07


Step01-1

3D圖學:網站下載 下載window.zip 和 data.zip








window.zip和data.zip解壓縮把data放進window裡面


打開Texture.exe



就會出現一張兩個人的美麗風景照



改動glColor4f可以更改顏色、改動glVertex3f可以更改圖片的頂點

Step01-2


改貼圖座標時,貼圖座標介於0到1之間。超過範圍GL_REPEAT會在0到1之間重複



Step01-3




練習答案:
glPushMatrix();//備份矩陣
    glTranslatef(x,y,z);//移動
    glRotatef(angle,x,y,z);//轉動
    glScalef(x,y,z);//縮放
    glBegin(GL_POLYGON);//開始畫
        glColor3f(r,g,b);//色彩
        glTexCoord2f(tx,ty);//貼圖座標
        glNormal3f(nx,ny,nz);//打光的法向量
        glVertex2f(x,y);//頂點
    glEnd();//結束畫
glPopMatrix();//還原矩陣

Step02-1


安裝OpenCV(不能下載最新的)




一定要安裝Add OpenCV


開CodeBlock




點Settings>Compiler










點Search directoies>Compiler>Add>C槽裡面的OpenCV2.1>include




點Linker>Add>C槽裡面的OpenCV2.1>lib


點Linker settings>分別Add>cv210>cxcore210>highgui210



這樣就設定完成👍



Step02-2



開一個新的空白檔案


檔案一定要存成
.cpp不然會出錯
打上以下程式碼

#include <opencv/highgui.h>

int main()
{
    IplImage * img =cvLoadImage("image.jpg");
    cvShowImage("week07",img);
    cvWaitKey(0);

}

從網上找出你所想要顯示的圖片改成image.jpg
然後把想要顯示的圖存在與程式檔案存在同樣路徑上
最後按執行





圖片就顯示出來了😉


Step03-1


開專案







打專案名稱 選擇檔案存檔位置



解壓縮freeglut

開啟freeglut>lib>複製libfreeglut>貼上名稱改成libglut32
codeblock選擇freeglut完成>他跑出來就會生成三個神祕圖形

把程式碼刪掉

找到裡面的myTexture.cpp
#include <opencv/highgui.h> ///使用 OpenCV 2.1 比較簡單, 只要用 High GUI 即可
#include <opencv/cv.h>
#include <GL/glut.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 );
    glutSwapBuffers();
}
int main(int argc, char**argv)
{
    glutInit( &argc, argv );
    glutInitDisplayMode(GLUT_DOUBLE | GLUT_DEPTH);
    glutCreateWindow("week07 texture");

    glutDisplayFunc(display);
    myTexture("earth.jpg");

    glutMainLoop();
}

要把earth.jpg丟進freeglut>bin裡面

就會出現一個茶杯地球了


Step03-2


把程式稍作修改...

#include <opencv/highgui.h> ///使用 OpenCV 2.1 比較簡單, 只要用 High GUI 即可
#include <opencv/cv.h>
#include <GL/glut.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);
glBegin(GL_POLYGON);
        glTexCoord2f(0,0);glVertex2f(-1,+1);
        glTexCoord2f(1,0);glVertex2f(+1,+1);
        glTexCoord2f(1,1);glVertex2f(+1,-1);
        glTexCoord2f(0,1);glVertex2f(-1,-1);
    glEnd();
    glutSolidTeapot( 0.3 );
    glutSwapBuffers();
}
int main(int argc, char**argv)
{
    glutInit( &argc, argv );
    glutInitDisplayMode(GLUT_DOUBLE | GLUT_DEPTH);
    glutCreateWindow("week07 texture");

    glutDisplayFunc(display);
    myTexture("earth.jpg");

    glutMainLoop();
}




就會發現中間的地球扭曲成茶杯了!!!

Step03-3


新增一個新的專檔

找到裡面的myEarth.cpp
貼上程式碼
#include <opencv/highgui.h> ///使用 OpenCV 2.1 比較簡單, 只要用 High GUI 即可
#include <opencv/cv.h>
#include <GL/glut.h>
GLUquadric * sphere = 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);
    glPushMatrix();
        glRotatef(angle, 0,-1,0);
        glRotatef(90, 1,0,0);
        gluQuadricTexture(sphere, 1);
        gluSphere(sphere, 1, 30, 30);///glutSolidTeapot(0.3);
    glPopMatrix();
    glutSwapBuffers();
    angle++;
}
int main(int argc,char**argv)
{
    glutInit(&argc,argv);
    glutInitDisplayMode(GLUT_DOUBLE | GLUT_DEPTH);
    glutCreateWindow("week07 texture earth");

    glutIdleFunc(display);
    glutDisplayFunc(display);
    myTexture("earth.jpg");
    sphere = gluNewQuadric();
    glEnable(GL_DEPTH_TEST);

    glutMainLoop();
}


就會出現一個在旋轉的地球了😎




最後上傳GITHUB✌

安裝git 開啟GIT bash

cd desktop 進入桌面
git clone 複製你的檔案
cd 進入你的檔案
git add . 加入你的檔案
git status 確認你的檔案
git config --global user.email "你的Gmail"
git config --global user.name "你的GitHubID"
git commit -m "你的周次"
git push 上傳



沒有留言:

張貼留言