krpano hotspot

http://krpano.com/docu/xml/#hotspot

觉得官网文档找起来不方便，那么读过一次就放到这里来好了

overall

Hotspots are areas in the panorama, which react on mouse hovering or clicking. They can be used to load other panoramas, links to other urls, change the viewing ...

There are currently 2 types of Hotspots:

1. Polygonal Hotspots

2. Image Hotspots

The type of the hotspots is defined by their attributes:

• if the "url" attribute is set it is a image hotspot

• if not and there are points defined it is a polygonal hotspot

<hotspot name="..."
         type="image"
         url="..."
         keep="false"
         visible="true"
         enabled="true"
         handcursor="true"
         maskchildren="false"
         zorder=""
         style=""
         ath="0.0" atv="0.0"
         edge="center"
         zoom="false"
         distorted="false" rx="0.0" ry="0.0" rz="0.0"
         width="" height=""
         scale="1.0"
         rotate="0.0"
         alpha="1.0"
         onover=""
         onhover=""
         onout=""
         ondown=""
         onup=""
         onclick=""
         onloaded=""
         />

attributes

name

The name of the current hotspot element.
Full variable name is: hotspot[name].name

type

Type of the hotspot element.
Full variable name is: hotspot[name].type.
'image' is the default and the only valid value.

url

The path/url to the hotspot image file.
Full variable name is: hotspot[name].url
Supported file types: JPG, PNG, GIF and SWF (Flash-only).
Note - when "url" will be set, then the hotspot will be an image hotspot and not a polygonal hotspot!

keep

Should this hotspot element be kept or removed when loading a new pano.
Full variable name is: hotspot[name].keep. Default value is false.
See also the loadpano() action.

visible

Visibility of the hotspot element.
Full variable name is: hotspot[name].visible. Default value is true.

enabled

Enables the hotspot element to receive mouse events. When set to "false" then the mouse events will be routed to the underlying elements.
Full variable name is: hotspot[name].enabled. Default value is true.

handcursor

Show a hand cursor when mouse is over the hotspot element.
Full variable name is: hotspot[name].handcursor. Default value is true.

maskchildren

When set to true then all child elements that are outside of the parent element will be clipped / masked out.
Full variable name is: hotspot[name].maskchildren. Default value is false.

zorder

Deep / "Z" ordering of the hotspot elements.
Full variable name is: hotspot[name].zorder.
This value can be any string or number. All hotspot elements with a zorder setting will be sorted by the given value. When nothing is set - then the order is undefined and depends on the loading/finishing order of the browser.

Note - this is an important setting for overlapping elements!
HTML5 Note - the zorder should be a value between 0 and 100, no negative values!

style

Load the attributes from one or more <style> elements.
Full variable name is: hotspot[name].style.
This can be used to reduce the xml code - the attributes that are the same for more layer / plugin or hotspot elements can be stored together at one place in a <style> element. To specify more than one style, separate the style names by pipe | characters.

Note - the attributes that were defined in a style can NOT be overwritten in the layer / plugin / hotspots definition!

Example:

<style name="style1" alpha="0.5" scale="0.5" ... />

<plugin  name="p1" ... style="style1" />
<plugin  name="p2" ... style="style1" />
<hotspot name="h1" ... style="style1" />

A style can be also loaded dynamically by the loadstyle(name) action.

edge

Edge / anchor-point of the hotspot element.
Full variable name is: hotspot[name].edge.
Possible values: lefttop, left, leftbottom, top, center, bottom, righttop, right, rightbottom

ath, atv

The spherical coordinates of the hotspot in degrees. There the hotspot image will be aligned by the in the edge setting defined point.
Full variable name is: hotspot[name].ath|atv. Default value is 0.

ygjack: ath is short for at horizontal, atv is short for at vertical.

zoom

Should the size of the hotspot image change together with the pano when zooming.
Full variable name is: hotspot[name].zoom. Default value is false.

distorted

Should the hotspot image be distorted in the 3D space together with the current pano/viewing distortion. When distorted use rx / ry / rz settings to rotate the hotspot in 3D space.
Full variable name is: hotspot[name].distorted. Default value is false.

