Beiträge von andremc85

andremc85

Please? Any advice, im not usign rx ry and rz positioning.

Its a polygonal hotspot.

andremc85

Yeah, they work very different!

I'm already using onclick="showpic();" to show the image.
Tried to integrate both functions but without success.

Also the images are displayed much bigger than the stagewidth and stageheight.

Any advice will be great, I'm totally lost right now. Is this a demo limitation or lack of programming skills?

andremc85

Thanks for the help

Actually i'm using not image hotspot
But hotspot to image

I'm not sure how the best way to integrate the code you gave me..
""

Code

<hotspot name="spotpolygon75"
           visible="true"
           style="PolygonDefaultPolygonSpotStyle"
           descriptionid="spotpolygon75_description"
            onclick="showpic();"
           tooltip="spotpolygon75_tooltip"
           ath="-74.405156" atv="-7.717118"
		   pic="Imagem03"
           >
    <point ath="-83.268812" atv="-16.628462" />
    <point ath="-83.002383" atv="1.194226" />
    <point ath="-65.541501" atv="0.892388" />
    <point ath="-65.732176" atv="-15.957575" />
  </hotspot>
  <hotspot name="spotpolygon75" devices="flash" zorder="1"/>
  <hotspot name="spotpolygon75" devices="html5+desktop" zorder="3" zorder2="1"/>
  <hotspot name="spotpolygon75" devices="tablet|mobile" zorder2="1"/>
	  <!-- **** 2 **** -->
  <hotspot name="spotpolygon115"
           visible="true"
           style="PolygonDefaultPolygonSpotStyle"
           descriptionid="spotpolygon115_description"
            onclick="showpic();"
           tooltip="spotpolygon115_tooltip"
           ath="-72.109764" atv="-23.935150"
		   pic="imagem01"
           >
    <point ath="-78.173037" atv="-28.840006" />
    <point ath="-78.364221" atv="-28.593393" />
    <point ath="-78.473469" atv="-19.797534" />
    <point ath="-66.374235" atv="-19.030294" />
    <point ath="-66.128427" atv="-19.249505" />
    <point ath="-65.746058" atv="-27.689146" />
  </hotspot>
  <hotspot name="spotpolygon115" devices="flash" zorder="1"/>
  <hotspot name="spotpolygon115" devices="html5+desktop" zorder="3" zorder2="1"/>
  <hotspot name="spotpolygon115" devices="tablet|mobile" zorder2="1"/>


  <!-- **** 3 **** -->
  <hotspot name="spotpolygon116"
           visible="true"
           style="PolygonDefaultPolygonSpotStyle"
           descriptionid="spotpolygon116_description"
            onclick="showpic();"
           tooltip="spotpolygon116_tooltip"
           ath="-82.827676" atv="12.172363"
		   pic="Imagem02"
           >
    <point ath="-64.476429" atv="4.359404" />
    <point ath="-101.178923" atv="5.001048" />
    <point ath="-100.915957" atv="19.985322" />
    <point ath="-64.476429" atv="18.853009" />
  </hotspot>
  <hotspot name="spotpolygon116" devices="flash" zorder="1"/>
  <hotspot name="spotpolygon116" devices="html5+desktop" zorder="3" zorder2="1"/>
  <hotspot name="spotpolygon116" devices="tablet|mobile" zorder2="1"/>
  
  <!-- 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%/spots/',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>

Alles anzeigen

Code

<!-- use a <style> to share the same attriubtes for all hotspots -->
	<style name="flyoutimage"
	       distorted="true"
	       backup_rx="0"
	       backup_ry="0"
	       backup_rz="0"
	       backup_scale="0"
	       backup_zorder="0"
	       flying="0.0"
	       flystate="0"
	       onclick="if(flystate == 0, flyout_by_name(get(name)), flyback_by_name(get(name)) );"
	       />


	<hotspot name="spot1" style="flyoutimage"
	         url="image1.jpg"
	         zorder="1"
	         ath="45"
	         atv="54"
	         scale="0.5"
	         rx="-22.5" ry="-26.25" rz="-50.1"
	         />


	<hotspot name="spot2" style="flyoutimage"
	         url="image2.jpg"
	         zorder="2"
	         ath="60"
	         atv="54"
	         scale="0.5"
	         rx="-22.5" ry="-26.25" rz="-50.1"
	         />


	<hotspot name="spot3" style="flyoutimage"
	         url="image3.jpg"
	         zorder="3"
	         ath="75"
	         atv="58"
	         scale="0.5"
	         rx="-22.5" ry="-26.25" rz="-50.1"
	         />




	<!--
		flyout/flyback actions
		(for more stylish in/out animations play with different tweentypes and times)
	-->


	<action name="flyout_by_name">
		<!-- make all other hotspots flying back -->
		flyback_others();


		<!--
			for best control set 4 fly states:
			0 = normal
			1 = while flying out
			2 = out
			3 = while flying back
		-->


		<!-- save original position/rotation -->
		if(hotspot[%1].flystate == 0,
		    copy(hotspot[%1].backup_rx,     hotspot[%1].rx);
		    copy(hotspot[%1].backup_ry,     hotspot[%1].ry);
		    copy(hotspot[%1].backup_rz,     hotspot[%1].rz);
		    copy(hotspot[%1].backup_scale,  hotspot[%1].scale);
		    copy(hotspot[%1].backup_zorder, hotspot[%1].zorder);
		  );


		<!-- set new state -->
		set(hotspot[%1].flystate,1);
		set(hotspot[%1].zorder,99);


		<!-- tween the rotations values to 0 for a flat screen view -->
		tween(hotspot[%1].rx, 0);
		tween(hotspot[%1].ry, 0);
		tween(hotspot[%1].rz, 0);
		tween(hotspot[%1].scale, 1.5);


		<!--
			tween 'flying' to 1.0,
			this makes the hotspot independent from the panorama rotation and scaling
		-->
		tween(hotspot[%1].flying, 1.0, 0.5, default, set(hotspot[%1].flystate,2); );
	</action>




	<action name="flyback_by_name">
		if(hotspot[%1].flystate != 3,
			set(hotspot[%1].flystate,3);


			<!-- tween back to the stored backup values -->
			tween(hotspot[%1].rx,    get(hotspot[%1].backup_rx)    );
			tween(hotspot[%1].ry,    get(hotspot[%1].backup_ry)    );
			tween(hotspot[%1].rz,    get(hotspot[%1].backup_rz)    );
			tween(hotspot[%1].scale, get(hotspot[%1].backup_scale) );


			copy(hotspot[%1].zorder, hotspot[%1].backup_zorder);


			<!-- tween 'flying' also back to 0.0 -->
			tween(hotspot[%1].flying, 0.0, 0.5, default, set(hotspot[%1].flystate,0); );
		  );
	</action>




	<action name="flyback_others">
		for(set(i,0), i LT hotspot.count, inc(i),
			if(hotspot[%i].flystate GT 0, flyback_by_name(get(hotspot[get(i)].name)); );
		  );
	</action>

Alles anzeigen

andremc85

Hi folks,

I'm trying to create a hotspot that open an image like the example: https://krpano.com/tours/weingut/

But i can open multiple images and then they are overrided as the image above

Is there any way to simply close when another is clicked?
Didn find any topic in forum.

Thanks!

Beiträge von andremc85

Image hotspot override - Close on click

Image hotspot override - Close on click

Image hotspot override - Close on click

Image hotspot override - Close on click