[Topic Unique] Flash 360 Player - Un lecteur SWF de panorama 360°

Flash 360 Player - Un lecteur SWF de panorama 360° [Topic Unique] - Logiciels & Retouche - Photo numérique

Marsh Posté le 20-01-2010 à 19:09:22    

:bounce: !!! MàJ 13/06/2013 !!!  :bounce:  
Refonte du lecteur en cours !
 
Cette V2 consiste en un logiciel qui se veut intuitif, court-circuitant l'édition du XML.
Avancée majeur :
 
 

  • Gestion des panoramas dont la couverture horizontale est incomplète (blocage camera)  
  • Ajout de hotspot (lien vers d'autre pano, infobulles, contenu HTML...)  
  • Conversion des panos sphèriques => cubiques pour un gain de performance  
  • Export HTML5 (CSS3 ou WebGL) pour vos tablettes  
  • J'attend vos idées  :o  


________________________________________________
 
                        FLASH 360 PLAYER (V1)
________________________________________________
 
 
 
------------ PRESENTATION ----------
 
Flash 360° Player est un outil gratuit qui permet de visualiser un panorama 360° via Flash Player 10.
Il est configurable par l'intermédiaire d'un fichier XML (vitesse de déplacement, zoom, type de panorama, limite de la camera...)

Lien de démonstration : Lagny sur Marne - Place de la Fontaine
 
Màj 23/01/2010 : Prise en compte du brackingTime, retrait du champs de texte après chargement, Ajout d'un lien vers ce topic (clic droit).
 
 
---------- TELECHARGEMENT ----------
 


 
----------- MODE D'EMPLOI ----------
 

  • Pré-requis

Pour fonctionner, le player nécessite les fichiers :
 
 - panorama360.swf
 - config.xml
 - L(es) image(s) nécessaire(s) au panorama soit:
        - une seule, pour la projection sphérique
        - 6, pour la projection cubique (1 par face)
 
Pour l'exemple du pack à télécharger, il y a en plus un index.html où le .swf est intégré, ainsi qu'un script .js qui me sert pour cette intégration. (voir plus bas).
Il semblerait que lancer panorama360.swf directement avec le lecteur Flash Player en local ne fonctionne pas chez tous le monde, sachez déjà qu'il doit être à jour (version 10 ou +).
 
    /!\   Les images doivent avoir une taille inférieur à 6000px de largeur, à cause d'une limite de Flash...
          Les 2 premiers fichiers doivent être dans le même répertoire. L'url des image que vous indiquez dans le XML est relative à ce dernier.
          Ne mettez surtout pas d'accents, caractères spéciaux ou espaces aux noms de fichiers / dossiers que vous ajouterez au package.

 

  • Intégration du player

Je ne m'attarderai pas à vous expliquer comment intégrer un SWF dans une page web, ce sujet a été traité de nombreuses fois dans la catégorie Programmation/HTML de ce forum, je vous laisse donc le soin de faire une recherche si vous ne savez pas comment faire...
Je vous suggère néanmoins d'utilisé SWFObject(), un outil javascript à la fois simple et complet pour intégrer proprement du Flash dans votre page (X)HTML.
 

  • Paramétrage du player

Tout réside dans le fichier config.xml .  
Vous pouvez l'éditer avec n'importe quel éditeur de texte simplifié, tel que le Bloc-note sous Windows, mais je vous recommande vivement NotePad++ (ou un autre éditeur de texte avancé) qui vous offrira un coloriage syntaxique assez utile pour ne pas se perdre dans le code, bien qu'il n'y en ait que très peu !
Sachez déjà que vous ne devrez toucher qu'aux données entre guillemets, autrement dit, aux valeurs de ces différentes propriétés :
 
Pour la balise <projection> :
 
type : Il faut mettre le type de projection. Il n'y a que 2 valeurs possibles : "spherique" (pas d'accent !) ou "cubique"... C'est à vous de voir laquelle correspond à votre panorama !
 
