zjs_project 1 年之前
父节点
当前提交
9bdda06422

+ 36 - 52
src/mixins/screenshot.js

@@ -112,58 +112,42 @@ export default {
 			// let currUniPage = getCurrentPages()[getCurrentPages().length - 1].$vm;
 			//时机合适时-像素存在则触发生成
 			return new Promise(resolve => {
-				if(type==3){
-					this.getClipPicUrl(resolve)
-				}else{
-					this.screenPromiseShot().then((param) => {
-						if(param){
-							this.flip(param[0], param[1], param[2], 4);
-							const canvas = this.canvas2d;
-							const ctx = canvas.getContext('2d');
-							//  ImageData 对象,data是像素 一维数组,包含以 RGBA 顺序的数据,数据使用 0 至 255(包含)的整数表示
-							const img = canvas.createImageData(param[0], param[1], param[2]);
-							canvas.height = img.height;
-							canvas.width = img.width;
-							ctx.putImageData(img, 0, 0);
-							uni.canvasToTempFilePath({
-								x: 0,
-								y: 0,
-								destWidth:  canvas.width,
-								destHeight: canvas.height,
-								canvasId: "canvas",
-								canvas: canvas,
-								fileType: 'jpg',
-								quality: 1,
-								success: (res)=> {
-									console.log("***canvasToTempFilePath-success***", res)
-									this.upload(res.tempFilePath,resolve);
-								},
-								fail: (res)=> {
-									console.warn("***canvasToTempFilePath-fail***", res);
-									if(this && this.starRender && typeof(this.starRender)=='function'){
-										this.starRender()//启动渲染
-									}
-									resolve('')
-								}
-							})
-						}else{
-							// let imgBase64 = this.canvas.toDataURL();
-							// this.base64src(imgBase64, (res) => {
-							// 	console.warn('转化后的url:', res)
-							// 	this.upload(res,resolve);
-							// })
-							
-							// let img = new Image();
-							// img.src = this.canvas.toDataURL('image/jpeg');// toDataURL :图片格式转成 base64
-							let imgBase64 = this.canvas.toDataURL();
-							if(type==2){
-								resolve(imgBase64)
-							}else if(type==1){
-								this.uploadFile(imgBase64,resolve)
-							}
-						}					
-					})
-				}
+				this.screenPromiseShot().then((param) => {
+					if(param){
+						let {pixelData,width,height} = param;
+						this.flip(pixelData,width,height, 4);
+						let canvas = document.getElementById('canvas');
+						let context = canvas.getContext('2d');
+						
+						let img = context.createImageData(width, height);
+						for (var i = 0; i < img.data.length; i += 4) {
+							img.data[i + 0] = pixelData[i + 0];
+							img.data[i + 1] = pixelData[i + 1];
+							img.data[i + 2] = pixelData[i + 2];
+							img.data[i + 3] = pixelData[i + 3];
+						}
+						canvas.height = img.height;
+						canvas.width = img.width;
+						context.putImageData(img, 0, 0);
+						let imgBase64 = canvas.toDataURL();
+						this.uploadFile(imgBase64,resolve);
+					}else{
+						// let imgBase64 = this.canvas.toDataURL();
+						// this.base64src(imgBase64, (res) => {
+						// 	console.warn('转化后的url:', res)
+						// 	this.upload(res,resolve);
+						// })
+						
+						// let img = new Image();
+						// img.src = this.canvas.toDataURL('image/jpeg');// toDataURL :图片格式转成 base64
+						let imgBase64 = this.canvas.toDataURL();
+						if(type==2){
+							resolve(imgBase64)
+						}else if(type==1){
+							this.uploadFile(imgBase64,resolve)
+						}
+					}					
+				})
 			})
 		},
 		async uploadFile(file, cb = null) {

+ 7 - 2
src/pages/webgl_rxdz_720/webgl_rxdz_720.vue

@@ -217,7 +217,7 @@
 							}else{
 								videoHandle({videoUrl:that.videoUrl,coordinate:that.coordinate});
 							}
