Online Virtual Tours

One Click Is Enough To Create An Online Virtual Tour

The Online Virtual Tour Creator supports several image formats and lets you create Virtual Tours from the scratch in just two clicks:

  • A click from your camera to capture 360 degree around in a single exposure.


  • A click from your mouse to transform the picture into an Interactive Virtual Tour.


With your own camera and free.



 

Parabolic Mirrors


Contact Information
contacto

360 Facil

Barcelona, España

Buenos Aires, Argentina

Santiago, Chile

Contact Us

E-Mail : info@360facil.com


Retractable Parabolic Mirror


Forum

Find An Answer To Your Enquiry Entering The Forum


This is the place to ask for data you didn't find elsewhere and also a good spot to help others with your knowledge :


 

Newsletter
Subscribe To Our Newsletter

To be notified of major updates to our site and/or other related info please type in your email adress :




 

Recommended

A Minimal Investment To Update Your Online Real Estate Agency

Offer more and better services to your clients by showing your Real Estate Portfolio in 360 degree Virtual Tours. Nothing is more alike to actually being in the place and you can do it yourself with the same ease as you do it with traditional pictures.
Read more...



The Ideal Complement To Any Website

Every Webmaster can notoriously improve his/her services by adding to them interactive Virtual Tours that he/she can do with his/her own equipment and in as little as two clicks.
Read more...



The Freeware Programs That Will Do All The Job

Depending on the panorama type, the combination of this four free programs, three, two, one or even none of them is all the multimedi photographer needs to complete his/her work.
Read more...


Renovated Online Virtual Tour Creator : improved design, Facebook comments box for each Virtual Tour, internal engine optimized for greater speed, compatibility with more browsers and increased security.


Interactive Flash Panorama Publising



On this page we will explain in detail how to publish a Flash-based interactive panorama with full management of all variables. The Virtual Tour is created on a local computer without the need of an Internet connection to work and, once created, can be distributed on CDs, pen drives or similar means, or hosted on a server to be accessible through the web.


When we say that the publication is based on Flash, we mean that the program, code or instruction that makes the animation and interaction with the Virtual Tour possible does not contain itself all the necessary instructions but part of these instructions need to be pre-installed on the computer from which we want to access the animation.

The vast majority of existing computers in the world and have installed the Flash runtime environment or else it is easily installable without restarting the computer. Much of the existing interactive content on the Internet use Flash without you noticing.

Out of the many Flash based panorama viewers, for this implementation we chose our favorite, the Ryubin Pano Player, which is the program we used preferentially throughout our website, which is free for any use and highly configurable.



Basic Configuration For A Cylindrical Panorama


The minimum configuration to animate an interactive panorama with Ryubin Pano Player requires four elements linked together by references similar to which we have used in the last chapters. These elements are a panoramic photograph, the webpage, the animation instruction and an additional script. To have all the elements in view simultaneously, in this case we'll keep them all in the same folder which we'll call Flash :





Click here to download the four elements together and unzip the file to an empty folder as shown above. Alternatively you may choose to download each item separately and save each one with the file name specified in the link :



AC_RunActiveContent.js

RyubinPanoPlayer5.swf

panorama_cilindrico.jpg

pagina.htm



The RyubinPanoPlayer5.swf file is the instruction that allows all movement, the user interaction with the landscape and the apparent changes in the image such as alterations in perspective when the mouse is moved up or down.

The AC_RunActiveContent.js file is an instruction or additional script. Its function is to prevent the Internet Explorer browser from stopping execution of a command Active-X in a webpage displaying a warning window instead. The user is then forced to accept and refresh the page to continue. This is not only inconvenient because it causes a delay but many users might be wary of the content and decide not to run the panorama. This file allows the direct execution of the panorama in any browser and in any case it would be meaningless to avoid it because this would force to totally change the code of the web page.

The panorama_cilindrico.jpg image file, which looks like this :




The pagina.htm file is the webpage which contains in its code references to the three previous files. We will work as usual with this file open simultaneously by two programs: a browser and a text editor :





While the browser shows the page, the text editor shows its code :



<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Panorama De 360 Grados Interactivo Offline En Flash</title>
<script type="text/javascript">AC_FL_RunContent = 0;</script>
<script src="AC_RunActiveContent.js" type="text/javascript"></script>
</head>
<body bgcolor="#333333" >
<script type="text/javascript">
AC_FL_RunContent( 'codebase',
'http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=10,0,0,0', 'pluginspage', 'http://www.macromedia.com/go/getflashplayer',
'bgcolor', '#000000',
'width', '400',
'height', '400',
'id','RyubinPanorama',
'movie', 'RyubinPanoPlayer5',
'FlashVars','playmode=cylinder&
img_path=panorama_cilindrico.jpg&
fov=70&
elevation=45&
depression=45&
limit_vertical=yes&
top_limit=44&
bottom_limit=44
',
'allowFullScreen','true',
'allowScriptAccess','always');
</script>
</body>
</html>


As it can be seen, we have highlighted in red color the references included in the webpage to the external files. It is enough to have these four elements in one folder for the Virtual Tour included in the pagina.htm file to work. We have also noted in green the Flash variables used to load additional information for the creation of the interactive Virtual Tour. These go changing according to the type of image used as a base.



fov is the initial viewing angle of the projection and to make any vertical movement in the panorama possible it must be less than the sum of the two parameters explained below.

elevation defines the height in degree that will extend above the horizon the upper part of the photograph. Analogously depression indicates the height in degree that the lower half of the image will extend below the horizon. To manipulate these values in conjunction with those discussed in the next paragraph allows to adapt the projection to the characteristics of the panorama. For example if we have photographed a panorama with several shots with the camera tilted with a fixed inclination from the horizontal, the horizon line will be located below or above its natural position in the center of the panorama, causing on it deformations that can be corrected by applying different values of the elevation and depression of the image.

top_limit and bottom_limit are respectively the maximum limits in degree to which it can be seen by moving up or down with the mouse inside the Virtual Tour and only work in conjunction with Limit_vertical = yes . It is advisable that they contain values just below those used respectively for elevation and depression for the Virtual Tour to have vertical amplitude.

limit_vertical and limit_horizontal have two possible values : yes to set the Virtual Tour to indefinitely rotate in the specified direction and no to define a maximum rotation limit.



The values allocated to these variables are in average suitable for this type of cylindrical panoramas but it is advisable to do some experiments by changing values to see how these changes cause different effects on the Virtual Tour and find the most appropriate settings for our own example. The basic configuration for a Virtual Tour With A Cylindrical Panorama displays a window with the panorama that can be dragged crawl but does not rotate by itself. The image can zoom in or out by rotating the mouse wheel but no controls and no buttons have functions that can be activated by clicking the right mouse button mouse. All these features and others can be added and we will, but first we will see how to create virtual views from other types of image.




Configure Viewer For Other Types Of Panorama


