2017計算機圖學: 40347008S

顯示具有 40347008S_張惠鈞 標籤的文章。顯示所有文章

2018年1月13日星期六

我只是一只可愛的麻雀（．＿．）Week10 筆記

本周主題：利用processing code寫android app

1. 於processing軟體右上角新增android mode
2. 系統會跳出是否安裝SDK 選擇安裝

靠杯不知道為什麼試很久沒辦法安裝QQQQQQ

所以看一下同學的筆記就好QQQQQ

本周主題：場景

1. 去下載
myGL_Frustrum221_MultiView_2012_1221-20171130T060949Z-001.zip

2. run看看.exe檔

3. 開一個glut專案，把這個code copy過去main.cpp

4. 加幾個程式碼

5. Build and run

＊開啟P語言的範例程式＊

1. 在library中下載collada和picking

2. 文件 -> 範例程序 -> 雙擊打開 collada 的 viewer2D

3. 把false改成true以顯示3D模型

4. 可以用滑鼠+鍵盤移動拖曳

5. 打開picking的simple

6. 執行觀察看看

因為有點難截圖直接說明

一開始預設邊框是黑色的
當滑鼠移到橘色的方塊上時 -> 邊框變橘色
當滑鼠移到黃色的方塊上時 -> 邊框變黃色

本周主題：音樂

＊放wav音檔＊

1. 開啟glut專案

2. include <mmsystem.h> ///使用multimedia system 多媒體系統

3. main裡面加上code

PlaySoundA("filename.wav",NULL,SND_ASYNC);

PlaySoundA => A = ASCII
引號內 =>檔名
檔案位置 => 在哪個位置(NULL 記得把檔案放在freeglut的bin中)
如何播放 =>ASYNC 聲音和圖同時 ; SYNC 聲音放完後畫圖

＊放mp3檔＊

wav沒有壓縮過 vs mp3有壓縮過

1. #include "CMP3_MCI.h"
///去下載這個.h檔 (在FB社團有) 這等於是一個外掛XD

2. 宣告全域變數
CMP3_MCI mp3;

3. MAIN函式內code

mp3.Load("file.mp3");
mp3.Play();

最後程式大概會長這樣 :D

註：通常
音效檔 => wav
音樂檔 => mp3 (因為mp3會delay)

＊在processing code中放音樂＊

1. 速寫本 -> 引用庫文件 -> 添加庫文件 -> libraries搜尋
下載 minim 函式庫

程式:

import ddf.minim.*;
Minim minim;
AudioPlayer player;

void setup(){
minim = new Minim(this);
player = minim.loadFile("spotlight.mp3");
player.loop();
player.play();
}
void draw(){ //這段是為了卡著畫面
}

音樂要記得放在程式的目錄中

2018年1月12日星期五

我只是一只可愛的麻雀（．＿．）Week18 期末專題

我只是一只可愛的麻雀（．＿．）Week09 筆記

本周主題：Bump Mapping

何謂Bump Mapping??
=> https://www.openprocessing.org/sketch/249457

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

2. 從剛才上面的網址中複製他的code貼到軟體中

3. 在random中填上255

執行結果

PS--- 有些電腦的GPU不支援

4. color的地方多加一個f 可以變成網頁那樣的圖案

＊畫出簡單的幾何圖形＊

畫一個簡單的四方形

