Logo GNT
Actualités Tests & Guides Bons Plans
Twitter iPhone pliant OnePlus 11 PS5 Disney+ Orange Livebox Windows 11
Entraide Média Photo Discussions Générales Présentation d'images en très grande résolution

Présentation d'images en très grande résolution

11 réponses
Avatar
Stephan Peccini
Bonjour,

Pour pr=E9senter mes grands panoramas en r=E9solution maximale (=E0 la mode=
Google Earth), j'utilisais les services de zoom.it de Microsoft. Depuis qu=
elques temps, ce service ne permet plus de soumettre de nouvelles demandes.

Je me suis donc retourn=E9 vers la solution openseadragon (ouverture du cod=
e de zoom.it) pour la partie pr=E9sentation et vips pour cr=E9er les tuiles=
n=E9cessaires =E0 la pr=E9sentation. Il faut un peu plus de manipulations =
que pour zoom.it mais c'est relativement simple et surtout on a la main sur=
la pr=E9sentation.

Openseadragon : https://openseadragon.github.io/
vips : http://www.vips.ecs.soton.ac.uk/index.php?title=3DVIPS

D=E9j=E0 le r=E9sultat :
http://grandspanoramas.peccini.fr/Haut-Atlas%202014/DSC_3064-DSC_3071.html
Vous pouvez zoomer dans l'image ou vous y d=E9placer avec la molette et la =
souris.

Comment obtenir le r=E9sultat ?

La premi=E8re chose =E0 faire est de transformer votre image en haute r=E9s=
olution vers un ensemble de fichiers permettant de proposer l'effet de zoom=
.
Il existe plusieurs solutions pour y arriver (https://openseadragon.github.=
io/examples/creating-zooming-images/) et j'ai choisi vips pour sa tr=E8s gr=
ande rapidit=E9 : quelques secondes pour une image d'origine en 200 Mpixels=
.

Sous linux (sous Windows, c'est aussi simple), je lance la commande :
vips dzsave DSC_3064-DSC_3071.JPG dz
Elle me g=E9n=E8re un r=E9pertoire DSC_3064-DSC_3071 avec toutes les tuiles=
de diverses dimensions et un fichier xml de description DSC_3064-DSC_3071.=
dzi.

Il faut ensuite pr=E9parer le serveur Web sur lequel vous allez d=E9poser v=
os images.

Pour cela il faut r=E9cup=E9rer le moteur openseadragon :
https://openseadragon.github.io/#download
et l'installer sur votre serveur :
https://openseadragon.github.io/docs/
Cela n'est =E0 faire qu'une fois, bien =E9videmment.

On pr=E9pare ensuite le fichier html de pr=E9sentation ; pour l'exemple que=
je pr=E9sente, il contient :

<html lang=3D"fr">
<head>
<meta charset=3D"utf-8">
<link rel=3D"shortcut icon" type=3D"image/png" href=3D"favicon.png" />
<title>Maroc - La grande travers=E9e du Haut-Atlas - Juillet 2014 - aut=
our d'Iskataffen</title>
</head>

<body background=3D"grey">

<div id=3D"openseadragon1"></div>
<script src=3D"../openseadragon/openseadragon.min.js"></script>

<script type=3D"text/javascript">
var viewer =3D OpenSeadragon({
id: "openseadragon1",
prefixUrl: "../openseadragon/images/",
tileSources: "DSC_3064-DSC_3071.dzi",
navigatorSizeRatio: 1
});
</script>

</body>

Vous d=E9posez alors votre fichier html sur votre serveur Web avec le fichi=
er dzi et le r=E9pertoire associ=E9. Dans mon exemple j'ai donc =E0 la fin =
:

Racine du site
|____openseadragon
|____Haut-Atlas 2014
|____DSC_3064-DSC_3071.html <=3D=3D mon fichier de pr=E9sentation
|____DSC_3064-DSC_3071.dzi <=3D=3D mon fichier de description des tu=
iles
|____DSC_3064-DSC_3071 <=3D=3D le r=E9pertoire avec les tuiles

C'est fini.
Signaler un problème avec ce contenu

10 réponses

Supprimer
Cette action est irreversible, confirmez la suppression du commentaire ?
Signaler le commentaire

Veuillez sélectionner un problème

Nudité
Violence
Harcèlement
Fraude
Vente illégale
Discours haineux
Terrorisme
Autre
1 2
Avatar
Pierre Maurette
Stephan Peccini :
Bonjour,


[trucs utiles]
C'est fini.



C'est *très* intéressant, lu en diagonale ça semble compact mais
complet.
J'aimerais bien le retrouver /un jour/. Peut-être pourriez-vous en
tirer une page de blog, à moins que ce ne soit déjà fait ?


PS: <URL: http://grandspanoramas.peccini.fr/&gt; ouvre sur la page de test
de l'Apache (de OVH j'imagine). Est-ce ce qui est souhaité ?

