Quellcode

	<action name="sync_to_other_viewer" type="Javascript"><![CDATA[

		viewers = krpano.get("syncviewer").split(",");
		
		viewers.forEach(function(viewer) {

			var otherviewer = document.getElementById( viewer );
			if (otherviewer && otherviewer.get)
			{
			
				var lastuserinteraction = args[1] | 0;
				
				if (lastuserinteraction)
					krpano.sync_lastuserinteraction = lastuserinteraction;
				else
					lastuserinteraction = krpano.sync_lastuserinteraction | 0;
				
				var otherkrpano = otherviewer.get("global");
				

				
				otherkrpano_lastuserinteraction = otherkrpano.sync_lastuserinteraction | 0;
				
				if (lastuserinteraction > otherkrpano_lastuserinteraction)
				{
					// An internal API call to remove the focus from the other viewer.
					// That will stop any movement frictions, release pressed keyboard-keys and close an open contextmenu.
					otherkrpano.control.panoControl.focusLoss();
					
					krpano.call("trace(" + krpano.get("syncviewer").split(",") + ")");
				
					var view1 = otherkrpano.view;
					var view2 = krpano.view;
					
					view1.hlookat = view2.hlookat;
					view1.vlookat = view2.vlookat;
					view1.camroll = view2.camroll;
					view1.fovtype = view2.fovtype;
					view1.fov = view2.fov;
					view1.fisheye = view2.fisheye;
					view1.architectural = view2.architectural;
					view1.pannini = view2.pannini;
					view1.tx = view2.tx;
					view1.ty = view2.ty;
					view1.tz = view2.tz;
					view1.ox = view2.ox;
					view1.oy = view2.oy;
					view1.oz = view2.oz;
					view1.rx = view2.rx;
					view1.ry = view2.ry;
				}
			}
		});

		
	]]></action>

Quellcode

	<div id="viewersDiv" style="position:absolute; left:0; top:0; width:100%; height:100%;">
		<div id="div1"  style="position:absolute; left:0%;  top:0; width:25%; height:100%;"></div>
		<div id="div2" style="position:absolute; left:25%; top:0; width:25%; height:100%;"></div>
		<div id="div3" style="position:absolute; left:50%; top:0; width:25%; height:100%;"></div>
		<div id="div4" style="position:absolute; left:75%; top:0; width:25%; height:100%;"></div>
	</div>
	
	<script>
		embedpano({html5:"only", consolelog:true, basepath:"../../../", id:"pano1viewer",  target:"div1",  xml:"pano1.xml", vars:{syncside:"pano1",syncviewer:"pano2viewer,pano3viewer,pano4viewer"}, passQueryParameters:true});
		embedpano({html5:"only", consolelog:true,basepath:"../../../", id:"pano2viewer", target:"div2", xml:"pano2.xml", vars:{syncside:"pano2",syncviewer:"pano1viewer,pano3viewer,pano4viewer"}, passQueryParameters:true});
		embedpano({html5:"only", consolelog:true,basepath:"../../../", id:"pano3viewer", target:"div3", xml:"pano3.xml", vars:{syncside:"pano3",syncviewer:"pano1viewer,pano2viewer,pano4viewer"}, passQueryParameters:true});
		embedpano({html5:"only", consolelog:true,basepath:"../../../", id:"pano4viewer", target:"div4", xml:"pano4.xml", vars:{syncside:"pano4",syncviewer:"pano1viewer,pano2viewer,pano3viewer"}, passQueryParameters:true});
	</script>