Introducing some changes in the basic code we can edit it to create Virtual Tours from different types of panorama :


Spherical Panorama



Click on the image to download it and save it as panorama_esferico.jpg in the Flash folder. To create an interactive Virtual Tour with this image we'll open the pagina.htm file with a text editor to change the line of code which contains the references to the image file and the action mode :



<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Panorama De 360 Grados Interactivo Offline En Flash</title>
<script type="text/javascript">AC_FL_RunContent = 0;</script>
<script src="AC_RunActiveContent.js" type="text/javascript"></script>
</head>
<body bgcolor="#333333" >
<script type="text/javascript">
AC_FL_RunContent( 'codebase',
'http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=10,0,0,0', 'pluginspage', 'http://www.macromedia.com/go/getflashplayer',
'bgcolor', '#000000',
'width', '400',
'height', '400',
'id','RyubinPanorama',
'movie', 'RyubinPanoPlayer5',
'FlashVars','playmode=sphere&
img_path=panorama_esferico.jpg&
fov=70&
elevation=90&
depression=90&
limit_vertical=yes&
top_limit=130&
bottom_limit=130
',
'allowFullScreen','true',
'allowScriptAccess','always');
</script>
</body>
</html>


Notice that we have also edited the parameters in green to suit the Characteristics of a Spherical Panorama. After editing the code in the text editor and saving the changes we'll head back to the browser to view the updated page Virtual Tour From A Spherical Panorama .




360 Degree Donut Shot



Click on the image to download it and save it as dona_de_360_grados.jpg in the Flash folder. To create an interactive Virtual Tour with this image we'll open the pagina.htm file with a text editor to change the line of code which contains the references to the image file and the action mode :



<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Panorama De 360 Grados Interactivo Offline En Flash</title>
<script type="text/javascript">AC_FL_RunContent = 0;</script>
<script src="AC_RunActiveContent.js" type="text/javascript"></script>
</head>
<body bgcolor="#333333" >
<script type="text/javascript">
AC_FL_RunContent( 'codebase',
'http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=10,0,0,0', 'pluginspage', 'http://www.macromedia.com/go/getflashplayer',
'bgcolor', '#000000',
'width', '400',
'height', '400',
'id','RyubinPanorama',
'movie', 'RyubinPanoPlayer5',
'FlashVars','playmode=doughnut&
img_path=dona_de_360_grados.jpg&
fov=70&
elevation=45&
depression=60&
limit_vertical=yes&
top_limit=40&
bottom_limit=59
',
'allowFullScreen','true',
'allowScriptAccess','always');
</script>
</body>
</html>


Note that for an elevation of 45 degree we have fitted with a top_limit of just 40 degree. Thus we have hidden in the Virtual Tour the upper end where a dark area would loom. After editing the code in the text editor and saving the change we'll headed to the browser to see the updated page Virtual Tour With A 360 Degres Donut Shot.


Horizontal Fisheye Shot



Click on the image to download it and save it as disparo_de_ojo_de_pez_horizontal.jpg in the Flash folder. To create an interactive Virtual Tour with this image we'll open the pagina.htm file with a text editor to change the line of code which contains the references to the image file and the action mode :



<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Panorama De 360 Grados Interactivo Offline En Flash</title>
<script type="text/javascript">AC_FL_RunContent = 0;</script>
<script src="AC_RunActiveContent.js" type="text/javascript"></script>
</head>
<body bgcolor="#333333" >
<script type="text/javascript">
AC_FL_RunContent( 'codebase',
'http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=10,0,0,0', 'pluginspage', 'http://www.macromedia.com/go/getflashplayer',
'bgcolor', '#000000',
'width', '400',
'height', '400',
'id','RyubinPanorama',
'movie', 'RyubinPanoPlayer5',
'FlashVars','playmode=fisheye&
img_path=disparo_de_ojo_de_pez_horizontal.jpg&
fov=70&
top_limit=90&
bottom_limit=90&
elevation=90&
depression=90
',
'allowFullScreen','true',
'allowScriptAccess','always');
</script>
</body>
</html>


As always, we have edited the basic parameters in green font to fit the logic of the projection type for the image used. After entering the code in the text editor and saving the change we'll head to the browser to view the updated page Virtual Tour From An Horizontal Fisheye Shot.


Vertical Fisheye Shot



Click on the image to download it and save it as disparo_do_ojo_de_pez_vertical.jpg in the Flash folder. To create an interactive Virtual Tour with this image we'll open the pagina.htm file with a text editor to change the line of code which contains the references to the image file and the action mode :



<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Panorama De 360 Grados Interactivo Offline En Flash</title>
<script type="text/javascript">AC_FL_RunContent = 0;</script>
<script src="AC_RunActiveContent.js" type="text/javascript"></script>
</head>
<body bgcolor="#333333" >
<script type="text/javascript">
AC_FL_RunContent( 'codebase',
'http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=10,0,0,0', 'pluginspage', 'http://www.macromedia.com/go/getflashplayer',
'bgcolor', '#000000',
'width', '400',
'height', '400',
'id','RyubinPanorama',
'movie', 'RyubinPanoPlayer5',
'FlashVars','playmode=verticalfisheye&
img_path=disparo_de_ojo_de_pez-vertical.jpg&
fov=70',
'allowFullScreen','true',
'allowScriptAccess','always');
</script>
</body>
</html>


After editing the code in the text editor and saving the change we'll head to the browser to see the updated page Virtual Tour From A Vertical Fisheye Shot.




Partial Panorama



Click on the image to download it and save it as disparo_do_ojo_de_pez_vertical.jpg in the Flash folder. To create an interactive Virtual Tour with this image we'll open the pagina.htm file with a text editor to change the line of code which contains the references to the image file and the action mode :



<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Panorama De 360 Grados Interactivo Offline En Flash</title>
<script type="text/javascript">AC_FL_RunContent = 0;</script>
<script src="AC_RunActiveContent.js" type="text/javascript"></script>
</head>
<body bgcolor="#333333" >
<script type="text/javascript">
AC_FL_RunContent( 'codebase',
'http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=10,0,0,0', 'pluginspage', 'http://www.macromedia.com/go/getflashplayer',
'bgcolor', '#000000',
'width', '400',
'height', '400',
'id','RyubinPanorama',
'movie', 'RyubinPanoPlayer5',
'FlashVars','playmode=simpleflat&
img_path=panorama_parcial.jpg&
fov=70',
'allowFullScreen','true',
'allowScriptAccess','always');
</script>
</body>
</html>


After editing the code in the text editor and saving the change we'll head to the browser to see the updated page Virtual Tour From A Partial Panorama.




How to customize More Options Using A Configuration XML File



Replace Flash Variables By A Configuration File


It is enough to add a fifth .xml file to the system to store in it more features to include in building the Flash Virtual Tour. Below we'll reuse our first Virtual Tour by adding a configuration file, which will convert it into a much richer and customized experience.