--
Pierre Maurette
Avatar
Zorglub
Le 18/12/2014 04:49, Stephan Peccini a écrit :
Déjà le résultat :
http://grandspanoramas.peccini.fr/Haut-Atlas%202014/DSC_3064-DSC_3071.html
Vous pouvez zoomer dans l'image ou vous y déplacer avec la molette et la souris.



quand on zoome c'est plus de la bouillie de pixels que de la haute
résolution
Avatar
Jacques
"Zorglub" a écrit dans le message de news:
549284b8$0$2134$
Le 18/12/2014 04:49, Stephan Peccini a écrit :
Déjà le résultat :
http://grandspanoramas.peccini.fr/Haut-Atlas%202014/DSC_3064-DSC_3071.html
Vous pouvez zoomer dans l'image ou vous y déplacer avec la molette et la
souris.



quand on zoome c'est plus de la bouillie de pixels que de la haute
résolution



c'est du 1100X680 environ, c'est plus que limite pour du HD,
effectivement ...........
Avatar
Stephan Peccini
Le jeudi 18 décembre 2014 05:31:40 UTC+1, Pierre Maurette a écrit :

PS: <URL: http://grandspanoramas.peccini.fr/&gt; ouvre sur la page de test
de l'Apache (de OVH j'imagine). Est-ce ce qui est souhaité ?



Je n'ai pas encore géré cette partie. Je vais sûrement en profiter po ur y déposer l'explication que je donne dans ce forum. Cela complétera bien.

Merci pour le retour
Avatar
Den
Jacques wrote:
"Zorglub" a écrit dans le message de news:
549284b8$0$2134$
Le 18/12/2014 04:49, Stephan Peccini a écrit :
Déjà le résultat :
http://grandspanoramas.peccini.fr/Haut-Atlas%202014/DSC_3064-DSC_3071.html

Vous pouvez zoomer dans l'image ou vous y déplacer avec la molette et
la souris.



quand on zoome c'est plus de la bouillie de pixels que de la haute
résolution



c'est du 1100X680 environ, c'est plus que limite pour du HD,
effectivement ...........




Bonjour,
une fois de plus, on voit que l'offre crée la demande. Sur le fond, ça
me fait penser à NCIS : faudrait faire un essai avec une photo prise du
haut de la tour Eiffel.
Den
Avatar
GhostRaider
Le 18/12/2014 04:49, Stephan Peccini a écrit :
Bonjour,

Pour présenter mes grands panoramas en résolution maximale (à la mode Google Earth), j'utilisais les services de zoom.it de Microsoft. Depuis quelques temps, ce service ne permet plus de soumettre de nouvelles demandes.

Je me suis donc retourné vers la solution openseadragon (ouverture du code de zoom.it) pour la partie présentation et vips pour créer les tuiles nécessaires à la présentation. Il faut un peu plus de manipulations que pour zoom.it mais c'est relativement simple et surtout on a la main sur la présentation.


....
C'est fini.



Merci.
Ce qui compte, ce n'est pas la définition de l'exemple, c'est la
méthode, parfaitement expliquée.
Avatar
Solanar
Stephan Peccini avait soumis l'idée :
Bonjour,

Pour présenter mes grands panoramas en résolution maximale (à la mode Google
Earth), j'utilisais les services de zoom.it de Microsoft. Depuis quelques
temps, ce service ne permet plus de soumettre de nouvelles demandes.

