March 1, 2010

Zoom XXL avec Microsoft Seadragon & Deep Zoom

Posted by

Nicolas Fabre

Pour réaliser des Zoom XXL nous utilisions la techno Seadragon et Deep Zoom de Microsoft.
Deep Zoom permettent de zoomer presque arbitrairement dans des grandes images de manière performante via la techno Silverlight. Mais vu que le taux de pénétration de Silverlight qui n’est pas très élevé, il existe un portage officiel Ajax et un portage Flex (moins officiel).

Deep Zoom, ou d’ailleurs toute autre technologie, tels que Google Maps, ViaMichelin etc, utilise ce qu’on appelle une pyramide d’image qui offre l’affichage de grandes images de manière efficace.

pyramide d’image

La photo ci-dessus illustre la présentation de l’image  en forme d’une pyramide. L’image est  stockée dans toute taille dans de nombreuses résolutions différentes, ainsi que ces différentes résolutions tranchées dans de nombreuses régions, à savoir les tuiles.

Vu que l’image originale  est stockée dans différentes résolutions, on peut afficher la résolution qui est le plus proche de celle dont nous avons besoin et dans un cas où l’ensemble de l’image ne s’adapte à l’écran, seules les parties de l’image (tuiles), qui sont effectivement visibles. Le réglage de notre pyramide, tels que le nombre de niveaux et de tuile de taille nous permet de contrôler le transfert de données.

L’image pyramidale est évidemment plus lourde que la taille du fichier image originale. Mais comme vous le voyez sur l’illustration ci-dessous, en ce qui concerne la bande passante, la pyramide est beaucoup plus efficace pour l’affichage haute résolution, car la plupart des parties de l’image ne sont généralement pas visibles de toute façon.

Cadre

Comme vous pouvez le voir sur la photo ci-dessus, il y a encore plus de données chargées que nécessaire pour afficher tout ce qui est visible sur l’écran. C’est là que les paramètres  de l’image de la pyramide entrent en jeu: la taille des carreaux et le nombre de niveaux permet de déterminer la relation entre la quantité d’espace de stockage, le nombre de connexions réseau et de la bande passante requise pour l’affichage des images en haute résolution.

Pour construire la pyramide d’images Microsoft propose le logiciel gratuit Deep Zoom Composer. Il met aussi à disposition une DLL pour faire des scripts en .NET.

OpenZoom est alternative Open Source qui offre la possibilité de créer des pyramide d’images via d’autres librairies que celles proposées par Microsoft.
Il existe des partages Python, Ruby, Java et PHP… La dernière étant développée par mes soins (Une version PHP5.3 devrait prochainement arriver).

oblab

Bonjour,

Pourriez-vous nous en dire plus concernant l’utilisation des deepzoom tools (python, ruby, java…), un petit comparatif en somme bien : quelle sont les différences, la simplicité de mise en place.
SUr le partage en PHP que vous développez, serait-il possible d’avoir un exemple de mise en application ?

Merci