For this we'll remove most of the Flash variables included in the .htm page's code which contains the interactive Virtual Tour, and replace them by a reference to the new.xml file, where we'll put the removed variables and add to them some others not used so far. The code of the pagina.htm file for a cylindrical panorama such as the one in the beggining of this page will now look like this :



<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Panorama De 360 Grados Interactivo Offline En Flash</title>
<script type="text/javascript">AC_FL_RunContent = 0;</script>
<script src="AC_RunActiveContent.js" type="text/javascript"></script>
</head>
<body bgcolor="#333333" >
<script type="text/javascript">
AC_FL_RunContent( 'codebase',
'http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=10,0,0,0', 'pluginspage', 'http://www.macromedia.com/go/getflashplayer',
'bgcolor', '#000000',
'width', '400',
'height', '400',
'id','RyubinPanorama',
'movie', 'RyubinPanoPlayer5',
'FlashVars','playmode=cylinder&
img_path=panorama_cilindrico.jpg&
xml_path=pagina.xml',
'allowFullScreen','true',
'allowScriptAccess','always');
</script>
</body>
</html>


Now that the reference to the pagina.xml file is created we still have to create this file and locate it in the same folder or in the location specified in the code. For this we can use a text editor or any other program and change the format to .xml.



The contents of this file are enclosed between a pair of tags :



<my_params>
</my_params>


The first thing we'll do is to include into this file the information we have removed from the Flash variables we have been using before adding the pagina.xml file and we'll do this into an element enclosed between the <play_objects> and </play_objects> tags :



<my_params>
<play_objects>
<image path="panorama_cilindrico.jpg" />
<init_filter="no"
init_fov="70"
limit_vertical="yes"
elevation="45"
depression="45"
top_limit="44"
bottom_limit="44"
/>
<auto init_start="yes"
pan_speed="-0.3"
tilt_amplitude="7"
tilt_cycle="100
" />
</play_objects>
</my_params>


image_path defines the access route to the image file and in aditional parameters we can establish more features for the panoramas :



image_path defines the access route to the image file.

init_filter defines one out of two possible states (yes or no) for a sharpness filter which, applied to the image makes it smoother.

init_fov replace fov from the non xml grammar.

Within the <auto> element we can define one out of two values (yes or no) for init_start , ie, for the image to autorotate as default setting.

pan_speed is the mentioned rotation's speed. tilt_amplitude is a measure in degree that the panorama tilts up and down while autorating and tilt_cicle is the number in degree that an entire oscilation spans.



Click to see the XML Virtual Tour.


How to Add A Set Of Controls


Next we'll add a button box with control to interact with the panorama that you can download and save to the Flash folder witht the name PanoramaCtrl07.swf :





This is a file provided togheter with Ryubin Pano Player :





To link it to the file's system we'll include it in a reference in the .xml file within al element defined between a pair of <stage> and </stage> tags :



<my_params>
<stage>
<panorama_controller path="PanoramaCtrl07.swf" posx="0" posy="0"/>
</stage>
<play_objects>
<image path="panorama_cilindrico.jpg" />
<init_filter="no"
init_fov="70"
limit_vertical="yes"
elevation="45"
depression="45"
top_limit="44"
bottom_limit="44"" />
<auto init_start="yes"
pan_speed="-0.3"
tilt_amplitude="7"
tilt_cycle="100" />
</play_objects>
</my_params>


The optional parameters posx and posy define the distance in pixels from the right lower corner of the image to the beggining of the controls's box. Click to see the Virtual Tour With Controls.




How to Customize The Panorama With Background Images


The background images of the panarama player as well as those which are shown while processes are being completed can be customized from the pagina.xml file. Click here to download the images and uncompress the files to the Flash folder. You can uncompress them to any folder as far as you also modify the code lines where there are references to these files. You can even store the files into a specific location on the internet and type in the complete route where to find them. If you prefer to download each one of the files apart from the rest click on the links below and save them with the names indicated for each file :



background.gif

caption.png

indicator.gif


We see the new files added to the Flash folder :





The sintax for the xml looks as follows :



<my_params>
<stage>
<panorama_controller path="PanoramaCtrl07.swf" posx="0" posy="0"/>
</stage>
<user_loader>
<caption path="caption.png" connecting="" loading="" />
<indicator path="indicator.gif" />
<background path="background.gif" /></user_loader>
<play_objects>
<image path="panorama_cilindrico.jpg" />
<view init_filter="no"
init_fov="70"
limit_vertical="yes"
elevation="45"
depression="45"
top_limit="44"
bottom_limit="44" />
<auto init_start="yes"
pan_speed="-0.3"
tilt_amplitude="7"
tilt_cycle="100" />
</play_objects>
</my_params>


We recommend to try out different background images to better understand their use. Click to see the Virtual Tour With Background Images.




How To Add Functions To The Context Menu Of A Virtual Tour


The context menu is the menu that displays on right clicking the mouse's right button over a Virtual Tour of this type or over any element based on Flash. The basic Ryubin Pano Player's context menu looks like this :



The configuration .xml file also serves us to add new functionalities to the context menu. In our example, some of them riposte functions from the Control's button box while other are new :



To get this done we need to create a new element in the .xml page and surround it between a pair of tags <context_menu> and </context_menu> within which we'll define every new element for the menu and two texts to show : the text to show in on mode where the element is active and the text to show in off mode when the element is deactivated. We also must include the show_item="yes" parameter for each element to be visible on the menu.


Also, if we include user defined elements -such as the credits in this example- it will be necessary to include into my_params a new element surrounded by a <user_panel> and </user_panel> pair of tags where we'll establish the access route to the resource defined by the user. For our example we'll use the following image file :



Mensaje.png



The configuration file now could look like this :



<my_params>
<stage>
<panorama_controller path="PanoramaCtrl07.swf" posx="0" posy="0"/>
</stage>
<user_loader>
<caption path="caption.png" connecting="" loading="" />
<indicator path="indicator.gif" />
<background path="background.gif" /></user_loader>
<context_menu>
<panorama_controller show_item="yes" on_caption="Mostrar Botones" off_caption="Ocultar Botones" />
<u_context1 show_item="yes" on_caption="Mostrar Creditos" off_caption="Ocultar Creditos" />
<show_info show_item="yes" on_caption="Mostrar Coordenadas" off_caption="Ocultar Coordenadas" />
<smoothing show_item="yes" on_caption="Menos Contraste" off_caption="Mas Contraste" />
<start_auto show_item="yes" on_caption="Iniciar Rotacion" off_caption="Detener Rotacion" />
<full_screen show_item="yes" on_caption="Mostrar en Pantalla Completa" off_caption="Mostrar en Pantalla Normal" />
</context_menu>
<user_panel>
<u_context1 path="Mensaje.png" />
</user_panel>
<play_objects>
<image path="panorama_cilindrico.jpg" />
<view init_filter="no"
init_fov="70"
limit_vertical="yes"
elevation="45"
depression="45"
top_limit="44"
bottom_limit="44" />
<auto init_start="yes"
pan_speed="-0.3"
tilt_amplitude="7"
tilt_cycle="100" />
</play_objects>
</my_params>


