WebGL學習筆記（一）
目錄 繪制二維圖形（2D圖形） 經過一下三個步驟 簡單js程序代碼 簡單html文件代碼 繪制實例（一個點） 着色器 ...
原文：WebGL學習筆記（十六）：遮罩
這里總結下幾種WebGL中實現遮罩的方法。 模板緩沖 模板緩沖可以實現渲染剔除，但是我們之前的學習里，剔除范圍是基於上一次渲染的結果，且上一次的渲染也會進行顯示，這樣的話並不適合用來實現遮罩。 我們想實現遮罩的話，是希望只繪制模板緩沖而不繪制顏色緩沖。 想要實現這樣的效果，可以借助 colorMask 方法來實現 如果關閉了顏色緩沖的所有通道后，下一次繪制就不會改變顏色緩沖了 ，具體寫法如下： s ...
2019-11-17 16:47 0 461 推薦指數：
相關推薦
WebGL學習筆記（四）：繪圖
圖元 WebGL可以繪制非常復雜的3D模型，這些模型都是由下面3種基本幾何圖元構成的，下面我們來詳細的看看。 三角形 WebGL中任何復雜的模型，都是由三角形組合而成的，可以說三角形是任意形狀的最小構成單位。 WebGL可以繪制下面幾種三角形： 獨立的三角形（gl.TRIANGLES ...
WebGL學習筆記一
學習用來做web3D的，從第一頁開始學起先做2D的，接下來的程序是一個入門級的程序，可以通過在畫板上的不同位置點擊而獲取不同顏色的點，以畫板中心為坐標原點四個象限有不同的顏色，訪問地址 http://123.206.70.64:8080/WebGL2/ColoredPoints.html ...
WEBGL學習筆記（二）：矩陣變換
游戲已經做好，但是博客園不能支持哈，我在我的獨立博客里面加入了這個游戲。 加載時候會黑屏，等待數秒即可，點擊這里體驗試玩：FlappyBird3d游戲試玩 Three.js 使用 ...
WebGL學習筆記（六）：紋理貼圖
只可以繪制純色的模型是不夠的，為了呈現出更真實的模型，我們還需要通過紋理貼圖給模型進行上色。 丟失上下文 GPU作為一種公用資源，是會被多個進程同時使用的，在資源不足的情況下（比如PC或手機系統進 ...
WEBGL學習筆記（一）：創建場景
游戲已經做好，但是博客園不能支持哈，我在我的獨立博客里面加入了這個游戲。 加載時候會黑屏，等待數秒即可，點擊這里體驗試玩：FlappyBird3d游戲試玩 初衷：最近在學習webgl，翻譯一下用戶幫助文檔，希望對大家有所幫助！（進了一個什么webgl中文網的qq群，問了一個 ...
WebGL學習筆記（二）：WebGL坐標系及基礎幾何概念
WebGL使用的是正交右手坐標系，且每個方向都有可使用的值的區間，超出該矩形區間的圖像不會繪制： x軸最左邊為-1，最右邊為1； y軸最下邊為-1，最上邊為1； z軸朝向你的方向最大值為1，遠離你的方向最大值為-1； 注：這些值與Canvas的尺寸無關，無論Canvas的長寬 ...
CSS3學習筆記（5）—頁面遮罩效果
今天把頁面遮罩的效果發一下，之前遮罩都是用JS實現的，忽然發現CSS3里面的box-shadow屬性除了做立體陰影外，還可以做頁面的遮罩. 下面來看一下完成的動態效果： 從上圖可以看出，就是當鼠標懸浮在按鈕上時，會出現整個頁面的遮罩，當然調一下透明度就是網頁中經常看到的當鼠標懸浮在一張圖片 ...