showStats : Prends comme valeur "true" ou "false". Il permet d'afficher (true) ou pas (false) un cadre contenant les statistiques hardware, à savoir le taux de FPS ainsi que la mémoire utilisé par votre panorama. Utile en phase de test...
 
Pour la balise <imageSpherique> :
(utile seulement si votre projection est de type sphérique, sinon, elle est à ignorer)
 
image : Indique l'url de l'image (jpg, gif ou png) du panorama
 
angleOffset : Angle de décalage vertical du panorama si il ne couvre pas toute la hauteur (180°) ET dont le centre ne correspond pas à l'horizon.
 
backgroundColor : La couleur de fond (en nombre hexadecimal). Si la caméra ne bloque pas, c'est la couleur qui apparaitra dans les zones non "remplies" par le panorama.
 
Pour la balise <imageCubique> :
(utile seulement si votre projection est de type cubique, sinon, elle est à ignorer)
 
front : indique l'url de l'image (jpg, gif ou png) de la face avant du cube.
 
left : indique l'url de l'image (jpg, gif ou png) de la face gauche du cube.
 
back : …
...
 
Pour la balise <camera>
Tout les nombres ici doivent être des entiers positifs.
 
cameraSpeed : La vitesse de la caméra.
 
angleMax : Angle maximal(en degré) auquel la caméra se bloquera. Voir schéma ci-dessous.
 
angleMin : Angle minimal (en degré) auquel la caméra se bloquera. Voir schéma ci-dessous.
 
defaultFOV : Angle de champs de vision (FOV) par defaut (au lancement du player, en degré). Voir shémas ci-dessous.
 
zoomStep : valeur de zoom/dézoom pour 1 "roulis" de molette.
 
brakingTime : durée (en milliseconde) de freinage de la caméra lorsqu'on relâche le clic de la souris.
 
http://urfman.free.fr/fhw/schema_panoSpherique.png
 
Merci de signaler ce qui n'est pas clair !
 
 
 
----------- A PROPOS ----------
 

  • Technologie / sources utilisée

Pour produire cette source, j'ai utilisé FlashDevelop, qui couplé au Flex SDK permet de développer et compiler l'AS3 gratuitement.
Par ailleurs, les frameworks (libres) suivants ont été utilisés :
Away 3D : pour le rendu 3D dans Flash.
Tween Lite : Pour des interpolations fluides et légères.
BulkLoader : Pour la gestion des chargements multiples.
Mr.Doob : Affichage des statistiques hardware.
 
Mon travail se résume surtout à l'interactivité de la caméra et l'interprétation du XML.
Je compte partager prochainement la source .as si je vois des gens intéressés... C'est à la base un projet personnel que je partage :)
 

  • Projets

- Porter la source vers WebGL lorsque le HTML5 se démocratisera. Le but est de ne plus dépendre de flash (qui est une technologie propriétaire).
- Créer des zones cliquables afin d'atteindre d'autre panorama, ouvrir une image...
- Créer un interface simplifier pour configurer le panorama pour passer outre l'édition manuelle XML
 
Je souhaiterais par ailleurs que vous me soumettiez toutes vos idées / remarques nécessaires à l'amélioration de cet outil  :jap:


Message édité par abais le 13-06-2013 à 21:36:36

---------------
Le membre ci-contre n'est pas responsable du message ci-dessus.
Reply

Marsh Posté le 20-01-2010 à 19:09:22   

Reply

Marsh Posté le 20-01-2010 à 19:18:57    

j'ai téléchargé le ZIP avec l'exemple et l'image ne se charge pas c'est normal ?

Reply

Marsh Posté le 20-01-2010 à 19:36:35    

non -.-
C'est en local seulement ? peux tu tester sur un FTP si t'en a un ?
Mon lien de démo fonctionne t-il ?

