You are not logged in.

1

Sunday, September 3rd 2017, 6:11pm

Toggle image hotspot Flat pano?

Hello All.


Please could someone have a quick look at my code and link.
And correct the code which is very almost correct.

https://s3-eu-west-1.amazonaws.com/prese…_test/tour.html


In the example below i have created an image toggle in flat pano mode, However even when i add distorted="true" and zoom="true" to my code i cant get the distorted image to work?
Im sure its a very simple solution but i have tried so many vairations for this?

Man thanks

Also you'll notice the black chairs are actually a png hoptspot loaded in postion on start. please could someone tell me how to add a very simple toggle on/off for the limage?


Many thanks in advance








Source code

1
2
3
4
5
6
7
8
9
10
<hotspot name="spot1" url="hotspot.png"       distorted="true"  scale="0.002"  />






<action name="open"> set(plugin[%1].visible,true); tween(plugin[%1].alpha,1);
 </action> <action name="close">  tween(plugin[%1].alpha,0,0.5,default, set(plugin[%1].visible,false) );</action>  <plugin name="openimage" url="chairs_green.png" ath="0"atv="0"
 alpha="0"distorted="true"  visible="true" zoom="true"onclick="action(close,get(name));" />  <hotspot name="fyi"  url="up.png" ath="0" atv="0" scale="0.001"distorted="true"   alpha="1"zoom= "tue" onover="tween(alpha,1);tween(scale,0.001);" onout="tween(alpha,1);tween(scale,0.001);" onclick="action(open,openimage);" />

spacerywirtualne

Professional

Posts: 1,117

Location: Poland, Europe

Occupation: krpano developer : virtual tours : the cms4vr owner

  • Send private message

2

Monday, September 4th 2017, 11:24am

Hi,

You 'openimage' element was not a hotspot but layer! Only hotspots can be distortion.


<
plugin name="openimage" url="chairs_green.png"


to


<hotspot name="openimage" url="chairs_green.png"


Piotr

Your own professional, online cloud tool for creating virtual tours - www.cms4vr.com

facebook page :: youtube :: wiki.cms4vr.com

cms4vr team *thumbsup*

3

Monday, September 4th 2017, 1:17pm

Hi Piotr.

Many thanks for your quick support, im very excited as this is almost working.
I have now updated the code as youve suggested however. the open close toggle button doesnt toggle the image.
Im sure its a minor, please could you view the link and code and correct me?

https://s3-eu-west-1.amazonaws.com/prese…_test/tour.html

Many thanks


Source code

1
2
3
<action name="open"> set(plugin[%1].visible,true); tween(plugin[%1].alpha,1);
 </action> <action name="close">  tween(plugin[%1].alpha,0,0.5,default, set(plugin[%1].visible,false) );</action>  <hotspot name="openimage" url="chairs_green.png" ath="0.1" atv="0.1"
 scale="0.001"distorted="true"   alpha="0.4"zoom= "tue"onclick="action(close,get(name));" />  <hotspot name="fyi"  url="up.png" ath="0" atv="0" scale="0.001"distorted="true"   alpha="1"zoom= "tue" onover="tween(alpha,1);tween(scale,0.001);" onout="tween(alpha,1);tween(scale,0.001);" onclick="action(open,openimage);" />







Many thanks again.

spacerywirtualne

Professional

Posts: 1,117

Location: Poland, Europe

Occupation: krpano developer : virtual tours : the cms4vr owner

  • Send private message

4

Monday, September 4th 2017, 2:11pm

Many thanks for your quick support, im very excited as this is almost working.
I have now updated the code as youve suggested however. the open close toggle button doesnt toggle the image.
Im sure its a minor, please could you view the link and code and correct me?

https://s3-eu-west-1.amazonaws.com/prese…_test/tour.html

Many thanks

I think the error is here:



Source code

1
2
3
4
5
6
7
8
<action name="open">
	set(plugin[%1].visible,true);
	tween(plugin[%1].alpha,1); 
</action> 

<action name="close">
	tween(plugin[%1].alpha,0,0.5,default, set(plugin[%1].visible,false) );
</action>


Replace 'plugin' to 'hotspot' and it should work.

Like this:

Source code

1
2
3
4
5
6
7
8
<action name="open">
	set(hotspot[%1].visible,true);
	tween(hotspot[%1].alpha,1); 
</action> 

<action name="close">
	tween(hotspot[%1].alpha,0,0.5,default, set(hotspot[%1].visible,false) );
</action>



Piotr

p.s. Or...

Source code

1
2
3
4
5
6
7
<action name="switch_visible">	
    tween(hotspot[openimage].alpha, %1);
</action>

<hotspot name="openimage" url="chairs_green.png" ath="0.1" atv="0.1" scale="0.001" distorted="true" autoalpha="true" alpha="0.4" zoom="true" onclick="switch_visible(0);"/>

<hotspot name="fyi" url="up.png" ath="0" atv="0" scale="0.001" distorted="true" alpha="1" zoom="tue" onover="tween(alpha,1);tween(scale,0.001);" onout="tween(alpha,1);tween(scale,0.001);" onclick="switch_visible(1);"/>



Your own professional, online cloud tool for creating virtual tours - www.cms4vr.com

facebook page :: youtube :: wiki.cms4vr.com

cms4vr team *thumbsup*

5

Monday, September 4th 2017, 5:07pm

Many thanks Piotr.


Please note that the toggle button only make the chairs visible? and doesn't set to 0 alpha (toggle off)


I have attempted to update the code. by removing the tween code on the chair .png itself?

As far as i can see by the code you provided, the toggle on off should work?

I appreciate your support. and once i get this working will submit some amazing 3d work for the showscase *smile*

Please could you offer a solution to correctly have the button toggle the furn on and off?

spacerywirtualne

Professional

Posts: 1,117

Location: Poland, Europe

Occupation: krpano developer : virtual tours : the cms4vr owner

  • Send private message

6

Monday, September 4th 2017, 7:21pm

Please could you offer a solution to correctly have the button toggle the furn on and off?
The switcher action is quite simple.


Source code

1
2
3
4
5
6
7
<action name="btn_switcher">	
if(hotspot[openimage].visible,		
  set(hotspot[openimage].visible, false);	
,		
  set(hotspot[openimage].visible, true);	
);
</action>



run a 'btn_switcher();' action and that's all.

Piotr
Your own professional, online cloud tool for creating virtual tours - www.cms4vr.com

facebook page :: youtube :: wiki.cms4vr.com

cms4vr team *thumbsup*