Animazione foto 360' di Object2VR in html5 come fare
Autore: Nicolò Salerno
Visite 4512,
Followers 1,
Condiviso 0
Salve,
ho bisogno di inserire in una pagina, una o più foto a 360° generate dal software Object2VR (di Garden Gnome) in formato html5.I file sono contenuti in una cartella e sono: 1) Un file in html (se provo a cliccare vedo l'animazione sul browser Crome e posso farla ruotare spostando il puntatore del mouse a destra o a sinistra, inoltre con la rotellina posso zoomare) 2) Un file in xml contenente il codice; 3) Un file js chiamato object2vr_player; 4) E infine una cartella contenente tutte le foto (30 foto). Non saprei come fare dal momento che non capisco nulla di codice! Grazie mille a chi vorrà aiutarmi!
Buona serata, Nicolò.
Postato il
A partiore dalla v10 Pro trovi in Gallery il tipo Rotazione Oggetto 360°.
In che cosa differisca rispetto ad una tradizionale sequenza non chiedermelo perché non l'ho mai usato e non lo so.
Comunque é quanto di più si avvicina alle tue esigenze tra le funzionalità già introdotte in wsx5 (vedi ss).
Naturalmente non puoi metterlo sullo stesso piano di una collezione di immagini in 3D che ti consenta di navigare la visualizzazione in tutte le direzioni; qui l'oggetto ruota intorno al suo asse verticale e tu ne hai una visione esclusivamente orizzontale.
Ti farei vedere un esempio ma dovresti allegarmi in un file zip la cartella delle tue 30 immagini per vedere cosa salta fuori, cioé cosa puoi fare usando solo wsx5 e quella cartella senza il resto.
... per la v.10 (ormai da aggiornare alla v.11), prova a... pubblicare in RETE la tua pagina HTML di esempio e funzionante, e metti qui il LINK...
... ... e poi, tramite IFRAME, o tramite qualche esperto in codici, si vedrà il da farsi... ... ... .
... altrimenti, come è stato prima detto, con la PRO troverai la Galleria Rotazione Oggetto 360°.
.
ciao
questo l'esempio della 10 Pro
http://provews.altervista.org/X10Pro/gallery360.html
Grazie Mirko; esattamente come pensavo, ma non avevo il materiale fotografico per fare la verifica. Comunque ancora non capisco l'utilità specifica di questo tipo rispetto ad una gallery normalissima.
Autore
Buongiorno,
grazie a tutti, scusate il ritardo nel rispondere, pensavo arrivasse una mail quando qualcuno avesse risposto alla mia!
La versione che ho io è la 10 Evolution e la galleria 360° non c'è.
A me serve per il mio lavoro... Sono un fotografo per e-commerce e faccio anche le foto a 360°, quindi avrei voluto far vedere come funziona!
Mi interesserebbe il discorso iframe, ma sono completamente all'asciutto di codice. Potrei farmi aiutare da qualcuno però... Mi date qualche indizio? Grazie!
L'html funzionante potrei allegarvelo, se volete lo faccio, ma senza le foto nella stessa cartella, non può funzionare!
Grazie ancora a presto.
Nicolò.
... per 360° intendi l'effetto tipo la bicicletta postata da MirKo, oppure tipo un panorama senza soluzione di continuità...?...
... indipendentemente dal tipoi, ...intanto pubblica nel tuo spazio WEB, in una sottodirectory del tuo sito, la cartella con le immagini e la pagina HTML che ne fa uso, e metti qui il LINK, già detto prima, in modo che si possa vedere di cosa si tratti, ed eventualmente come gestire nel Programma o tramite IFRAME (più immediato)...
... se vuoi anticipare i tempi, il codice IFRAME "tipo" da usare è questo:
<iframe src="httpIndirizzoSito/nomecartella/nomepagina.html" width="900" height="600"> </iframe>
... ricordati del LINK...
.
ciao
Autore
Grazie KolAsim, ecco il link: http://www.ns-studio.it/Capodimonte/output/Capodimonte.html
Come puoi vedere, se non tocchi nulla dopo 2 secondi comincia a girare, ma se ci vai sopra col mouse tenendo premuto il tasto sinistro, puoi decidere tu se girare a destra o sinistra, inoltre col doppio click va a tutto schermo e con la rotella puoi zoommare. Nella pagina del sito, ho pensato di mettere una finestrella più piccola comunque, anche 320x320 ma dovrebbe funzionare in questo modo!
Credo che la cosa da fare sia proprio l'iframe, quello che mi hai dato (ti ringrazio per questo) dove dovrei inserirlo? Smanettando, ho provato a mettere l'oggetto HTML e Widjets nella pagina del sito e il codice l'ho inserito in prima pagina (mi riferisco alla pagine dell'oggetto html & Widjet), devo dire che funziona, ci siamo quasi, perchè intanto me lo da ingrandito ma dentro la finestrella piccola e se clicco due volte, lo riduce alle dimensione della finestra. Però funziona, devo smanettarci ancora un po, oppure mi dici dove ho sbagliato, se c'è un'altro metodo ecc. Te ne sarò grato finche campa il sito! :) Ah, altra cosa, sotto l'iframe, nella pagina del sito, mi fa vedere tutto il codice (l'iframe di cui sopra) cosa bruttina da vedere... E inoltre mi da le barre di spostamento, ma questo immagino sia per le dimensioni. Nel'iframe ho messo 320x320, ma nei quadratoni della pagina non ho calcolato queste misure, sicuramente sarà per questo... Comunque per questo penso di arrivarci anche da solo!
Ti ringrazio in anticipo per le dritte che vorrai darmi e... Mi scuso per la mia ignoranza in materia, capisco che faccio perder tempo con cose che per voi sono stupide, mi rendo conto! :)
Buona serata!
Nicolò.
... tieni in considerazione che io non ho programmi, quindi mi esprimo per deduzione...
... l'IFRAME ho verificato, e potrebbe anche andar bene, ma l'ingrandimento avverrebbe all'interno dell'IFRAME stesso; poco male se non ti interessasse...
... l'ideale invece sarebbe di incorporare il codice nella pagina del Programma stesso, tramite un Oggetto HTML&WIDGETS pannello HTML, per mantenere gli effetti globali...
1) ... oggetto contenitore detto, HTML&WIDGETS pannello HTML, deve avere una larghezza almeno di 500 Px ed una altezza di almeno 650 Px. questo per mantenere l'aspetto originale ;(eventualmente si potrebbe apportare una variazione se si volesse rimpicciolire la finestra di uscita)...
... e quindi devi incollare questo codice (anche in allegato): http://www.zspace.it/kolasim/answersWSX5E/script360.txt
... fatto; ...né più, né meno...
...
... se per caso vuoi diminuire le dimensioni, oltre a diminuire l'altezza dell'Oggetto HTML&WIDGETS, dovrai agire nella parte di codice iniziale, dove troverai questa stringa:
<div id="container" style="width:494px;height:640px;">
... per esempio, per usare lo stesso rapporto in larghezza 300: 300 x 389
<div id="container" style="width:300px;height:389px;">
.
... provaci; ..dovrebbe essere semplice...
(... nel TXT ho usato gli URL ASSOLUTI relativi alla posizione del tuo JavaScript ed delle tue Immagini, per provarlo su una pagina HTML di base: html | body | script | /body | /html ... http://www.zspace.it/kolasim/answersWSX5E/script360.html ..se la posizione che userai rimarrà invariata, potresti mantenere lo stesso codice, oppure ridurre gli URL alla posizione relativa; ...nel caso servisse, ci risentiremo...)
.
ciao
...!... il TXT >>
Autore
Perfetto, grazie mille!
Funziona abbastanza bene. Peccato non si possa ingrandire a tutto schermo col doppio click, rimane sempre all'interno del frame! Non esiste la possibilità di aprirlo ingrandito su un'altra pagina? Sarebbe più bello poter vedere l'oggetto ingrandito!
Accanto a questa ne metterò altre due, spero non dia problemi di caricamento, inteso come tempi di caricamento... che dici?
Intanto ti ringrazio davvero tanto, mi hai risolto un problemone!
Ti auguro una buona serata!
Nicolò.
Autore
Ah, dimenticavo, l'ho pubblicato, se ci vuoi dare un'occhiata:
http://www.ns-studio.it/listino-foto-ecommerce.html
... non so cosa sia, ma hai un errore nel codice della pagina...
... devi eliminare nella sezione HEAD questa stringa:
<div id="fb-root"></div>
... caso mai ti servisse, mettila dove servirebbe, magari nella sezione /BODY o in un oggetto HTML...
... per quanto riguarda la visualizzazione del 360° ...vedo che è regolare, e solo su FireFox non si apre a tutta pagina, del resto ciò avviene anche con il link originale ed anche con il mio esempio, che su FireFox non va in fullscreen...
.
ciao