Quellcode durchsuchen

2D 图片使用

zjs_project vor 1 Jahr
Ursprung
Commit
138334cad9
2 geänderte Dateien mit 46 neuen und 15 gelöschten Zeilen
  1. 6 5
      src/components/krpanoVideo/index.vue
  2. 40 10
      src/components/krpanoVideo/panoramic.xml

+ 6 - 5
src/components/krpanoVideo/index.vue

@@ -219,9 +219,10 @@
 				}
 				let object = this.panoramicKrpano.get("hotspot[video]");
 				let image_hotspot = this.panoramicKrpano.get("hotspot[image_hotspot]");
+        // this.scale = 1;//这里要注意,当2D模式下,绿幕视频隐射到canvas的关系暂不清楚,似乎会放的很大?所以这里使用了极小的缩放值
 				if(Number(item.width)>= Number(item.height)){//横屏
-					let realWidth = 480;
-					let realHeight = item.height/(item.width/480);
+					let realWidth = 350;
+					let realHeight = item.height/(item.width/realWidth);
 					object.width = realWidth;
 					object.height = realHeight;
 					object.scale = this.scale;
@@ -233,8 +234,8 @@
 						image_hotspot.url = 'https://dm.static.elab-plus.com/miniProgram/shadow22.png';
 					}
 				}else{//竖直版视频
-					let realWidth = 180;
-					let realHeight = item.height/(item.width/180);
+					let realWidth = 350;
+					let realHeight = item.height/(item.width/realWidth);
 					object.width = realWidth;
 					object.height = realHeight;
 					object.scale = this.scale;
@@ -246,7 +247,7 @@
 						image_hotspot.url = 'https://dm.static.elab-plus.com/miniProgram/shadow11.png';
 					}
 				}
-				console.warn("**updataVideoSize****",item.width,item.height,Number(item.width)>= Number(item.height),this.scale);
+				console.warn("**updataVideoSize****",item.width,item.height,Number(item.width)>= Number(item.height),object.width,object.height,this.scale);
 			},
 			aiChange(item,type,tabIndex){
 				console.warn("**aiChange****",item,type,tabIndex)

+ 40 - 10
src/components/krpanoVideo/panoramic.xml

@@ -47,20 +47,20 @@
 
 		<control bouncinglimits="calc:image.cube ? true : false" />
 
-		<view hlookat="50.082" vlookat="12.404" fovtype="MFOV" fov="90.000" maxpixelzoom="2.0" fovmin="70" fovmax="120" limitview="auto" />
-
-		<!-- <preview url="https://elab-marketing-web.oss-cn-shanghai.aliyuncs.com/fairyMountain/layout/hospital/panos/ceshi.tiles/preview.jpg" /> -->
+		<!-- <view hlookat="50.082" vlookat="12.404" fovtype="MFOV" fov="90.000" maxpixelzoom="2.0" fovmin="70" fovmax="120" limitview="auto" /> -->
 
 		<image if="!(webvr.isenabled OR device.mobilevr)">
 			<!-- <cube url="https://elab-marketing-web.oss-cn-shanghai.aliyuncs.com/fairyMountain/layout/hospital/panos/ceshi.tiles/%s/l%l/%v/l%l_%s_%v_%h.jpg" multires="512,1024,2048" /> -->
 			<!-- <sphere url="https://elab-marketing-web.oss-accelerate.aliyuncs.com/aiBeauty/1702533120761.png" /> -->
-			<sphere url="%$panorama_url%" />
+			<!-- <sphere url="%$panorama_url%" /> -->
+      <flat url="%$panorama_url%" />
 		</image>
 
 		<image if="webvr.isenabled OR device.mobilevr">
 			<!-- <cube url="https://elab-marketing-web.oss-cn-shanghai.aliyuncs.com/fairyMountain/layout/hospital/panos/ceshi.tiles/vr/pano_%s.jpg" /> -->
 			<!-- <sphere url="https://elab-marketing-web.oss-accelerate.aliyuncs.com/aiBeauty/1702533120761.png" /> -->
-			<sphere url="%$panorama_url%" />
+			<!-- <sphere url="%$panorama_url%" /> -->
+      <flat url="%$panorama_url%" />
 		</image>
 		<!--火车站-->
 		<!-- <hotspot name="spot2" url="skin/plugin.png" distorted="true" keep="false" ath="145.763" atv="22" visible="true"></hotspot>
@@ -71,8 +71,38 @@
 			<layer  name="title2_line2_hottiyan" style="text" align="top center" x="0" y="0" css="background-color:#fff;width:6px;height:6px;border-radius:50%;"  />
 		</plugin> -->
 		<!-- <preview url="test3333.png"/> 			onloaded.addevent="sceneload();"-->
-		
-		<hotspot name="video"
+		<!-- 绿幕视频-2D -->
+    <hotspot name="video"
+      edge="center"
+			ox="0" 
+			oy="0"
+			url="https://dm.static.elab-plus.com/videoplayer.js"
+			videourl=""
+			chromakey="0x238E54|0.294|0.133"
+			preload="true"
+			pausedonstart="false"
+			loop="true"
+			distorted="false"
+			muted="true"
+			autopause="true"
+			autoresume="true"
+			onvideoready="videoreadyFunc"
+			onvideoplay="videoplayHandle"
+			ondown="draghotspot();"
+			onclick="togglepause();"
+			cursor="grab"
+			ondown.addevent="set(cursor,grabbing);"
+			onup.addevent="set(cursor,grab);"
+			zorder="1"
+			enabled="true"
+		>
+		</hotspot>
+    <!-- 电子人的阴影-2D -->
+    <!-- <hotspot name="image_hotspot" ath="50.082" atv="14" rotate="0" zorder="1"
+    	distorted="true" scale="1" alpha="0.5" visible="false" width="180" height="320"
+    	url="https://dm.static.elab-plus.com/miniProgram/shadow11.png" keep="true"></hotspot> -->
+    <!-- 以下是3D空间的数据 -->
+		<!-- <hotspot name="video"
 			ath="50.082" 
 			atv="14"
 			url="https://dm.static.elab-plus.com/videoplayer.js"
@@ -99,11 +129,11 @@
 			zorder="2"
 			enabled="true"
 		>
-		</hotspot>
+		</hotspot> -->
 		<!-- 电子人的阴影 -->
-		<hotspot name="image_hotspot" ath="50.082" atv="14" rotate="0" zorder="1"
+		<!-- <hotspot name="image_hotspot" ath="50.082" atv="14" rotate="0" zorder="1"
 			distorted="true" scale="1" alpha="0.5" visible="false" width="180" height="320"
-			url="https://dm.static.elab-plus.com/miniProgram/shadow11.png" keep="true"></hotspot>
+			url="https://dm.static.elab-plus.com/miniProgram/shadow11.png" keep="true"></hotspot> -->
 		<action name="draghotspot">
 			spheretoscreen(ath, atv, hotspotcenterx, hotspotcentery, calc(mouse.stagex LT stagewidth/2 ? 'l' : 'r'));
 			sub(drag_adjustx, mouse.stagex, hotspotcenterx);