Share
Visionner une photo-sphère revient presque à se placer à l'endroit où l'image a été prise, mais en tant que nouvelle forme d'image numérique, le partage de photo-sphères est toujours un peu fastidieux..
Dans ce didacticiel, je vais vous montrer comment intégrer des sphères de photos Google à une page Web. Si vous insérez du code pour la première fois dans une page Web, ne vous inquiétez pas. Tout le travail acharné a été fait pour nous: nous avons juste besoin de rassembler trois éléments et de les mettre ensemble. Pendant ce processus, vous aurez besoin d’un programme d’éditeur de texte pour coller et modifier des extraits de texte ou de code au fur et à mesure que vous les réunissez..
Vous pouvez effectuer une recherche dans Google Street View et trouver n'importe quelle photo-sphère du monde entier et l'intégrer à votre blog. Vous pouvez également créer une photo-sphère à l'aide de votre smartphone ou de votre reflex numérique et la contribuer à Google Maps. Voir mes tutoriels sur la création d'une photo-sphère avec un smartphone ou un reflex numérique.
Recherchez la photo-sphère ou le panorama sur Google Maps et cliquez dessus pour l'afficher. Copiez et collez l'URL dans votre éditeur de texte. Vous remarquerez que l'URL est très longue et divisée en différents segments correspondant à différents bits de données. Quelque part dans cette longue URL se trouve le Pano ID. Regardez à travers l'URL jusqu'à ce que vous rencontriez l'expression data =. Ceci est un indice d'où commencer à regarder. le Pano ID est situé après cette expression et entre les caractères !1s et la suivante ! point d'exclamation. Par exemple, dans la chaîne data =! 3m6! 1e1! 3m4! 1sWijofm0bDHKz2mc4rSk-dg! 2e0! 7i13312! 8i6656, les personnages Wijofm0bDHKz2mc4rSk-dg sont les Pano ID. Copiez ces caractères dans votre éditeur de texte pour les utiliser Pano ID.
Vous pouvez également extraire le Pano ID en utilisant javascript. Heureusement, certaines personnes ont déjà créé un outil en ligne simple que nous pouvons utiliser pour saisir Pano ID. L'outil Panoid vous permet de faire glisser le pegman à tout endroit sur Google Maps et renvoie le Pano ID dans le coin inférieur gauche. Copier le Pano ID et collez-le dans votre éditeur de texte.
Accédez à Google Maps Embed API et cliquez sur le bouton. Afficher Street View ou un panorama personnalisé languette.
Placer le Pano ID dans le ID de panorama personnalisé boîte. Une fois que vous avez quitté cette zone, votre photo-sphère apparaîtra dans l'aperçu. S'il n'apparaît pas, revérifiez le Pano ID.
La photo-sphère doit être approuvée et ajoutée à Google Maps pour avoir une image utilisable. Pano ID.
Lorsque la photo-sphère s'affiche correctement, copiez le code d'intégration au bas de la page et collez-le dans votre éditeur de texte..
Rester dans l'API Google Maps, cliquez sur le bouton Cela semble bon bouton. Puis cliquez sur le registre bouton sur la page suivante. Inscrivez-vous à une API en vous inscrivant, en révisant et en acceptant les conditions d'utilisation. Une fois les conditions acceptées, un nouveau projet sera créé pour vous et une clé API sera générée. Vous serez également amené à la console du développeur.
Dans la console du développeur, cliquez sur la clé de votre navigateur. Vous serez emmené au Clé de l'API du navigateur Page. Sur cette page, copiez le Clé API et collez-le dans votre éditeur de texte.
Avant de pouvoir utiliser votre clé, vous devez remplir un autre champ. Vous devez définir des référents dans le dernier champ. Votre parrain sera votre site web avec un joker personnage (*) avant et après. Par exemple: * .votre site.com / * Cela indiquera à l'API que toute page de www.votresite.com est autorisée à utiliser l'API. Cela empêche également d’autres sites d’utiliser votre Clé API sauf s'ils sont ajoutés ici.
Ajoutez votre Clé API au Code intégré en remplaçant le … dans le clé =… de votre Code intégré avec votre Clé API.
Si vous utilisez un gestionnaire de contenu tel que Wordpress, créez une nouvelle page ou un nouveau blog. Ensuite, cliquez sur le passer en HTML bouton. Une fois dans ce mode, vous pouvez insérer du code HTML personnalisé. Collez le code incorporé et cliquez sur le bouton Enregistrer. Vous pouvez revenir au mode normal ultérieurement pour ajouter du texte ou d’autres éléments de votre choix..
Allez-y et affichez votre page. Si votre photo-sphère apparaît, vous avez fait du bon travail! S'il n'apparaît pas, vous devriez voir un message d'avertissement. Le message d’avertissement vous dira si vous avez un problème avec le Pano ID ou avec le Clé API. Si aucune photo sphère ou avertissement n'apparaît, le problème peut être lié à l'extrait de code. Copiez-le à nouveau et collez-le dans votre page Web..
Si vous utilisez Adobe Muse, cliquez sur le bouton Objet menu et sélectionnez Insérer HTML. Ensuite, collez votre extrait de code dans la boîte de dialogue et cliquez sur D'accord. Faites glisser la zone à l'emplacement souhaité sur votre page et redimensionnez-la à 600 x 450 pixels. Pour voir la photo-sphère, vous devez publier le site sur le Web. Alors allez-y et cliquez sur Publier. Une fois publié, accédez à la page contenant la photo-sphère pour la visualiser..
Voici un aperçu de mon code d'intégration que j'ai collé dans ma page:
Accentsconagua