-						},500)
+						},1000)
 					}
 				}, false);
 			}
@@ -226,22 +226,27 @@
 					{
 						videoUrl:'https://dm.static.elab-plus.com/miniProgram/002.mp4',
 						coordinate:'{"x":6,"y":-5,"z":0}',
+						muted:true,
 					},
 					{
 						videoUrl:'https://dm.static.elab-plus.com/miniProgram/004.mp4',
 						coordinate:'{"x":-13,"y":16,"z":8}',
+						muted:false,
 					},
 					{
 						videoUrl:'https://dm.static.elab-plus.com/miniProgram/005.mp4',
 						coordinate:'{"x":13,"y":-14,"z":-35}',
+						muted:true,
 					},
 					{
 						videoUrl:'https://dm.static.elab-plus.com/miniProgram/007.mp4',
 						coordinate:'{"x":0,"y":4,"z":25}',
+						muted:true,
 					},
 					{
 						videoUrl:'https://dm.static.elab-plus.com/miniProgram/008.mov',
 						coordinate:'{"x":3,"y":-4,"z":-5}',
+						muted:true,
 					}
 				]
 				data.forEach(it=>{
@@ -257,7 +262,7 @@
 				video.src = item.videoUrl; // 视频文件的路径
 				video.setAttribute("crossOrigin", "Anonymous");
 				video.loop = true;
-				video.muted = true;
+				video.muted = item.muted;
 				video.controls = false;
 				video.setAttribute('webkit-playsinline', true);
 				video.setAttribute('playsinline', true);

+ 21 - 2
src/pages/webgl_rxdz_clipImg/webgl_rxdz_clipImg.vue

@@ -75,6 +75,7 @@
 				bottomLeftX:0,
 				bottomLeftY:0,
 				coordinate:'',
+				screenshotResolve:null,
 			}
 		},
 		beforeDestroy() {
@@ -459,6 +460,25 @@
 				}
 				renderer.render(scene, camera); //单次渲染
 				requestId = requestAnimationFrame(render, canvas3d);
+				if (that.screenshotResolve) {
+					let gl = renderer.getContext();
+					let pix = window.devicePixelRatio;
+					let width = parseInt(that.width*pix);
+					let height = parseInt(that.height*pix);
+					let pixelData = new Uint8Array(width * height * 4);
+					if (gl.checkFramebufferStatus(gl.FRAMEBUFFER) === gl.FRAMEBUFFER_COMPLETE) {
+						// gl.readPixels(0, 0, frameBuffer.x, frameBuffer.y, gl.RGBA, gl.UNSIGNED_BYTE, pixelData);
+						gl.readPixels(that.bottomLeftX*pix, that.bottomLeftY*pix, width, height, gl.RGBA, gl.UNSIGNED_BYTE, pixelData);
+						// 确保有像素,微信小程序安卓在进入子页面返回本页面后,再一次readPixels稳定无像素
+						if (pixelData.some(i => i !== 0)) {
+							stopRender();
+							console.warn("***screenshotResolve-pixelData***");
+							that.screenshotResolve({pixelData, width, height})
+							that.screenshotResolve = null;//释放Promise
+							pixelData = null;//清空内存中的数据
+						}
+					}
+				}
 			}
 
 		},
@@ -466,7 +486,6 @@
 			async clipImgHandle(){
 				this.bottomLeftX = this.left;
 				this.bottomLeftY = this.screenHeight - this.top - this.height;
-				console.warn("***clipImgHandle***")
 				let shottingImg = await this.shottingAction(3);//开始截图
 				console.warn("***clipImgHandle1***",shottingImg);
 				// alert(shottingImg)
@@ -497,7 +516,7 @@
 					// 	+ '&bgUrl=' + shottingImg
 					// 	+ '&videoUrl=' + encodeURIComponent(this.$route.query.videoUrl)})
 				}else{
-					window.location.href = shottingImg
+					// window.location.href = shottingImg
 				}
 			},
 			navbarBackClk() {