Likewise, more user defined elements can be added by modifiyng the number accompanying the expression u_context (u_context1, u_context2, etc). Click to see the Virtual Tour With Extended Context Menu and right click over the Virtual Tour to display the context menu.




Spherical Projection Modes


It is also possible to add new features to the context menu which are useful to certain types of panoramic projection. For example, in a Virtual Tour of spherical projection, this could be of any of three modes (rectilinear, orthogonal or stereographic mode) and it is possible to switch between them by displaying the context menu to choose the mode :



We'll configure the spherical panorama through a .xml file :



The code to include within the page that contains the Virtual Tour could be as follows :



<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Panorama De 360 Grados Interactivo Offline En Flash</title>
<script type="text/javascript">AC_FL_RunContent = 0;</script>
<script src="AC_RunActiveContent.js" type="text/javascript"></script>
</head>
<body bgcolor="#333333" >
<script type="text/javascript">
AC_FL_RunContent( 'codebase',
'http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=10,0,0,0', 'pluginspage', 'http://www.macromedia.com/go/getflashplayer',
'bgcolor', '#000000',
'width', '400',
'height', '400',
'id','RyubinPanorama',
'movie', 'RyubinPanoPlayer5',
'FlashVars','playmode=sphere&
img_path=panorama_esferico.jpg&
xml_path=pagina.xml',
'allowFullScreen','true',
'allowScriptAccess','always');
</script>
</body>
</html>


The content of the .xml file could be as follows :



<my_params>
<stage>
<panorama_controller path="PanoramaCtrl07.swf" posx="0" posy="0"/>
</stage>
<user_loader>
<caption path="caption.png" connecting="" loading="" />
<indicator path="indicator.gif" />
<background path="background.gif" /></user_loader>
<context_menu>
<panorama_controller show_item="yes" on_caption="Mostrar Botones" off_caption="Ocultar Botones" />
<u_context1 show_item="yes" on_caption="Mostrar Creditos" off_caption="Ocultar Creditos" />
<show_info show_item="yes" on_caption="Mostrar Coordenadas" off_caption="Ocultar Coordenadas" />
<smoothing show_item="yes" on_caption="Menos Contraste" off_caption="Mas Contraste" />
<start_auto show_item="yes" on_caption="Iniciar Rotacion" off_caption="Detener Rotacion" />
<full_screen show_item="yes" on_caption="Mostrar en Pantalla Completa" off_caption="Mostrar en Pantalla Normal" />
</context_menu>
<user_panel>
<u_context1 path="Mensaje.png" />
</user_panel>
<sphere_context>
<normal show_item="yes" on_caption="-> Proyeccion Rectilinea" off_caption=" Proyeccion Rectilinea" />
<globe show_item="yes" on_caption="-> Proyeccion Ortogonal" off_caption=" Proyeccion Ortogonal" />
<bipolar show_item="yes" on_caption="-> Proyeccion Estereografica" off_caption=" Proyeccion Estereografica" />
</sphere_context>
<play_objects>
<image path="panorama_esferico.jpg" />
<view init_filter="no"
init_fov="100"
limit_vertical="yes"
elevation="90"
depression="90"
top_limit="110"
bottom_limit="110" />
<auto init_start="yes"
pan_speed="-0.3"
tilt_amplitude="7"
tilt_cycle="100" />
</play_objects>
</my_params>


Click to see the Spherical Virtual Tour With Extended Context Menu and right click over the Virtual Tour to display the context menu which allows to switch between the three mentioned projection modes.


Fisheye Projection Modes


Likewise, interactive Virtual Tours from Fisheye shots also admit three projection modes (simple, dual and mirror modes) and the wat to access them is to use the context menu through references on the configuration .xml file :



We'll customize the spherical panorama through an .xml file :



The code to include within the page that contains the Virtual Tour could be as follows :



<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Panorama De 360 Grados Interactivo Offline En Flash</title>
<script type="text/javascript">AC_FL_RunContent = 0;</script>
<script src="AC_RunActiveContent.js" type="text/javascript"></script>
</head>
<body bgcolor="#333333" >
<script type="text/javascript">
AC_FL_RunContent( 'codebase',
'http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=10,0,0,0', 'pluginspage', 'http://www.macromedia.com/go/getflashplayer',
'bgcolor', '#000000',
'width', '400',
'height', '400',
'id','RyubinPanorama',
'movie', 'RyubinPanoPlayer5',
'FlashVars','playmode=sphere&
img_path=panorama_esferico.jpg&
xml_path=pagina.xml',
'allowFullScreen','true',
'allowScriptAccess','always');
</script>
</body>
</html>


The contents of the .xml file could be as follows :



<my_params>
<stage>
<panorama_controller path="PanoramaCtrl07.swf" posx="0" posy="0"/>
</stage>
<user_loader>
<caption path="caption.png" connecting="" loading="" />
<indicator path="indicator.gif" />
<background path="background.gif" /></user_loader>
<context_menu>
<panorama_controller show_item="yes" on_caption="Mostrar Botones" off_caption="Ocultar Botones" />
<u_context1 show_item="yes" on_caption="Mostrar Creditos" off_caption="Ocultar Creditos" />
<show_info show_item="yes" on_caption="Mostrar Coordenadas" off_caption="Ocultar Coordenadas" />
<smoothing show_item="yes" on_caption="Menos Contraste" off_caption="Mas Contraste" />
<start_auto show_item="yes" on_caption="Iniciar Rotacion" off_caption="Detener Rotacion" />
<full_screen show_item="yes" on_caption="Mostrar en Pantalla Completa" off_caption="Mostrar en Pantalla Normal" />
</context_menu>
<user_panel>
<u_context1 path="Mensaje.png" />
</user_panel>
<fisheye_context>
<single show_item="yes" on_caption="-> Modo Simple" off_caption="Modo Simple" />
<double show_item="yes" on_caption="-> Modo Doble" off_caption="Modo Doble" />
<mirror show_item="yes" on_caption="-> Modo Espejo" off_caption="Modo Espejo" />
</fisheye_context>
<play_objects>
<image path="disparo_de_ojo_de_pez_horizontal.jpg" />
<view init_filter="no"
init_fov="100"
limit_vertical="yes"
elevation="90"
depression="90"
top_limit="110"
bottom_limit="110" />
<auto init_start="yes"
pan_speed="-0.3"
tilt_amplitude="7"
tilt_cycle="100" />
</play_objects>
</my_params>


Click to see the Virtual Tour From Fisheye Shot With Extended Context Menu and right click over the Virtual Tour to switch between the three mentioned projection modes.




