Publica en tu web foto panoramas esféricos de google

Diseño Web, Html, Salamanca, android Dejar un comentario

Si tienes un dispositivo Android 4.2 con cámara, es posible que te ofrezca la opción de realizar fotos panorámicas esféricas de 360º. Una herramienta muy fácil de manejar, identificada por un logotipo característico.

google photo spheres

El proceso de creación es laborioso, pero sencillo, gracias al asistente que nos va indicando por donde debemos movernos para realizar todas las fotos que formaran el panorama esférico de 360º.

google photo spheres

Con el asistente solo hay que girar sobre uno mismo, sin moverse del sitio, para completar todas las fotos que formarán el panorama 360º, un punto azul nos indica la zona pendiente por fotografiar y al colocarnos encima enfocará y realizara la fotografía automáticamente.

google photo spheres

Siempre me ha parecido una herramienta fantástica, que permite llevar la información a otro nivel en la web, solo faltaba la API de Google para poder embeber estos trabajos en la web y ahora ya la ha puesto a disposición de los desarrolladores.

En este ejemplo puedes ver la Plaza Mayor de Salamanca:

El código de la API ofrece la llamada al javascript (plusone.js), la configuración de los parametros del foto panorama esferico 360 (g:panoembed …) donde puedes introducir la url de la imagen (que debe subirse a picasa o a tu google+), el tamaño en pantalla y la opción de autorotar. Las opciones fullsize, croppedsize y offset son METAetiquetas de la imagen, que se pueden obtener desde un programa de diseño gráfico.

google photo spheres

En el ejemplo he editado la imagen (para poner la marca de opcionweb) y la he subido reduciendo su peso a mi google+. Desde el perfil no la reconoce como foto panorama y he cambiado muchos de los parámetros y opciones aconsejadas en el html, como poner todo el código en el body del html o cambiar los valores de las MetaEtiquetas por (0,0) y el visor web de google sigue mostrando el foto panorama 360 embebida en la web correctamente.

Puedes ver el ejemplo a pantalla completa y analizar el código utilizado.

Si te gusto el post, vótalo, difúndelo en tus redes sociales, agregadores de noticias y foros. Si te animas a probarlo, comenta aquí tu experiencia o tus dudas.

Blog Widget by LinkWithin
¿Te gustó?, VOTA el post. SÍGUEME por Twitter, Facebook o RSS.

Sigue leyendo:

Un Trackback

2 Comentarios

  1. Gravatar 3 julio 2013, 15:16
    Tammie: Reply to this comment

    Guardado en mi marcador!, Me gusta tu web

  2. Gravatar 8 julio 2013, 12:24
    Pancho opcionweb: Reply to this comment

    Muchas gracias Tammie. Me has alegrado el día.
    Un saludo.

Escribe tu comentario o... ¡salta!

Etiquetas XHTML permitidas: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>


Entradas RSS Comentarios RSS Acceder Subir
twitter facebook Rss mail rssSígueme en Google Currents