Afficher des images 360° dans vos articles à l’aide d’un « modèle » SPIP

Pour afficher des images 360°, un « modèle » SPIP est proposé dans le plugin SPIPr-dane (maquette utilisable dans les sites de Caen)

Ce modèle utilise A-Frame, un framework open-source libre sous licence MIT pour la construction d’expériences de réalité virtuelle.

Mise en œuvre

Pour afficher une image 360° dans un article :

  1. joindre une image 360° à l’article. Ce document a un numéro, par exemple n°XYZ.
  2. donner un titre au document (celui-ci s’affichera en 3D sur l’image)
  3. Ajouter dans le texte de l’article le modèle : <panoramaXYZ> avec éventuellement les paramètres suivant :
    1. affichage intégré dans la page : (conseillé, sans ça l’image 360° s’affiche en plein écran)
      |embedded=oui
    2. couleur du texte sur l’image :
      Ex : |couleur=#F00 (par défaut la couleur est le blanc :#FFF)
    3. taille du texte :
      Ex : |taille=10 (par défaut la taille est « 5 »)

Résultat pour le code du modèle suivant <panorama433|embedded=oui|couleur=#107b10|taille=6> :

vr-mode-ui="enterVRButton: #myEnterVRButton_433;" id="scene-id_433">

Source de l’image 360° : Site Archiclasse.

Limites, contraintes

Sur notre serveur, les images sont réduite à 1600px (pour éviter que des images de taille déraisonnable ne soient déposées sur le serveur... et que le serveur se remplisse trop vite). On n’a donc pas l’image en haute définition...