GBIF Silvia Lusa Bernal [email protected] II Taller sobre imágenes digitales para estudios de biodiversidad Madrid, 14-16 de Abril de 2008 II TALLER SOBRE

GBIF

Silvia Lusa Bernal [email protected]

II Taller sobre imágenes digitales para estudios de biodiversidad

Madrid, 14-16 de Abril de 2008

II TALLER SOBRE IMÁGENES DIGITALES PARA ESTUDIOS DE

BIODIVERSIDAD

PUBLICACIÓN DE IMÁGENES DIGITALES DE BIODIVERSIDAD EN INTERNET

GBIF




• Qué es un servidor de imágenes

• Servidores de imágenes: eREZ, IIPimage

• Modelos de trabajo propuestos

• Trabajo con repositorio de imágenes y visor zoomyfier EZ– Caso Práctico I.

Publicación de imágenes en nuestra web con repositorio y visor zoomyfier eZ

• Trabajo con un servidor de imágenes (eRez)

– Caso PrácticoII. • Notas de instalación y config de eRez• Usuarios, roles, carpetas• Carga de imágenes, visualización, metadatos y búsquedas• Descarga de imágenes

– Caso Práctico III.Publicación de imágenes en nuestra web con servidor de imágenes eRez y visor FSI

viewer


GBIF




• Software especializado en servir imágenes. Usados como complementos de servidores web

• Almacenamiento de una imagen y generación dinámica de x formatos (tamaños/calidades)

• Optimizan el tráfico cliente servidor con respecto al ancho de banda y gestionan con gran eficiencia la memoria del servidor

• Suelen además ofrecer herramientas para la navegación remota sobre imágenes de gran calidad y detalle (cliente solo accede a la porción solicitada) (mega y gigapixel size)

• Pueden ofrecer una serie de procesos extra en el manejo de esas imágenes: gestión de metadatos, ajustes de color, etc

• Otras posibles ventajas:• Ajuste dinámico del tamaño de imagen - resolución del navegador • Formatos de imagen dinámico - tipo/versión del navegador


Qué es un Servidor de imágenes

GBIF




• Arquitectura cliente-servidor e interacción del cliente a través API’s públicas (peticiones al servidor)

• Basados en el protocolo Internet Imaging Protocol (IIP) diseñado por International Imaging Industry Association (I3A) (supervisa además estándares como JPEG 2000)

• Sobre HTTP para comunicar imágenes y sus metadatos

• Trabaja sobre las múltiples posibilidades que los formatos TIFF pyramidal y FlashPix ofrecen

• Actualmente version 1.05.

• Especificaciones: http://www.graphcomp.com/info/specs/livepicture/iip_10.pdf#search=%22Internet%20Imaging%20Protocol%22


[Qué es un Servidor de imágenes]

GBIF




• Formatos base: TIFF (tiled) pyramidal y FlashPix

• Son formatos multi-resolución, contienen datos de la imagen para múltiples resoluciones

• Ofrecen la posibilidad de leer porciones de la imagen en distintos niveles de resolución a gran velocidad

• TIFF es un estándar abierto y FlashPix es un estándar creado por KODAK, HP y Microsoft.

• TIFF pyramidal además soporta los espacios de color de CMYK y ciLAB así como 16-bit por canal de datos, perfiles ICC embebidos, transparencia, capas de Photoshop, metadatos EXIF


[Qué es un Servidor de imágenes]

GBIF




IIPimage server

• http://iipimage.sourceforge.net/ OpenSource

• Cliente-servidor• Servidor escrito en C++• Cliente: AJAX, JAVA applet, links embebidos para generación de JPEG

• Formato base TIFF pyramidal (necesaria conversión)

• Formato generado JPEG

[Procesadores de imágenes ]• Para creación, edición y composición de imágenes• Aconsejados para conversion a TIFF pyramidal (necesario con IIPimage):

• VIPS image processing suite http://vips.sourceforge.net• ImageMagick http://www.imagemagick.net/script/index.php

• Software (JMagick, IMagick, PythonMagick) ó desde la línea de comandos • Creación, modificación, conversión de imágenes de forma dinámica y posibilidad de

automatizado


