Widget de carte et de routage intégrable

Ajoutez une carte OSRMRoute avec recherche d’adresses et itinéraires par script ou iframe. Thème et taille adaptative sont configurables ; l’usage API suit votre offre.

Aperçu en direct

Copier et intégrer

Utilisez le script ou un iframe. Aucune compilation nécessaire.

Script + div

<div data-osrmroute-map
     data-key="YOUR_API_KEY"
     data-theme="dark"
     style="height:480px"></div>
<script src="https://osrmroute.com/embed.js" async></script>

Iframe simple

<iframe
  src="https://osrmroute.com/embed/route?key=YOUR_API_KEY&theme=dark"
  style="width:100%;height:480px;border:0;border-radius:16px"
  loading="lazy" allow="geolocation"></iframe>

Utilisez une clé dédiée au widget, limitez-la à votre domaine et suivez l’usage. Les clés du navigateur sont visibles aux visiteurs. Tableau de bord

Configuration

Attribut	Valeurs	Description
data-key	YOUR_API_KEY	Votre clé API OSRMRoute ; limitez-la à votre domaine.
data-theme	dark \| light	Thème de couleurs ; sombre par défaut.
data-accent	06b6d4	Couleur d’accent hex sans # pour boutons et tracé.
data-center	40.37,49.89	Centre initial de la carte dans l’ordre lat,lon.
data-profile	driving \| cycling \| walking	Profil par défaut ; disponibilité selon la couverture régionale.
data-lang	en \| az \| tr \| ru …	Langue des résultats de recherche.
data-height	480px	Hauteur du widget ; également définissable par CSS.
data-powered	true \| false	Afficher ou masquer le badge Powered by OSRMRoute.

Pour l’iframe, passez les mêmes options en paramètres de requête. ?theme=light&accent=22c55e

Cas d’utilisation

Recherche de points de vente

Aidez les visiteurs à trouver vos adresses et leur itinéraire.

Temps de trajet des livraisons

Estimez la distance routière et le temps jusqu’au dépôt.

Planificateur d’itinéraires

Ajoutez des directions entre départ et destination pour voyages ou équipes terrain.

Page de contact

Affichez une carte interactive aux couleurs de votre entreprise.

Commencer l’intégration

Créez une clé API, limitez-la à votre domaine et ajoutez le code.

Obtenir votre clé API Documentation