Sie sind nicht angemeldet.

dynamically set VR Thumbs with "showthumbs" from krpano_vr.xml

loki

Schüler

  • »loki« ist der Autor dieses Themas

Beiträge: 72

Wohnort: Berlin

  • Nachricht senden

1

Freitag, 30. April 2021, 07:48

dynamically set VR Thumbs with "showthumbs" from krpano_vr.xml

Hi,

I got the VR thumbs menu from this example https://krpano.com/releases/1.20.9/viewe…tml5=only+webgl
showing up at the origin of my depthmap panos when pressing the HOME button in VR. The code below will show the thumbs menu at origin, also when I'm in a pano with offset.
Now I struggle calculating the current offset and adjust it dynamically in the showthumbs action, before the thumbs get tweened from ty=10000 to ty=0 with ox|oy offset, whereever the cameraposition is at the moment.

Could someone give me a push in the right direction at which position to maybe copy the current location coords and use them to show the thumbs correctly? I tried tracing various coords without success.

Thanks,
loki

Quellcode

 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27

<action name="add_example_thumb" scope="local" args="title, ath, yoffset, thumburl, clickaction">
		addhotspot(auto,bg);
		addhotspot(auto,thumb);
		addhotspot(auto,text);

		set(bg,    distorted=true, zorder=1, enabled=false, type=text, bgcolor=0x000000, bgalpha=0.5, bgroundedge=0, width=220, height=160, ath=get(ath), oy=calc((yoffset+20)*0.15*0.5), depth=150, scale=0.15);
		set(thumb, distorted=true, zorder=2, capture=false, url=get(thumburl), width=200, height=120, ath=get(ath), oy=calc(yoffset*0.15*0.5), depth=149, scale=0.15, onover=tween(depth,147), onout=tween(depth,149), clickaction=get(clickaction), onclick='set(enabled,false); clickaction();');
		set(text,  distorted=true, zorder=3, enabled=false, type=text, html=get(title), css='text-align:center;color:#FFFFFF;font-size:15px;font-weight:bold;', oversampling=3, mipmapping=true, bgcolor=0xFFFFFF, bgalpha=0.004, width=200, height=20, ath=get(ath), oy=calc((yoffset+145)*0.15*0.5), depth=149, scale=0.15);

		set(bg,    ty=10000, autoalpha=true, alpha=0);
		set(thumb, ty=10000, autoalpha=true, alpha=0);
		set(text,  ty=10000, autoalpha=true, alpha=0);

		<!-- store the current local scope to have later access to its local variables -->
		set(global.thumbs[get(global.thumbs.length)],get(local));
	</action>


	<action name="showthumbs" scope="local">
		for(set(i,0), i LT global.thumbs.length, inc(i),
			scope(get(global.thumbs[get(i)]),
				callwith(bg,    tween(ty|alpha, 0|1, 3.0, easeOutQuint|easeOutQuad); );
				callwith(thumb, tween(ty|alpha, 0|1, 3.0, easeOutQuint|easeOutQuad); );
				callwith(text,  tween(ty|alpha, 0|1, 3.0, easeOutQuint|easeOutQuad); );
			);
		);
	</action>

jeromebg

Profi

Beiträge: 1 120

Wohnort: Angers - France

Beruf: 360 experiences creator

  • Nachricht senden

2

Freitag, 30. April 2021, 10:26

to place a hotspot in a 3D space you have to use tx ty and tz instead of ath atv and depth

loki

Schüler

  • »loki« ist der Autor dieses Themas

Beiträge: 72

Wohnort: Berlin

  • Nachricht senden

3

Montag, 10. Mai 2021, 19:19

Hi jerome and thanks for the hint.

I added

Quellcode

 
1
2

tx=calc(view.tx),
tz=calc(view.tz),


to the add_example_thumb action and partly succeeded: Now the vr thumb menu pops up at the correct tx, ty, tz, but always faces towards hlookat 0.

I was wondering if I could dynamically calculate the fixed ath and yoffset values (eg. -27 and --60) in the action below but also no success, probably because scopes and args is still new to me?

Quellcode

 
1
2
3
4
5
6
7
8
9

<action name="add_examples" scope="local" autorun="onstart">
		def(global.thumbs, array);
		add_example_thumb('Monoscopic 2D Panos',   -27, -60,'%CURRENTXML%/thumb_corfu.jpg',     load_example('corfu.xml'); );
		add_example_thumb('Stereoscopic 3D Panos',   0, -60, '%CURRENTXML%/thumb_pano3d.jpg',    load_example('bluebonnet/tour.xml'); );
		add_example_thumb('Stereoscopic 3D Panos', +27, -60, '%CURRENTXML%/thumb_tour3d.jpg',    load_example('stereoscopic.xml'); );
		add_example_thumb('Stereoscopic 3D Panos', -27,+290, '%CURRENTXML%/thumb_temple3d.jpg',  load_indiantemple_example(); );
		add_example_thumb('Depthmap 3D Tour',        0,+290, '%CURRENTXML%/thumb_depthmap.jpg',  load_depthmap_example(); );
		add_example_thumb('Panoramic Video',       +27,+290, '%CURRENTXML%/thumb_panovideo.jpg', load_videopano_example(); );
	</action>

Ähnliche Themen