Servidores de imágenes: eREZ, IIPimage

GBIF




eRez

• http://www.yawah.com/products/erez.html (Requiere licencia)

• Escrito en Java

• Concepto single source dynamic imaging

• Generación automática de imágenes

• Organización de imágenes, gestión de usuarios y de directorios compartidos

• FSI Viewer como visor de imágenes de alta resolución

• Gestión de metadatos asociados (IPTC y EXIFF)

• Interfaz de búsqueda basada en metadatos

• Formato base TIFF pyramidal, FlashPix o PSD

• Carga de imágenes en diferentes formatos: JPEG, EPS, GIF PDF, AI, SVG y CAD y otros implementando plug-ins. También .zip

• Descarga de:JPEG, GIF, PNG, Flash, PDF y TIFFa través de http requests



GBIF




Otros servidores de imágenes:

• iSeeMedia: http://www.iseemedia.com/main/products/is_overview

• MediaRich Server: http://www.equilibrium.com/Internet/Equil/Products/MediaRich/Product+Tour/index.htm

• Adobe Scene 7: http://www.scene7.com/ (antes TrueSpectra)



GBIF




Estudio y análisis de las necesidades del proyecto. A evaluar entre otros:

• Arquitectura del proyecto

• Operaciones necesarias a realizar sobres las imágenes y estado de las imágenes originales (nivel de procesamiento)

• Presupuesto disponible (software open source/pago)

• Espacio físico disponible

• Cualificación técnica de personal (para manejo de software de imágenes y desarrollo de scripts y/o uso e integración de cliente en nuestro sitio web)

Ejemplos de implementaciones:http://florabrasiliensis.cria.org.br/project

http://ww2.bgbm.org/Herbarium/default.cfm


Modelos de trabajo propuestos

GBIF




Modelo I.

Base de datos (datos biodiversidad:taxonómicos, nomenclaturales, especimenes/observaciones, especies etc)

+

Base de datos con metadatos de imágenes

+

Repositorio de imágenes

+

Sitio web (Interacción con bases de datos + Visor para imágenes)



GBIF




Modelo II.


+

Servidor de imágenes (imágenes+metadatos)

+

Sitio web (Interacción con base de datos + Cliente servidor imágenes)



GBIF




Modelo III.


+Base de datos con metadatos de imágenes

+Repositorio de imágenes

+Procesadores de imágenes

+Sitio web (Interacción con base de datos + Desarrollo con API’s de

procesadores para generación automática de imágenes y automatizado de procesos)



GBIF




Visor de imágenes a utilizar en la práctica: http://www.zoomify.com/

Zoomify es un visor para publicación de imágenes digitales de gran calidad• web sites, CDs, or DVDs interactivos• zoom y desplazamiento por las imágenes• Multiplataforma