Message cité 1 fois
Message édité par abais le 20-01-2010 à 20:27:49

---------------
Le membre ci-contre n'est pas responsable du message ci-dessus.
Reply

Marsh Posté le 20-01-2010 à 20:24:37    

drapal

Reply

Marsh Posté le 20-01-2010 à 20:32:35    

Quelqu'un peu retester le pack avec l'exemple (avec index.html) en local svp ?


---------------
Le membre ci-contre n'est pas responsable du message ci-dessus.
Reply

Marsh Posté le 20-01-2010 à 21:54:19    

Et hop  [:turborunner]  
 
ça ma l'air prometteur, good job abais  :jap:

Reply

Marsh Posté le 20-01-2010 à 21:56:14    

abais a écrit :

non -.-
C'est en local seulement ? peux tu tester sur un FTP si t'en a un ?
Mon lien de démo fonctionne t-il ?


oui téléchargé, décompressé, et j'ouvre le swf et rien

Reply

Marsh Posté le 20-01-2010 à 21:58:00    

De mon côté ça fonction, sous firedox et flash player 10.

Reply

Marsh Posté le 20-01-2010 à 22:03:11    

nan mais c'est bon en fait, j'essayais d'ouvrir le swf, mais sur une page web, pas de souci :)

Reply

Marsh Posté le 21-01-2010 à 09:47:09    

bricocoman a écrit :

nan mais c'est bon en fait, j'essayais d'ouvrir le swf, mais sur une page web, pas de souci :)


Le .SWF du dernier pack est lui aussi différent à 2-3 choses prêt concernant les sécurités d'export Flash, le but étant de régler les éventuels conflits en mode local...
Le problème c'est que ça marchera dans tous les cas chez moi, ce pourquoi je vous sous-traite pour tester le nouveau pack (en local)  :jap:  
 
Suite à vos retour ça semble maintenant fonctionner...
 
Merci à vous  :jap:  


---------------
Le membre ci-contre n'est pas responsable du message ci-dessus.
Reply

Marsh Posté le 21-01-2010 à 09:47:09   

Reply

Marsh Posté le 21-01-2010 à 22:09:53    

drap

Reply

Marsh Posté le 22-01-2010 à 23:36:23    

bon je viens de l'essayer. très bon travail  :) jusqu'ici j'utilisais pano2vr mais ton lecteur me plaît  :jap:  
 
feedback:
-l'argument brackingtime ne fonctionne pas sur mon animation. ni sur celle en exemple dans l'archive. que l'on passe de 500ms à 5000ms c'est la même, je voulais avoir un mouserelease plus "smooth" or là c'est pas possible.
-pour chipoter: le curseur quand il est au milieu de l'animation prend la forme d'un i majuscule, comme lorsqu'on saisit du texte, ça vient je pense (ayant qqs notions en flash/actionscript) de la progressbar qui reste en arrière-plan une fois l'image chargée.

Reply

Marsh Posté le 23-01-2010 à 23:25:10    

1) Je vais jeter un coup d'oeil, merci :)
EDIT :  C'est réglé !

 

2) J'avais réglé se problème mais pas mis à jour le SWF sur mon FTP, je vais faire ça dés que possible...C'est bien le textfield du chargement qui posait le pb ;)
EDIT : Uploadé :)


Message édité par abais le 23-01-2010 à 23:56:17

---------------
Le membre ci-contre n'est pas responsable du message ci-dessus.
Reply

Marsh Posté le 24-01-2010 à 17:11:56    

parfait :)
 
par contre il ne faut pas mettre une image de pile 6000px de largeur sinon ça ne marche pas

Reply

Marsh Posté le 24-01-2010 à 20:02:37    

Apparement, la limite est de 16 MP...
Si le ratio est de 1/2 (panorama 360°x180°), la limite serait donc de 5656px...


---------------
Le membre ci-contre n'est pas responsable du message ci-dessus.
Reply

