田園 計圖筆記 Week14

Rasterization

1.打開processing

2.程式碼

size(600,600,P3D);

background(255);
beginShape(TRIANGLE);
stroke(255,0,0);vertex(300,100);
stroke(255,255,0);vertex(500,500);
stroke(0,0,255);vertex(100,500);
endShape();

3.stroke表顏色 執行後就會有一個中空三角形

4.stroke改成fill就會有填滿的三角形

田園 計圖筆記 Week13

色彩系統
processing內寫
size(255,255);
colorMode(RGB,255);
for(int x=0;x<255;x++)
{
  for(int y=0;y<255;y++)
     {
          stroke(x,y,0);//參數代表RGB
          point(x,y);
      }
}
並執行!

田園 計圖筆記 Week12

1.下載MyGL_Frustum221_MultiView
(1)跑執行檔
就會有四個視窗跑出來

(2)程式.cpp.編譯
開一個GLUT專案,然後把myGL_Frustrum_skeleton.cpp裡面的程式碼覆蓋到專案內的main.cpp
最下面的int main()裡面 紅字是要新增的
int main(int argc,char **argv)
{
    glutInit(&argc,argv);
printf("Usage\n"
"(1) Mouse Drag to rotate\n"
"(2) Key UP/DOWN/LEFT/RIGHT to rotate\n"
"(3) Key '+'/'-' to resize\n"
"(4) Key 'o' for Orthogonal Projection\n"
"(5) Key 'p' for Perspective Projection\n"
"(6) Key '1'(red ball) and '2'(green ball) to switch to Kinect Frustrum\n"
"(7) Key ASDW for (humanX, humanY) movememt\n"
"It will read myGL_Frustrum.txt for Kinect Positions and Targets");
readKinectCFG();
initGL();
glutMainLoop();
return 0;
}

記得複製00readme.txt到專案資料夾內
然後執行

2.開啟processing 速寫本->引用庫文件->添加庫文件->libraries 搜尋collada
下載Collada Loader for SketchUp and Blender 3.1
就可以從 文件->範例程序 選擇你要的範例

下載Picking 0.3.1
Nicolas Clavaud

Pick an object in a 3D scene easily     

從 文件->範例程序 選擇你要的範例

田園 計圖筆記 Week11

Sound聲音匯入程式
1.開啟GLUT專案
C語言 wav檔
先去載wav檔，放在freeglut資料夾內bin->Debug內
#include<mmsystem.h>//多媒體

int main()
{
PlaySoundA("檔名.wav",NULL,SND_ASYNC);

}
SND_SYNC 等同步
SND_ASYNC 不等同步 下一行繼續


2.開啟GLUT專案
C語言mp3檔
下載CMP3_MCI.h加入專案
再將MP3檔放入freeglut資料夾內 bin->Debug內
#include<stdio.h>
#include "CMP3_MCI.h"
CMP3_MCI mp3;

int main()
{
    mp3.Load("NOSLEEP.mp3");
    mp3.Play();

}

3.P語言播音樂
程式碼:
import ddf.minim.*;
Minim minim;
AudioPlayer player;
AudioPlayer player2;
void setup(){
  minim = new Minim(this);
  player = minim.loadFile("MIW.mp3");
  player.play();
}
void draw(){
}
打開Processing 速寫本->引用庫文件->添加庫文件

 搜尋sound 選擇Minim並install

速寫本->引用庫文件->Minim

執行就有音樂囉

田園 計圖筆記 Week09

Bump Mapping
連到這個網站
https://www.openprocessing.org/sketch/249457 sketch可以做出凹凸不平感

1.下載 processing-3.3.6-windows64.zip並解壓縮
執行processing.exe

 2.把找到的圖檔放進資料夾內 並打上程式碼
PImage img=loadImage("Morty.png");//processing image loading
size(600,1300);//寬 長
image(img,0,0,600,1300);//show the image img

 3.執行後就跑出來了!Sausage Morty

