Skip to main content

Using Node Markers (Pano2VR)

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

Pano2VR - Help

Node markers are found in the skin editor and are used to do a number of useful things. In Pano2VR Pro, you can change a node marker to a marker template for easy node placement on a map and in both Pano2VR versions, you can use the node marker in conjunction with tags to activate or deactivate actions and media.

Node Markers Basic Tutorial
Video loading...

Watch this video on YouTube

Node Markers Advanced Tutorial
Video loading...

Watch this video on YouTube

Download Project Files

Adding node markers[edit]

Use node markers to show panorama location on a map:

  1. Create a tour.
  2. Open the Skin Editor.
  3. Add a map to the skin. This is where the node markers will be placed.
    In our example, we simply used a screenshot of a map, which is probably the easiest way to make a map for a tour.
    ◊ TIP: Avoid copyright violations by using an open source map (see Settings/Preferences, for a list of map providers).
  4. Add a markertemplate by simply adding a node marker to the skin and give it an ID of markertemplate. If you are already using the simplex skin, or your skin already includes a markertemplate, then you can skip this step.
  5. From the Tour Browser (undocking it may make this step easier), drag the panorama to its location on the map within the skin editor. A node marker will be added.
    The marker image and text comes from the markertemplate.
    The markertemplate in the Skin Editor tree.
  6. Continue adding the rest of the panoramas to map, in the same way.
  7. Save the skin.
  8. Output the project.

Have multiple locations and maps? Move on to, Using multiple node images.

Universally change all marker images[edit]

The template's images can be changed at anytime. If the node markers from the marker template have already been added, this will universally change all marker images.

  1. In the Skin Editor, open either one of the template marker images (marker_active or marker_normal).
  2. Select Choose, next to the image, and navigate to the new image file. Choose, Open.

Now, all the node marker images will have changed.

Using multiple node images[edit]

It is sometimes necessary to use different marker images for a different set of panoramas. For this example, we will use different images for different locations/maps.

These steps are a continuation of Adding Node Markers.

  1. Add a another map/image to the skin.
  2. Drag images in to the editor window of the skin editor to use for the marker; one for the active state and one for the normal state.
    ◊ TIP: SVGs are recommended.
  3. Give the images meaningful IDs in the Editor (or via their preferences).
  4. Make the images children of the container called, hide_template, by dragging them onto the container.
  5. Open the marker_template properties (double-click) and clone the new indicators from the drop down lists:
    • for Clone as Normal
    • for Close as Active
  6. Now drag in the new panoramas/nodes for which this image will be used.

The new panoramas should now be using the new marker images.

Activating elements[edit]

The node markers can be used to activate elements within the skin based on triggers. This example will illustrate how to show and hide buttons based on tags.

  1. For each panorama that will trigger a change, add a tag from within the user data settings. Our example adds the tag, sound to every panorama that has sound added to it.
  2. In the Skin Editor, add an element that will be triggered by the tags added in the previous step. We added play and pause buttons to our controller.
  3. In the element's properties, deselect Visible, to keep it hidden until it is triggered. (Otherwise, it will show on start up.)
  4. Add a new node marker by clicking the node marker button in the toolbar.
    Toolbar marker.jpg
  5. Open the marker's properties, and in the Tour Node/Tag section, add the tag (type it in) that was added to the panorama. In our example, we added our sound tag.
    Nm sound tag.jpg
  6. In the Actions/Modifiers tab, add the following actions:
    • Source: Activate; Action: appropriate action; Target: the element that was added.
    • Source: Deactivate; Action: appropriate action; Target: the element that was added.
      Nm tags.png
  7. Save the skin and output the project.

See Also[edit]

Building a Tour (Pano2VR)
Skin Editor
Tour Browser (Pano2VR)
Multi Node and Multi Floor Plan Projects by Hopki
Use node markers to assign actions to Polygon Hotspots