Hotspot Tooltips for VR mode?

MarcW.

Fortgeschrittener

Beiträge: 282

Mittwoch, 22. April 2020, 14:39

Hotspot Tooltips for VR mode?

Hello,
I´m creating a VTOUR and I want to add text or tooltip to hotspots in VR mode. How is this possible?

best,
Marc

Zum Seitenanfang

Just Another Joe

Anfänger

Beiträge: 5

Freitag, 1. Mai 2020, 22:43

VR tool tips

It is actually very easy! Lets start with Klaus's Tooltips example.

Quellcode

<!-- the 'tooltip' style - show the tooltip textfield and update its position as long as hovering -->	<style name="tooltip"
	       onover="copy(layer[tooltip].html, tooltip);
	               set(layer[tooltip].visible, true);
	               tween(layer[tooltip].alpha, 1.0, 0.5);
	               asyncloop(hovering, copy(layer[tooltip].x,mouse.stagex); copy(layer[tooltip].y,mouse.stagey); );"
	       onout="tween(layer[tooltip].alpha, 0.0, 0.25, default, set(layer[tooltip].visible,false), copy(layer[tooltip].x,mouse.stagex); copy(layer[tooltip].y,mouse.stagey); );"
	       />


	<!-- the 'tooltip' textfield -->
	<layer name="tooltip" keep="true"
	       type="text"
	       parent="STAGE"
	       visible="false" alpha="0"
	       enabled="false"
	       align="lefttop"
	       edge="bottom"
	       oy="-2"
	       background="false" backgroundcolor="0xFFFFFF" backgroundalpha="1.0"
	       border="false" bordercolor="0x000000" borderalpha="1.0"
	       borderwidth="1.0" roundedge="0"
	       shadow="0.0" shadowrange="4.0" shadowangle="45" shadowcolor="0x000000" shadowalpha="1.0"
	       textshadow="1" textshadowrange="6.0" textshadowangle="90" textshadowcolor="0x000000" textshadowalpha="1.0"
	       css="text-align:center; color:#FFFFFF; font-family:Arial; font-weight:bold; font-size:14px;"
	       html="" 	       />

So it works by altering the text (html) of the tooltip layer. Layers can not be displayed in VR so we just need to make a version that uses a hotspot instead of a layer!

Here is a version I modified. In my case I wanted the tooltip to display under the hotspot, so I removed the asyncloop from the style and made it copy the ath and atv of the target item.

Quellcode

1
2

 <style name="tooltip"	 		onover.addevent="copy(hotspot[tooltip].html, tooltip); 		copy(hotspot[tooltip].atv, atv);  		copy(hotspot[tooltip].ath, ath); 		set(hotspot[tooltip].visible, true);	 		tween(hotspot[tooltip].alpha, 1.0, 0.5); " 	onout.addevent="tween(hotspot[tooltip].alpha, 0.0, 0.25, default, set(hotspot[tooltip].visible,false), copy(hotspot[tooltip].ath , ath); 		copy(hotspot[tooltip].avt, atv); );"	       />
 <hotspot name="tooltip" keep="true"	       type="text"	       distorted="false"	       visible="false" alpha="0"	       enabled="false" 	ath="40" atv="-50"  	oy="60"               ox=""	 	zorder='95'  	html=""  	padding="5 25 5 25"  	bg="true"        bgalpha="0.8"        bgcolor="get:skin_settings.design_bgcolor"        bgroundedge="10"  	onautosized="false"        oversampling="2"        mipmapping="2" 	css="font-family:Helvetica; font-size:13px; color:#ffffff; margin:5px;"           />

Hmmm, I am not sure why that formatting is so ugly! *huh*

To use this code, just add the tooltip style to your hotspot ( style="currentstyle|tooltip") and add a new tooltip attribute to the hotspot ( tooltip="Your tool tip text" )

I hope that helps!

Zum Seitenanfang

joschii

Anfänger

Beiträge: 25

Wohnort: Austria

Beruf: VR

Montag, 3. August 2020, 16:55

Hotspot Name Tag Label Text Plugin

hi. i made a plugin that puts the hotspot's-name under every hotspot as a textfield automatically.
textfield can be edited of course.
simple integration.
works also in VR and smartdevices.
DEMO_TOUR_EXAMPLE
would that help you?