Marsh Posté le 27-01-2010 à 22:28:28    

drapo

Reply

Marsh Posté le 28-01-2010 à 00:16:38    

Dés que j'aurais le temps, je porterais la source sur away3dlite que j'ai chatouillé récemment...
J'espère diminuer la charge CPU et diviser la taille du SWF par 2


---------------
Le membre ci-contre n'est pas responsable du message ci-dessus.
Reply

Marsh Posté le 03-02-2010 à 19:42:47    

Y a t'il un paramètre permettant de démarrer le défilement au chargement du pano sans toucher à la souris ?
Bravo pour cette magnifique appli !
Jean-Benoît

Reply

Marsh Posté le 04-02-2010 à 13:07:46    

non, mais je pourrais le rajouter...


---------------
Le membre ci-contre n'est pas responsable du message ci-dessus.
Reply

Marsh Posté le 05-02-2010 à 11:48:41    

Bonjour,
 
Ton application est vraiment super sympa par contre j'aimerai savoir s'il y avait la possibilité de configurer un angle max pour la droite et la gauche..  
Je m'explique , je prend des photos en mode fishEye et cela me permettrais de ne montrer que le partie devant moi (180° ).
 

Reply

Marsh Posté le 17-02-2010 à 08:17:45    

Excellent ton Player flash !
 
Je l'ai testé avec des grandes images et la qualité est super.
Le mode sphérique présente une minuscule déformation des lignes droites, mais il faut bien regarder.
Le résultat est meilleur en mode cubique.
 
Comme chacun y va de son idée ou de sa requête :
 
Serait'il possible de modifier les proportions de l'image ?
Changer la largeur sans changer la hauteur, ou l'adapter au format large ou 16/9, comme les autres players.
 
Tant qu'on y est, un mode "plein écran", serait le top.
 
Si tu mets les sources à disposition je suis intéressé.  
Je suis photographe panoramiste et en echange, si tu veux, je te propose une dizaine de mes photos (cubiques et sphériques) pour faire tes tests ou tes demos  
 
Patrick.


Message édité par winini33 le 17-02-2010 à 13:44:45

---------------
Visites Virtuelles en Aquitaine : http://www.avisiter.com
Reply

Marsh Posté le 17-02-2010 à 16:01:49    

Bonjour winini33,

 

Pour le player en soit, rien ne t'empêche de le mettre dans la taille que tu souhaite...
Concernant les proportions de l'image, je ne vois pas trop où tu veux en venir, car le ratio d'une image sphérique 360°x180° est normalement de 2/1...
Si les 180° ne sont pas desservi, il rajoute automatiquement des bande noir...
M'enfin, si tu justifie cette proposition, pourquoi pas...

 

Pour le fullscreen, bonne idée :)

 

Concernant le mode sphèrique, les déformations peuvent aussi être dues au maillage 3D de la sphère qui est assez léger, lorsque j'aurai porté ma source sur Away3DLite, je me permettrai de l'alourdir ;)

 

Pour le partage de ma source, je ne sais pas trop encore, ça dépendra de mes projets, mais je me demande si je ne vais pas faire quelque chose de lucratif derrière... En stand-by pour le moment donc...

 

En ce moment, je suis à fond sur mon site perso (voir le Wip de ma signature), mais j'essayerais de m'y mettre assez tôt.


Message édité par abais le 17-02-2010 à 16:04:12

---------------
Le membre ci-contre n'est pas responsable du message ci-dessus.
Reply

Marsh Posté le 17-02-2010 à 20:33:24    

Ok Abais, merci pour ta réponse.
 
Les proportions de l'image d'origine sont bien de 2/1, mais le player c'est une fenêtre et on doit pouvoir lui donner n'importe quelle dimension sans déformer le sujet.
J'ai des exemples sur mon site avec des panoramiques 360 qui s'ouvrent en fenêtres modales et qui s'adaptent aux dimensions de la page.
 