• Windows• MacOS• Linux (http://sourceforge.net/projects/zoomifyimage/)

Versión gratuita: ZOOMIFYER EZ (http://www.zoomify.com/express.htm)• Contiene: Convertidor + Visor


Trabajo con repositorio de imágenes y visor zoomyfier EZCaso Práctico I.

GBIF




Necesitamos:

• Imágenes para ser procesadas (JPEG, BMP ó GIF)Las que el alumno traiga de su institución

• Servidor web + sitio web con visor (.swf) incorporadoInstalado en cada equipo : http://localhost

• Repositorio de imágenes: En cada equipo:$pathtoWebServer\htdocs\img_visor

• Navegador con flash incorporado: IExplorer,Firefox,etc + Flash Player v6 o superior


[Trabajo con repositorio de imágenes y visor zoomyfier EZCaso Práctico I. ]

GBIF




1. Acceder a http://www.zoomify.com/downloads/products/shipping/zEZV3-Win.zip y copiar Zoomyfer EZ en nuestro equipo (archivo zEZV3-Win.zip)

2. Descompirmir el .zip anterior en nuestro equipo

3. Ir al directorio donde se encuentran los archivos descomprimidos y ejecutar el convertidor: Zoomifyer EZ v3.0.exe

Seleccionar una de las imágenes a publicar en nuestra web (de nuestro directorio con imágenes digitales). [Formatos válidos: JPEG,GIF ó BMP]

4. Pulsar aceptar. El programa procesará la imagen y como resultado nos creará un directorio con el mismo nombre de la imagen original con una serie de archivos.



GBIF




5. Ejecutar el convertidor para todas las imágenes. Los directorios secrearán en el mismo directorio de donde seleccionamos las imágenes

6. Copiar los directorios creados por el convertidor de Zoomyfer Ez en nuestro repositorio de imágenes: :$pathtoWebServer\htdocs\img_visor

7. Para visualizar nuestras imágenes, acceder a la url: http://localhost Opción 2. Acceso a: repositorio y visor zoomyfier-EZ

Hacer click sobre uno de los nombres que aparecen en el listado de imágenes delos alumnos usar las herramientas de Visor.

[Este es nuestro servidor web (apache+php) donde hemos integradopreviamente el Visor (zoomifyViewer.swf)]

Visor.php <OBJECT CLASSID="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" CODEBASE="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0" WIDTH="750" HEIGHT="450" ID="theMovie">

<PARAM NAME="FlashVars" VALUE="zoomifyImagePath=../img_visor/<?php echo $archivo?>"> <PARAM NAME="MENU" VALUE="FALSE">

<PARAM NAME="SRC" VALUE="zoomifyViewer.swf"> <EMBED FlashVars="zoomifyImagePath=../img_visor/<?php echo $archivo?>" SRC="zoomifyViewer.swf" MENU="false" PLUGINSPAGE="http://www.macromedia.com/shockwave/download/index.cgi?

P1_Prod_Version=ShockwaveFlash" WIDTH="750" HEIGHT="450" NAME="theMovie"></EMBED> </OBJECT>



GBIF




II.A.Servidor e-Rez. *Notas1 y 2 Consola de administración. Creación de usuarios, asignación de roles y creación

configuración de carpetas compartidas [A realizar en el equipo de un alumno por cada fila de mesas] y Acceso web administración a e-Rez de pruebas:

http://161.111.171.216:8080/erez4admin/

1. Creación de usuario y asignación de rolMenú izquierdo, UsersNew userLogin (fila1, fila2,…)Password (fila1, fila2,…)Roles: taller (seleccionarlo con el ratón)

Guardar los cambios


Trabajo con un servidor de imágenes (eRez). Caso Práctico II.

GBIF




(II.A)

3. Creación de carpeta compartida y configuraciónMenú izquierdo, Shared FoldersNew shareName (carpetafila1,carpetafila2,…Path (carpetafila1,carpetafila2,…)Asignar permisos de lectura y listado a todos y los demás permisos solo al rol “taller”

Activar “Monitor files”



GBIF




II.B.Servidor e-Rez.Interfaz de usuario. Manejo por los usuarios del servidor. Carga de imágenes, visualización, edición de metadatos y búsqueda

Entrar en: http://161.111.171.216:8080/erez4/Ir a “Start using e-Rez”Logarse con el usuario creado para la fila correspondienteAcceder a través del menú de la izquierda a la carpeta ImagenesSilvia y comprobar que se pueden listar pero no descargar las imágenes ni cargar (upload)

1. Carga de imágenes: *Notas3

Acceder a la carpeta compartida creada para nuestra fila (carpetafila1, carpetafila2,…) Click en “UPLOAD” ó bien en el icono

y subir nuestras imágenes (de 5 en 5 ó en un .zip) Asignar al conjunto los metadatos de “Caption” y “Keywords”Click en “Send Files”



GBIF




(II.B)

2. Visualización de imágenes: Una vez subidas las imágenes, seleccionar del árbol-menú de la izquierda cualquiera de las carpetas creadas en el taller, para visualizar las imágenes tenemos diferentes opciones: -Pase de diapositivas: pulsar “SLIDESHOW” en el menú de la barra superior o bien el icono:

- Listado: pulsar “LIST”Y controlar el tamaño del listado con los botones de la parte inferior derecha

-Para visualizar una imagen con el visor FSI-Viewercomo vista previaseleccionar una de las imágenes pasando así al modo“FILE” de nuestro menú superior.



GBIF




(II.B)

3. Visualización y edición de los metadatos *Notas4

- En la vista de listado, seleccionamos alguna de nuestras imágenes de la carpeta correspondiente. Aquí visualizamos los metadatos de la imagen, los creados al cargar la imagen (correspondientes a datos tomados por la cámara) y a los dados al cargar las imágenes al servidor

- Volver a la vista de listado y seleccionar una de nuestras imágenes, después, hacer click en “EDIT FILE”Después click en el menú superior opción “SELECTION” y después en “EDIT”- Personalizar los metadatos (Title, Author, Caption, keywords,…) y utilizar alguno de los suplementarios (Custom Field

01:) para dar datos sobre el origen de la fotoGuardar los cambios

- Para incluir los mismos metadatos (Orientación,IPTC y 3D)en varias imágenes, en la vista de listado, seleccionamos las imágenes a editar

hacemos click en el menú superior opción “SELECTION” y después en “EDIT”.



GBIF




(II.B)

4. Búsqueda de imágenes según metadatos *Notas5

Utilizar la caja de texto del menú de la izquierda para buscar imágenes.

Hacer alguna búsqueda avanzada



GBIF




II.C.Servidor e-Rez.Interfaz de usuario. Manejo por los usuarios del servidor. Descarga de imágenes en

distintos formatos

1.Descarga de imágenes *Notas6

- Ir a una de las capetas y seleccionar una de las imágenes, después hacer click en el menú superioropción “Download”

- Seleccionar 2 formatos a descargar de la lista depreconfigurados (uno de ellos pdf),



GBIF




(II.C)

- Comprobar nuestras lista de descargas en “Download Manager”

- Ir a Opciones avanzadas de descarga y seleccionar una de las plantillas para descargas

- Volver a “Download Manager” y descargar todos los archivos de nuestra lista y comprobar las imágenes descargadas



GBIF




Publicación de imágenes en nuestra web con servidor de imágenes eRez y visor FSI viewer

III.A. Generar códigos desde el servidor para su inserción de imágenes en nuestra web.

1. Abrir una ventana de nuestro navegador e ir a http://localhost

2. Escoger la opción 1. [ Acceso a : Integración de nuestra web con servidor de imágenes eRez y visor FSI viewer]

3. Ver las distintas formas y herramientas de visualización de imágenes generadas a partir del servidor a través de llamadas http

4. Editar la pagina “Servidor.php” del directorio htdocs de nuestro servidor web ($pathtoWebServer\htdocs\)

5. Localizar los bloques de código insertados:Desde <script type="text/javascript" src="http://161.111.171.204:8080/erez4/js/fsiwriter.js"></script>……..

hasta ……..</object></noscript>


Trabajo con un servidor de imágenes (eRez). Caso Práctico III.

GBIF




(III.A.)

6. Abrir en un navegador una instancia del eRez y logarnos7. Escoger nuestra carpeta, seleccionar una imagen y hacer click en “Publish to web” y seleccionar la

opción “Publish as FSI Viewer (Flash)”8. Suituir los códigos de eRez localizados anteriormente por el nuevo código que aparece en la caja de

texto

9. Hacer lo mismo para: -varias imágenes seleccionadas, código generado como “Slideshow”-la carpeta correspondiente a nuestra fila, como FSI Pages-para los resultados de una búsqueda, como FSI Showcase*Notas7



GBIF




III.B. Generar códigos como urls

1. Abrir en un navegador una instancia del eRez y logarnos

2. Escoger nuestra carpeta y seleccionar una imagen, anotar el nombre de la imagen

3. Construir una url como:http://161.111.171.216:8080/erez4/erez?src=carpetafila0/136_3633.tif&tmp=Largedonde sustituimos: nombre de la carpeta, nombre de la imagen

4. Probarla directamente en un navegador

5. Construir urls con distintos parámetrosPara añadir parámetros:

url “&”Nombreparametro=Valor Usar como guía el servidor, escogiendo una imagenPublish to webPublish as HTML Image,

fijándonos en el contenido que aparece en “Image URL” cada vez que variamos los parámetros



Documents

GBIF Silvia Lusa Bernal [email protected] II Taller sobre imágenes digitales para estudios de biodiversidad Madrid, 14-16 de Abril de 2008 II TALLER SOBRE