[API Google] récupérer la distance

Fermé
BARIS69330 Messages postés 20 Date d'inscription samedi 31 janvier 2009 Statut Membre Dernière intervention 30 novembre 2012 - 18 juin 2009 à 15:16
 Rom's - 20 mai 2010 à 09:50
Bonjour, je suis actuellement en stage et sur un projet de développement d'un API google

j'ai trouvé le script suivant qui récupère bien la valeur de la distance et l'affiche, mais une fois la partie du code qui effectue cela rentré dans notre propre code la récupération ne s'effectue pas. dsl si j'ai vraiment mal codé mais je suis débutant en javascript :/

<code type="html">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="generator" content="PSPad editor, www.pspad.com">
<title></title>
</code>
<code type="javascript">
<script src="http://maps.google.com/..." type="text/javascript"></script>
<script type="text/javascript">

var map;
var directionsPanel;
var directions;

function onLoad() {
map = new GMap2(document.getElementById("map"));
map.setCenter(new GLatLng(47.388355,0.688705), 10);
directionsPanel = document.getElementById("direction");


directions = new GDirections(map,directionsPanel);
directions.load("from: 75001 paris, FR to: 13001 marseille, FR");
GEvent.addListener(directions,"load", function() {

// Indique la distance sous cette forme : 157 km
var distance = directions.getDistance().html;

// Indique la distance sous cette forme : 157147
var mesure = directions.getDistance().meters;

// Indique la durée de l'itinéraire sous cette forme : 1 heure 58minutes
var duree = directions.getDuration().html;

// Indique les infos distance + temps sous cette forme : 157 km ( environ 1 heure 58 minutes )
var sommaire = directions.getSummaryHtml();

var prix=mesure * "0.001" * "0.2";

document.getElementById("distances").innerHTML="distance et temps estimé :" + sommaire;


alert("- Distance : "+ distance +"\n- Mesure : "+ mesure +"\n- Durée : "+ duree +"\n- Sommaire : " + sommaire + "\n- Cout supplémentaire: " + prix + " euros");
});
}
</script>
</code>

<code type="html">
</head>
<body onload="onLoad()" onunload="GUnload()">
<div id="map" style="width: 500px; height: 300px"></div>
<div id="direction"></div>
<div id="distances"></div>
</body>

</html>
</code>

NOTRE CODE

<code type="html">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>Itinéraire</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</code>
<code type="javascript">
<script src="http://maps.google.com/..." type="text/javascript"></script>
<script type="text/javascript">

var map;
var gdir;
var geocoder = null;
var addressMarker;

function initialize() {
if (GBrowserIsCompatible()) {
map = new GMap2(document.getElementById("map"));
map.setCenter(new GLatLng(45.756788, 4.831515), 5);
gdir = new GDirections(map, document.getElementById("direction"));
GEvent.addListener(gdir, "load", onGDirectionsLoad);
GEvent.addListener(gdir, "error", handleErrors);
var distance = gdir.getDistance().html;
var mesure = gdir.getDistance().meters;
var duree = gdir.getDuration().html;
var sommaire = gdir.getSummaryHtml();
var prix=mesure * "0.001" * "0.2";
document.getElementById("distances").innerHTML="distance et temps estimé :" + sommaire;
alert("- Distance : "+ distance +"\n- Mesure : "+ mesure +"\n- Durée : "+ duree +"\n- Sommaire : " + sommaire + "\n- Cout supplémentaire: " + prix + " euros");
}
}

function setDirections(fromAddress, toAddress, to2Address, locale) {
to3Address = toAddress + " " + to2Address;
gdir.load("from: " + fromAddress + " to: " + to3Address,{ "locale": locale });
}

