Page 1 of 1

Linking Hotspot Proxy IDs using forward back buttons

Posted: Wed Aug 28, 2019 11:52 pm
by Nathan
Hi Hopki,

Pano2vr is an invaluable tool for our studio...

We are currently working on an architectural pano containing 5 information rollouts/hotspots showing signage locations for an exterior building. Our client is hoping that the interactivity follows the look of the carvana interior 360 as linked below (please ignore vehicle unavailable message and enter via the view 360 button). The beauty of the carvana example is that the information popups are linked together via gallery style forward and backwards buttons with the rotation of the pano being affected as the information buttons are cycled through.

[url] https://www.carvana.com/vehicle/1247349 [url]

We currently have the information rollouts/hotspots working but cant figure out a way to link them together with gallery style forward and backward buttons. We are aware that different panos can be linked via these buttons but our hope is that there is a way to do this with Hotspot Proxy IDs? Our hope is that upon click of the next/back button the pano rotates to the next/previous hotspot AND the informational rollout button interactively changes per hotspot. If my description is convoluted please know that the end goal is to match the carvana interactivity. Our example is below

[url] https://s3-us-west-1.amazonaws.com/vr.m ... stv01.html [url]

Thanks in advance,

Re: Linking Hotspot Proxy IDs using forward back buttons

Posted: Thu Aug 29, 2019 1:48 pm
by Hopki
Hi Nathan,
The first link just opens a still picture, is this what we are supposed to see?
Anyway, so the task is open a popup with some text with next and previous buttons.
Each press changes the text in the popup and changes the pan, tilt and FoV of the pano.

Please find attached a project that does this.
How it works.

Each point hotspot is set to info and has a title and in the description a number.
Each number corresponds to one of the information popups, this project has four, 1 - 4.


To help make this easier I made a note for each number, example for popup 1, I made a note of the title, body text it should have and the hotspot position, pan/tilt.

Example:
Title:
What is Lorem Ipsum

Body Text:
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.

Hotspot position:
hs1 -326.70 / -0.22


In the skin, I am using a numbered variable which controls everything!
The variable is: data_info and starts at 0.

The container "information" has a visible logic block that says that if the variable is greater than 0, visible, true.

The next and prev buttons don't have any actions but they have stacked containers, example next1, next2 etc.
These have visible logic blocks so they only show when the variable is at a certain number.
The containers have the actions to change the variable value and to rotate the panorama to the next hotspot, on click.

The fist info hotspot changes the variable to 1.
This then shows the container information.
This also shows the containers next1 and prev1.
Also in the text box info_title, there is a logic block for the text, so 1 = "What is Lorem Ipsum"

The same thing for the info_text_body, when the variable is 1 it will display the text: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged."


The next1 container has the actions to change the variable number to 2 and to rotate the pano to point towards the next hotspot.
The prev1 container does the same thing but points to the 4th hotspot and changes the variable to 4.


I got the test text from https://www.lipsum.com

Regards,
Hopki

Re: Linking Hotspot Proxy IDs using forward back buttons

Posted: Thu Aug 29, 2019 6:12 pm
by Nathan
This is amazing....works like a charm! Thanks for the clear and concise answer along with the example project.

Much appreciation!

Re: Linking Hotspot Proxy IDs using forward back buttons

Posted: Wed Oct 09, 2019 12:11 am
by Nathan
Hello,

I am continuing to develop the same project mentioned above, now what we are trying to do a bit more with it:
we are trying to have the info box with the arrows that switch to the next hotspot info, also highlight its connected button in a navigation list to the side. Is there a way to do that using what you have already done with the info boxes?

Re: Linking Hotspot Proxy IDs using forward back buttons

Posted: Thu Oct 10, 2019 11:07 pm
by Hopki
Hi,
Yes, just use the numbered variable in your list.
As an example a text box with a white background and black text.
If this text box is linked to the hotspot which has the variable number 3, then set a colour logic block for the background, so when the variable value is 3, the background colour changes to black.
And under the text colour logic block, when the variable value is 3 change the text colour to white.
For the other text boxes of your list just set the different variable number.
Regards,
Hopki