Mouseover Actions for a Polygon Hotspot


This “little bit's” tutorial show you how to apply a Mouseover Action to a Polygon Hotspot.

Note: As “Little Bit” tutorials don’t go into detail about Pano2VR operations a working knowledge of Pano2VR is an advantage.

Final Output

Project Overview

In this tutorial we will add a Hotspot Proxy ID to a Container element and add actions that will modify a Polygon Hotspot.

Note: this tutorial assumes a basic knowledge of Pano2VR V6

Note: click on any image in the tutorial to enlarge it

Setting up the Polygon Hotspot

1. Open up Pano2VR

2. Add an Equirectangular image to the project

3. Set the Output to HTML and define an output folder

4. Create a Polygon Hotspot

5. Give it a Title: Polygon - Mouseover

5. Leave the Hotspot settings at the default with the exception of View Mode: which is set to ‘Always Visible’

5. Save the Project (Figure #1)

Figure #1: Project file with Polygon Hotspot

Creating the Hotspot Proxy ID

  1. Create a new Skin

  2. Add a ‘Draw Container’ to the skin

  3. In the Properties/Advanced dropdown panel add the Hotspot Proxy ID: Poly01

  4. In the Actions Panel add two new actions

    a. Mouse Over to change the color
    b. Mouse Leave to change it back to the original color (Figure #2)

Figure #2: Container element with Hotspot Proxy ID and Actions

5. Save and close the Skin

6. Re-output the project to see the Actions working with the Polygon Hotspot.


I hope you have enjoyed the tutorial and it has helped you to achieve the best possible project outcome. If it has please take a second to consider a donation so that I can continue to add more tutorials.

I'd like to Donate