You are not logged in.

## Tutorial / Example - a Floor-hotspot at the Mouse-position

Tuesday, March 2nd 2021, 4:12pm

### Tutorial / Example - a Floor-hotspot at the Mouse-position

Hi,

I have seen several times examples that try to make a 'floor-hotspot' that automatically moves with the mouse position - and often this seems to be done by using spherical coordinates and some tricky rotations, but that typically results in a not correct looking perspective of the hotspot.

Here a more correct and still very simple solution:
• The hotspot will be '3d-placed' by the tx,ty,tz coordinates (and not by the spherical ath/atv/depth coordinates) and will be defined to be always be parallel-rotated to the floor.
• A custom 'floor-height' will be manually defined. That can be individual for each pano and would be the height of the camera when shooting the pano.
• Then to get the 3d position for the floor hotspot:
• First get the spherical position at the mouse position using the screentosphere action.
• Then convert that spherical position to a 3d unit/direction vector using the spheretospace action with depth=1.
• Then scale that vector to hit the floor - simply by scaling the unit-vector by the factor 'floorheight/unit-vector-y'.
Here as code:
```set(floorheight, 160);
screentosphere(mouse.x,mouse.y, h,v);
set(d,1);
spheretospace(h,v,d, x,y,z);
calc(hotspot[name].tx, x*floorheight/y);
calc(hotspot[name].tz, z*floorheight/y);
copy(hotspot[name].ty, floorheight);```
This are only a few code-lines and will result it a correctly placed hotspot in 3d space and will look good from all viewing angles.

Additionally having the correct 3d position allows doing other nice things,
• e.g. automatically rotating the hotspot into the target direction,
• changing the alpha depending on the distance,
• or even moving toward the point in 3d-space, but that one would be only useful for depthmapped panos.

Here a full example:
https://krpano.com/releases/1.20.11/view…mouse-position/

And here the example source:
https://krpano.com/viewsource.html?relea…pot-example.xml

Best regards,
Klaus

Sage

Posts: 3,733

Location: Netherlands

Occupation: Krpano custom coding / Virtual Tours / Photography / Musician / Recording engineer

Professional

Posts: 1,113

Location: Angers - France

Occupation: 360 experiences creator

Tuesday, March 2nd 2021, 6:19pm

Great, thanx Klaus !

Wednesday, March 3rd 2021, 3:30pm

Thank you Klaus, this is awesome, any chance to get the multiple texture support for Obj files too, please?
Regards.

Sage

Posts: 3,733

Location: Netherlands

Occupation: Krpano custom coding / Virtual Tours / Photography / Musician / Recording engineer

Friday, March 12th 2021, 4:07pm

Hi,

i was playing a bit and have a question.

I like the floor hotspot to point (rotate) to the ath position of the center of the/a polygonal hotspot.
I tried quite some, getcenter stuff etc..
No..succes..
perhaps i made a stupid mistake (obviously).. or just am/was on the wrong path.

https://www.virtualtuur.com/krpano/120/help/floorhotspot/1/
https://www.virtualtuur.com/krpano/120/h…spot/1/tour.xml

Tuur

Friday, March 12th 2021, 7:10pm

### Quoted from "Tuur"

I like the floor hotspot to point (rotate) to the ath position of the center of the/a polygonal hotspot.

Here a second example for such:
https://krpano.com/releases/1.20.10/view…t-example-2.xml

The example source:
https://krpano.com/viewsource.html?relea…t-example-2.xml

Sage

Posts: 3,733

Location: Netherlands

Occupation: Krpano custom coding / Virtual Tours / Photography / Musician / Recording engineer

Friday, March 12th 2021, 7:18pm

master ..

thank you!
in my case it's not a door.. though.. let me sleep on that.. i think to know where you hint for

Tuur

Trainee

Posts: 64

Location: China

Occupation: Krpano custom coding

Monday, March 15th 2021, 3:06am

A great demo!
Could it be possible to go one step further, such as showing up on surfaces with depth information?

Constrast Plugin
KR HLS Plugin
Slider Controller Plugin
KR+Next+MapBox+TS Demo (source code)

Saturday, March 20th 2021, 11:45am

### Quoted from "juyatu"

Could it be possible to go one step further, such as showing up on surfaces with depth information?
Not yet, but with one of the next releases.

Trainee

Posts: 64

Location: China

Occupation: Krpano custom coding

Sunday, March 21st 2021, 4:57am

### Quoted from "klaus.krpano"

Not yet, but with one of the next releases.
That's great.I'm looking forward to it.

In addition, if the virtual scene panorama is rendered through the model, theoretically there is no need to draw the additional model, because it carries depth and camera information.Is it possible to develop a tool that generates model files directly from 3DMax or Blender without relying on EverPano?This saves a lot of tedious and repetitive work.

Constrast Plugin
KR HLS Plugin
Slider Controller Plugin
KR+Next+MapBox+TS Demo (source code)

Sunday, October 10th 2021, 8:08am

### Quoted from "juyatu"

Could it be possible to go one step further, such as showing up on surfaces with depth information?
Not yet, but with one of the next releases.
Hello Sir,

It is not yet possible right? or no update yet?

Thanks for the response.
Bax has attached the following image:

Sunday, October 17th 2021, 7:05pm

### walk on floor in 360 photo

Excellent
It is possible to walk on floor in 360 photo whit this example?

Beginner

Posts: 6

