You are not logged in.

mit javascript eine Panorama extern steuern (aus und einzoome)

Dear visitor, welcome to krpano.com Forum. If this is your first visit here, please read the Help. It explains in detail how this page works. To use all features of this page, you should consider registering. Please use the registration form, to register here or read more information about the registration process. If you are already registered, please login here.

Panorade

Trainee

  • "Panorade" started this thread

Posts: 56

  • Send private message

1

Friday, January 20th 2012, 7:35pm

mit javascript eine Panorama extern steuern (aus und einzoome)

Hallo ist es möglich mit javascript eine Panorama extern zu steuern ( ein und auszoomen usw,) externe Buttons
Wie das Beispiel mit dem laden von externen Panos
Ich habe es nicht geschafft
Wäre es möglich bitte mal ein Beispiel zu zeigen ,
was in die html und xml muß wäre toll
mfg Achim *smile*
www.panorade.de *smile*

Panorade

Trainee

  • "Panorade" started this thread

Posts: 56

  • Send private message

2

Sunday, January 22nd 2012, 11:10am

nochmal mit testcode

Ich habe noch ein bißchen gebastelet aber ganz nicht hinbekommen
Ich denke das das javascript nicht genau weiß welches Panorama er einzoomen soll
hier der test

http://www.panorade.de/upload/2011/09_re…oter2_neu.html#


schau dir bitte mal den code an



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head>
<title>www.panorade.de - regensburg_4</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="viewport" content="target-densitydpi=device-dpi, width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />

<style>
html { height:100%; }
body { height:100%; overflow: hidden; margin:0; padding:0; font-family:Arial, Helvetica, sans-serif; font-size:16px; color:#FFFFFF; background-color:#000000; }
a{ color:#AAAAAA; text-decoration:underline; }
a:hover{ color:#FFFFFF; text-decoration:underline; }
</style>

<link rel="stylesheet" href="css/footer_fixed_width.css" type="text/css" media="screen" /><!-- Footer Stylesheet -->

<script type="text/javascript" src="js/jquery.js"></script><!-- jQuery -->
<script type="text/javascript" src="js/hoverintent.js"></script><!-- HoverIntent -->
<script type="text/javascript" src="js/footer.js"></script><!-- Footer Script -->
<script type="text/javascript">
$(document).ready(function($){
$('#footer').stickyFooter({
speed : 'fast',
effect : 'hover_fade',
showhidefooter : 'show',
hide_speed : 1000,
hide_delay : 2000
});
});

</script>
</head>
<body>



<ul id="footer" class="footer_fixed"><!-- BEGIN FOOTER -->


<li id="footer_home"><a href="#"><img src="img/footer_home.png" alt="Home" /></a></li>
<li><a href="#" class="dropup">Panoramaauswahl</a>
<div class="footer_dropup drop8columns">
<div class="col_8">

<h4>Panoramen von Regensburg</h4>
<hr />

<hr />
<a href="#" onclick="loadpano('regensburg_61.xml');"><img alt="" class="img_left" src="img/asset01.jpg" height="80" width="150"/>Panorama anschauen</a>
<p>Regensburg liegt am nördlichsten Punkt der Donau und den Mündungen der linken Nebenflüsse Naab und Regen. Im Stadtgebiet liegen zwei Donauinseln, der Untere und der Obere Wöhrd.</p>

<hr />
<a href="#" onclick="loadpano('regensburg_31.xml');"><img alt="" class="img_left" src="img/asset02.jpg" height="80" width="150"/>Panorama anschauen</a>
<p>Regensburg liegt am nördlichsten Punkt der Donau und den Mündungen der linken Nebenflüsse Naab und Regen. Im Stadtgebiet liegen zwei Donauinseln, der Untere und der Obere Wöhrd.</p>

<hr />
<a href="#" onclick="loadpano('regensburg_41.xml');"><img alt="" class="img_left" src="img/asset03.jpg" height="80" width="150"/>Panorama anschauen</a>
<p>Regensburg liegt am nördlichsten Punkt der Donau und den Mündungen der linken Nebenflüsse Naab und Regen. Im Stadtgebiet liegen zwei Donauinseln, der Untere und der Obere Wöhrd.</p>

</div>


</div>


</li>

<li id="social">
<ul>

<!-- Hier das Menu zum ein und auszoomen u -->
<li><a href="#" ondown="set(fov_moveforce,-1);" onup="set(fov_moveforce,0);"><img src='img/icons/plus.png' alt="" class="footer_icon" /><span>Einzoomen</span></a></li>
<li><a href="#" ondown="set(fov_moveforce,+1);" onup="set(fov_moveforce,0);"><img src='img/icons/minus.png' alt="" class="footer_icon" /><span>Auszoomen</span></a></li>

</ul>


</li>


</ul>


<a id="footer_trigger" class="active" href="#"></a><!-- Trigger Button -->



<div id="krpanoDIV" style="width:100%; height:100%;">
<noscript><table style="width:100%;height:100%;"><tr style="valign:middle;"><td><div style="text-align:center;">ERROR:<br/><br/>Javascript not activated<br/><br/></div></td></tr></table></noscript>

</div>



<script src="swfkrpano.js"></script>

<script>
// <![CDATA[

embedpano({swf:"regensburg_4.swf", id:"krpanoSWFObject", xml:"regensburg_41.xml", target:"krpanoDIV", wmode:"transparent"});

function krpano()
{
return document.getElementById("krpanoSWFObject");
}

function loadpano(xmlname)
{
krpano().call("loadpano(" + xmlname + ", null, MERGE, BLEND(1));");
}

function lookat(fov)
{
krpano().set("movevectorz", fov);
}


// ]]>
</script>




</body>
</html>
www.panorade.de *smile*

iceman_fx

Professional

Posts: 597

Location: Sachsen

Occupation: Webdesigner- und entwickler sowie Fotodesigner

  • Send private message

3

Sunday, January 22nd 2012, 1:28pm

Hi Achim,

der Zoom kann so nicht funktionieren, da Du versuchst direkt aus Javascript eine krpano interne Prozedur aufzurufen: ondown="set(fov_moveforce,+1);" onup="set(fov_moveforce,0);"

Du musst das wie bei Deinem loadpano über eine eigene Javascriptfunktion mit aufrufen/bzw. an krp senden.
Weiterhin heisst es im HTML/JS nicht ondown/onup, sondern onmousedown="" und onmouseup="".
VG vom iceman

www.fotodesign360.de
_____________________________________________________________________________________________________________________
Sende eCards direkt aus Deinem Panorama oder teile es in sozialen Netzwerken.

Send eCards from your panorama and share it to social networks.
The eCard-Plugin for krpano >> http://ecardplugin.falkomueller.com

Panorade

Trainee

  • "Panorade" started this thread

Posts: 56

  • Send private message

4

Sunday, January 22nd 2012, 5:23pm

Hallo danke dachte ich mir aber so richtig komm ich nicht weiter (nach 1 Stunde)

hier der unter teil

function lookat(fov)
{
krpano().call("lookat", fov);
}

function lookto(toh, tov, fov)
{
krpano().call( "lookto(" + toh +"," + tov + "," + fov + ")" );
}


und der der aufruf mal mit oncklick und onmousedown
lookat
<li><a href="#" class="tooltip" onclick="lookat(0,0,90);"><img src='img/icons/plus.png' alt="" class="footer_icon" /><span>test</span></a></li>

und der lookto
<li><a href="#" class="tooltip" onmousedown="lookto(fov(+1));" onmouseup="lookto(fov(0));"><img src='img/icons/minus.png' alt="" class="footer_icon" /><span>kleiner</span></a></li>

mal getestet
es tut sich nichts

ich habe hier im forum unter
Navigationselemente außerhalb des Panofensters auf der Webseite platzieren?
auch schon mal gelesen
das ist aber leider auch nichts richtiges rausgekommen
kannst du mir bitte weiterhelfen
danke Achim
www.panorade.de *smile*

klaus.krpano

Administrator

Posts: 7,264

  • Send private message

5

Sunday, January 22nd 2012, 7:37pm

Hi,

der "lookat" Aufruf ist falsch:
mit "call" können krpano Actions gerufen werden,
wobei weiters mit "lookat" die hlookat/vlookat und fov direkt gesetzt werden könne,
zum Setzen von Werten muss die "set" Funktion verwendet werden,

hier der Link zur Dokumentation der JS-Schnittstelle:
http://krpano.com/docu/js/

richtig in dem Fall wäre z.B.
<!-- Hier das Menu zum ein und auszoomen u -->
<li><a href="#" onmousedown="krpano().set('fov_moveforce',-1);" onmouseup="krpano().set('fov_moveforce',0);"><img src='img/icons/plus.png' alt="" class="footer_icon" /><span>Einzoomen</span></a></li>
<li><a href="#" onmousedown="krpano().set('fov_moveforce',+1);" onmouseup="krpano().set('fov_moveforce',0);"><img src='img/icons/minus.png' alt="" class="footer_icon" /><span>Auszoomen</span></a></li>

wobei ich persönlich eher keine <a> Elemente für die Buttons verwenden würde...

Schöne Grüße,
Klaus

Panorade

Trainee

  • "Panorade" started this thread

Posts: 56

  • Send private message

6

Monday, January 23rd 2012, 7:06am

Danke Klaus hast meinen Tag gerettet
Genau so gehts
MFG Achim
www.panorade.de *smile*

Similar threads