鐵人檔案
隨著科技越來越發達，繪圖引擎越來越先進，網頁的互動也增加了更多可能性。
當 3D 互動已經不再是瓶頸，webGL 逐漸成熟、甚至還有 webVR 正逐漸萌芽，身為工程師的我們也得趕快跟上腳步。
趁現在，讓我們來看看這些複雜卻又吸引人的技術吧！
隨著科技越來越進步，效能已經不再是瓶頸了。而隨著 webGL 的發展，我們已經不需要安裝其他軟體才能使用 3D，只要有瀏覽器跟先進一點的電腦，很容易就能在電腦裡...
為什麼是 webGL 我知道，es6 語法簡介的迷人、react 的火紅、webpack...框架不斷竄出，從今年的鐵人幫大賽就看得出來。 不過，前端的可能性絕...
身為一位工程師，我知道各位已經迫不急待想要動手開始寫程式了。先不要急，我們先來了解一下基本的知識吧！ 我們是如何看見影像的 基本上我們是透過用眼睛接受光線的方式...
WebGL 修羅道(1) - 用 100行程式碼畫點 前一個章節提到的 Shader，就是負責繪製每個像素的顏色跟位置。跟 canvas 本身的原理很像，我們先...
上一篇文章中，我們將 gl_Position 跟 gl_PointSize 等變數寫死在 shader 裡頭，這顯然不是個好方法，光是看到 C/C++ like...
[Day6] webGL 修羅道(3) - Animation 與 varying demo 昨天我們介紹完了如何傳遞資料給著色器，並且透過著色器畫了三個點，昨...
[Day7] webGL修羅道 - 3D 與動畫 3D 圖形基礎 在電腦上看到圖形的方式，通常是透過 camera 的概念。可以想像人的眼睛（或螢幕）就是一台相...
Sampler 在 GSGL 中，有一個特殊的類別是 sampler，負責接收由 Javascript 中傳來的 texture。我們可以將圖像的數據放到一個特...
到目前為止，已經介紹了不少 webGL 的 API 以及 GLSL 的使用與撰寫。是時候來寫寫看有趣的特效了，其實在網路上隨便搜尋關鍵字都能看到不少絢爛奪目的...
雖然 three.js 幫我們簡化了許多複雜的工作，可以很快地用簡單 API 的方式馬上畫出圖形。不過我們仍然要介紹一下背後的原理，之後操作起來才會得心應手。...
