소스 검색

WebGPURenderer: Fix color mask setting in WebGLBackend (#27026)

Co-authored-by: aardgoose <[email protected]>
aardgoose 1 년 전
부모
커밋
45b985db32
4개의 변경된 파일17개의 추가작업 그리고 4개의 파일을 삭제
  1. 13 1
      examples/jsm/renderers/webgl/utils/WebGLState.js
  2. BIN
      examples/screenshots/webgpu_particles.jpg
  3. 4 2
      examples/webgpu_particles.html
  4. 0 1
      test/e2e/puppeteer.js

+ 13 - 1
examples/jsm/renderers/webgl/utils/WebGLState.js

@@ -30,6 +30,7 @@ class WebGLState {
 		this.currentPremultipledAlpha = null;
 		this.currentPremultipledAlpha = null;
 		this.currentPolygonOffsetFactor = null;
 		this.currentPolygonOffsetFactor = null;
 		this.currentPolygonOffsetUnits = null;
 		this.currentPolygonOffsetUnits = null;
+		this.currentColorMask = null;
 		this.currentDepthFunc = null;
 		this.currentDepthFunc = null;
 		this.currentDepthMask = null;
 		this.currentDepthMask = null;
 		this.currentStencilFunc = null;
 		this.currentStencilFunc = null;
@@ -296,6 +297,17 @@ class WebGLState {
 
 
 	}
 	}
 
 
+	setColorMask( colorMask ) {
+
+		if ( this.currentColorMask !== colorMask ) {
+
+			this.gl.colorMask( colorMask, colorMask, colorMask, colorMask );
+			this.currentColorMask = colorMask;
+
+		}
+
+	}
+
 	setDepthTest( depthTest ) {
 	setDepthTest( depthTest ) {
 
 
 		const { gl } = this;
 		const { gl } = this;
@@ -462,7 +474,7 @@ class WebGLState {
 		this.setDepthFunc( material.depthFunc );
 		this.setDepthFunc( material.depthFunc );
 		this.setDepthTest( material.depthTest );
 		this.setDepthTest( material.depthTest );
 		this.setDepthMask( material.depthWrite );
 		this.setDepthMask( material.depthWrite );
-		this.setDepthMask( material.colorWrite );
+		this.setColorMask( material.colorWrite );
 
 
 		const stencilWrite = material.stencilWrite;
 		const stencilWrite = material.stencilWrite;
 		this.setStencilTest( stencilWrite );
 		this.setStencilTest( stencilWrite );

BIN
examples/screenshots/webgpu_particles.jpg


+ 4 - 2
examples/webgpu_particles.html

@@ -29,6 +29,8 @@
 			import { GUI } from 'three/addons/libs/lil-gui.module.min.js';
 			import { GUI } from 'three/addons/libs/lil-gui.module.min.js';
 
 
 			import WebGPU from 'three/addons/capabilities/WebGPU.js';
 			import WebGPU from 'three/addons/capabilities/WebGPU.js';
+			import WebGL from 'three/addons/capabilities/WebGL.js';
+
 			import WebGPURenderer from 'three/addons/renderers/webgpu/WebGPURenderer.js';
 			import WebGPURenderer from 'three/addons/renderers/webgpu/WebGPURenderer.js';
 
 
 			import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
 			import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
@@ -40,11 +42,11 @@
 
 
 			function init() {
 			function init() {
 
 
-				if ( WebGPU.isAvailable() === false ) {
+				if ( WebGPU.isAvailable() === false && WebGL.isWebGL2Available() === false ) {
 
 
 					document.body.appendChild( WebGPU.getErrorMessage() );
 					document.body.appendChild( WebGPU.getErrorMessage() );
 
 
-					throw new Error( 'No WebGPU support' );
+					throw new Error( 'No WebGPU or WebGL2 support' );
 
 
 				}
 				}
 
 

+ 0 - 1
test/e2e/puppeteer.js

@@ -122,7 +122,6 @@ const exceptionList = [
 	'webgpu_loader_gltf_sheen',
 	'webgpu_loader_gltf_sheen',
 	'webgpu_materials',
 	'webgpu_materials',
 	'webgpu_materials_video',
 	'webgpu_materials_video',
-	'webgpu_particles',
 	'webgpu_sandbox',
 	'webgpu_sandbox',
 	'webgpu_shadertoy',
 	'webgpu_shadertoy',
 	'webgpu_shadowmap',
 	'webgpu_shadowmap',