Mode Combinations


The .xml file allows us to add to a single Virtual Tour options to play it with option modes corresponding to different types of panoramas. In the following example we'll use the features just described to add to the context menu the ability to change both the spherical snd fisheye projection modes :



We'll customize the Virtual Tour for the same image we just used :



The code to include within the page that contains the Virtual Tour could be as follows :



<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Panorama De 360 Grados Interactivo Offline En Flash</title>
<script type="text/javascript">AC_FL_RunContent = 0;</script>
<script src="AC_RunActiveContent.js" type="text/javascript"></script>
</head>
<body bgcolor="#333333" >
<script type="text/javascript">
AC_FL_RunContent( 'codebase',
'http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=10,0,0,0', 'pluginspage', 'http://www.macromedia.com/go/getflashplayer',
'bgcolor', '#000000',
'width', '400',
'height', '400',
'id','RyubinPanorama',
'movie', 'RyubinPanoPlayer5',
'FlashVars','playmode=fisheye&
img_path=disparo_de_ojo_de_pez_horizontal.jpg&
xml_path=pagina.xml',
'allowFullScreen','true',
'allowScriptAccess','always');
</script>
</body>
</html>


The contents of the .xml file could be as follows :



<my_params>
<stage>
<panorama_controller path="PanoramaCtrl07.swf" posx="0" posy="0"/>
</stage>
<user_loader>
<caption path="caption.png" connecting="" loading="" />
<indicator path="indicator.gif" />
<background path="background.gif" /></user_loader>
<context_menu>
<panorama_controller show_item="yes" on_caption="Mostrar Botones" off_caption="Ocultar Botones" />
<u_context1 show_item="yes" on_caption="Mostrar Creditos" off_caption="Ocultar Creditos" />
<show_info show_item="yes" on_caption="Mostrar Coordenadas" off_caption="Ocultar Coordenadas" />
<smoothing show_item="yes" on_caption="Menos Contraste" off_caption="Mas Contraste" />
<start_auto show_item="yes" on_caption="Iniciar Rotacion" off_caption="Detener Rotacion" />
<full_screen show_item="yes" on_caption="Mostrar en Pantalla Completa" off_caption="Mostrar en Pantalla Normal" />
</context_menu>
<user_panel>
<u_context1 path="Mensaje.png" />
</user_panel>
<sphere_context>
<normal show_item="yes" on_caption="-> Proyeccion Rectilinea" off_caption=" Proyeccion Rectilinea" />
<globe show_item="yes" on_caption="-> Proyeccion Ortogonal" off_caption=" Proyeccion Ortogonal" />
<bipolar show_item="yes" on_caption="-> Proyeccion Estereografica" off_caption=" Proyeccion Estereografica" />
</sphere_context>
<fisheye_context>
<single show_item="yes" on_caption="-> Modo Simple" off_caption="Modo Simple" />
<double show_item="yes" on_caption="-> Modo Doble" off_caption="Modo Doble" />
<mirror show_item="yes" on_caption="-> Modo Espejo" off_caption="Modo Espejo" />
</fisheye_context>
<play_objects>
<image path="disparo_de_ojo_de_pez_horizontal.jpg" />
<view init_filter="no"
init_fov="100"
limit_vertical="yes"
limit_horizontal="no"
elevation="90"
depression="90"
top_limit="110"
bottom_limit="110" />
<auto init_start="yes"
pan_speed="-0.3"
tilt_amplitude="7"
tilt_cycle="100" />
</play_objects>
</my_params>


Notice that we have included the limit_horizontal="no" parameter to free the image movement which, no matter it is a fisheye shot, rotates freely as if it was a spherical panorama. This makes it possible for us to apply to the Virtual Tour the six possible variants that the instrumented combination of projection modes allows. Click to see the Fisheye Shot Virtual Tour With Doubly Extended Context Menu and right click over the Virtual Tour to display the context menu and try out the different possible combinations.




How To Use 360 Degree Donut Shots And Fisheye Shots Without Cropping


So far we have created Virtual Tours from photographs whose images occupy the entire available surface, such as Cylindrical and Spherical Panoramas, or others such as the 360 Degree Donut Shots and Fisheye Shots which, no matter their useful areas do not span the entire surface of the picture, they are centered in a perfecly symmetrical image, which has required some edition job. The Ryubin Pano Player also let us create Virtual Tour from non edited images, just as they come out of the camera :





As we know, it depends on the camera and its settings that the complete picture is more or less enlarged and on the camera handling depends that the center of the donut shot matches better or worse the precise center of the entire image. To create a Virtual Tour without the need of actually cropping the photograph, the possible alternative is to tell the panorama viewer in which area of the image it should look for the useful information, as if we were making a virtual cropping.

To obtain a good practical result with this sistem, it is important that the parabolic mirror used to photograph the 360 degree donut shots is tightly attached to the camera, so that it does not move even when the camera moves. This way the parameters measured once will be valid to use por the entire set of photographed panoramas.

To get started with this example, we'll create the necessary code for a 360 Degree Cropped Donut Shot whose ratio between sides is 1/1 :



The code to include within the page that contains the Virtual Tour could be as follows :



<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Panorama De 360 Grados Interactivo Offline En Flash</title>
<script type="text/javascript">AC_FL_RunContent = 0;</script>
<script src="AC_RunActiveContent.js" type="text/javascript"></script>
</head>
<body bgcolor="#333333" >
<script type="text/javascript">
AC_FL_RunContent( 'codebase',
'http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=10,0,0,0', 'pluginspage', 'http://www.macromedia.com/go/getflashplayer',
'bgcolor', '#000000',
'width', '400',
'height', '400',
'id','RyubinPanorama',
'movie', 'RyubinPanoPlayer5',
'FlashVars','playmode=doughnut&
xml_path=pagina.xml',
'allowFullScreen','true',
'allowScriptAccess','always');
</script>
</body>
</html>


The contents of the .xml file could be as follows :



