Skip to main content

Building a Tour (Pano2VR)

This is the documentation for Pano2VR 4. You can find the new documentation for Pano2VR 5 here.

Pano2VR - Help

The Tour Browser is found only in Pano2VR Pro. It provides a quick and easy way to build interactive panorama tours. Watch the video or follow the instructions below to learn how to make the most of out the Tour Browser.

To open the Tour Browser, go to Tour > Show Tour Browser.

Video loading...

Watch this video on YouTube

Download Project Files


Importing the Images[edit]

Import all tour images by doing one of following:


Setting up the Images[edit]

◊ TIP: When you have a lot images in a tour, convert equirectangulars to a strip format for faster loading times (i.e. during skin design). If the images will be multi-resolution, use cube faces instead. Also, if you don't want to lose GPS data, use the convert tool rather than the batch tool to remap the images.

Once the images are added to the Tour Browser, you can then modify the image order (click and drag), change the default views (Viewing Parameters) and add GPS data (User Data).

The first image that is imported into the project will be automatically assigned as the starting panorama. You can change this order by rearranging the images (follow the instructions below). The starting panorama is indicated by the number 1.

Starting panorama indicated by the number 1.

◊ NOTE: The following directions are for setting data and parameters on an individual basis. A much quicker way to add information to all the images in a tour, is by using the Master Node. Go to the tip page to learn how to add user data, hotspots and patches to all images simply with the Master Node.

  1. Set the starting panorama if not already set. In the Tour Browser, select the panorama that will begin the tour (the first panorama to be viewed in the tour). Right click on the image and choose, Set as Start Panorama.
    Set-as-start.png

    The following steps (steps 2-8) are all optional and are not required in order for the tour to function. However, they help to make a better user experience.

  2. Set the default view in Viewing Parameters for the starting panorama:
    1. Move the panorama to where it should open.
    2. Click, Set in top left section.
      Set-vp.png

  3. Set North in Viewing Parameters:
    1. To help line up North, choose, Show north. A black vertical line and direction indicators appear in the preview window.
    2. Line up the North symbol with the black vertical line, and then hit, Set.
      ◊ NOTE: North can also be set in User Data using a map and/or GPS coordinates. See step 6.
      Show north vp.jpeg

  4. Add general information (meta data) about the image in User Data (if not already added from EXIF data).
    ◊ TIP: Data that will be the same across all images can be added to the Master Node.

  5. Add location information in User Data (if not already added from EXIF data):
    1. Click the marker button to open the Map.
      Open map.jpeg
    2. Find the image's location by doing one of the following:
      – Enter the location or address in the Address field and click the magnifying glass. A green flag will be dropped. To confirm the location, Click on the flag and a pin with a radar beam will be dropped.
      – Navigate the map through a combination of clicking, zooming and dragging within the map. Right-click to drop a pin with a radar beam.
      Dropped pin.png
      ◊ TIP: To reposition, click and drag.
  6. Set North by:
    1. Selecting, Pick landmark.
    2. Rotate the image to a specific landmark, bringing it into view. Line up the landmark with the black vertical line.
    3. In the the map, locate and center the same landmark (changing to satellite view may help) in the viewer, and right-click on the landmark. North will be automatically set.
  7. Click OK to return to the User Data window and the Latitude and Longitude fields have been updated.
    Long lat.png

  8. Add Tags to the image by typing in the field and then hit the spacebar to add the next tag.
    Tags.png

  9. Select the next panorama and repeat steps 2 - 8. Continue to do this for each panorama.


Linking the Images[edit]

After setting up the images, you can start linking (or pointing) the images (nodes). ◊ TIP: Add a hotspot to the Master Node for any common hotspot; i.e. a nadir logo.

Linking the images is done through hotspots and there are multiple types of hotspots:

Open the Hotspot editor to add hotspots.


Adding Point and Polygon Hotspots[edit]

The Point & Polygon hotspot tab is opened by default.

If location information was added in the User Data section, then you will see grey crosshairs in the image, indicating the location of the other nodes of the tour in relation to the current panorama. They are meant as placeholders or a way to assist you in adding hotspots. The crosshairs can be moved and they will not be visible on output until they are activated.
Hotspot crosshair.jpeg

◊ TIP: The current hotspot (that is being edited) is red. A non-active hotspot is blue.
◊ TIP: In the hotspot editor, clicking on a hotspot while holding down the ALT key will take to the linked panorama.