4.作鍵盤操作
程式碼
PImage imgMorty ,imgBrick;
void setup(){
  size(800,600);//windows width and length
  imgMorty=loadImage("Morty.png");
  imgBrick=loadImage("brick.png");
}
float mortyX=200,mortyY=100,mortyVY=0,mortyVX=0;
boolean mortyOnFloor=false;
boolean mortynotOnEdge=true;
void draw(){
  background(255);
  for(int x=0;x<18;x++) image(imgBrick,x*50,500,50,100);
  image(imgMorty,mortyX,mortyY,60,130);
  mortyY +=mortyVY; mortyX+=mortyVX;
  mortyVY += 0.98;
  if(mortyY>=500-130){mortyY=500-130;mortyVY=0;mortyOnFloor=true;}
  if(mortyX>=800-60){mortyX=800-60;mortyVX=0;mortyOnEdge=false;}
  if(mortyX<=0){mortyX=0;mortyVX=0;mortyOnEdge=false;}
}
void keyPressed(){
  if(keyCode==UP && mortyOnFloor) mortyVY=-15;mortyOnFloor=false;
  if(keyCode==RIGHT && !mortynotOnEdge) mortyVX=5;mortynotOnEdge=false;
  if(keyCode==LEFT && !mortynotOnEdge) mortyVX=-5;mortynotOnEdge=false;
}
void keyReleased(){
  if(keyCode==UP) mortyVY=0;
  if(keyCode==RIGHT) mortyVX=0;
  if(keyCode==LEFT) mortyVX=0;
}

執行後就可以看到
左右上控制，我還有設定移動的物體只能到邊界。

田園 計圖筆記 Week08

1.安裝OpenCV 選取 Add OpenCV to the system PATH for all users 其他都按下一步

2.到 jsyeh.org/3dcg10下載 data.zip, windows.zip , glut32.dll, source.zip
3.開啟Project 選取 Console application,語言選C++

3.複製程式碼放進cpp檔

#include <opencv/highgui.h>

int main()

{

    IplImage * img = cvLoadImage("earth.jpg");

    cvNamedWindow("Hello opencv");

    cvShowImage("Hello opencv", img);

    cvWaitKey(0);

}

4.在Codeblocks中對 666.cbp 按右鍵 -->  Build Option --> Search directories

 5.   Compiler --> Add --> 輸入 : 【c:\\opencv2.1\include】

     Linker     --> Add --> 輸入 : 【c:\\opencv2.1\lib】

 6.  點選 Linker setting --> Link Libraries 

      Add --> 輸入 --> 【cv210】

      Add --> 輸入 --> 【cxcore210】

      Add --> 輸入 --> 【highgui210】

      點選OK

7.下載一張earth.jpg放在專案資料夾內，並執行

8.再開一個glut專案

一樣Codeblocks中對 777.cbp 按右鍵 -->  Build Option --> Search directories

Compiler --> Add --> 輸入 : 【c:\\opencv2.1\include】

     Linker     --> Add --> 輸入 : 【c:\\opencv2.1\lib】

點選 Linker setting --> Link Libraries 

      Add --> 輸入 --> 【cv210】

      Add --> 輸入 --> 【cxcore210】

      Add --> 輸入 --> 【highgui210】

9.再將程式碼 加到main裡面

IplImage * img = cvLoadImage("earth.jpg");

    cvNamedWindow("Hello opencv");

    cvShowImage("Hello opencv", img);

    //cvWaitKey(0);

10.把#include <opencv/highgui.h>加入main.cpp 並執行

--------------------------------------------------------------------------------------

啟動程式OpenGL貼圖

複製程式碼到Glut專案的main.cpp 直接覆蓋

#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();///自動轉很帥

        glRotatef(90, 1,0,0);

        glRotatef(angle, 0,0,1);///自動轉很帥

        gluQuadricTexture(quad, 1);

        gluSphere(quad, 1, 30, 30);///glutSolidTeapot(0.3);

    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("earth.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();

}

就有會轉的地球了!

田園 計圖筆記 Week07

光隨著mosue motion移動
1.打開GLUT專案檔,將程式碼const GLfloat light_position[] = { 2.0f, 5.0f, 5.0f, 0.0f };的const刪掉
因為後面要改變他。

2.加入函式
void motion(int x,int y)
{
    light_position[0]=(x-150)/150.0*2;
    light_position[1]=-(y-150)/150.0*2;
    glLightfv(GL_LIGHT0,GL_POSITION,light_position);
    glutPostRedisplay();
}

3.然後在main新增 glutMotionFunc(motion);
然後執行就可以用滑鼠移動了

田園 計圖筆記 Week06

week05複習
一、開啟Lighting打光
1.到jsyeh.org/3dcg10下載source.zip內有transformation.c範例
search : light
glutCreateWindow("Transformation");
//
glEnable(GL_LIGHTING);
glEnable(GL_LIGHTQ);
glLightfv(GL_LIGHTQ,GL_POSITION,pos);
glEnable(GL_DEPTH_TEST);
//
glutMainLoop();
2.打開week05的專案檔，加入一行程式碼GLfloat pos[]={0.0,0.0,-1.0,0.0};在主程式前

 3.加入