<my_params>
<stage>
<panorama_controller path="PanoramaCtrl07.swf" posx="0" posy="0"/>
</stage>
<user_loader>
<caption path="caption.png" connecting="" loading="" />
<indicator path="indicator.gif" />
<background path="background.gif" /></user_loader>
<context_menu>
<panorama_controller show_item="yes" on_caption="Mostrar Botones" off_caption="Ocultar Botones" />
<u_context1 show_item="yes" on_caption="Mostrar Creditos" off_caption="Ocultar Creditos" />
<show_info show_item="yes" on_caption="Mostrar Coordenadas" off_caption="Ocultar Coordenadas" />
<smoothing show_item="yes" on_caption="Menos Contraste" off_caption="Mas Contraste" />
<start_auto show_item="yes" on_caption="Iniciar Rotacion" off_caption="Detener Rotacion" />
<full_screen show_item="yes" on_caption="Mostrar en Pantalla Completa" off_caption="Mostrar en Pantalla Normal" />
</context_menu>
<user_panel>
<u_context1 path="Mensaje.png" />
</user_panel>
<sphere_context>
<normal show_item="yes" on_caption="-> Proyeccion Rectilinea" off_caption=" Proyeccion Rectilinea" />
<globe show_item="yes" on_caption="-> Proyeccion Ortogonal" off_caption=" Proyeccion Ortogonal" />
<bipolar show_item="yes" on_caption="-> Proyeccion Estereografica" off_caption=" Proyeccion Estereografica" />
</sphere_context>
<play_objects>
<image path="dona_de_360_grados_1.1.jpg" />
<view init_filter="no"
init_fov="60"
limit_vertical="yes"
elevation="45"
depression="45"
top_limit="44"
bottom_limit="44" />
<auto init_start="yes"
pan_speed="-0.3"
tilt_amplitude="7"
tilt_cycle="100" />
</play_objects>
</my_params>


Click to see the Virtual Tour From A 360 Degree Cropped And Centered Donut Shot. Next we'll re-create the process but using a non-cropped image, whose ratio between sides is 4/3 :



For this we must use the crop element and its parameters whose meanings we explain below :

To add this information to the Virtual Tour we'll go once again to the .xml file, where we'll create an element defined between the <crop> and </crop> tags. The aditional parameters supported by the crop element are what we'll use to tell the viever the features of the photograph that contains the 360 degree donut. These are :

height is the height percentage of the donut compared to the total height of the photograph. In other words, it is the product of dividing the maximum height of the donut by the total height of the image.

width is the width percentage of the donut compared to the total width of the photograph. In other words, it is the product of dividing the maximum width of the donut by the total width of the image.

cx is the product of the distance from the donut's center to the left side of the photograph, divided by the total width of the image.

cy is the product of the distance from the donut's center to the upper border of the photograph, divided by the total height of the image. Togheter with cx it serves to establish the exact location of the donut in the photographed rectangle.

inner_circle is the product of the empty inner circle's radius of the donut divided by the distance from the center of the above mentioned circle and the outer border of the donut :




height = B / A width = D /C cx = E / C cy = G / A inner_circle = F / G


With these simple equations we can estimate the values to include as parameters in the Virtual Tour's configuration. The reference in the .htm page which contains the Virtual Tour hasn't changed at all :



<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Panorama De 360 Grados Interactivo Offline En Flash</title>
<script type="text/javascript">AC_FL_RunContent = 0;</script>
<script src="AC_RunActiveContent.js" type="text/javascript"></script>
</head>
<body bgcolor="#333333" >
<script type="text/javascript">
AC_FL_RunContent( 'codebase',
'http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=10,0,0,0', 'pluginspage', 'http://www.macromedia.com/go/getflashplayer',
'bgcolor', '#000000',
'width', '400',
'height', '400',
'id','RyubinPanorama',
'movie', 'RyubinPanoPlayer5',
'FlashVars','playmode=doughnut&
xml_path=pagina.xml',
'allowFullScreen','true',
'allowScriptAccess','always');
</script>
</body>
</html>


The .xml configuration file, instead, will be modified by the inclusion of the crop element :



<my_params>
<stage>
<panorama_controller path="PanoramaCtrl07.swf" posx="0" posy="0"/>
</stage>
<user_loader>
<caption path="caption.png" connecting="" loading="" />
<indicator path="indicator.gif" />
<background path="background.gif" /></user_loader>
<context_menu>
<panorama_controller show_item="yes" on_caption="Mostrar Botones" off_caption="Ocultar Botones" />
<u_context1 show_item="yes" on_caption="Mostrar Creditos" off_caption="Ocultar Creditos" />
<show_info show_item="yes" on_caption="Mostrar Coordenadas" off_caption="Ocultar Coordenadas" />
<smoothing show_item="yes" on_caption="Menos Contraste" off_caption="Mas Contraste" />
<start_auto show_item="yes" on_caption="Iniciar Rotacion" off_caption="Detener Rotacion" />
<full_screen show_item="yes" on_caption="Mostrar en Pantalla Completa" off_caption="Mostrar en Pantalla Normal" />
</context_menu>
<user_panel>
<u_context1 path="Mensaje.png" />
</user_panel>
<sphere_context>
<normal show_item="yes" on_caption="-> Proyeccion Rectilinea" off_caption=" Proyeccion Rectilinea" />
<globe show_item="yes" on_caption="-> Proyeccion Ortogonal" off_caption=" Proyeccion Ortogonal" />
<bipolar show_item="yes" on_caption="-> Proyeccion Estereografica" off_caption=" Proyeccion Estereografica" />
</sphere_context>
<play_objects>
<image path="dona_de_360_grados_4.3.jpg" />
<crop width="0.712" height="0.960" cx="0.5" cy="0.5" inner_circle="0.177"/>
<view init_filter="no"
init_fov="60"
limit_vertical="yes"
elevation="45"
depression="45"
top_limit="44"
bottom_limit="44" />
<auto init_start="yes"
pan_speed="-0.3"
tilt_amplitude="7"
tilt_cycle="100" />
</play_objects>
</my_params>


Notice how the values of height and width get closer to 1 as the distance between the donut and the photograph borders get smaller. Likewise, the cx and cy values get closer to 0.5 the better centered the donut is in the image. Click to see the Virtual Tour From A Non-Cropped 360 Degree Donut Shot.

To know in depth all the possible options, as well as to see more examples and documents -in english- visit Ryubin Pano Player's site .




Visitor's Feedback


Geovanny (geliasmf@hotmail.com) says :

Simplemente exelente................!!!!!!!!!!!!!!!

URL :


360 Facil (info@360facil.com) says :

Muchas gracias y saludos!

URL :


david (dberrogp@gmail.com) says :

Simplemente... impresionante

URL : URL


Marco (marco.oa@hotmail.com) says :

Hola. Me gustaria saber si se puede hacer un tour virtual con varias panorámicas. Es decir, cuando acabe de rotar la primera, salte automático a la segunda, a la tercera.... y asi sucesivamente hasta la última que queramos enseñar. Gracias

URL : URL


360 Facil (info@360facil.com) says :

Hola Marco, gracias por tu consulta. Una manera basica en que puedes hacer lo que propones es crear diferentes paginas, cada una con un tour virtual animado y agregar a cada una entre las etiquetas <head> y </head> una linea como la siguiente :

<meta http-equiv="refresh" content="15; url=proxima.htm">