Location: Catania

Occupation: Cultural Heritage

Monday, October 18th 2021, 12:51pm

TOP!! Thanks Klaus!!
DP
Danavon

Professional

Tuesday, November 30th 2021, 11:45pm

hi klaus,

if you combine this with the dollhouse example and view.ox/y/z gets set,
the hotspot doesn't move in sync with the mouse anymore
would you have a tip here?

best, index

edit... the documentation says about view.ox/y/z :
" An additional 3D translation offset of the viewpoint.
But the viewing rotation will be still from the non-offset point.
"
so to find the effective/true position in 3d space we would need to
rotate the view.ox/y/z vector by hlookat/vlookat and add this vector to view.tx/y/z ?

This post has been edited 9 times, last edit by "indexofrefraction" (Dec 1st 2021, 11:35am)

Professional

Wednesday, December 8th 2021, 10:48pm

here a small sampler showing the problem
the view offset (oz) is not taken in account

### 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
40
41
42
43
44
45
```
```<krpano>
<action name="place_floorspot_at_mouse_pos" scope="local">
set(d, 1);
screentosphere(mouse.x, mouse.y, h, v);
spheretospace(h, v, d, x, y, z);
calc(fh, caller.floorheight_cm - view.ty);
calc(x, x * fh / y);
calc(z, z * fh / y);
set(caller,
tx=calc(view.tx + x),
tz=calc(view.tz + z),
ty=calc(view.ty + fh)
);

// optionally rotate the hotspot toward the target direction (e.g. for image-arrow-spots):
// calc(caller.ry, atan2(x, z) * 180 / Math.PI);

// optionally fade out the spot when too far away:
// calc(distance, sqrt(x * x + z * z));
// calc(caller.alpha, distance LT 1000 ? 1.0 : 1.0 - (distance - 1000) / 100);
);
</action>

<preview type="grid()"/>
<image oy="calc:hotspot[floorspot].floorheight_cm - 1000" />
<hotspot name="floorspot" devices="mouse" type="text" html="" css="font-size:80px;text-align:center;" vcenter="true" width="200" height="200" scale="0.2" bgalpha="0.5" bgroundedge="100" bgborder="2 0x000000 1" bgshadow="0 0 5 0xFFFFFF 1.0" oversampling="2" mipmapping="true" zorder="1" distorted="true" depth="0" depthbuffer="true" torigin="world" rotationorder="xyz" rx="-90" capture="false" handcursor="false" autoalpha="true" floorheight_cm="250" onloaded="place_floorspot_at_mouse_pos();" onclick="tween(view.tx, get(tx)); tween(view.tz, get(tz));"/>
<style name="button" type="text" css="text-align:center;" padding="4 8" mergedalpha="false" bgborder="0 0xFFFFFF 1" bgroundedge="1" bgshadow="0 1 4 0x000000 1.0" ondown="set(bgcolor, 0xDDDDDD);" onup="set(bgcolor, 0xFFFFFF);" />
<layer name="dollhouse" style="button" html="Dollhouse" width="80" align="bottom" y="50" onclick="dollhouse_toggle();" />

<action name="dollhouse_toggle">
if(!control.invert,
copy(hl, view.hlookat);
copy(vl, view.vlookat);
copy(fv, view.fov);
lookto(270, 50, 90, default, true, true);
tween(view.oz, 1200);
set(control.invert, true);
,
lookto(get(hl), get(vl), get(fv), default, true, true);
tween(view.oz, 0);
set(control.invert, false);
);
</action>
</krpano>```

This post has been edited 3 times, last edit by "indexofrefraction" (Dec 10th 2021, 11:53am)

Thursday, December 23rd 2021, 1:05pm

Hi,

just as quick note - in version 1.20.11 support for dollhouse views was added.
The links in the first post were updated accordingly.

Best regards,
Klaus

Intermediate

Posts: 342

Location: La Ceja, Colombia

Occupation: photographer

Friday, June 3rd 2022, 5:51pm

Hi Klaus
Is it possible to override or limit the action of the floor hotspot
when approaching the edge of the panorama and thus prevent the
panorama from disappearing when the last wall is clicked?
and the panorama does not disappear?
Ramiro

Intermediate

Wednesday, November 2nd 2022, 11:06am

How to see Floor-hotspot at the Mouse-position on a mobile?

onover="set(hotspot[floorspot].visible, false);"
onout="set(hotspot[floorspot].visible, true);"

does not work on mobiles, any other option?

don't walk through walls:

https://dearte.online/nav/

Intermediate

Wednesday, November 2nd 2022, 11:10am

### Quoted from "ramirox3"

Hi Klaus
Is it possible to override or limit the action of the floor hotspot
when approaching the edge of the panorama and thus prevent the
panorama from disappearing when the last wall is clicked?
and the panorama does not disappear?
Ramiro
https://dearte.online/nav/

Intermediate

Wednesday, November 9th 2022, 12:31pm

### Quoted from "Tuur"

I like the floor hotspot to point (rotate) to the ath position of the center of the/a polygonal hotspot.

Here a second example for such:
https://krpano.com/releases/1.20.10/view…t-example-2.xml

The example source:
https://krpano.com/viewsource.html?relea…t-example-2.xml

https://dearte.online/poly/

it is possible to limit the navigation with a polygonal hotspot on the ground, that is to say that the navigation remains active only for the area defined by the polygonal hotspot?

Best
Suso