Understanding Positions

Understanding Positions in Flashificator and Flash Panorama Player

1 - Introduction to Hotspots - Spot and Box

The Hotspots plugin has five types of objects: global, pano, spot, box and external. These objects can load external images (jpg, png and gif). They can also load external Flash movies, external Flash applications and even streaming audio and video content. These objects allow for a high degree of customization as to how you present your panorama while offering to your website visitor ways to interact with that presentation. The two types that are used most frequently are the spot object and the box object. In Flashificator's Hotspots tab, these two types are quickly distinguished by their icons; a little dot or a little box, along the bottom of the display for each hotspot's named settings tab. Clicking on the icon will allow you to quickly change from one to the other.

The spot object is attached to your panorama at a single point known as an alignment point and will not distort while you turn your panorama for viewing. Alternatively, the spot object can be fixed to the window so that it's static and doesn't move at all while your panorama turns, making this type the hotspot of choice for navigational controls, border trimmings, thumbnails and other means afforded to your website visitor and their interaction.

The box object, with many of the same parameters as the spot object including the ability to be made static, also allows you to load external images and movies while it is attached to the warped surface of the panorama at a single point, but the box object can be distorted into the virtual 3D space (sphere, cylinder or any face of the cube). The external images can be rotated, scaled and otherwise transformed to make them appear to fit in the perspective of the scene of your revolving panorama. Additional parameters even allow for adjusting transparency (alpha), hue, tint, saturation, contrast, brightness, blur and sharpness.

Both objects allow various blending modes (like in Photoshop and GIMP) through many available parameter settings. And both objects allow for precise placement using two separate schemes.

If you are interested in digging deeper into Hotspots history, in 2006, Denis V. Chumakov put together a tutorial, gives further examples here and appears to be the first emergence of this invention.

2 - Understanding X and Y - static hotspots

Before we can talk about where a stationary or static hotspot will be placed, we need to understand some terms for that discussion. Coordinate pairs are used to express locations. A single pair of coordinates define a single location. In the context of 2D computer graphics, we are dealing with only the x axis and the y axis. (Note; bit depth should not be confused with z axis when dealing with 3D space - see discussion below).

The illustration above shows how these coordinates are measured and the convention as to how they are expressed, noting that the subscript x and y have been added for clarity and aren't normally written. In other instances, the x and y can be separated by a comma instead of a colon. Units are in pixels.

These measurements only relate to static hotspots.

3 - Understanding Pan and Tilt - hotspots on a surface

In the context of Flashificator (FFC) and Flash Panorama Player (FPP), 3D space is also defined by coordinate pairs, only in this instance, we're measuring angles.

The illustration above shows that we are dealing in 3D space with our spherical images and their projection onto the faces of a cube. It also shows how these coordinates are measured and the convention as to how they are expressed.

Pan values are angular measurements along the horizontal plane with zero fixed at the center of the front cube face and the vertex of the angle fixed at the center of the panorama. Values are positive to the right and negative to the left; both to the center of the back cube face.

Tilt values are angular measurements along the vertical plane with zero fixed at any point along the equator and the vertex of the angle fixed at the center of the panorama. Values are positive toward zenith and negative toward nadir.

Units are in degrees and decimal degrees (ddd.ddd).

Pan and tilt values are used regardless of the 3D surface being targeted; e.g., sphere, cylinder or cube face.

4 - Understanding Zero

Without knowing where zero is - for any measurement - such quantities have little meaning. If we're going to be measuring the positions of things, we need to understand from where to start our measurement:

• Where is the origin; 0:0 ? (static parameter)
• Where exactly on the hotspot does zero relate?

The above illustration shows two grids - both represent nine possible locations on the hotspot and panorama window. Their style; one with dots, the other with squares really makes no difference. What does make a difference, and significantly, is whether their use is in regard to the align parameter or the salign parameter. Both parameters use disparate numeric values when defining the relative position; one for the hotspot, the other the panorama window.

For example, both schemes define the center as Center, Middle (CM). Likewise, they'd both define the lower left corner as Left, Bottom (LB), but the numeric value for each would be -0.5:-0.5 (align) and 0:0 (salign) in the first case and in the second instance, would be 0:-1 (align) and -0.5:0.5 (salign).

The align x and y parameters relate to the hotspot. They define the alignment point on the hotspot; for example, the center of the hot spot (-0.5:-0.5)

The slaign x and y parameters relate to the panorama window and the static parameter. The panorama window is the bounding limits in which your panorama is displayed; typically one of the following: 1) the full extent of the computer monitor when displayed full screen, 2) the full extent of the browser window to whatever size and configuration that it has been resized or 3) when your panorama is displayed within a frame on the html page.

One note of caution if you're using Flashificator v2.0694 or earlier: The graphical representations for the Alignment points are in error. As shown in the illustration below, the little white dot is in the exact opposite location as defined in each instance where x and y are not equal.

Post Note Update As of FFC release v2.075 the box alignment issue has been fixed - more on the discussion here.

The green dots in the two examples above show the possible alignment points for two hotspots with the example on the left being amongst a field of adjacent images that will be abutting to form the navigational controls (static). The example hotspot on the right will be used as a distorted image on a cube face. In both instances, we'll use the center of the hotspot as the hotspot alignment point.

5 - Bit Depth

One last point in regard to hotspot positioning has to do with the bit depth of the hotspot. Bit depth is more to do with drawing order than with elevation (z axis).

Each hotspot is rendered according to its bit depth order, and while there is no real spatial stacking, it's still analogous to drawing layers - the stuff that's on "top" is seen and the stuff that's "lower" isn't - that's assuming that the opacity is 100%.

In the example above, the three static spot objects; letters F, P and P, each have a bit depth of 1220, 1221 and 1222 respectively while the static box object; dinfoscreen, has a bit depth of 1016.

In this example, in order to have the info screen show completely, a bit depth greater than 1222 is required.