clickable hotspot area - HELP

  • Hope someone can help as I am slowing losing the will to live after a few hours trying to set this up. I want to click on a picture in my pano and have it pop up a larger jpg. I have used the following code as below.

    The issue I am having is trying to position the clickable area - its driving me to drink!

    The bit highlighed does nothing if I change it and I cannoty fathom out the section <point.....ath="xx" atv=" xx"/>

    My assumption was that the ath="146.5" atv="-10"> would position the clickable area and the other bit would be the actual area but I am not sure why it would have 8 dimensions.

    Can anyone shed a bit of light before I join AA. cheers in advance.


    <!-- place your scene hotspots here -->


    <style name="pichotspot" capture="true" zorder="1" onclick="showpic();" alturl="zoomicon.png" zoom="true" scale="0.5"/>

    <hotspot name="hs2" style="pichotspot" pic="pic3" ath="146.5" atv="-10">

    <point ath=" -20.5409" atv=" -20.8241"/>
    <point ath=" -45.6940" atv=" 3.7081"/>
    <point ath=" -36.0841" atv=" 3.0648"/>
    <point ath=" -35.9859" atv=" -4.4321"/>
    </hotspot>


    <!-- actions -->

    <!-- calc the max. flyout size of a hotspot for the current screen size -->

    <action name="calc_flyout_size">
    div(screen_sideaspect, stagewidth, stageheight);
    div(hotspot_sideaspect, hotspot[%1].width, hotspot[%1].height);

    if(screen_sideaspect LT hotspot_sideaspect,
    <!-- align at screen width -->
    div(hotspot[%1].width,stagewidth,stageheight);
    mul(hotspot[%1].width,80);
    txtadd(hotspot[%1].width,'%');
    set(hotspot[%1].height,prop);
    ,
    <!-- align at screen height -->
    set(hotspot[%1].width,prop);
    set(hotspot[%1].height,80%);
    );
    </action><!-- fly in a hotspot = show hotspot fixed at screen --><action name="flyin">
    if(hotspot[%1].flying == 0.0, hotspot[%1].resetsize(); calc_flyout_size(%1); );
    if(hotspot[%1].oldscale === null, copy(hotspot[%1].oldscale, hotspot[%1].scale) );
    if(hotspot[%1].oldrx === null, copy(hotspot[%1].oldrx, hotspot[%1].rx) );
    if(hotspot[%1].oldry === null, copy(hotspot[%1].oldry, hotspot[%1].ry) );
    if(hotspot[%1].oldrz === null, copy(hotspot[%1].oldrz, hotspot[%1].rz) );
    set(hotspot[%1].enabled,true);
    set(hotspot[%1].visible,true);
    tween(hotspot[%1].alpha, 1.0);
    tween(hotspot[%1].flying, 1.0);
    tween(hotspot[%1].scale, 1.0);
    tween(hotspot[%1].rx, 0.0);
    tween(hotspot[%1].ry, 0.0);
    tween(hotspot[%1].rz, 0.0);
    </action><!-- fly the hotspot out/back --><action name="flyout">
    set(hotspot[%1].enabled,false);
    tween(hotspot[%1].alpha, 0.0, 0.5, default, set(hotspot[%1].visible,false); );
    tween(hotspot[%1].flying, 0.0);
    tween(hotspot[%1].scale, get(hotspot[%1].oldscale));
    tween(hotspot[%1].rx, get(hotspot[%1].oldrx));
    tween(hotspot[%1].ry, get(hotspot[%1].oldry));
    tween(hotspot[%1].rz, get(hotspot[%1].oldrz));
    </action><action name="showpic">

    <!-- creates a new hotspot and fly it out -->
    if(hotspot[get(pic)] === null,
    txtadd(picfilename,'%CURRENTXML%',get(pic),'.jpg');
    addhotspot(get(pic));
    getcenter(hsath,hsatv);
    copy(hotspot[get(pic)].ath, hsath);
    copy(hotspot[get(pic)].atv, hsatv);
    set(hotspot[get(pic)].visible,false);
    set(hotspot[get(pic)].distorted,true);
    set(hotspot[get(pic)].zorder,2);
    set(hotspot[get(pic)].scale,0.1);
    set(hotspot[get(pic)].alpha,0.0);
    set(hotspot[get(pic)].onloaded, flyin(get(name)) );
    set(hotspot[get(pic)].onclick, flyout(get(name)) );
    copy(hotspot[get(pic)].url,picfilename);
    ,
    flyin(get(pic));
    );
    </action>

  • Hi spelican, I have now worked it out just about I was getting confused with the zoomimage positining which I could not see until viewed live on something with html5.

    I now undertsand the other dimentions but it tooks ages moving them, testing correct postion, moving again etc etc. I am sure there must be a quicker way of positing a polygonal area?

Participate now!

Don’t have an account yet? Register yourself now and be a part of our community!