Adding a Point Hotspot[edit]

  1. Add a point hotspot by selecting the point hotspot type, Hotspot.png, and then doing one of the following:
    • Drag an image from the Tour Browser and drop onto the hotspot.
    • Double-click within the panorama and an ID and red crosshair are added. Continue to step 2.
    • Double-click on a grey crosshair to activate it - it will turn red.
      If using the crosshairs, all the necessary information (Title, URL) is automatically added. Skip to step 4.
  2. Enter a Title for the hotspot. On output, this will appear as a tooltip (if enabled) when the mouse hovers over the hotspot. (optional)

  3. Enter the linking panorama in the URL field. Use the drop-down menu to choose from the images already imported into the tour browser.
    Enter URL.png

  4. Enter the Target information by opening the Target Viewing Parameters: Target button.png. The linked image will pop up. Rotate it to set its opening view. Click, OK, when finished.

  5. Go to the next image in the tour by doing one of the following
    • Click the Follow hotspot link button, Follow hotspot link.png.
    • Keep the Hotspot window open and select the next image in the Tour Browser.

Adding a Polygon Hotspot[edit]

  1. Add a polygon hotspot by selecting the Polygon Hotspot, Drawpolygon.png, as the Hotspot type.

  2. Draw the hotspot by first double-clicking in the image, then move to the next point, click, and continue until the shape is finished.

  3. Double-click to close/finish the shape.
    ◊ TIP: You can always go back and adjust the points of the hotspot by simply clicking and dragging on them.

  4. Enter a Title for the hotspot. On output, this will appear as a tooltip (if enabled) when the mouse hovers over the hotspot. (optional)

  5. Enter the linking panorama in the URL field by doing one of the following:
    • Use the drop-down menu to choose from the images already imported into the tour browser.
      Enter URL.png

    • Drag the image from the Tour Browser and drop onto the hotspot.
  6. Enter the Target information by opening the Target Viewing Parameters: Target button.png. The linked image will pop up. Rotate it to set its opening view. Click, OK, when finished. (optional)

  7. Go to the next image in the tour by doing one of the following
    • Click the Follow hotspot link button, Follow hotspot link.png.
    • Keep the Hotspot window open and select the next image in the Tour Browser.

Adding Area Hotspots[edit]

◊ NOTE: HTML5 does not support area hotspots.

  1. Select the Area Hotspots tab.

  2. Select the checkbox labeled, Enable.
    A message asks if the hotspot file should be created. Click, Yes.
    HSmessage.png
  3. Click the Add new Hotspot button, Add area hotspot.png. This will activate the Tools and fields as well as assign the hotspot an ID.

  4. Zoom in to the image to get better detail for drawing your hotspot. Use the Zoom option to choose how far to zoom in.

  5. Draw the hotspot.
    Choose a shape from the tool section and drag over the area in the image that is to be interactive.
    The area hotspot that you created will be red.
    Area hs v4.png

  6. Enter the hotspot's title in the Title field.
    The title will be seen when the mouse hovers over the hotspot.

  7. Link to another panorama in the tour by choosing it from the URL field.
    Choose url.png

  8. Enter the Target information by opening the Target Viewing Parameters: Target button.png. The linked image will pop up. Rotate it to set its opening view. Click, OK, when finished. (optional)

  9. Go to the next image in the tour by doing one of the following
    • Click the Follow hotspot link button, Follow hotspot link.png.
    • Keep the Hotspot window open and select the next image in the Tour Browser.


Outputting the Tour[edit]

Once all the images are linked, you're ready to output your project. But before you output you may want to:

Choose to output to either Flash or HTML5.

◊ TIP: When outputting a tour, take advantage of the new feature in the HTML template which lets you directly access each node via the URL.


Replacing Nodes[edit]

Sometimes you might find you need to swap out images in a tour but you don't want to loose all the information connected to the images.

To replace images:

  1. Select the node in the Tour Browser.
  2. Click, Select Input in the Input section and navigate to the replacement image.


See Also[edit]

Quick Tip: Building a tour
Example tour
Tour Browser (Pano2VR)
Hotspot Editor (Pano2VR)
Editing the Master Node
Direct Node Access and Show Internal Node ID
Setting North and Setting the Radar Beam