Il y’a quelque jours je cherchais comment réaliser à moindre coût une « visite virtuelle » d’un lieu pour un site web sur lequel je travaille et quand on est pas spécialisé en développement ce n’est pas forcément accessible. Et là comme par hasard Google me fournit la solution ! Intégrer les Photo Sphère de mon Nexus directement sur une page web. Comment faire ? Je vous explique ça dans la suite…

On peut réaliser très facilement des panoramas à 360° alias PhotoSphere avec un simple Nexus 4. Alors certes on est loin d’un panorama professionnel mais mine de rien, on commence à s’en approcher. Toujours est-il que pour mon utilisation cela suffisait amplement. Le truc est en fait d’utiliser l’API Google+ pour appeler un iframe qui va nous permettre avec les bonne script chargés d’afficher une PhotoSphere hébergée sur Google+ .

D’abord il faut charger les scripts de Google dans sa page avec la ligne suivante:

Ensuite à l’endroit où l’on veut afficher son image on définit notre objet:

Et on exécute le script pour qu’il affiche le tout:

Par contre le truc essentiel ce sont les paramètres: fullsize, croppedsize, offset, etc… En fait ce sont eux qui déterminent comment va être affiché le panorama en fonction des dimensions de la photo. En gros cela vous permet d’afficher un panorama d’un stade de foot comme si c’était bel et bien un stade et non un studio de 9m² ! Ces informations se récupèrent dans les données EXIF de la photo. Vous le savez maintenant j’utilise pour ma part Ubuntu ou Linux Mint et pour lire simplement les données EXIF d’une photo j’utilise un petit outil en ligne de commande bien pratique: exiftool . Son utilisation est très simple puisqu’il suffit de lancer la commande suivante:

exiftool /chemin/vers/ma/photo.jpg

Ensuite on part du principe que les paramètres de notre code s’obtiennent comme suit:

fullsize = Full Pano Width Pixels,Full Pano Height Pixels
croppedsize = Cropped Area Image Width Pixels, Cropped Area Image Height Pixels
offset = Cropped Area Left Pixels, Cropped Area Top Pixels

Le paramètre displaysize ne sert qu’à définir la taille du cadre dans lequel votre panorama va s’afficher.

Pour obtenir l’url de votre photo rendez vous sur votre profil et dans l’album un clic droit sur l’image vous donnera la possibilité d’en récupérer l’adresse.
Ce qui serait parfait c’est que l’on ne soit pas obligé d’envoyer ces photos sur G+ avant !

Voilà ! Vous savez tout, à vous d’essayer !

(miniature)