You are not logged in.

Dear visitor, welcome to krpano.com Forum. If this is your first visit here, please read the Help. It explains in detail how this page works. To use all features of this page, you should consider registering. Please use the registration form, to register here or read more information about the registration process. If you are already registered, please login here.

1

Tuesday, May 19th 2020, 1:41pm

Hotspot alpha relative to hlookat, onviewchange

Hope someone can help!

I've been scratching my head over this for days. I want to fade in a hotspot (simple label, png image) to fully opaque when it's at the centre of the user viewing direction, and then fade out to zero as they move either left or right. Using the onviewchange event. Ideally, there would be some sort of "factor" involved as a variable, so that if you move say 30 degrees to the left, if fades to zero as you hit 30, and 30 degrees to the right, also zero as you reach 30. Hope this makes sense!


<events onviewchange="continuous_tracking();" />

<action name="continuous_tracking">
if (view.hlookat LT 0,
calc(labelAlpha, (view.hlookat * -1) / get(hotspot[label-breakout].ath) );
,
calc(labelAlpha, view.hlookat / get(hotspot[label-breakout].ath) );
);
trace(labelAlpha);
set(hotspot[label-breakout].alpha, get(labelAlpha));
</action>

Any input greatly appreciated!

Tim

Sergey74

Intermediate

Posts: 175

Location: Russia, Chelyabinsk

Occupation: professional noob

  • Send private message

2

Tuesday, May 19th 2020, 4:28pm

You need to use getlooktodistance and sin

You can explore my example (look at the sun), the code is open (only there is used cos).
translation difficulties *huh*

This post has been edited 1 times, last edit by "Sergey74" (May 20th 2020, 7:17am)


3

Wednesday, May 20th 2020, 3:25pm

Sergey, thank you for replying.

I've looked at your example, but can't see an example of what I'm trying to achieve? Also your xml is encrypted?

I'm playing around with getlooktodistance now

Sergey74

Intermediate

Posts: 175

Location: Russia, Chelyabinsk

Occupation: professional noob

  • Send private message

4

Wednesday, May 20th 2020, 3:43pm

My code is not encrypted https://panosphera.ru/gallery/expo/expo.xml, click file, save as
In my example, when you look at the sun, the variable that is responsible for exposure increases. You need to do the opposite (as I understand)
translation difficulties *huh*

Sergey74

Intermediate

Posts: 175

Location: Russia, Chelyabinsk

Occupation: professional noob

  • Send private message

5

Wednesday, May 20th 2020, 4:06pm

Just try this code

Source code

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
28
29
30
31
32
33
34
35
36
37
38
39
<krpano onstart="showlog();">
  <preview type="grid();" />
  <view hlookat="0" vlookat="0" fovtype="VFOV" fov="90" fovmin="30" fovmax="150"/>
  <hotspot name="logo"
           type="image"
           url="logo.jpg"
           keep="false"
           visible="true"
           enabled="true"
           handcursor="true"
           maskchildren="false"
           zorder=""
           style=""
           ath="0.0" atv="0.0"
           edge="center"
           zoom="false"
           distorted="false"
           rx="0.0" ry="0.0" rz="0.0"
           width="" height=""
           scale="1.0"
           rotate="0.0"
           alpha="1.0"
           />
  <settings transparent_angle="45"/>
  <events name="transparent_active" keep="true" onviewchanged="transparent_active"/>
  <action name="transparent_active" scope="local">
    getlooktodistance(current_angle, hotspot[logo].ath, hotspot[logo].atv);
    clamp(current_angle, 0, get(settings.transparent_angle));
    set(current_angle_90, calc( current_angle * (90 / settings.transparent_angle) ));
    set(current_angle_90_rad, calc( current_angle_90 / 180 * Math.PI ));
    if(current_angle_90 LT 90,
      Math.sin(transparent_coeff, current_angle_90_rad);
      ,
      set(transparent_coeff, 1);
    );
    set(hotspot[logo].alpha, get(transparent_coeff));
    trace(hotspot[logo].alpha);
  </action>
</krpano>
translation difficulties *huh*

6

Thursday, May 21st 2020, 2:09pm

Hi again Sergey,

Thank you so much for the code!

I have applied it to my pano and it has kind of the opposite effect, the hotspot is fading out when nearer the central viewing point. Have a look:

https://tours.picto.co.uk/label-demo-3/

Sergey74

Intermediate

Posts: 175

Location: Russia, Chelyabinsk

Occupation: professional noob

  • Send private message

7

Saturday, May 23rd 2020, 6:32pm

Apparently I translated your question incorrectly.

Source code

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
28
29
30
31
32
33
34
35
36
37
38
39
<krpano onstart="showlog();">
  <preview type="grid();" />
  <view hlookat="0" vlookat="0" fovtype="VFOV" fov="90" fovmin="30" fovmax="150"/>
  <hotspot name="logo"
           type="image"
           url="logo.jpg"
           keep="false"
           visible="true"
           enabled="true"
           handcursor="true"
           maskchildren="false"
           zorder=""
           style=""
           ath="0.0" atv="0.0"
           edge="center"
           zoom="false"
           distorted="false"
           rx="0.0" ry="0.0" rz="0.0"
           width="" height=""
           scale="1.0"
           rotate="0.0"
           alpha="1.0"
           />
  <settings transparent_angle="45"/>
  <events name="transparent_active" keep="true" onviewchanged="transparent_active"/>
  <action name="transparent_active" scope="local">
    getlooktodistance(current_angle, hotspot[logo].ath, hotspot[logo].atv);
    clamp(current_angle, 0, get(settings.transparent_angle));
    set(current_angle_90, calc( current_angle * (90 / settings.transparent_angle) ));
    set(current_angle_90_rad, calc( current_angle_90 / 180 * Math.PI ));
    if(current_angle_90 LT 90,
      Math.cos(transparent_coeff, current_angle_90_rad);
      ,
      set(transparent_coeff, 0);
    );
    set(hotspot[logo].alpha, get(transparent_coeff));
    trace(hotspot[logo].alpha);
  </action>
</krpano>
translation difficulties *huh*

8

Thursday, June 4th 2020, 5:59pm

This works perfectly Sergey, thank you so much!