Si tienes un dispositivo android/iOS con la aplicación de Google Photosphere quizá te has preguntado si es posible visualizar las fotografías 360 fuera de Google Maps o bien G+.
Pues existe una librería excelente programada en Javascript que funciona a la maravilla para visualizar estas fotos via web sin necesidad de casi nada de codigo :D.
Su uso es como el de cualquier librería simplemente enlazamos dos archivos (sphere.js y three.js) :
<!DOCTYPE html>
<html lang="en">
<head>
<title>PhotoSphere Ejemplo </title>
<script type="text/javascript" src="lib/three.min.js"></script>
<script type="text/javascript" src="lib/sphere.js"></script>
<script type="text/javascript">
//pasamos el parametro de la imagen que queremos visualizar y le indicamos en que elemento HTML la vamos a mostrar
new Photosphere("pano.jpg").loadPhotosphere(document.getElementById("sphere"));
</script>
</head>
<body>
<div id="sphere" style="width: 100%; min-height: 700px;"></div>
</body>
</html>
Listo!, como ves es muy simple , puedes ver un ejemplo aqui (espera un poco ya que la imagen es algo pesada :P)
Enlace [PhotoSphere.js ]
mi amigo, sera q lo estoy haciendo mal. o no se porque
pero los ejemplos no me muestran nada, es decir, carga el código html js etc. pero no carga la imagen photosphere,
espero puedas ayudarme gracias
Hola disculpa por la tardanza , te comparto la carpeta con el ejemplo y los scripts usados (dben correr sobre un servidor web) http://maquetando.com/ejemplos/photos.zip
Buenas tardes,
He llegado a este artículo porque llevo buscando unos dias un visor de Java para ver esféricas.
No tengo ni idea de ningún lenguaje de programación y he seguido tu artículo al pie de la letra y no consigo ver de ese modo una esférica que he hecho.
Tengo en una carpeta los dos archivos que comentas, la foto esférica y un HTML con el código que pones.
No se si me puedes echar una mano. Hago doble click en el HTML y se me queda la pantalla de Chrome en blanco. Lo siento pero no te puedo dar mas pistas porque no me sale ningún error ni nada.
Un saludo y gracias.
Buen día, la imagen debe ser tomada directamente con la aplicación Google Photosphere que viene directamente en la app fotos de Android, debido a que el script three.js lee datos directo de la imagen así es como realiza el render, si tu imagen es generada por algún programa como photoshop u otro quizá por eso no funciona, o posiblemente por que estas corriendo el archivo HTML desde tu PC y no desde un servidor .
Quiza te pueda servir algún plugin de estos -> http://www.sitepoint.com/10-jquery-panorama-image-display-plugins/
Te comparto la carpeta del ejemplo con las imagenes que use http://maquetando.com/ejemplos/photos.zip
Saludos.
Muchas gracias por tu respuesta Dan lel.
Las fotos esfericas las hago con una dslr y las uno con Hugin.
Por otro lado mi objetivo en principio es poder ver las esfericas desde mi ordenador para comprobar que estan bien y luego pasarselas mis clientes para que las puedan integrar en su web y no tener que depender de Google para verlas.
No se si me puedes echar una mano o indicarme algun tutorial que me pueda aclar las cosas. Ya te digo que no tengo ni idea de ningun lenguaje de programacion.
Un saludo y muchas gracias de nuevo.