glEnable(GL_LIGHTING);
glEnable(GL_LIGHTQ);
glLightfv(GL_LIGHTQ,GL_POSITION,pos);
glEnable(GL_DEPTH_TEST);

4.加入keyboard, mouse,motion
int rotateX=0,rotateY=0,rotateZ=0;
int oldx=0,oldy=0;

void keyboard (unsigned char key , int x , int y)

{

     printf("now : %c ( %d  %d)\n " ,key , x , y );
     if(key=='x')rotateX++;
     if(key=='y')rotateY++;
     if(key=='z')rotateZ++;
     glutPostRedisplay();  //貼出公告，請電腦有空時，重新展示畫面

}

void mouse ( int button , int state , int x , int y)

{  
   printf("button : %d  state: %d ( %d %d )\n ",button,state,x,y);
      //mouse drag (1) down (2) drag (3) up
   if(state==GLUT_DOWN)
     {
        oldx=x;
        oldy=y;

     }
 }

void motion (int x ,int y)
{
    rotateX += -(y-oldy);
    rotateY += -(x-oldx);
    oldx=x; oldy=y;
    glutPostRedisplay();

}

void display()

{

    glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT); 

    //3D深度測試，清 depth buffer，才能繪圖

    glPushMatrix();
    glRotatef(rotateX,1,0,0);
    glRotatef(rotateY,0,1,0);
    glRotatef(rotateZ,0,0,1);

    drawmodel();
    glPopMatrix();

    glutSwapBuffers();

}

int main(int argc, char**argv) 

{

    glutInit(&argc, argv);

    glutInitDisplayMode(GLUT_DOUBLE | GLUT_DEPTH); 

     //3D深度測試，有準備好的depth buffer，才能繪圖

    glutCreateWindow("week05");

    glutDisplayFunc(display);

    glutMouseFunc(mouse);
    glutKeyboardFunc(keyboard);
    glutMotionFunc(motion);
    
    

    glEnable(GL_LIGHTING);              //偷來的3D深度測試，打開Enable

    glEnable(GL_LIGHT0);                   //偷來的打光(2) ，打開Enable

    glEnable(GL_DEPTH_TEST);        //偷來的打光(1) ，打開Enable

    glLightfv(GL_LIGHT0,GL_POSITION,pos);

    glutMainLoop();

}

5.執行 就可以用滑鼠 鍵盤控制旋轉

田園 計圖作業 Week05

Week05
1.輸入網址jsyeh.org/3dcg10

2.到老師的網頁

 3.下載 data.zip 、windows.zip、glut32.dll

4.講這三個檔案放進一個新資料夾並命名為windows

5.把兩個壓縮檔都解壓縮

 6.執行Transformation.exe

7.執行Projection.exe
(1)gluPerspective(fovy   ,  aspect  ,   zNear  ,  zFar)
                              視野  Y/X比例
(2)glOrtho(左,右,下,上,近,遠)
    glFvutum(左,右,下,上,近,遠)
(3)gluLookAt(eyex,eyey,eyez,
                        centerx,centery,centerz,
                        upx,upy,upz)

田園 計圖筆記 Week04

1.原本的圖形

 2.更改第一個圖的函式，印出一個茶壺，確認第一個位置在左上角

3.glRotated(角度,X,Y,Z);X,Y,Z表示軸(右手座標系統)
glRotatef(角度,X,Y,Z);
glRotated(60,1,0,0);代表圖形繞著X軸右手大拇指指向右方，右手剩下四指方向轉60度
若是用a=t*90的a當角度，
glRotated(a,1,0,0);就會造成圖形隨著時間轉動不同角度，看起來就像一直在轉。

4.glScaled(X,Y,Z);朝X方向縮放X倍，Y、Z以此類推

田園 計圖筆記 Week03

一:學姊的程式
1.下載學姐的程式碼及txt檔，把txt檔放在freeglut/bin裡面

 2.打開學姐的程式碼，並複製

 3.打開freeglut專案檔的main.cpp把學姐的程式碼覆蓋上去。

 4.執行!

二:怎麼用別人的3D檔

1.下載3D Exploration

 2.下載老師的足球.obj檔 並用3D Exploration檢視

 3.File->save as->.cpp檔

4.選擇Expor type:Sample APP

 5.開一個open GL的專案 ，路徑放到桌面，不用放在freeglut資料夾

6.把專案的main.c改成main.cpp然後把剛剛的足球.cpp內的程式碼覆蓋上去，並把error部分隱藏

7.執行!