size(200,200); //create a 200*200 window
fill(#FC24C3); //fill #FC24C3 color
rect(10,10,50,50); //draw a 50*50 rectangle in position 10,10

＊如何顯示一張圖片＊

要記得把圖片放在processing程式的資料夾裡

讀進一張圖
PImage img=loadImage("bluerabbit.jpg");
size(250,128); //設定視窗大小
image(img,0,0,250,128); //設定圖片大小跟位置(圖片大小會讓圖片拉伸)

＊跟著滑鼠連續的圖片＊

PImage img;
void setup(){
img=loadImage("bluerabbit.jpg");
size(600,600);
}
void draw(){
image(img,mouseX,mouseY);
}

＊做一個簡單的馬力歐程式＊

↓成果

＜可以修改程式碼去研究每個功用哦＞

int [][]map={{0,0,0,0,0,0,0,0,0,0,0,0,0,0},
{0,0,0,0,0,0,0,0,0,0,0,0,0,0},
{0,0,0,0,0,0,0,0,0,0,0,0,0,0},
{0,0,0,0,0,0,0,0,0,0,0,0,0,0},
{0,0,0,0,0,0,0,0,0,0,0,0,0,0},
{0,0,0,0,0,0,0,0,0,0,0,0,0,0},
{0,0,1,1,2,2,1,1,0,0,0,0,0,0},
{0,0,0,0,0,0,0,0,0,0,0,0,0,0},
{0,0,0,0,0,0,0,0,0,0,0,0,0,0},
{0,0,0,0,0,0,0,0,0,0,0,0,0,0},
{1,1,1,1,1,1,1,1,1,1,1,1,1,1},
};
PImage img;
PImage brick;
PImage qmark;
void setup(){
size(600,600);
img=loadImage("mario.png");
brick=loadImage("brick.png");
qmark=loadImage("qmark.jpg");
}
float marioX=200,marioY=50,marioVY=0,marioVX=0;
boolean marioOnFloor=false;
void draw(){
background(255); //redraw background
for(int i=0;i<14;i++){
for(int j=0;j<11;j++)
{
if(map[j][i]==1)image(brick,i*50,j*50,50,50);
if(map[j][i]==2)image(qmark,i*50,j*50,50,50);}}
image(img,marioX,marioY,100,100);
marioY+=marioVY;
marioX+=marioVX;
marioVY+=0.98;
if(marioY>=400) {marioY=400;marioVY=300;marioOnFloor=true;}
}
void keyPressed(){
if(keyCode==UP && marioOnFloor){marioVY=-20;marioOnFloor=false;}
if(keyCode==RIGHT) marioVX=15;
if(keyCode==LEFT) marioVX=-15;
}
void keyReleased(){
if(keyCode==RIGHT || keyCode==LEFT) marioVX=0;
}

2017年11月30日星期四

我只是一只可愛的麻雀（．＿．）Week07 筆記

第七週主題－光源

1. 照之前的方式開一個glut的專案檔
2. 程式碼

首先解釋部分程式碼功能

【resize】保持圖畫不變形

【key】按鍵功能

【idle】閒置時要不停地作畫

＊開始修改程式＊

把光源的position const拿掉才能修改

新增motion函式

在main裡用motion函式

＊執行程式＊

原圖

使用滑鼠拖曳更改光源位置

2017年11月2日星期四

我只是一只可愛的麻雀（．＿．）Week08 筆記

1. 到 jsyeh.org/3dcg10 下載 source. data. win32 和 glut32.dll檔案
2. glut32.dll 和 windows資料夾底下的東西放一起

下載 opencv 2.1 (Moodle有, 也可以上網載)

開project設定以下

對著cbp檔按右鍵 -> build options

linker settings
新增
cv210
cxcore210
highgui210

compiler settings
compiler
C:\OpenCV2.1\include

linker
C:\OpenCV2.1\lib

就可以開始打code囉！

把圖載下來放在project的資料夾中

程式碼 ---

#include <opencv/highgui.h>
int main()
{
IplImage * img=cvLoadImage("ro.png"); ///名稱就是想開的圖片的檔名!!
cvNamedWindow("RO");
cvShowImage("RO", img);
cvWaitKey(0);
return 0;
}

醬就成功囉～！

NEXT CLASSSSSSSSSS

開一個GLUT project

2017年10月15日星期日

我只是一只可愛的麻雀（．＿．）Week05 筆記

去 jsyeh.org/3dcg10/ 下載 data win32 glut32.dll 並且解壓縮
執行.exe檔試試每個函式的效果

＊transformation＊

glTranslatef() //對x,y,z做位移
glRotatef(角度,x,y,z) //以x,y或z軸為軸心旋轉某度數
glScalef() //對x軸,y軸,z軸放大幾倍

＊projection.exe - perspective＊

gluPerspective(fovy, aspect, zNear, zFar)
fovy => 視野
aspect => x/y比例(寬窄)
zNear => 前界(前面的平面)
zFar => 後界(後面的平面)

gluLookAt
eye => 照相機圍繞著人物旋轉，所以始終看的到人
center => 照相機固定位置，以中心做旋轉，所以轉一轉人會不見
up => 以哪一個軸為上, 圖例中y = 1.00 表示以y軸為上

＊projection.exe - Orthogonal投影＊

glOrtho(左,右,下,上,近,遠)

EX:

投影left = -4.10 因此人物看起來會瘦瘦長長的
(我們人看到的等於整個後面灰色區域)

概念就是: 以左右下上前後形成一個框框投影看到的影像

gluLookAt的參數跟上面的概念是一樣的
差別在於他是投影這個框框所以有時候轉動後人物不在框框內就會被切掉

EX:

下期預告：如何打開程式碼～！

2017年10月5日星期四

我只是一只可愛的麻雀（．＿．）Week04 筆記

＊移動旋轉＊

const double t = glutGet(GLUT_ELAPSED_TIME) / 1000.0;
const double a = t*90.0; //隨著時間t變化的速度

glPushMatrix(); //備份矩陣 //把現在的位置記住開始作圖
glTranslated(-2.4,1.2,-6);
// d代表double 改成f就是float 後面的數字分別代表(x,y,z)的移動距離
glRotated(60,1,0,0); // 以x軸為軸心旋轉60度
//(度數, x軸, y軸, z軸)
glRotated(a,0,0,1); //以z軸為軸心隨著時間變化旋轉(a)
glutSolidSphere(1,slices,stacks);
glPopMatrix(); //還原矩陣 //回到剛才作圖(移動...etc)前的原點

＊新增會旋轉的茶壺＊

五彩繽紛還有重疊

＊放大變形＊

glPushMatrix();
glTranslated(0,0,-6); //移動座標
glRotated(60,1,0,0);
glRotated(a,0,0,1);
glScalef(1,2,2); //對(x,y,z)軸放大幾倍
glColor3d(0,1,0);
glutSolidTeapot(1);
glPopMatrix();

看起來很大有一邊扁扁的

＊滑鼠移動茶壺＊

變數宣告

main函式

glutMouseFunc(mouse); 使用的函數

補充
http://blog.csdn.net/lisy14/article/details/70713007

檢測鼠標單擊
void glutMouseFunc(void (*func)(int button,int state,int x,int y));
func：處理鼠標點擊事件的函數名button：取值
GLUT_LEFT_BUTTON GLUT_MIDDLE_BUTTON
GLUT_RIGHT_BUTTONstate：取值GLUT_DOWN
GLUT_UPx,y：提供鼠標當前窗口坐標（以左上角為原點）

motion移動

關於滑鼠移動的座標概念

第一次滑鼠移動↓↓

第二次滑鼠移動↓↓

以此類推並且了解到dx, dy, dz的算法

display

訂閱：文章 (Atom)

2017計算機圖學

2018年1月13日星期六

我只是一只可愛的麻雀（．＿．）Week10 筆記

我只是一只可愛的麻雀（．＿．）Week12 筆記

本周主題：場景

＊開啟P語言的範例程式＊

我只是一只可愛的麻雀（．＿．）Week11 筆記