function handleErrors(){
if (gdir.getStatus().code == G_GEO_UNKNOWN_ADDRESS)
alert("Pas d'adresse correspondante");
else if (gdir.getStatus().code == G_GEO_SERVER_ERROR)
alert("Une requête de géocodage ou de direction n'a pu être exécutée");

else if (gdir.getStatus().code == G_GEO_MISSING_QUERY)
alert("Le paramètre HTTP q manque ou n'a aucune valeur. Pour une requête de géocodage, ceci signifie qu'une adresse vide a été spécifiée comme entrée. Pour une requête de direction, ceci signifie qu'aucune requête n'a été spécifiée dans l'entrée.");

else if (gdir.getStatus().code == G_GEO_BAD_KEY)
alert("La clef donnée est invalide ou n'est pas assortit avec le domaine pour lequel elle a été donnée.");

else if (gdir.getStatus().code == G_GEO_BAD_REQUEST)
alert("Une requête de direction n'a pu être analysée.");

else alert("Erreur inconnue.");

}

</script>
</code>
<code type="html">
<style type="text/css">
<!--
body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
}
a:link {
color: #996633;
}
a:visited {
color: #666666;
}
-->
</style>
<link href="styles_suissegeo.css" rel="stylesheet" type="text/css">
</head>

<body onload="initialize()" onunload="GUnload()">

<div align="center"></div>

</td>
</tr>
<tr valign="top" bordercolor="#FFFFFF">
<td><table width="95%" border="0" align="center" cellpadding="2" cellspacing="0">
<tr>
<td>

<form action="#" onsubmit="setDirections(this.from.value, this.to.value, this.to2.value, this.locale.value); return false">

<table width="100%" align="center" class="povNormalnew">
<tr>
<th align="right">De: </th>
<td><select name="from" class="povNormalnew" id="fromAddress">
<option value="lyon" selected>Lyon</option>
<option value="paris">Paris</option>
<option value="reims">Reims</option>
<option value="grenoble">Grenoble</option>
<option value="annecy">Annecy</option>
<option value="cannes">Cannes</option>
<option value="nimes">Nimes</option>
<option value="frejus">Frejus</option>
<option value="marseille">Marseille</option>
<option value="montpellier">Montpellier</option>
<option value="bordeaux">Bordeaux</option>
<option value="angers">Angers</option>
<option value="toulouse">Toulouse</option>
</select>
<strong> à: </strong> <input name="to" type="text" class="povNormalnew" id="toAddress"
value="" size="50" /><strong> Pays: </strong><select name="to2" class="povNormalnew" id="to2Address">
<option value="france" selected>France</option>
<option value="suisse">Suisse</option>
<option value="belgique">Belgique</option>
</select></td>
</tr>
<tr>
<th align="right">Language: </th>

<td>
<select name="locale" class="povNormalnew" id="locale">
<option value="en">English</option>
<option value="fr" selected>Français</option>
<option value="de">Deutsch</option>
<option value="es">Spanish</option>

</select> <input name="submit" type="submit" class="povNormalnew" value="Voir l'itinéraire" />
</td>
</tr>
</table>
<table width="100%" class="povNormalnew">
<tr>
<th width="300" rowspan="2" align="left" valign="top"><div id="direction" style="width: 300px"></div></th>
<th height="420" valign="top"><br><div id="map" style="width: 400px; height: 400px"></div><br><div align="center" id="carteBig"></div></th>

</tr>
<tr>
<th align="center" valign="top"><p>
</p><br>
<p>


</p></th>
</tr>
</table>
</form>
<p align="center"> </p></td>
</tr>
</table></td>
</tr>
</table> </td>

<!-- <td width="25" background="images/BordD.jpg"> </td>-->
</tr>
<tr>
<td> </td>
<td><table width="100%" border="0" cellpadding="3" cellspacing="0" class="legende">
<tr valign="top">
<td> </td>
</tr>
</table>
</body>
</html>
</code>
A voir également:

1 réponse

http://www.astucesdewebmaster.com/dsi/itineraire-et-distance-via-http-php-par-ex-lapi-de-google-maps-a-evolue-253
0