Cómo hacer panorámicas (II) en castellano
En una entrada que escribí en su día sobre este tema, en asturiano, un visitante me pidió que lo tradujese. Aquí va la traducción. Aparte del lenguaje, puede que no se entienda, ni siquiera en español, lo que quiero decir :-) así que también me ofrezco a aclarar lo que buenamente pueda de los detalles técnicos.
Voy a retomar el tema de las visitas virtuales. Hace ya tiempo que escribí cómo se podían hacer fotos panorámicas sin una cámara adecuada para ello, y ahora voy a contar cómo se puede poner en la red una visita virtual en 360º.
Para esto conviene usar un trípode, porque las fotos tienen que estar, en la medida de lo posible, bien hechas. Pones el trípode en el centro de la sala o paisaje, y pones la cámara bien horizontal (mi trípode es de los baratos, pero tiene un nivel de burbuja para ello). Entonces empiezas a sacar fotos para una panorámica como dijimos en el otro artículo, pero teniendo en cuenta dos cosas: una, que para girar la cámara aprovechamos el trípode, malteniendo perfectamente la horizontal. Dos, que vamos a hacer fotos hasta que demos la vuelta entera, haciendo una últimaa foto que sea casi igual que la primera. Depende de la cámara y de otros mil factores y como no entiendo mucho no puedo dar reglas, pero como ejemplo y para hacerse una idea, yo con una Lumix creo que hacía unas 20 fotos para dar una vuelta entera.
Con eso tenemos un "cinturón" horizontal de todo el paisaje. Cuidado si estamos en una habitación y hay cristales o espejos, porque saldremos nosotros en la foto; en ese caso, hay que usar el temporizador de la cámara, y después de darle al botón esconderse o apartarse para no salir reflejados.
Hecho esto, podemos sacar también un poco más arriba o más abajo de la horizontal, si queremos, Yo apunto la cámara un poquito hacia abajo, de manera que, como siempre, del orden del 40% de la parte de arriba de la foto esté repetida respecto a la parte de abajo de las de antes. Y otra vez lo mismo: una vuelta entera haciendo fotos. Y otra vez también apuntando un poco hacia arriba. Yo lo hacía así: el centro, abajo y arriba.
Una vez tienes todas las fotos, que en mi caso eran del orden de 60, se las metes al programa que las une, en mi caso el ICE (ver artículo anterior), y él va a hacer una foto como esta, por ejemplo. Esto es el salón de mi casa: ahí se ve que en la foto está "todo el salón" metido en un plano:
Esa foto se puede reducir de tamaño, o lo que uno quiera. Pero ahora sólo falta meterla en una página web, de manera que se pueda manipular con el ratón.
En este caso usaremos una tecnología que se llama "applet". Es un programa que se puede ejecutar dentro de una página (en un rectángulo de la misma, como si fuera una foto normal pero "viva"); cuando la abres en el navegador, este carga el programa, y lo ejecuta. El programa es sensible al ratónn y las teclas, así que el usuario puede manipular esa "foto". Y el applet que vamos a usar se llama PTViewer. Coges el fichero .zip, lo deescomprimes, y coges el ptviewer.jar y lo pones al lado de la página web donde quieres poner la visita, donde te parezca. Supongamos que tu página está en el directorio "/paginas" y que el .jar lo pones en el directorio "/paginas/visor", por ejemplo.
Entonces, en el código fuente de la página pones algo así:
<applet archive="visor/ptviewer.jar" code="ptviewer" width="400" height="300">
<param name="file" value="MiSalon.jpg">
<param name="quality" value="3">
<param name="auto" value="0.2">
<param name="bgcolor" value="ebebeb">
Mi salón
</applet>
Ahí se ve que lo que se hace es cargar el "ptviewer.jar" y pasarle algunos parámetros. Algunos van en la misma etiqueta "applet", y otros van aparte en etiquetas "param". El "width" y el "height" están en pixels, y son el ancho y alto del rectángulo donde queremos que se vea el salón. El otro parámetro importante es "file", que es la foto que montamos y puse más arriba.
Con eso (y si la página la ves con un navegador mínimamente moderno) ya se ve una foto del salón, que da vueltas sola. Si se quiere, se puede pinchar en la foto y arrastrar, con lo que deja de dar vueltas y lo mueves tú para donde quieras (para los lados y para arriba y abajo, hasta donde te deje, según las fotos que hayas hecho). Y si das "+" te acercas, y con "-" te alejas.
Poniendo cosas en los parámetros se puede hacer más virguerías, como poner "hotspots" en las fotos (o sea, explicaciones de algún punto de la foto), o enlazar una foto con otra página, con lo que puedes hacer una visita virtual entera (enganchando, por ejemplo, la puerta del salón a la habitación de al lado). Si buscas PTViewer por la red, hay montones de ejemplos.
6 comentarios:
muchísimas gracias.
Lo mismo digo yo: muchas gracias, aunque me queda la espinita de no poder ver la imagen del applet.
He probado desde dos ordenadores distintos y navegadores distintos, pero si nadie más se queja supongo que será problema de esos dos ordenadores...
Yo tampoco la veo...
Pues es verdad que no se ve :-( pero hay que tener en cuenta que esto lo estoy poniendo en el sitio de Blogspot, sobre el que tengo un control más que relativo. Por ejemplo, no puedo poner el applet en el propio servidor, tengo que enlazarlo a otro sitio... Y la imagen también tiene sus pegas.
Esas instrucciones coinciden (salvo error u omisión) con lo que he hecho yo en mi propio PC y sí funciona. De todos modos, si queréis ver esa misma imagen en su sitio original usada como visita virtual, podéis ir aquí. Si elegís la opción "Ver/Código fuente" del navegador, y buscáis "ptviewer" por el código, veréis el código que está funcionando en ese sitio, y que es muy parecido al que yo puse aquí...
guti acabo de seguir todos los pasos y como no me deja subirlo a mi hosting (porque es gratuito y no admite una foto tan grande) me he puesto a probarlo en el ordenador y me pasa lo mismo que en el blog..
¿En el ordenador no se puede probar sin tener que subirlo?
¡Sí!, sí que se puede probar en el propio ordenador, y de hecho suele ser más fácil hacer que funcione en local que subiéndolo a un hosting :-) Yo primero hice todas las pruebas en local, y luego ya vino el follón de subirlo a un sitio y a otro.
Si quieres, prueba a pegar aquí el cacho de código en cuestión a ver si se nos ocurre algo de por qué no funciona, aunque como el Blogger maneja etiquetas HTML, igual conviene que antes de pegarlo aquí sustituyas todos los < por [ y todos los > por ] o algo así, para que no queden etiquetas invisibles.
Publicar un comentario