Note 1 - When enabled, a size of 1000 pixels will be used as reference for pixel sizes. And this 1000 pixels are covering a field of view of 90 degrees in 3D space.

Note 2 - Distorted hotspots can't and shouldn't have children elements. They will be probably not displayed correctly.

Note 3 - Displaying Flash plugins as distorted hotspots should be possible but not the direct interaction with them. In this case the plugin will not display directly, only a kind of 'screenshot'-image of it.

Note 4 - In HTML5 the sorting of normal and distorted hotspots via zorder is not possible, the zorder2 setting can be used additionally for normal hotspots to move them above the distorted hotspots.

rx, ry, rz

3D Rotation in degrees over the X / Y / Z axes. (axis order: Y-X-Z).
Full variable name is: hotspot[name].rx|ry|rz. Default value is 0.

Note - can only be used when distorted="true"!

width, height

Destination size of the hotspot element - the image will be scaled to that size.
Full variable name is: hotspot[name].width|height.

This can be a absolute pixel value or a relative (to the screenwidth or screenheight) percent value. When not set - the size of the loaded image will be used.

Additionally it's possible to use the special value "prop" to scale an image via width or height by keeping it proportions (e.g. set width or height to a value and the other setting to "prop" - width="500" height="prop").

ygjack: prop即保持比例，设定其中一个维度，另一个维度根据比例自动设定

Note - when using distorted hotspots, then the size is relative to an internal base-size where 1000 pixel are covering a 90 degree field of view.

scale

Scaling of the hotspot element.
Full variable name is: hotspot[name].scale. Default value is 1.

rotate

Rotation of the hotspot element in degrees.
Full variable name is: hotspot[name].rotate. default value is 0.

alpha

Alpha value / transparency of the hotspot element.
0.0 = fully transparent, 1.0 = fully visible
Full variable name is: hotspot[name].alpha. Default value is 1.

fillcolor, fillalpha

The fill-color and alpha (transparency) of a polygonal hotspot area.
Full variable name is: hotspot[name].fillcolor|fillalpha. Default values are 0xAAAAAA, 0.5.

borderwidth, bordercolor, borderalpha

The width, the color and the alpha (transparency) of a polygonal hotspot border line.
Full variable name is: hotspot[name].borderwidth|bordercolor|borderalpha. Default values are 3.0, 0xAAAAAA, 1.0.

point[..].ath, point[..].atv

The spherical coordinates of the polygonal hotspot points in degrees.
Full variable name is: hotspot[name].point[..].ath|point[..].atv.

Example:

set(hotspot[polyspot].point[0].ath,-10);
set(hotspot[polyspot].point[0].atv,-10);
set(hotspot[polyspot].point[1].ath,-10);
set(hotspot[polyspot].point[1].atv,+10);
set(hotspot[polyspot].point[2].ath,+10);
set(hotspot[polyspot].point[2].atv,+10);
set(hotspot[polyspot].point[3].ath,+10);
set(hotspot[polyspot].point[3].atv,-10);

onover

Actions / functions that will be called when the mouse moves over the hotspot element.
Full variable name is: hotspot[name].onover.
Value should be defined action.

Example:

set(hotspot[polyspot].onclick, removehotspot(polyspot) );

onhover

Actions / functions that will be called in intervals (15 times per second) when the mouse stays over / hovers the hotspot element.
Full variable name is: hotspot[name].onhover.

onout

Actions / functions that will be called when the mouse moves out of the hotspot element.
Full variable name is: hotspot[name].onout.

ondown

Actions / functions that will be called when the mouse button will be pressed down on the hotspot element.
Full variable name is: hotspot[name].ondown.

onup

Actions / functions that will be called when the previously pressed mouse button will be released.
Full variable name is: hotspot[name].onup.

onclick

Actions / functions that will be called when there is a mouse click on the hotspot element.
Full variable name is: hotspot[name].onclick.

onloaded

Actions / functions that will be called when the loading of the hotspot image is done.
Full variable name is: hotspot[name].onloaded.