---------------
Visites Virtuelles en Aquitaine : http://www.avisiter.com
Reply

Marsh Posté le 18-02-2010 à 10:14:07    

winini33 a écrit :

Ok Abais, merci pour ta réponse.
 
Les proportions de l'image d'origine sont bien de 2/1, mais le player c'est une fenêtre et on doit pouvoir lui donner n'importe quelle dimension sans déformer le sujet.
J'ai des exemples sur mon site avec des panoramiques 360 qui s'ouvrent en fenêtres modales et qui s'adaptent aux dimensions de la page.
 


Quand je clique sur un de vos panoramas dans l'accueil du site, ça ouvre bien une box, mais ça me fait un fond de couleur uni...  
Pourtant, je vois bien la barre de chargement se compléter en haut à gauche...
 
Je crois voir ce que vous dites, le redimensionnement n'agrandirait pas le viewport 3D, mais se contente de stretcher le canvas flash...
Je jetterais un coup d'œil là dessus :)


---------------
Le membre ci-contre n'est pas responsable du message ci-dessus.
Reply

Marsh Posté le 29-04-2010 à 22:25:11    

cool ca ...  [:fumble]

Reply

Marsh Posté le 03-05-2010 à 21:59:59    

drapal


---------------
Des piafs en photo
Reply

Marsh Posté le 13-07-2011 à 10:41:49    

Pourrait - on avoir les sources de ce superbe player ?
 
Je dev avec Flash et Away 3D mais je suis bloqué et j'aimerais beaucoup utiliser ton player, et pour le customiser avec des hotspots il me faudrait le AS  
, est ce possible ?
 
Merci d'avance


Message édité par Rpschhh le 13-07-2011 à 10:42:28
Reply

Marsh Posté le 28-11-2011 à 21:16:35    

bonsoir a tous
voila j'ai un problème que je n'arrive pas a résoudre sa fait deja 3 jours que je cherche et je sent que je vais craquer. jusqu'a present je trouve quelque tutorial mais pas trés interréssant et sans bonne explication.
Mon souci...le voici
je suis membre d'un forum (http://a-d-n.forumperso.com/) je désirai poster dans un message plusieurs panorama que j'ai effectuer avec panoramastudio2pro chaque panorama contient un dossier avec image jpeg, un .html , un un .xml et un fichier pano studio viewer.
Mon probleme c'est...comment les mettre en ligne ???
j'aimerai que les membre puisse depuis le message poster naviguer a traver le panorama en haut a droite a gauche etc... dans une sorte de fenetre aussi grand qu'un fenetre de video youtube...
je ne sais pas si cela ai possible , je ne suis pas un pro en informatique non plus.
je ne sais pas non plus ou héberger ces fichier car apparement il faut quils soient tous au meme endroit mais si je les upload (ex : chez free) j'ai un lien par fichier !.. donc je cale sérieusement
 
merci pour vos réponse futur, si vous avez besoin d'autre explication je suis la ^^
merci encore

Reply

Marsh Posté le 29-11-2011 à 10:09:18    

petit up :
voici un lien en .rar contenant un dossier avec un jpeg (une simple photo en panorama) et un autre dossier que j'ai obtenue avec panoramastudioviewer2pro
si quelqu'un pouvais m'expliquer la marche a suivre pour pouvoir le mettre en ligne ^^
http://dl.free.fr/aRwirFRVw

Reply

Marsh Posté le 04-12-2011 à 14:05:14    

Tu n'es pas vraiment dans le bon topic pour ça... Ici je distribue un player de panorama 360, je ne fais pas le support d'un autre...
Pour t'aiguiller, tu dois avoir ouvrir un hébergement web (FTP) et y uploader tes fichiers...


---------------
Le membre ci-contre n'est pas responsable du message ci-dessus.
Reply

Marsh Posté le 27-01-2012 à 13:46:46    

