Menu

Hotspot_maps

Anonymous Christian Walther Andrea Viarengo Seryous

How to make hotspot maps

Introduction

The hotspot maps must be 256 color indexed, each color match with an hotspot. if your hotspotmap doesn't work or don't work properly means that the map has not the right format so what you need is a good drawing program and the file "hotspotpalette.gif" that you find in the "extras" folder in the source package.
This guide is made using The Gimp http://www.gimp.org

  • Open the hotspotpalette.gif file and set the size as the your picture
  • Open with Gimp the picture you want to map and copy it
  • Go to the hotspotpalette.gif window and paste in a new layer. To toggle the visibility of each layer click on the eye near the layer icon
  • For each hotspot select the palette layer, press 'O' key and pick a color show and select the other layer and draw the spot
  • Now remove the visibility or remove the palette layer
  • Resize ave image as you want and save the file

Hotspots on panoramic node

Create the "equirect image" of your node adding pipmak.saveequirect to your node.lua:

cubic {"front.jpg","left.jpg","back.jpg","right.jpg","top.jpg","bottom.jpg"}

onenternode(
  function() 
    pipmak.saveequirect() 
  end)

When you enter in the node, the onenternode section execute statement pipmak.saveequirect() which reprojects the current (panoramic) node to an equirectangular image and saves it as equirect.bmp inside the node folder.

After that, open "equirect.bmp" with a graphic program which support layers and create a second, empty layer over the image,

Paint the area which you want to use as an hotspot, different hotspots have different colors taken from palette, Color index 0 means background, color index 1 is the first hotspot, index 2 the second etc, Using the palette of "hotspot-palette.gif" is a good idea, or you can use palettes taken from the hotspot maps in the demo.

Now, save the second layer created as an image PNG (24 bits) and use it as hotspot map.

Using handle instead of hotspots

Another way (only programmatic, i.e.: you don't need any extra program) is to use "handle" instead "hotspots".

With "handles" you can specify rectangular regions (using elevation and azimuth) in your panoramic node:

handle { 
  az = 90,
  el = 45,
  w  = 90, 
  h  = 90,
  onmouseup = function(self)
    pipmak.dissolve(2)
    pipmak.gotonode(next_node)
  end,
  cursor = pipmak.hand_forward
  }

Where az,el,w,h are expressed in degrees and next_node is you target node.

You can create every handles you need, the limitation respect hotspots is which handles can be only rectangular, instead hotspot can have every shape you want, and you have to use polar coordinates.


Related

Wiki: Main_Page