2012-07-18 46 views
2

WebGL有一個清除整個表面的clear方法。清除曲面的特定矩形的最佳方法是什麼?例如,我想設置一個從(50,50)開始的100x100像素框到全零(ARGB 0,0,0,0)。我現在所能想到的就是用一個可以寫入零的片段着色器繪製一個四邊形。有沒有更簡單的方法?如何清除WebGL中的矩形區域?

回答

11

您可以使用SCISSOR測試來將清除(以及通常的渲染)限制爲一個矩形。

// turn on the scissor test. 
gl.enable(gl.SCISSOR_TEST); 

// set the scissor rectangle. 
gl.scissor(x, y, width, height); 

// clear. 
gl.clearColor(r, g, b, a); 
gl.clear(gl.COLOR_BUFFER_BIT ...); 

// turn off the scissor test so you can render like normal again. 
gl.disable(gl.SCISSOR_TEST); 
+0

好主意,謝謝! – AshleysBrain 2012-07-18 18:12:54

+0

我正在玩three.js,我不明白視區和剪區之間的區別。我的意思是,如果我想放更多的視口,我必須設置剪刀區域並啓用剪刀測試。你能解釋這件事嗎? :) – optimusfrenk 2014-03-23 18:19:30

+0

視口命令設置2件事情。座標被剪切的值以及座標乘以的值將它們轉換爲來自clipsace的像素。注意我沒有說他們剪輯像素。如果將視口設置爲100,100,1,1(1像素視口),並將「gl_PointSize」的點設置爲10,則仍會看到它繪製了10個像素點(視口外)。這是因爲視口設置僅剪切頂點。另一方面剪刀剪輯像素。 – gman 2014-03-24 19:12:46

1

如果WebGL的範圍內將繪製視口以外的任何東西,外面剪刀任何事情都會被裁減掉,根本不抽!