Esto hara que vencido cierto tiempo, la pagina actual sea reemplazada por otra que tu determines. En este codigo, el numero 15 representa la cantidad de segundos que la pagina permanecera visible antes de ser redireccionada a la siguiente y proxima.htm es la URL de la siguiente pagina en cargarse. Si sabes usar un poco de Javascript, puedes aprovechar la API del Ryubin Flash Player, la que incluye la instruccion LoadXML() que puede ser utilizada para cargar los datos contenidos en otros archivos .XML a un mismo visor del Ryubin Flash Player sin necesidad de recargar la pagina ni tampoco el visor. Encuentras detalles sobre esta API en la Guia Para Usuarios (en ingles) que puedes descargar del sitio de Ryubin. Si bien el caso no es exactamente igual al que tu propones, ya que en el ejemplo los nuevos panoramas se cargan a partir de vinculos y no al cumplirse un periodo de tiempo, en la URL adjunta a este comentario encuentras un ejemplo de la implementacion de la instruccion LoadXML() de la API de Ryubin. Hay otros ejemplos en el mismo sitio. Agregaremos uno propio y explicado a nuestro tutorial en cuanto nos sea posible. Buena suerte y saludos.

URL : www.ryubin.com/panolab/panoflash/demo/PanoDoughnutFlash_03.html


Marco (marco.oa@hotmail.com) says :

Muchas gracias. Creo que es lo que estoy buscando. Probaré ambos metodos y a ver cual se me adapta mejor a mis necesidades. Otra duda es si a las panoramicas parciales se les puede dar movimiento. Con la instruccion simpleflat me da error de formato y no encuentro la manera. Me veo obligado a cambiarlo por cylinder y no me queda terminado como deseo. Un saludo y gracias

URL : URL


360 Facil (info@360facil.com) says :

No hay de que, Marco. Los panoramas parciales deben funcionar igual que los demas. Por favor dinos cual es el ID del panorama que te da error de formato para revisarlo. Gracias y saludos.

URL : URL


Marco (marco.oa@hotmail.com) says :

Muchas gracias. Solucionado. Ya funciona con modo flat. Solo me queda ajustar el zoom inicial que me sale muy ampliado y me gustaria el inicio un poco mas reducido para que se pueda ver toda la panoramica. Por lo demas conotento. Muchisimas gracias

URL : URL


360 Facil (info@360facil.com) says :

No hay de que. Creaimos que el problema lo habias encontrado en nuestro Creador de Tours Virtuales Online pero ahora se entiende que estas experimentando en tu propio equipo. A proposito, habras notado que en el modo plano o flat no existe la sensacion envolvente tal como en los modos cilindrico o esferico, sino que la imagen pasa por el visor sin deformarse. Si quieres crear Tours Virtuales realmente envolventes a partir de panoramas parciales puedes utilizar el modo cilindrico y limitar en el archivo .xml los recorridos vertical y horizontal y asi obtendras resultados mas atractivos. Es lo que nos gustaria hacer en el Creador de Tours Virtuales Online pero para ello necesitariamos conocer el angulo de vision vertical (que en los otros modos puede ser deducido) para ajustar el angulo de vision inicial, dato que tu conoces respecto de tu panorama o puedes acercarte a el mediante ensayo y error. Gracias por tu participacion y buena suerte!

URL : URL


Marco (marco.oa@hotmail.com) says :

Estoy experimentando en mi equipo con panoramicas mias. Tengo más dudas pues cambio muchos parametros de Fov pero no veo cambios. y me interesa mucho saber como limitar el movimiento al ancho de mi imagen. Tambien si es posible que inicie en modo pantalla completa... Un saludo

URL : URL


360 Facil (info@360facil.com) says :

Hola Marco. Puedes conseguir que un Tour Virtual se inicie en modo de pantalla completa agregando a tu archivo .xml, entre las etiquetas <stage> y </stage> un elemento panowindow que incluya el parametro fullstage="yes". Por ejemplo :

<stage><panowindow fullstage="yes" width="200" height="90"></stage>

Los valores admitidos para el FOV van de los 20 a los 130 grados, salvo unas pocas excepciones indicadas en la Guia Para Usuarios de Ryubin, pero creo que ninguna es tu caso. Si utilizas valores inferiores al minimo o superiores al maximo no veras ningun cambio. Ojala que esta informacion te sea util. Gracias y saludos.

URL : URL


Marco (marco.oa@hotmail.com) says :

HOla!!. No he conseguido que se inicie en modo pantalla completa en el navegador. Lo único que se asemeja es poniendo en el html los valores de width="100%" height="100%" y de esa forma me ocupa toda la página del navegador. Y con FOV sigo igual...por más que cambien el valor no consigo ningun cambio, y me gustaria se iniciara la imagen un poco más reducida, sin tanto zoom. A la vez ¿como hacer para que empiece en el extremo izquierdo de la panorama y no en medio de la misma? Mi idea es empezar por el extremo izquierdo y al llegar al opuesto que salte a la siguiente....seguiré probando opciones. Un saludo y muchas gracias

URL : URL


360 Facil (info@360facil.com) says :

Hola, Marco. Tienes razon, lo hemos chequeado y panowindow se refiere al area activa del panorama dentro del visor completo, de manera que parece no haber manera posible de iniciar el Tour Virtual en pantalla completa. Es probable que puedas mejorar tu aproximacion si en lugar de iniciar la pagina con un vinculo comun usas uno como el siguiente :

<a href="javascript:NewWindow=window.open('pagina.htm','newWin1',
'width=100%,height=100%,top=0,left=0,toolbar=No,location=No,
scrollbars=No,status=No,resizable=No,fullscreen=Yes'); void(0);">pagina</a>

Este debe abrir pagina.htm en una nueva ventana a pantalla completa, aunque solo funciona en Internet Explorer. Puedes evitar la señal de advertencia de la misma manera que se describe en la URL adjunta a este comentario. Para definir las coordenadas desde donde se incie el paneo de la imagen puedes agregar a tu archivo .xml dentro del elemento <view> el atributo init_yaw con valores negativos o positivos en grados para definir el desplazamiento. Para definir la velocidad y el sentido de la rotacion automatica puedes agregar el atributo pan_speed dentro de la etiqueta <auto>, el cual tambien admite valores numericos negativos, positivos y decimales. Puesto que de veras estas interesado en obtener lo maximo de tu presentacion es muy recomendable que consultes la Guia Para Usuarios de Ryubin. Ten en cuenta que esta pagina es una sintesis de ese documento de alrededor de cien paginas, de manera que alli encontraras posibilidades que ni te imaginas. Saludos y a seguir trabajando.

URL : www.360facil.com/esp/fotografia-360-grados-publicacion-tours-virtuales-java.php


Marco (marco.oa@hotmail.com) says :

Hola. Estoy con el manual siempre al lado revisandolo de arriba a abajo. Voy probando y corrigiendo y casi lo tengo más o menos para lo que quiero. De internet explorer...muchos problemas con él que he solucionado al cambiar a Chrome. Y de nuevo muchisimas gracias!!!!

URL : URL


360 Facil (info@360facil.com) says :

Gracias a ti!

URL : URL


Marco (marco.oa@hotmail.com) says :

