Modifier le cadre géographique par défaut d’un widget - via le code d’intégration

Introduction

Vous souhaitez gagner du temps et ne pas créer un Widget Itinéraires pour chaque page de votre site ? C’est possible !

Ce tutoriel technique vous permettra de modifier le cadre affiché par défaut sur votre widget. Il n’aura pas d’impact sur les données qu’il contient.

Notez que dès que l’utilisateur bougera la carte, la nouvelle position sera mémorisée la place de celle par défaut (le paramètre étant mis à jour dans l’url).

Si vous souhaitez plutôt faire un filtrage « permanent » sur une zone (centre/rayon), référez-vous à cet autre tutoriel qui vous permettra également de ne pas afficher les données en dehors de la zone définie.

Cas A – Version PHP (recommandé)

  1. Comme pour une insertion classique, récupérez depuis l’interface le code d’insertion PHP du type :
<?php
$code_html = file_get_contents("https://www.modulesbox.com/fr/api/module/XXX?mb_key=XXX&".$_SERVER["QUERY_STRING"]);
echo $code_html;
?>
  1. Récupérez ensuite le « bounds », c’est à dire le cadre que vous souhaitez définir. Il s’agit en fait des deux coordonnées géographique représentant le cadre :

    • Latitude/longitude du coin en bas à gauche

    • Latitude longitude du coin en haut à droite

  2. Ajoutez ensuite en paramètre de votre code d’intégration (paramètre « mb_bounds ») les coordonnées au format ci-dessous : [45.8728,-0.630684,45.981457,-0.199471]
  3. Le code devrait donc ressembler à ça :
<?php
$code_html = file_get_contents("https://www.modulesbox.com/fr/api/module/XXX?mb_key=XXX&mb_bounds=[LATITUDE_BAS_GAUCHE,LONGITUDE_BAS_GAUCHE,LATITUDE_HAUT_DROIT,LONGITUDE_HAUT_DROIT]&".$_SERVER["QUERY_STRING"]);
echo $code_html;
?>

Cas B – Version JavaScript

  1. Comme pour une insertion classique, récupérez depuis l’interface le code d’insertion PHP du type :
<script type="text/javascript" src="https://www.modulesbox.com/js/module-loader.js" id="mb-module-loader"></script>
<script type="text/javascript">
	mbLoadModule({ id: XXX, locale: "fr"});
</script>
<div id="mb-module-XXX"></div>
  1. Récupérez ensuite le « bounds », c’est à dire le cadre que vous souhaitez définir. Il s’agit en fait des deux coordonnées géographique représentant le cadre :

    • Latitude/longitude du coin en bas à gauche

    • Latitude longitude du coin en haut à droite

  2. Ajoutez ensuite en paramètre de votre code d’intégration (paramètre « mb_bounds ») les coordonnées au format ci-dessous : [45.8728,-0.630684,45.981457,-0.199471]
  3. Le code devrait donc ressembler à ça :
<script type="text/javascript" src="https://www.modulesbox.com/js/module-loader.js" id="mb-module-loader"></script>
<script type="text/javascript">
	mbLoadModule({ id: XXX, locale: "fr",
	params:{
	    mb_bounds : "[LATITUDE_BAS_GAUCHE,LONGITUDE_BAS_GAUCHE,LATITUDE_HAUT_DROIT,LONGITUDE_HAUT_DROIT]"
	}});
</script>
<div id="mb-module-XXX"></div>