SPIP-Contrib

SPIP-Contrib

عربي | Deutsch | English | Español | français | italiano | Nederlands

288 Plugins, 197 contribs sur SPIP-Zone, 237 visiteurs en ce moment

Accueil > Affichage multimédia > Galeries et diaporamas > Panoramas 360° > Insérer des panoramas 360° dans les articles

Insérer des panoramas 360° dans les articles

22 septembre 2006 – par Arnault Pachot – 12 commentaires

Ceci est une ARCHIVE, peut-être périmée. Vérifiez bien les compatibilités !

Attention : cette contribution basée sur les filtres spip a été remplacée par une version plugin : Plugin Panoramas 360°

Présentation

Ce filtre pour Spip 1.9 et 1.9.1 permet d’afficher sous forme de panoramas interactifs les images insérées dans les articles dont le nom d’image contient "360". Exemple : Panorama-paris360degres.jpg
L’affichage est basé sur la librairie Cross Browser JavaScript Library X sous licence LGPL et ne nécessite pas de plugin Java, Quicktime ou Flash.

Pour voir en ligne à quoi ressemble ce filtre, rendez-vous à cette adresse.

contexte
Actuellement la majorité des visites virtuelles sont proposées sur le net avec des viewer sous Flash ou QuickTime. Les viewers libres sont écrits en Java et sont de moins en moins présents. En plus ils nécessitent d’utiliser le plugin Java de Sun qui n’est pas libre.
L’affichage sans plugin des visites virtuelles avec des viewers libres est un point important marqué contre les logiciels propriétaires. C’est également un combat sur lequel ils ne peuvent lutter puisque justement, toute leur stratégie commerciale est basée sur l’utilisation de plugins. N’hésitez donc pas à intégrer des vues panoramiques "sans plugin" dans vos articles !

Fonctionnalités

-  Affichage d’images panoramiques à 360 degrès sans plugin. Il suffit d’activer JavaScript.
-  Affichage animé : la rotation démarre automatiquement.
-  Affichage interactif : on peut utiliser les deux flèches gauche et droite pour changer le sens de rotation et s’arrêter.

Limitations actuelles

-  On ne peut insérer qu’un panorama par article maximum. (solution : écrire les n appels ’onload=’ dans body.html)
-  La largeur de la fenêtre de visualisation est positionnée arbitrairement au tiers de la largeur du panorama. Exemple : un panorama de 1190*150 pixels sera affiché dans une fenêtre de 396*150 pixels.
-  Si deux visiteurs du site tentent de visualiser en même temps deux articles différents comportant chacuns un panorama différent, il peut y avoir un problème d’affichage dû à une écriture et lecture simultanée dans les mêmes fichiers temporaires utilisés dans ce filtre.(solution : peut-on utiliser le répertoire CACHE de spip ?)

Fichiers requis

Décompressez l’archive fournie en pièce jointe.