Merci Abais pour ton player, c'est ce que je recherchais et je trouve qu'il offre un très bon rendu en terme de qualité d'image par rapport à d'autres, donc félicitations!  ;)  
Par contre j'aimerais pouvoir bloquer le zoom molette. J'ai essayé avec la valeur 0 pour le zoomStep, mais ca ne fonctionne pas. Et le plus gênant est que le zoom reste actif même si on sort du champ du panorama lorsqu'on utilise la molette pour scroller dans une page web.
Si tu as une solution, je suis preneur.
Par avance merci!
Jocelyn

Reply

Marsh Posté le 07-03-2013 à 06:05:31    

Hello,
 
Merci pour ce super viewver qui correspond a ce que je recherchai.
J'avais juste 2 petites questions :
 
- Est ce qu'il est possible de bloquer le déplacement horizontale et verticale ?
 
Car mes photos panoramique ne font pas 360° mais plutôt 180 max, du coup si je baisse la caméra dans le pano je vois du blanc, pareil en haut.
Et sur les côtés ca raccorde les 2 extrémités de ma photos qui sont pas raccords quoi vu que c'est pas un full pano 360°...
 
Merci d'avance de ton retour et félicitations pour le boulot accompli !  ;)  
 

Reply

Marsh Posté le 21-05-2013 à 11:23:09    

Désolé pour le retard :
Vous l'aurez compris, je n'ai pas avancé le développement depuis, mais toutes ces évolutions sont possibles :  

  • Blocage du zoom
  • Blocages horizontal


J'essayerais de mettre en pratique mon savoir technique (car moi aussi j'évolue) pour proposé un outil plus robuste et actuel, je pense à un export HTML5 (non consultable sur Internet Explorer ou la majorité des browsers mobiles pour l'instant.


---------------
Le membre ci-contre n'est pas responsable du message ci-dessus.
Reply

Marsh Posté le 13-06-2013 à 21:37:03    

MàJ du 1er post :)


---------------
Le membre ci-contre n'est pas responsable du message ci-dessus.
Reply

Marsh Posté le 13-06-2013 à 23:23:17    

ah c'est cool ça :)
après toutes ces années je me sert encore de ta première version pour visualiser mes panos sphériques :)

Reply

Marsh Posté le 23-09-2013 à 15:01:55    

Bonjour Alexandre
 
Félicitations pour le travail déjà accompli et nous avons hâte de voir la version 2  
 


Message édité par kabakab le 11-10-2013 à 16:07:43
Reply

Marsh Posté le 12-11-2013 à 15:08:18    

Bonjour qu'en est-il de la version 2 ? J'attends cette nouvelle version avec impatience !
Merci encore pour tout ce travail.

Reply

Marsh Posté le 12-12-2013 à 07:49:29    

zorglou3 a écrit :

Bonjour qu'en est-il de la version 2 ? J'attends cette nouvelle version avec impatience !
Merci encore pour tout ce travail.


Je viens de m'y remettre... Sachez qu'un goss, c'est chronovore  [:elmoricq] !

Spoiler :

http://abais.fr/hfr/maquette_v2.jpg


Message édité par abais le 12-12-2013 à 07:53:22

---------------
Le membre ci-contre n'est pas responsable du message ci-dessus.
Reply

Marsh Posté le 02-01-2014 à 16:27:01    

félicitation, ça à l'air pas mal ce que tu prépares.
je vais suivre ça avec intérêt.

Reply

Marsh Posté le 19-02-2014 à 18:02:16    

Bonjour
 
excellent ce player  !
 
comment faire pour modifier le fichier jpg ( affichage sperique) via un parametre passe dans l'url , afin d'afficher plusieurs images  
ou bien choisir un autre fichier xml a passer dasn les parametres swfobject ?
 
histoire que l'on puisses afficher differentes images via la meme url simplement en ajoutant des parametres dasn l'url
 
merci

Reply

Marsh Posté le    

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed