zjs_project 1 year ago
parent
commit
9f9322afeb

+ 4 - 0
src/pages/webgl_rxdz_720/webgl_rxdz_720.vue

@@ -531,6 +531,10 @@
 								if(u_mode > 1.5 && u_mode < 2.5){
 									gl_FragColor = vec4(gl_FragColor.a, gl_FragColor.a, gl_FragColor.a, 1.0);
 								}
+								vec4 color = texture2D(pointTexture, vUv);
+								if (color.rgb == vec3(0.0, 0.0, 0.0)) {
+									discard; 
+								}
 								if(filterType==1){
 									float gray = 0.2989*gl_FragColor.r+0.5870*gl_FragColor.g+0.1140*gl_FragColor.b;
 									gl_FragColor = vec4(gray,gray,gray , gl_FragColor.a);

+ 4 - 0
src/pages/webgl_rxdz_clipImg/webgl_rxdz_clipImg.vue

@@ -422,6 +422,10 @@
 							if(u_mode > 1.5 && u_mode < 2.5){
 								gl_FragColor = vec4(gl_FragColor.a, gl_FragColor.a, gl_FragColor.a, 1.0);
 							}
+							vec4 color = texture2D(pointTexture, vUv);
+							if (color.rgb == vec3(0.0, 0.0, 0.0)) {
+								discard; 
+							}
 							if(filterType==1){
 								float gray = 0.2989*gl_FragColor.r+0.5870*gl_FragColor.g+0.1140*gl_FragColor.b;
 								gl_FragColor = vec4(gray,gray,gray , gl_FragColor.a);

+ 18 - 6
src/pages/webgl_rxdz_vr/webgl_rxdz_vr.vue

@@ -316,6 +316,12 @@
 					// that.scene.remove(lineMesh);
 					dragControls.dispose();
 				}
+				// 创建一个图片纹理
+				const placeholderTexture = new THREE.TextureLoader().load('https://dm.static.elab-plus.com/miniProgram/tab2.jpg');
+				const placeholderMaterial = new THREE.MeshBasicMaterial({ map: placeholderTexture });
+				let geometry = new THREE.PlaneGeometry(9, 16);
+				// 应用绿幕材质到对象上
+				let mesh = new THREE.Mesh(geometry, placeholderMaterial);
 				// 创建视频元素
 				// var video = document.createElement('video');
 				var video = document.getElementById('myvideo');
@@ -328,10 +334,13 @@
 				video.preload = 'auto';
 				video.setAttribute('webkit-playsinline', true);
 				video.setAttribute('playsinline', true);
-				video.load();
-				setTimeout(()=>{
+				// video.load();
+				setTimeout(() => {
+					// video.minFilter = THREE.LinearFilter;
+					// video.magFilter = THREE.LinearFilter;
+					// video.format = THREE.RGBFormat;
 					video.play();
-					console.warn("***video***",video,video.width);
+					// console.warn("***video***",video,video.width);
 					// 创建视频纹理
 					var videoTexture = new THREE.VideoTexture(video);
 					// 过滤的颜色值
@@ -445,15 +454,18 @@
 								if(u_mode > 1.5 && u_mode < 2.5){
 									gl_FragColor = vec4(gl_FragColor.a, gl_FragColor.a, gl_FragColor.a, 1.0);
 								}
+								vec4 color = texture2D(pointTexture, vUv);
+								if (color.rgb == vec3(0.0, 0.0, 0.0)) {
+									discard; 
+								}
 							}
 						`,
 					};
 					// 创建绿幕材质
 					let greenScreenMaterial = new THREE.ShaderMaterial(greenScreenShader);
 					greenScreenMaterial.side = THREE.DoubleSide;
-					let geometry = new THREE.PlaneGeometry(9, 16);
 					// 应用绿幕材质到对象上
-					let mesh = new THREE.Mesh(geometry, greenScreenMaterial);
+					mesh.material  = greenScreenMaterial;
 					mesh.position.copy(lastPosition);//设置视频位置
 					// mesh.lookAt(camera.position);
 					scene.add(mesh);
@@ -506,7 +518,7 @@
 					// lineMesh = line;
 					// scene.add(line);
 					that.repeatFlag = false;//释放锁,允许再次点击
-				},1000)
+				}, 1000)
 			}
 			function getVideoPosition() {
 				if(!videoMesh){