Just My Life & My Work

Archive for the ‘教學’ Category

[WebGL] 在Google Chrome上debug

有好debug的介面，能讓程式設計師在短時間內找出問題，在此介紹在Google Chrome上debug。

（繼續閱讀…）

分類：

WebGL, 教學

Tagged with:

[GLSL] Bump Map (3)

這裡要展示幾張用Bump Map做出來的teapot。

（繼續閱讀…）

分類：

GLSL, 教學

[WebGL] 初探 WebGL

目前在研究WebGL，根據WiKi的介紹：WebGL是一項在網頁瀏覽器呈現3D畫面的技術，有別於過往需加裝瀏覽器外掛程式，透過WebGL的技術，只需要編寫網頁程式碼，即可實現3D圖像的顯示，而它的程式碼會在GPU上執行。它是基於OpenGL ES繪圖的API，使用HTML5的canvas元素，並以DOM (Document Object Model)作為存取介面，而Javascript會提供自動的記憶體管理。WebGL 1.0規格在2011/3/3釋出，算是相當新穎的技術，未來還有很多發展空間。

（繼續閱讀…）

分類：

WebGL, 教學

Tagged with:

[OpenGL] 認識 OpenGL ES

WebGL是一項在網頁瀏覽器呈現3D畫面的技術，在程式平台是HTML和Javascript，在繪圖方面是基於OpenGL ES這個規範，接著發現了OpenGL ES這個OpenGL的子版本，根據維基百科的解釋：OpenGL ES (OpenGL for Embedded Systems) 是OpenGL三維圖形 API 的子集，針對手機、PDA和遊戲主機等嵌入式設備而設計。該API由Khronos集團定義推廣，Khronos是一個圖形軟硬體行業協會，該協會主要關注圖形和多媒體方面的開放標準。

（繼續閱讀…）

分類：

OpenGL, WebGL, 教學

Tagged with:

[GLSL] Bump Map (2)

承我剛寫不久的Bump Map，這次要更仔細分析它表現出來的特性，除了bump map的效果之外，我還加了phong shading的diffuse和specular。

（繼續閱讀…）

分類：

GLSL, 教學

Tagged with:

[GLSL] Bump Map

Bump Map的概念其實很簡單，在不增加geometry複雜度之下，讓物體表現更立體的樣子。我們需要兩張texture，一個color一個normal，color當然是做顏色，而normal則是表現凹凸(陰影)。做出來的結果並沒有增加model的polygon數，只是在視覺上巧妙地表現陰影(兩張texture合併)，使得物體看起來凹凸不平(有著陰影)。

（繼續閱讀…）

分類：

GLSL, 教學

Tagged with:

[OpenGL] Texture 函式參數

texture有一些函式參數需要瞭解，現在來看GL_REPEAT 和 GL_CLAMP有何差別。

（繼續閱讀…）

分類：

OpenGL, 教學

Tagged with:

[jQuery] menu 事件觸發

看似簡單的menu，實做起來困難重重，原因在於事件的觸發，搞了我整整一天，總算在mbmenu.js中找到觸發點。

（繼續閱讀…）

分類：

jQuery, 實習, 教學

[PHP][Javascript] 陣列型態：以字串為key

平常寫C所使用的陣列，index只能用數字，由0開始，這樣要找出陣列中的一筆資料，那就要從頭搜尋起，假如我知道陣列中有一筆資料，只是我不知道它被藏在哪個index，但我又不想從頭搜尋起，該怎麼作才好呢？

（繼續閱讀…）

分類：

Javascript, php, 教學

[GLSL] Shadow Map

上一篇「Shadow Mapping 原理」只有理論，這一篇用圖片來說明Shadow Map的概念，另有我實做的結果。

（繼續閱讀…）

分類：

GLSL, 教學

Tagged with:

標籤雲