Hola. Casi terminado ajustando el FOV en cada una. Usaré firefox pues al ponerlo en pantalla completa continua asi cuando pasado un tiempo salta a la siguiente panorama. En Chrome y explorer no lo hace. En el primero se sale de pantalla completa y continua el siguiente panorama en el tamaño de la pagina y en explorer directamente no salta a la siguiente. Muchisimas gracias por la ayuda!!! Un saludo

URL : URL


Juan Carlos (jnk.scorpio@gmail.com) says :

Buen día. Me gustarĂ­a saber como agregar botones que al dar click me lleven a una parte especifica de la imagen o a otra imagen. Lo que quiero hacer es un recorrido virtual de las instalaciones de una oficina, para que los usuarios sepan donde esta cada área y quien es el titular del área. No se si el Ryubin tenga esas opciones. Un recorrido como los de encarta.

URL : URL


360 Facil (info@360facil.com) says :

Hola Juan Carlos, Muchas Gracias por tu consulta. Puedes crear ese efecto utilizando hotspots con Ryubin Pano Player. Proximamente agregaremos al tutorial el ejemplo de como hacerlo. Mientras tanto te recomendamos que veas la guia para usuarios de Ryubin que puedes encontrarla en el sitio oficial del programa y leas lo relativo al uso de hotspots. Buena suerte y saludos!

URL : www.ryubin.com/panolab/panoflash/


Ramon (vallverd1@hotmail.com) says :

EL mejor tutorial y mejor web para trabajar con panorama 360°. Gracias por compartir tus conocimientos. Eres un autentico profesor.

URL : URL


360 Facil (info@360facil.com) says :

Muchas Gracias Ramon!

URL : URL


Omri Rodurr (rod_urr@hotmail.com) says :

gracias por tu aporte lo voy ha probar y te digo como me fue GRACIASSS

URL : URL


leandro pinilla (leandropinilla77@gmail.com) says :

Exelente la pagina unas dudas como le asigno funciones al menu por ejemplo la que dice mostrar creditos no hace nada las otras si como ocultar botones etc el archivo xml debe iniciar asi <?xml version = '1.0'?> o no hace falta otra cosa como puedo publicarla en mi blog wordpress conocen algun plugin para ello ya que intentado con iframe pero no me sale desde ya gracias te mando este mail porque quise dejar estas dudas en los comentarios y no pude me da error

URL : URL


360 Facil (info@360facil.com) says :

Gracias por tu consulta, Leandro. La re-publicamos aqui para que sea util a otros visitantes. Efectivamente habia un error y faltaba agregar el elemento user_panel, por lo tanto hemos corregido el articulo. Creemos que ahora todo esta bien. Con respecto al encabezamiento del archivo xml creemos que esto es asi, pero para mayor seguridad te conviene consultar con el sitio oficial de xml (URL al pie del comentario). No conocemos herramientas de wordpress pero podemos sugerirte que utilices vinculos al tour virtual o, si wordpress lo permite, un script del tipo thickbox/lightbox que lo abre en una ventana flotante por encima de la pagina desde donde se ejecuta. Como ejemplo puedes ver las alternativas de publicacion personalizada en nuestro Creador de Tours Virtuales Online. Buena Suerte y saludos!
PD - Tu dificultad para publicar en los comentarios se debio a la inclusion del encabezado XML ya que algunos de sus caracteres detienen la ejecucion del envio. Hasta tanto podamos arreglarlo si asi lo deseas puedes incluir caracteres hmtl en comentarios. Gracias.

URL : www.xml.com/


José Manuel Vazquez (jomavadi@gmail.com) says :

Me gustaria comenzar el Tour virtual interactivo de Ryubin en modo simpleflat& de forma que no salga el "maximun fov" en medio de a imgen. ¿Cómo puedo quitarlo? Salu2

URL : URL


Rubén (rubolver@gmail.com) says :

Buenos días: Tal vez sea un poco torpe, pero llevo un buen rato rompiéndome la cabeza para pasar la imagen al blog. Apenas tengo conocimientos de HTML y tal vez sea por eso por lo que no lo consigo. ¿Cómo se haría? Y otra cuestión: al cambiar de ordenador la dirección URL no me sirve. Esto sucede porque en la nueva terminal no tengo la carpeta. ¿Cómo se consigue una URL permanente que pueda compartir? Gracias de antemano ;-)

URL : URL


360 Facil (info@360facil.com) says :

Hola Ruben. Gracias por tu consulta. En la URL adjunta a este comentario encuentras el articulo que hemos preparado como introduccion a la publicacion simple en html. Todo en ese articulo se refiere a publicar de manera interna en el propio ordenador de uno. Si se copian los archivos a otro ordenador hay que asegurarse que la ruta de acceso a cada archivo coincida con las que estan escritas en el codigo. Para que la publicacion este disponible en internet, es necesario alojarla en un servidor. Si contratas un alojamiento tendras toda la disponibilidad para subir los archivos que quieras pero si quieres publicarla en un blog, tienes que seguir las instrucciones del blog y es probable que no te den herramientas necesarias para subir carpetas y archivos a tu voluntad. En ese caso, te convendria utilizar una herramienta como nuestro Creador de Tours Virtuales Online, donde los archivos ya se encuentran alojados en nuestro servidor y puedes utilizarlos copiando un texto o codigo que puedes pegar en el html de tu blog. Buena suerte y saludos!

URL : www.360facil.com/esp/fotografia-360-grados-publicacion-panoramas-planos.php


Add A Question Or Comment


All fields are optional. Messages not regarding the subject may be moderated.


Write 123 here (anti-spam check)

Send me a reminder of this publication.






If you like 360 Facil please share it with your social networks

  


With any camera


360 Degree Interactive Panoramas
In Three Easy Steps



After reading this tutorial you'll be able to create your first 360 degree interactive photography with the camera you already have :

1 - Photograph
1 - Fotografiar

Take one or more pictures of the place you want to show.

2 - Edit
2 - Editar

Convert your pictures into 360 degree panoramas.

3 - Publish
3 - Publicar

Make your panoramas interactive and available to the world on the internet.

Start Tutorial

If a picture is worth a thousand words, a 360 degree interactive panorama is worth a thousand pictures...

Recommended...!!!


Online Virtual Tour Creator



Using the online virtual tour creator you can :


Convert your 360 degree pictures to virtual tours with a single click.


Insert your virtual tours into web sites, emails, blogs or wherever you like by just copying and pasting a text.


Know in a practical way all kinds of 360 degree pictures.


Discover that you can create hundreds of interactive virtual tours just as easily as you take pictures with your camera.


Check that with just one click from your camera and another click from your mouse it is possible to create a 360 degree interactive virtual tour out of nothing. And completely free of charge!!!


You can get started right now, even if you don't have a camera



Create Virtual Tour Now



Find us in Facebook and thank you for your Like.