Je me suis donc retourné vers la solution openseadragon (ouverture du code de
zoom.it) pour la partie présentation et vips pour créer les tuiles
nécessaires à la présentation. Il faut un peu plus de manipulations que pour
zoom.it mais c'est relativement simple et surtout on a la main sur la
présentation.

Openseadragon : https://openseadragon.github.io/
vips : http://www.vips.ecs.soton.ac.uk/index.php?title=VIPS

Déjà le résultat :
http://grandspanoramas.peccini.fr/Haut-Atlas%202014/DSC_3064-DSC_3071.html
Vous pouvez zoomer dans l'image ou vous y déplacer avec la molette et la
souris.

Comment obtenir le résultat ?

La première chose à faire est de transformer votre image en haute résolution
vers un ensemble de fichiers permettant de proposer l'effet de zoom. Il
existe plusieurs solutions pour y arriver
(https://openseadragon.github.io/examples/creating-zooming-images/) et j'ai
choisi vips pour sa très grande rapidité : quelques secondes pour une image
d'origine en 200 Mpixels.

Sous linux (sous Windows, c'est aussi simple), je lance la commande :
vips dzsave DSC_3064-DSC_3071.JPG dz
Elle me génère un répertoire DSC_3064-DSC_3071 avec toutes les tuiles de
diverses dimensions et un fichier xml de description DSC_3064-DSC_3071.dzi.

Il faut ensuite préparer le serveur Web sur lequel vous allez déposer vos
images.

Pour cela il faut récupérer le moteur openseadragon :
https://openseadragon.github.io/#download
et l'installer sur votre serveur :
https://openseadragon.github.io/docs/
Cela n'est à faire qu'une fois, bien évidemment.

On prépare ensuite le fichier html de présentation ; pour l'exemple que je
présente, il contient :

<html lang="fr">
<head>
<meta charset="utf-8">
<link rel="shortcut icon" type="image/png" href="favicon.png" />
<title>Maroc - La grande traversée du Haut-Atlas - Juillet 2014 - autour
d'Iskataffen</title> </head>

<body background="grey">

<div id="openseadragon1"></div>
<script src="../openseadragon/openseadragon.min.js"></script>

<script type="text/javascript">
var viewer = OpenSeadragon({
id: "openseadragon1",
prefixUrl: "../openseadragon/images/",
tileSources: "DSC_3064-DSC_3071.dzi",
navigatorSizeRatio: 1
});
</script>

</body>

Vous déposez alors votre fichier html sur votre serveur Web avec le fichier
dzi et le répertoire associé. Dans mon exemple j'ai donc à la fin :

Racine du site
|____openseadragon
|____Haut-Atlas 2014
|____DSC_3064-DSC_3071.html <== mon fichier de présentation
|____DSC_3064-DSC_3071.dzi <== mon fichier de description des tuiles
|____DSC_3064-DSC_3071 <== le répertoire avec les tuiles

C'est fini.



Parfait, j'avais un autre systeme du même genre mais le tien semble
mieux, plus intuitif
je vais essayer
Moi, c'etait, ça:
http://www.jpzero.com/zoom/voirbihit.htm
http://www.jpzero.com/zoom/voirepeire.htm

--
Etre libre, c'est n'avoir rien à perdre
Avatar
Den
GhostRaider wrote:

Merci.
Ce qui compte, ce n'est pas la définition de l'exemple, c'est la
méthode, parfaitement expliquée.




+1, Den
Avatar
GG
Den a écrit :
GhostRaider wrote:

Merci.
Ce qui compte, ce n'est pas la définition de l'exemple, c'est la méthode,
parfaitement expliquée.




+1, Den



+1
Merci.

--
Cordialement.
GG.
Avatar
benoit
Stephan Peccini wrote:

Bonjour,

Pour présenter mes grands panoramas en résolution maximale (à la mode
Google Earth), j'utilisais les services de zoom.it de Microsoft. Depuis
quelques temps, ce service ne permet plus de soumettre de nouvelles
demandes.
[...]
C'est fini.



Bravo, merci
+1

--
"La théorie, c'est quand on sait tout et que rien ne fonctionne. La
pratique, c'est quand tout fonctionne et que personne ne sait pourquoi.
Ici, nous avons réuni théorie et pratique : Rien ne fonctionne... et
personne ne sait pourquoi !" [ Albert Einstein ]
1 2