zjs_project 1 tahun lalu
induk
melakukan
8956e534ee

+ 1 - 1
src/App.vue

@@ -61,7 +61,7 @@
 			window.addEventListener('error', (error) => {
 				// 区分是否是js错误
 				if (error.message) {
-					alert("error" + message)
+					alert("error" + error.message)
 				} else {
 					alert('监测到E1004错误' + error);
 				}

+ 1 - 3
src/pages/webgl_rxdz_clipImg/webgl_rxdz_clipImg.html

@@ -26,7 +26,5 @@
 	  :spaceObj="curSpaceObj" ></viewMask> -->
 	<!-- 生成截屏的画布对象 -->
 	<canvas id="canvas" type="2d" :style="{'height':'200px','top':'200px'}"></canvas>
-	<video id="myvideo" style="display: none;" loop muted autoplay controls="false" 
-
-	:src="videoUrl"></video>
+	<video id="myvideo" style="display: none;" loop muted autoplay controls="false" :src="videoUrl"></video>
 </div>

+ 1 - 1
src/pages/webgl_rxdz_clipImg/webgl_rxdz_clipImg.vue

@@ -239,7 +239,7 @@
 				video.setAttribute("crossOrigin", "Anonymous");
 				video.loop = true;
 				video.muted = true;
-				video.controls = true;
+				video.controls = false;
 				video.setAttribute('webkit-playsinline', true);
 				video.setAttribute('playsinline', true);
 				// video['custom-cache'] = false;

+ 8 - 2
src/pages/webgl_rxdz_vr/webgl_rxdz_vr.html

@@ -15,14 +15,20 @@
 		<canvas id="FPS" type="2d" style="width:80px;height:48px"></canvas>
 		<canvas id="MS" type="2d" style="width:80px;height:48px"></canvas>
 	</div> -->
-	<div class="mapDiv" ref="webgl"></div>
+	<div class="mapDiv" ref="webgl">
+		<div class="voice-btn rows justify-center" @click="updateMuted">
+			<span :class="[muted?'iconfont icon-jingyin':'iconfont icon-yinliang']" style="color: #ffffff;"></span>
+		</div>
+	</div>
 	<canvas id="canvas_webgl" type="webgl" ref="glcanvas"
 		 width="100vw" 
 		:style="{'height':canvasHeight+'px'}">
+		
 	</canvas>
 	<!-- AI数字人组件 -->
 	<viewAI ref="viewAI" @aiPeopleChange="aiPeopleChange" style="z-index: 13;"></viewAI>
 	<!-- 生成截屏的画布对象 -->
 	<canvas id="canvas" type="2d" :style="{'height':canvasHeight+'px','top':'100vh'}"></canvas>
-	<!-- <video id="myvideo" loop muted autoplay width="304" height="540" webkit-playsinline="webkit-playsinline" playsinline="playsinline" src="https://dm.static.elab-plus.com/miniProgram/001.mp4"></video> -->
+	<video id="myvideo" style="display: none;" loop :muted="muted" 
+	autoplay controls="false" ></video>
 </div>

+ 10 - 0
src/pages/webgl_rxdz_vr/webgl_rxdz_vr.scss

@@ -5,6 +5,7 @@
 }
 canvas { z-index: 10;}
 .mapDiv{
+	position: relative;
 	background-color: #fff;
 	font-size: 0px;
 }
@@ -30,3 +31,12 @@ page {
 	position:absolute;
 	width:100vw;
 }
+.voice-btn{
+	position: absolute;
+	width: 72px;
+	height: 72px;
+	background: rgba(0, 0, 0, 0.5);
+	right: 20px;
+	bottom: 20px;
+	border-radius: 50%;
+}

+ 27 - 15
src/pages/webgl_rxdz_vr/webgl_rxdz_vr.vue

@@ -63,6 +63,7 @@
 				myLoadingStatus: false,
 				repeatFlag: false, //重复点击
 				isIOS: false,
+				muted: true,
 			}
 		},
 		beforeDestroy() {
@@ -188,21 +189,25 @@
 				controls.enableRotate = true; //启用摄像机水平或垂直旋转
 
 				// 监听相机移动事件-限制只能在当前空间范围内移动
-				controls.addEventListener('change', () => {
-					// 检查相机位置是否超出边界框
-					if (boundary && !boundary.containsPoint(camera.position)) {
-						let clampedPosition = new THREE.Vector3();
-						boundary.clampPoint(camera.position, clampedPosition);
-						if (clampedPosition) {
-							camera.position.copy(clampedPosition);
-						}
-					}
-				});
+				// controls.addEventListener('change', () => {
+				// 	// 检查相机位置是否超出边界框
+				// 	if (boundary && !boundary.containsPoint(camera.position)) {
+				// 		let clampedPosition = new THREE.Vector3();
+				// 		boundary.clampPoint(camera.position, clampedPosition);
+				// 		if (clampedPosition) {
+				// 			camera.position.copy(clampedPosition);
+				// 		}
+				// 	}
+				// });
 				camera.lookAt(that.controlStarPosition.x, that.controlStarPosition.y, that.controlStarPosition.z);
 				starRender(); //启动渲染
-				// setTimeout(() => {
-				// 	videoHandle()
-				// }, 500);
+				if(that.isIOS){
+					document.addEventListener("WeixinJSBridgeReady", function (){
+					    videoHandle();
+					}, false)
+				}else{
+					videoHandle();
+				}
 			}
 
 			function videoHandle() {
@@ -214,11 +219,15 @@
 					controls2.dispose();
 				}
 				// 创建视频元素
-				var video = document.createElement('video');
+				// var video = document.createElement('video');
+				var video = document.getElementById('myvideo');
 				video.src = that.videoUrl; // 视频文件的路径
 				video.setAttribute("crossOrigin", "Anonymous");
 				video.loop = true;
-				video.muted = true;
+				video.muted = that.muted;
+				video.controls = false;
+				video.setAttribute('webkit-playsinline', true);
+				video.setAttribute('playsinline', true);
 				video.play();
 				
 				console.warn("***video***",video,video.width);
@@ -446,6 +455,9 @@
 			clearHandle() {
 				this.clearEvent();
 			},
+			updateMuted(){
+				this.muted = !this.muted;
+			},
 			aiPeopleChange(item){
 				console.warn("***aiPeopleChange***",item);
 				if(!item || !item.url){