Intégrer Google Maps à mon site Web : API ou iFrame ?

Le service Google Maps a été initié le 8 mars 2005 et les res­pon­sables de cette grande mul­ti­na­tio­nale ne se rendait pas compte de son effet sur le quotidien des uti­li­sa­teurs. Depuis plus d’une décennie, le service Web fournit à ses uti­li­sa­teurs des images satellite du monde entier et est également devenu in­dis­pen­sable aux appareils mobiles. On peut ainsi regarder di­rec­te­ment depuis une carte à quelle distance notre hôtel se trouve de la plage, ou encore quels sont les res­tau­rants à proximité qui sont bien évalués par les autres uti­li­sa­teurs. Lorsque vous êtes en dé­pla­ce­ment, l’ap­pli­ca­tion smart­phone Google Maps vous permet de retrouver votre chemin et de vous rendre à des­ti­na­tion, que vous soyez à pied, à vélo ou encore en voiture, ou même en em­prun­tant les trans­ports en commun.

Vous pouvez utiliser le service de Google sur votre site en y intégrant une fenêtre réduite de l’ap­pli­ca­tion Google Maps. Vous pouvez ainsi indiquer le lieu de votre en­tre­prise, votre hôtel, votre magasin, votre cabinet ou encore décrire l’iti­né­raire pour se rendre d’un point A à un point B. Comment intégrer Google Maps sur un site Web et quelles sont les con­di­tions pour une uti­li­sa­tion com­mer­ciale ?

Dans le menu de na­vi­ga­tion suivant, vous trouverez dif­fé­rentes pos­si­bi­li­tés de réglages avec les­quelles vous pouvez par exemple insérer des pistes cyclables ou des routes locales, ainsi que des astuces autour du service de Google. Dans le menu « My Maps » vous pouvez lancer le Map-Editor ou éditeur de cartes qui vous permet de créer des cartes in­di­vi­duelles. Ici, vous pouvez également accéder à toutes les cartes déjà créées.

Il suffit ensuite de copier l’extrait de code ainsi généré dans le code source de votre site Internet. Vous pouvez régler la taille de la carte ainsi que le nombre de pixels qui la compose (par exemple 640 x 480). Comme le code HTML n’est autre qu’un élément iFrame, le contenu de la carte est chargé en parallèle via les serveurs de Google. Cela décharge par con­sé­quent votre serveur des données liées à la carte. On parle de technique d’iFrame ou d‘in­li­ne­Frame pour désigner un élément au sein d’un code HTML. Elle est com­pa­tible avec tous les na­vi­ga­teurs Internet modernes et permet par exemple l’in­té­gra­tion d’éléments de réseaux sociaux.

L’in­té­gra­tion de Google Maps avec iFrame est seulement permise pour un usage privé. Si vous souhaitez utiliser le service de cartes pour un usage com­mer­cial, vous devez passer par son interface de pro­gram­ma­tion, à savoir Google Maps API.

La mise en place d’une carte de Google sur votre site Web peut s’effectuer grâce à une API Google Maps (Ap­pli­ca­tion Pro­gram­ming Interface ou interface de pro­gram­ma­tion en français), mais cela s’avère plus complexe qu’avec iFrame. L’uti­li­sa­tion de telles in­ter­faces ouvre de nouvelles pos­si­bi­li­tés aux dé­ve­lop­peurs pour intégrer Google Maps sur des sites Web. Il est par exemple possible de trans­mettre son em­pla­ce­ment exact à ses amis grâce à l’uti­li­sa­tion d’une API avec la mes­sa­ge­rie ins­tan­ta­née Whatsapp. Le service Web Plane Finder, qui re­pré­sente une carte du trafic aérien mondial en temps réel, utilise dif­fé­rentes cartes Google Maps API.

Pour obtenir un aperçu des dif­fé­rentes APIs et savoir quels pro­grammes sont les plus adaptés à votre projet Web, vous pouvez utiliser l’outil dédié de Google De­ve­lo­pers. 

2. Continuer la procédure en cliquant sur « continuer » et acceptez les con­di­tions générales d’uti­li­sa­tion. Vous créez ensuite un nouveau projet et une clé na­vi­ga­teur API. 3. Après avoir généré une clé API, vous pouvez utiliser votre ap­pli­ca­tion Web. Un guide Google Maps vous permet de savoir quoi ajouter à votre document HTML et où placer votre clé API. .

L’uti­li­sa­tion de ces in­ter­faces de pro­gram­ma­tion n’entraîne pas forcément de frais. Tout dépend du type de site Web que vous exploitez, à savoir un site Web ou une ap­pli­ca­tion par exemple. Les APIs sont uti­li­sables gra­tui­te­ment pour les projets qui ne dépassent pas un certain nombre de char­ge­ments par mois. Si votre ap­pli­ca­tion ou site Web a pour but de suivre la lo­ca­li­sa­tion de personnes ou d’objets, l’in­té­gra­tion d’APIs Google Maps est né­ces­sai­re­ment payante. Le site du dé­ve­lop­peur vous donne également une in­di­ca­tion des dif­fé­rents prix et modèles d’uti­li­sa­tion. Vous trouverez aussi sur cette page le contact de l’équipe de dé­ve­lop­peurs, si jamais vous ne savez pas quel modèle choisir pour votre projet.

Les avantages de l’in­té­gra­tion d’un service de cartes Google sont in­dé­niables : vous offrez une valeur ajoutée à vos visiteurs, sans que votre serveur Web ne subisse de charge sup­plé­men­taire (étant donné que les serveurs de Google sont utilisés). Google est intervenu en 2012 et a rendu l’uti­li­sa­tion com­mer­ciale de ses cartes payantes pour une partie des projets Web ayant un fort trafic. Ces derniers sont soumis à une co­ti­sa­tion fi­nan­cière, qu’il s’agisse d’un site Web ou d’une ap­pli­ca­tion. Si vous souhaitez ajouter des marquages sup­plé­men­taires à votre section de carte Google, vous devez ab­so­lu­ment avoir des con­nais­sances en HTML et Ja­vaS­cript au préalable. Si vous souhaitez intégrer une carte de Google Maps à votre site Web à des fins privées et sans attendre un grand nombre de visiteurs, iFrame propose un champ de pos­si­bi­li­tés suffisant.