Installation

  • copier les fichiers x.js, aller_gauche_15.gif (flèche gauche), aller_droite_15.gif (flèche droite), header.html et body.html dans le dossier squelette de votre site.
  • ajoutez le contenu du fichier téléchargé mes_fonctions.php (correspondant à votre version de SPIP : 1.9 ou 1.9.1) dans mes_fonctions.php, à la racine de votre site (ou copiez le tel quel si mes_fonctions.php à la racine de votre site n’existe pas).
  • Ensuite il vous faut ajouter :
    • la ligne <INCLURE{fond=header}> entre les balises <head> et </head> du fichier “article.html” de votre squelette.
    • la ligne <INCLURE{fond=body}> à l’intérieur de la balise <body> du fichier “article.html” de votre squelette. Ce qui donnera en général la ligne suivante : <body class="page_article" <INCLURE{fond=body}>>
    • la fonction panoramas dans le fichier “article.html” de votre squelette : (#TEXTE|panoramas). Ne pas utiliser en même temps qu’un filtre de type image_reduire.
    • en haut du fichier article.html mettre #CACHE{0}

Licence

Logiciel libre sous licence GNU/GPL.
Copyright 2006 Arnault Pachot - OpenStudio

Dernière modification de cette page le 3 août 2009

Retour en haut de la page

Vos commentaires

  • Le 6 avril 2008 à 22:59, par ludovic En réponse à : Insérer des panoramas 360° dans les articles

    Bonsoir,

    désolé pour cette question de novice, mais est-il indispensable de faire tout son site avec spip pour bénéficier de ce type d’utilitaire ?
    Je ne doute pas que Spip soit très bien mais je suis complètement débutant dans le domaine et j’avais déjà mis pas mal de temps à programmer une petit page en html pour visionner les photos d’un appartement. J’aurais aimé ne pas avoir à tout recommencer pour insérer juste un panorama interactif (en apprenant à faire fonctionner un nouveau logiciel).

    Répondre à ce message

  • Le 24 janvier 2007 à 19:05, par Arnault Pachot En réponse à : Panoramas 360° avec spip 1.9.1

    Voici une version qui tourne sous spip 1.9.1 :

    http://www.clefsdeforge.com/-L-Atelier-.html

    pour SPIP 1.9.1 il faut modifier légèrement le filtre utilisé dans mes_fonctions.php

    remplacer ligne 31

    $chaine_recherche = "/<img(\s+)src='(\S+)360(\S+)'(\s+)?width='(\S+)'(\s+)?height='(\S+)'(.*?)\/>/ims";

    par

    $chaine_recherche = "/<img(\s+)src='(\S+)360(\S+)'(\s+)?width=\"(\S+)\"(\s+)?height=\"(\S+)\"(.*?)\/>/ims";

    Répondre à ce message

  • Le 28 octobre 2006 à 21:16, par DJims En réponse à : Insérer des panoramas 360° dans les articles

    Bonjour,
    Cet article est TRES intéressant, je suis un Panoramiste invétéré...

    Mais en revanche je ne suis que Spipiste débutant, et j’ai galéré pour faire fonctionner ce filtre...
    Il faut donner un exemple précis de balise à insérer car il fonctionne au slash près...

    Pour les Néo-Spipistes (comme moi) voici un aperçu de ce qu’il faut taper dans la fenêtre texte de l’article :

    <#html><#img src=’IMG/jpg/ainsa_p_mayor360.jpg’ width=’1145’ height=’200’/>

    (retirer évidemment les ’#’ ils ne sont là que pour que ces balises HTML ne soient pas interprétées dans ce message... :-)

    REMARQUE : il faut impérativement mettre les attributs width et height et les placer dans cet ordre ainsi que le slash de fin de balise IMG, sinon ça ne marche pas !... (voir le filtre dans le fichier mes_fonctions.php)

    RE-REMARQUE : votre répertoire squelettes doit exister à la racine du site (et s’appeler obligatoirement comme ça) sinon ça ne marche pas non plus !

    RE-RE-REMARQUE : les fichiers body.html et header.html sont vides... Ne prenez pas peur, ils ne le resteront pas longtemps !...

    • Le 29 octobre 2006 à 13:14, par Arnault Pachot En réponse à : Insérer des panoramas 360° dans les articles

      Merci pour tes remarques, mais tu peux faire plus simple pour inserer le panorama dans l’article :

      -  ajoute l’image avec le menu « ajouter une image »,

      -  colle la balise Spip dans l’article, à l’endroit ou tu veux afficher le panorama, par exemple pour l’image numéro 5 :

      <img5|center>

    • Le 29 octobre 2006 à 23:55, par DJims En réponse à : Insérer des panoramas 360° dans les articles

      Ah oui !
      C’est pas intuitif... J’ai découvert ça aujourd’hui par hasard...
      Je n’avais trouvé cette information nulle part dans l’aide SPIP.
      En tout cas ça marche du tonnerre !
      Merci !

    • Le 22 novembre 2006 à 22:35, par vins En réponse à : Insérer des panoramas 360° dans les articles

      hé bien moi je suis un panoramiste débutant. J’ai pu voir dans le portofolio à quoi cela ressemble. Un appareil photo classique ne fait pas ce type de photo.... comment faites vous alors ? photoshop, un soft spécial...

      Merci d’avance,

      Vins

    • Le 23 novembre 2006 à 09:57, par Arnault Pachot En réponse à : Insérer des panoramas 360° dans les articles

      Les photos sont réalisées par assemblage de plusieurs photos avec le logiciel Hugin. C’est un logiciel libre très puissant mais un peu délicat à prendre en main. Il existe des tutoriels en français sur le site.

      Pour les prises de vues, un simple appareil numérique peut convenir.

      Mais on peut chercher à améliorer la qualité des photographies en jouant sur plusieurs paramètres :
      -  utiliser un trépied stable avec niveau
      -  utiliser une tête panoramique (la Panosaurus est une tête panoramique bon marché). La tête panoramique permet de conserver sur l’ensemble des vues le même point nodal (centre de l’objectif où les faisceaux se croisent) et donc d’éviter les erreurs de paralaxe.
      -  bloquer l’exposition pour toutes les vues (trouver une valeur moyenne)
      -  régler l’ouverture au min pour augmenter la profondeur de champ
      -  mise au point manuelle et identique sur toutes les vues
      -  bloquer la balance des blancs
      -  pas de filtre polarisant (qui réagit différement selon l’orientation par rapport au soleil)
      -  choisir le moment de la journée ou le soleil est le plus haut
      -  si une valeur d’exposition « moyenne » pour le panorama n’est pas satisfaisante, on peut éventuellement réaliser 2 panoramas d’une même scène, avec deux expositions différentes (par exemple en intérieur : exposition pour l’intérieur d’une pièce puis exposition pour l’extérieur vu à travers les fenêtres) puis faire un collage avec the Gimp.
      -  ajouter éventuellement un effet sur l’image finale pour augmenter le contraste. dans The Gimp : filtres -> amélioration -> augmenter les contrastes

      Il existe aussi des solutions pour réaliser une photographie 360° en une seule prise de vue. je possède cet objectif par exemple, mais il y a d’autres fabricants. La qualité du résultat est moins bonne et la mise au point est difficile. Par contre ce système permet de « saisir » des personnages ou objets « en mouvement » dans une scène ce que ne permet pas le système par assemblage. il a aussi l’avantage de produire des images très rapidement. tout dépend de l’utilisation qu’on veut faire.

      a+
      Arnault

    Répondre à ce message

  • Le 23 septembre 2006 à 00:11, par Balluche En réponse à : Insérer des panoramas 360° dans les articles

    Mais c’est génial ce javascript ! Depuis le temps que je cherches un truc qui soit ni flash ni java ! Bravo pour cette contrib !

    Répondre à ce message

Répondre à cet article

Qui êtes-vous ?

Pour afficher votre trombine avec votre message, enregistrez-la d’abord sur gravatar.com (gratuit et indolore) et n’oubliez pas d’indiquer votre adresse e-mail ici.

Ajoutez votre commentaire ici Les choses à faire avant de poser une question (Prolégomènes aux rapports de bugs. )
Ajouter un document

Retour en haut de la page

Ça discute par ici

  • ScolaSPIP 4

    19 janvier 2016 – 213 commentaires

    ScolaSPIP est plugin-squelette responsive personnalisable pour sites Web d’établissements scolaires basé sur SPIPr Présentation de ScolaSPIP Ce plugin pour SPIP 3 est développé par la Dane de l’académie de Versailles pour les webmestres de cette (...)

  • MediaBox

    10 mai 2010 – 514 commentaires

    Avertissement Le présent plugin est installé et activé par défaut sur toute les version de SPIP > 3.0. Inutile donc de l’installer manuellement sauf si vous utilisez SPIP 2.1. Aperçu La MediaBox est une Boîte multimédia polyvalente et (...)

  • Sommaire automatique

    31 janvier 2013 – 14 commentaires

    Ce plugin repère les intertitres des textes de vos articles et s’en sert pour génèrer un sommaire. Ce dernier peut être inséré automatiquement au début de chaque article, ou utilisé dans les squelettes pour générer un sommaire sur n’importe quel autre (...)

  • La Fabrique

    20 avril 2012 – 316 commentaires

    La Fabrique est un outil pour webmestres ou développeurs qui souhaitent créer des plugins. La Fabrique est capable de générer le code source minimal d’un plugin pour SPIP 3 (elle accélère donc le démarrage d’un plugin) et peut s’occuper également de (...)

  • Enluminures typographiques V3

    25 juillet 2009 – 186 commentaires

    Les Enluminures typographiques V3 permettent d’ajouter au Porte plume les raccourcis typographiques présents dans le Plugin Barre Typographique Enluminée. C’est une extension du PortePlume. Pour la documentation d’usage, se reporter à celle du (...)

Ça spipe par là