<!DOCTYPE html>
<html>
<title>Calculateur d'itinéraire</title>
<meta name="KeyWords" content="itineraire,google,maps,plan de ville,carte,depart,arrivee,kilometrage,parcours,route,trajet,plan,deplacement,voyage,tourisme,adresse,ville,village,carte routiere,google maps,calcul d'itineraire,distance,chemin,geolocalisation,routier,autoroute,automobile,voiture,auto,acces,pays,region">
<META http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<META NAME="Generator" CONTENT="NotePad++">
<META name="Copyright" content="Copyright VDC">
<META NAME="Author" CONTENT="VDC">
<META NAME="OWNER" CONTENT="VDC">
<META name="Rating" content="general">
<META name="revisit-after" content="15 days">
<META name="robots" content="index, follow">
<META name="Robots" content="All">
<META http-equiv="Content-Language" content="fr">
<style type="text/css">
body { font-family: Arial, Verdana, sans serif; font-size: 11px; margin: 2px; }
table.iti { background-color: #FFFFFF; font-size: 11px; margin: 4px; }
table.directions th { background-color:#EEEEEE; font-size: 15px;}
table.directions td { font-size: 11px;}
img { color: #000000; }
#map_canvas { width: 446px; height: 400px; border: 1px solid #333333 ; margin: 0px;}
#directions { width: 246px; height: 400px; border: 1px solid #333333 ; margin: 2px; overflow: auto; width: auto; text-align: left; font-size: 9px; }
</style>
<style type="text/css" media="print">
.print { display:none; }
#directions { width: 600px; height: auto; border: 1px solid #333333; margin: 2px; text-align: left; font-size: 9px; }
</style>
<script src=" http://maps.google.com/?file=api&v=2.x&key=ABQIAAAAFw0lDRKsdCra15LPvIxvehRjMgnVhZHmNh95BVtUkp0XgfXLlhSXfnSAP-eiQqfEOGaImc_V_dSQGQ" 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_canvas"));
gdir = new GDirections(map, document.getElementById("directions"));
GEvent.addListener(gdir, "load", onGDirectionsLoad); <!-- Charge la partie pour les distances -->
GEvent.addListener(gdir, "error", handleErrors); <!-- Charge la partie pour les messages d erreurs -->
map.setCenter(new GLatLng(46.98025, 3.66943), 6);
map.addControl(new GMapTypeControl());
map.addControl(new GLargeMapControl());
map.addControl(new GOverviewMapControl());
map.addControl(new GScaleControl());
map.enableScrollWheelZoom();
}
}
function setDirections(fromAddress, toAddress, locale)
{
gdir.load("from: " + fromAddress + " to: " + toAddress, { "locale": locale });
}
function handleErrors()
{
if (gdir.getStatus().code == G_GEO_UNKNOWN_ADDRESS)
alert("Aucune location géographique correspondante n'a pu être trouvée pour l'une des adresses spécifiées.\n Ce peut être du à une adresse récente, ou incorrecte.\nN'oubliez pas d'ajouter dans l'adresse le pays (en anglais).\nError code: " + gdir.getStatus().code);
else if (gdir.getStatus().code == G_GEO_SERVER_ERROR)
alert("La demande d'itinéraire n'a pu être calculée avec succès, aucune raison de l'échec n'est connu.\n Error code: " + gdir.getStatus().code);
else if (gdir.getStatus().code == G_GEO_MISSING_QUERY)
alert("The HTTP q parameter was either missing or had no value. For geocoder requests, this means that an empty address was specified as input. For directions requests, this means that no query was specified in the input.\n Error code: " + gdir.getStatus().code);
else if (gdir.getStatus().code == G_GEO_BAD_KEY)
alert("La clé (Key) n'est pas valide ou ne correspond pas au nom de domaine. \n Error code: " + gdir.getStatus().code);
else if (gdir.getStatus().code == G_GEO_BAD_REQUEST)
alert("La demande d'itinéraire n'a pu être correctement parsé.\n Error code: " + gdir.getStatus().code);
else alert("Une erreur inconnue est survenue.");
}
function onGDirectionsLoad()
{
var reg=new RegExp(" ", "g");
kilometrage = gdir.getDistance().html;
document.getElementById("km").value = kilometrage.replace(reg,' ');
}
</script>
</head>
<BODY BGCOLOR="#FFFFFF" TEXT="#000000" leftmargin="0" rightmargin="0" topmargin="0" bottommargin="0" marginheight="0" marginwidth="0" onLoad="initialize();" onUnload="GUnload()">
<form id="monFormulaire" method="post" action="#" onSubmit="setDirections(this.from.value, this.to.value, 'fr'); return false">
<table width="696" border="0" class="iti">
<tr valign="top">
<td align="right" width="100"><strong>Départ :</strong></td><td align="left" width="476"><input type="text" id="fromAddress" name="from" size="70"></td>
<td align="right" rowspan="3" width="120" valign="middle"><input name="gogogo" type="submit" value="Itinéraire" /></td>
</tr>
<tr><td align="right"><strong>Arrivée :</strong></td><td align="left"><input type="text" id="toAddress" name="to" size="70"></td></tr>
<tr><td align="right"><strong>Kilométrage :</strong></td><td><input type="text" id="km" value="" size="9" disabled > Il est conseillé d'ajouter le pays (en anglais) dans l'adresse !</td></tr>
<tr><td colspan="2">
<center>
<script type="text/javascript"><!--
google_ad_client = "pub-6860157129998313";
google_ad_width = 468;
google_ad_height = 15;
google_ad_format = "468x15_0ads_al_s";
google_ad_channel = "";
google_color_border = "336699";
google_color_bg = "D8E9EC";
google_color_link = "FFFF00";
google_color_text = "0000FF";
google_color_url = "CCCCCC";
//--></script>
<script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"></script><br>
</center>
</td><td align="center"><A href="javascript:window.print()"><img src="http://icdn.pro/images/fr/i/m/imprimante-icone-9549-128.png" width="32" height="32" border="0" alt="Imprimer l'itinéraire" title="Imprimer l'itinéraire"></A>
</td></tr>
</table>
<table width="700" border="0" class="directions" cellspacing="1" cellpadding="0">
<tr><th width="246">Itinéraire détaillé</th><th width="446" class="print">Carte</th></tr>
<tr><td><div id="directions"></td><td><div id="map_canvas" class="print"></div></td></tr>
</table>
</form>
</BODY>
</html>
<title></title>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no"><meta charset="utf-8">
<style type="text/css">html, body {
height: 100%;
margin: 0;
padding: 0;
}
#map {
height: 100%;
}
</style>
<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500" rel="stylesheet" type="text/css" />
<style type="text/css">#locationField, #controls {
position: relative;
width: 480px;
}
#autocomplete {
position: absolute;
top: 0px;
left: 0px;
width: 99%;
}
.label {
text-align: right;
font-weight: bold;
width: 100px;
color: #303030;
}
#address {
border: 1px solid #000090;
background-color: #f0f0ff;
width: 480px;
padding-right: 2px;
}
#address td {
font-size: 10pt;
}
.field {
width: 99%;
}
.slimField {
width: 80px;
}
.wideField {
width: 200px;
}
#locationField {
height: 20px;
margin-bottom: 2px;
}
</style>
<div id="locationField"><input id="autocomplete" onfocus="geolocate()" placeholder="Adresse de depart" type="text" /></div>
<script>
// This example displays an address form, using the autocomplete feature
// of the Google Places API to help users fill in the information.
var placeSearch, autocomplete;
var componentForm = {
street_number: 'short_name',
route: 'long_name',
locality: 'long_name',
administrative_area_level_1: 'short_name',
country: 'long_name',
postal_code: 'short_name'
};
function initAutocomplete() {
// Create the autocomplete object, restricting the search to geographical
// location types.
autocomplete = new google.maps.places.Autocomplete(
/** @type {!HTMLInputElement} */(document.getElementById('autocomplete')),
{types: ['geocode']});
// When the user selects an address from the dropdown, populate the address
// fields in the form.
autocomplete.addListener('place_changed', fillInAddress);
}
// [START region_fillform]
function fillInAddress() {
// Get the place details from the autocomplete object.
var place = autocomplete.getPlace();
for (var component in componentForm) {
document.getElementById(component).value = '';
document.getElementById(component).disabled = false;
}
// Get each component of the address from the place details
// and fill the corresponding field on the form.
for (var i = 0; i < place.address_components.length; i++) {
var addressType = place.address_components[i].types[0];
if (componentForm[addressType]) {
var val = place.address_components[i][componentForm[addressType]];
document.getElementById(addressType).value = val;
}
}
}
// [END region_fillform]
// [START region_geolocation]
// Bias the autocomplete object to the user's geographical location,
// as supplied by the browser's 'navigator.geolocation' object.
function geolocate() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function(position) {
var geolocation = {
lat: position.coords.latitude,
lng: position.coords.longitude
};
var circle = new google.maps.Circle({
center: geolocation,
radius: position.coords.accuracy
});
autocomplete.setBounds(circle.getBounds());
});
}
}
// [END region_geolocation]
</script><script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyA5IBUOyREvxhx2QnPtL0mMBGV9ahRT9-E&signed_in=true&libraries=places&callback=initAutocomplete"
async defer></script>
<p>Distance de votre parcours :<input id="distance" name="distance" required="" type="Kilometre" /> Nombre de personnes:<input id="NbPassager" name="Nombre de personnes" required="" type="number" /></p>
<p> </p>
<p><input onclick="calculer();" type="button" value="Calculer" /></p>
<p> </p>
<p>Tarifs (en €)<input id="Tarifs" name="tarifs" required="" type="price" /></p>
<script type="text/javascript">
function calculer(){
var Distance = document.getElementById('distance').value;
var Tarifs = document.getElementById('Tarifs');
var nbPassager = parseInt(document.getElementById('NbPassager').value);
//ici ton code de calcul...
var X = parseFloat(Distance);
var tarifKM;
var prixPassager;
console.log("Distance :"+Distance);
console.log("X :"+X);
console.log("NB Passagers :"+nbPassager);
if(X>=1 && X<=4){
tarifKM = 2*X;
prixPassager=2*(nbPassager-1);
}
if(X>=5 && X<=29){
tarifKM = 2*X;
prixPassager=1*(nbPassager-1);
}
if(X>=30 && X<=44){
if(nbPassager<3){
tarifKM = 1.90*X;
prixPassager=0;
}else{
tarifKM = 0;
prixPassager = 20 + ((nbPassager -1) * 10);
}
}
if(X>=45){
if(nbPassager<3){
tarifKM = 1.90*X;
prixPassager=0;
}else{
tarifKM = 0;
prixPassager = 30 + ((nbPassager -1) * 10);
}
}
var resultat = tarifKM + prixPassager;
Tarifs.value = resultat;
}
</script>
<!--DOCTYPE html-->
<html>
<title>Calculateur d'itinéraire</title>
<meta name="KeyWords" content="itineraire,google,maps,plan de ville,carte,depart,arrivee,kilometrage,parcours,route,trajet,plan,deplacement,voyage,tourisme,adresse,ville,village,carte routiere,google maps,calcul d'itineraire,distance,chemin,geolocalisation,routier,autoroute,automobile,voiture,auto,acces,pays,region">
<META http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<META NAME="Generator" CONTENT="NotePad++">
<META name="Copyright" content="Copyright VDC">
<META NAME="Author" CONTENT="VDC">
<META NAME="OWNER" CONTENT="VDC">
<META name="Rating" content="general">
<META name="revisit-after" content="15 days">
<META name="robots" content="index, follow">
<META name="Robots" content="All">
<META http-equiv="Content-Language" content="fr">
<style type="text/css">
body { font-family: Arial, Verdana, sans serif; font-size: 11px; margin: 2px; }
table.iti { background-color: #FFFFFF; font-size: 11px; margin: 4px; }
img { color: #000000; }
</style>
<script src=" http://maps.google.com/?file=api&v=2.x&key=ABQIAAAAFw0lDRKsdCra15LPvIxvehRjMgnVhZHmNh95BVtUkp0XgfXLlhSXfnSAP-eiQqfEOGaImc_V_dSQGQ" type="text/javascript"></script>
<script type="text/javascript">
var gdir;
function initialize()
{
if (GBrowserIsCompatible()){
gdir = new GDirections(null, null);
GEvent.addListener(gdir, "load", onGDirectionsLoad); <!-- Charge la partie pour les distances -->
GEvent.addListener(gdir, "error", handleErrors); <!-- Charge la partie pour les messages d erreurs -->
}
}
function setDirections(fromAddress, toAddress, locale){
gdir.load("from: " + fromAddress + " to: " + toAddress, { "locale": locale });
}
function handleErrors(){
if (gdir.getStatus().code == G_GEO_UNKNOWN_ADDRESS) alert("Aucune location géographique correspondante n'a pu être trouvée pour l'une des adresses spécifiées.\n Ce peut être du à une adresse récente, ou incorrecte.\nN'oubliez pas d'ajouter dans l'adresse le pays (en anglais).\nError code: " + gdir.getStatus().code);
else if (gdir.getStatus().code == G_GEO_SERVER_ERROR) alert("La demande d'itinéraire n'a pu être calculée avec succès, aucune raison de l'échec n'est connu.\n Error code: " + gdir.getStatus().code);
else if (gdir.getStatus().code == G_GEO_MISSING_QUERY) alert("The HTTP q parameter was either missing or had no value. For geocoder requests, this means that an empty address was specified as input. For directions requests, this means that no query was specified in the input.\n Error code: " + gdir.getStatus().code);
else if (gdir.getStatus().code == G_GEO_BAD_KEY) alert("La clé (Key) n'est pas valide ou ne correspond pas au nom de domaine. \n Error code: " + gdir.getStatus().code);
else if (gdir.getStatus().code == G_GEO_BAD_REQUEST) alert("La demande d'itinéraire n'a pu être correctement parsé.\n Error code: " + gdir.getStatus().code);
else alert("Une erreur inconnue est survenue.");
}
function onGDirectionsLoad() {
var reg=new RegExp(" ", "g");
kilometrage = gdir.getDistance().html;
document.getElementById("km").value = kilometrage.replace(reg,' ');
}
</script>
</head>
<BODY BGCOLOR="#FFFFFF" TEXT="#000000" leftmargin="0" rightmargin="0" topmargin="0" bottommargin="0" marginheight="0" marginwidth="0" onLoad="initialize();" onUnload="GUnload()">
<form id="monFormulaire" method="post" action="#" onSubmit="setDirections(this.from.value, this.to.value, 'fr'); return false">
<table width="696" border="0" class="iti">
<tr valign="top">
<td align="right" width="100"><strong>Départ :</strong></td><td align="left" width="476"><input type="text" id="fromAddress" name="from" size="70"></td>
<td align="right" rowspan="3" width="120" valign="middle"><input name="gogogo" type="submit" value="Itinéraire" /></td>
</tr>
<tr><td align="right"><strong>Arrivée :</strong></td><td align="left"><input type="text" id="toAddress" name="to" size="70"></td></tr>
<tr><td align="right"><strong>Kilométrage :</strong></td><td><input type="text" id="km" value="" size="9" disabled > Il est conseillé d'ajouter le pays (en anglais) dans l'adresse !</td></tr>
<tr><td colspan="2">
</td><td align="center"><A href="javascript:window.print()"><img src="http://icdn.pro/images/fr/i/m/imprimante-icone-9549-128.png" width="32" height="32" border="0" alt="Imprimer l'itinéraire" title="Imprimer l'itinéraire"></A>
</td></tr>
</table>
</form>
</BODY>
</html>
<title></title>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no"><meta charset="utf-8">
<style type="text/css">html, body {
height: 100%;
margin: 0;
padding: 0;
}
#map {
height: 100%;
}
</style>
<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500" rel="stylesheet" type="text/css" />
<style type="text/css">#locationField, #controls {
position: relative;
width: 480px;
}
#autocomplete {
position: absolute;
top: 0px;
left: 0px;
width: 99%;
}
.label {
text-align: right;
font-weight: bold;
width: 100px;
color: #303030;
}
#address {
border: 1px solid #000090;
background-color: #f0f0ff;
width: 480px;
padding-right: 2px;
}
#address td {
font-size: 10pt;
}
.field {
width: 99%;
}
.slimField {
width: 80px;
}
.wideField {
width: 200px;
}
#locationField {
height: 20px;
margin-bottom: 2px;
}
</style>
<div id="locationField"><input id="autostart" onfocus="geolocate()" placeholder="Adresse de depart" type="text" /></div>
<div id="locationField"><input id="autoend" onfocus="geolocate()" placeholder="Adresse de fin" type="text" /></div>
<script>
// This example displays an address form, using the autocomplete feature
// of the Google Places API to help users fill in the information.
var placeSearch, autoend, autostart;
var componentForm = {
street_number: 'short_name',
route: 'long_name',
locality: 'long_name',
administrative_area_level_1: 'short_name',
country: 'long_name',
postal_code: 'short_name'
};
function initAutocomplete() {
autostart = new google.maps.places.Autocomplete((document.getElementById('autostart')),{types: ['geocode']});
autoend = new google.maps.places.Autocomplete((document.getElementById('autoend')),{types: ['geocode']});
// When the user selects an address from the dropdown, populate the address fields in the form.
autostart.addListener('place_changed', fillInAddress);
autoend.addListener('place_changed', fillInAddress);
}
function fillInAddress() {
// Get the place details from the autocomplete object.
var place
if(document.activeElement.id== "autostart"){
place = autostart.getPlace();
} else {
place = autoend.getPlace();
}
for (var component in componentForm) {
document.getElementById(component).value = '';
document.getElementById(component).disabled = false;
}
// Get each component of the address from the place details and fill the corresponding field on the form.
for (var i = 0; i < place.address_components.length; i++) {
var addressType = place.address_components[i].types[0];
if (componentForm[addressType]) {
var val = place.address_components[i][componentForm[addressType]];
document.getElementById(addressType).value = val;
}
}
}
// Bias the autocomplete object to the user's geographical location, as supplied by the browser's 'navigator.geolocation' object.
function geolocate() {
if (navigator.geolocation) {
var autocomplete;
if(document.activeElement.id== ""){
autocomplete = autostart.getPlace();
} else {
autocomplete = autoend.getPlace();
}
navigator.geolocation.getCurrentPosition(function(position) {
var geolocation = {
lat: position.coords.latitude,
lng: position.coords.longitude
};
var circle = new google.maps.Circle({
center: geolocation,
radius: position.coords.accuracy
});
autocomplete.setBounds(circle.getBounds());
});
}
}
// [END region_geolocation]
</script><script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyA5IBUOyREvxhx2QnPtL0mMBGV9ahRT9-E&signed_in=true&libraries=places&callback=initAutocomplete" async defer></script>
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre questiondocument.activeElement.id== ""
document.activeElement.id== "autostart"
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyA5IBUOyREvxhx2QnPtL0mMBGV9ahRT9-E&signed_in=true&libraries=places,geometry&callback=initPage" async defer></script> <div id="locationField"><input id="autostart" placeholder="Adresse de depart" type="text" /></div> <div id="locationField"><input id="autoend" placeholder="Adresse de fin" type="text" /></div> <a onClick="getDistance()" href="#" rel="nofollow noopener noreferrer" target="_blank"> test </a> <script> var autoend, autostart; function initPage() { autostart = new google.maps.places.Autocomplete((document.getElementById('autostart')),{types: ['geocode']}); autoend = new google.maps.places.Autocomplete((document.getElementById('autoend')),{types: ['geocode']}); } function getDistance(){ var a = autostart.getPlace(); var FROM = a.geometry.location; a = autoend.getPlace(); var TO = a.geometry.location; var kiloM = (google.maps.geometry.spherical.computeDistanceBetween(FROM, TO)) / 1000); alert(kiloM); } </script>
function getDistance(){ var a = autostart.getPlace(); var FROM = a.geometry.location; a = autoend.getPlace(); var TO = a.geometry.location; var request = { origin:FROM, destination:TO , travelMode: google.maps.TravelMode.DRIVING }; var directionsService = new google.maps.DirectionsService(); directionsService.route(request, function(result, status) { if (status == google.maps.DirectionsStatus.OK) { var meterDistance = result.routes[0].legs[0].distance.value; alert(meterDistance); //-----ici meterDistance est la distance en metre qui sépart les deux lieux par la route } }); }
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyA5IBUOyREvxhx2QnPtL0mMBGV9ahRT9-E&signed_in=true&libraries=places,geometry&callback=initPage"
async defer></script>
<div id="locationField"><input id="autostart" placeholder="Adresse de depart" type="text" /></div>
<div id="locationField"><input id="autoend" placeholder="Adresse de fin" type="text" /></div>
<a onClick="getDistance()" href="#" rel="nofollow noopener noreferrer" target="_blank"> test </a>
<script>
var autoend, autostart;
function initPage() {
autostart = new google.maps.places.Autocomplete((document.getElementById('autostart')),{types: ['geocode']});
autoend = new google.maps.places.Autocomplete((document.getElementById('autoend')),{types: ['geocode']});
}
function getDistance(){
var a = autostart.getPlace();
var FROM = a.geometry.location;
a = autoend.getPlace();
var TO = a.geometry.location;
var request = {
origin:FROM,
destination:TO ,
travelMode: google.maps.TravelMode.DRIVING
};
var directionsService = new google.maps.DirectionsService();
directionsService.route(request, function(result, status) {
if (status == google.maps.DirectionsStatus.OK) {
var meterDistance = result.routes[0].legs[0].distance.value;
alert(meterDistance);
//-----ici meterDistance est la distance en metre qui sépart les deux lieux par la route
}
});
}
}
</script>
<a onClick="getDistance()" href="#" rel="nofollow noopener noreferrer" target="_blank"> test </a>
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyA5IBUOyREvxhx2QnPtL0mMBGV9ahRT9-E&signed_in=true&libraries=places,geometry&callback=initPage"
async defer></script>
<input id="autostart" placeholder="Adresse de depart" type="text" /><br />
<input id="autoend" placeholder="Adresse de fin" type="text" /><br />
Tarifs: <input type="price" id="tar" /><br />
Passagers: <input type="text" id="pass" /><br />
<input onclick="getDistance();" type="button" value="Calculer" />
<br /><br />
Kilometres: <input type="text" id="kilom" /><br />
Prix: <input type="price" id="prix" /><br />
<script>
var autoend, autostart;
function initPage() {
autostart = new google.maps.places.Autocomplete((document.getElementById('autostart')),{types: ['geocode']});
autoend = new google.maps.places.Autocomplete((document.getElementById('autoend')),{types: ['geocode']});
}
function getDistance(){
var a = autostart.getPlace();
var FROM = a.geometry.location;
a = autoend.getPlace();
var TO = a.geometry.location;
var request = {
origin:FROM,
destination:TO ,
travelMode: google.maps.TravelMode.DRIVING
};
var directionsService = new google.maps.DirectionsService();
directionsService.route(request, function(result, status) {
if (status == google.maps.DirectionsStatus.OK) {
var meterDistance = result.routes[0].legs[0].distance.value;
var tarif = parseInt(document.getElementById('tar').value);
var nbPassager = parseInt(document.getElementById('pass').value);
var Distance = parseInt(meterDistance/1000);
var X = parseFloat(Distance);
var tarifKM;
var prixPassager;
if(X>=1 && X<=4){
tarifKM = 2*X;
prixPassager=2*(nbPassager-1);
}
if(X>=5 && X<=29){
tarifKM = 2*X;
prixPassager=1*(nbPassager-1);
}
if(X>=30 && X<=44){
if(nbPassager<3){
tarifKM = 1.90*X;
prixPassager=0;
}else{
tarifKM = 0;
prixPassager = 20 + ((nbPassager -1) * 10);
}
}
if(X>=45){
if(nbPassager<3){
tarifKM = 1.90*X;
prixPassager=0;
}else{
tarifKM = 0;
prixPassager = 30 + ((nbPassager -1) * 10);
}
}
var resultat = tarifKM + prixPassager;
document.getElementById('prix').value = resultat;
document.getElementById('kilom').value = Distance;
}
});
}
</script>
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyA5IBUOyREvxhx2QnPtL0mMBGV9ahRT9-E&signed_in=true&libraries=places,geometry&callback=initPage"
async defer></script>
<input id="autostart" placeholder="Adresse de depart" type="text" /><br />
<input id="autoend" placeholder="Adresse de fin" type="text" /><br />
Passagers: <input type="text" id="pass" /><br />
<input onclick="getDistance();" type="button" value="Calculer" />
<br /><br />
Kilometres: <input type="text" id="kilom" /><br />
Prix: <input type="price" id="prix" /><br />
<script>
var autoend, autostart;
function initPage() {
autostart = new google.maps.places.Autocomplete((document.getElementById('autostart')),{types: ['geocode']});
autoend = new google.maps.places.Autocomplete((document.getElementById('autoend')),{types: ['geocode']});
}
function getDistance(){
var a = autostart.getPlace();
var FROM = a.geometry.location;
a = autoend.getPlace();
var TO = a.geometry.location;
var request = {
origin:FROM,
destination:TO ,
travelMode: google.maps.TravelMode.DRIVING
};
var directionsService = new google.maps.DirectionsService();
directionsService.route(request, function(result, status) {
if (status == google.maps.DirectionsStatus.OK) {
var meterDistance = result.routes[0].legs[0].distance.value;
var prix = parseInt(document.getElementById('prix').value);
var nbPassager = parseInt(document.getElementById('pass').value);
var Distance = parseInt(meterDistance/1000);
var X = parseFloat(Distance);
var tarifKM;
var prixPassager;
if(X>=1 && X<=4){
tarifKM = 2*X;
prixPassager=2*(nbPassager-1);
}
if(X>=5 && X<=29){
tarifKM = 2*X;
prixPassager=1*(nbPassager-1);
}
if(X>=30 && X<=44){
if(nbPassager<3){
tarifKM = 1.90*X;
prixPassager=0;
}else{
tarifKM = 0;
prixPassager = 20 + ((nbPassager -1) * 10);
}
}
if(X>=45){
if(nbPassager<3){
tarifKM = 1.90*X;
prixPassager=0;
}else{
tarifKM = 0;
prixPassager = 30 + ((nbPassager -1) * 10);
}
}
var resultat = tarifKM + prixPassager;
document.getElementById('prix').value = resultat;
document.getElementById('kilom').value = Distance;
}
});
}
</script>
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyA5IBUOyREvxhx2QnPtL0mMBGV9ahRT9-E&signed_in=true&libraries=places,geometry&callback=initPage" async defer></script> <input id="autostart" placeholder="Adresse de depart" type="text" /><br /> <input id="autoend" placeholder="Adresse de fin" type="text" /><br /> Passagers: <input type="text" id="pass" /><br /> <input onclick="getDistance();" type="button" value="Calculer" /> <br /><br /> Kilometres: <input type="text" id="kilom" /><br /> <DIV id='ResTar' > </DIV> <script> var autoend, autostart; function initPage() { autostart = new google.maps.places.Autocomplete((document.getElementById('autostart')),{types: ['geocode']}); autoend = new google.maps.places.Autocomplete((document.getElementById('autoend')),{types: ['geocode']}); } function getDistance(){ var a = autostart.getPlace(); var FROM = a.geometry.location; a = autoend.getPlace(); var TO = a.geometry.location; var request = { origin:FROM, destination:TO , travelMode: google.maps.TravelMode.DRIVING }; var directionsService = new google.maps.DirectionsService(); directionsService.route(request, function(result, status) { if (status == google.maps.DirectionsStatus.OK) { var meterDistance = result.routes[0].legs[0].distance.value; var nbPassager = parseInt(document.getElementById('pass').value); var Distance = parseInt(meterDistance/1000); var X = parseFloat(Distance); var tarifKM; var prixPassager; if(X>=1 && X<=4){ tarifKM = 2*X; prixPassager=2*(nbPassager-1); } if(X>=5 && X<=29){ tarifKM = 2*X; prixPassager=1*(nbPassager-1); } if(X>=30 && X<=44){ if(nbPassager<3){ tarifKM = 1.90*X; prixPassager=0; }else{ tarifKM = 0; prixPassager = 20 + ((nbPassager -1) * 10); } } if(X>=45){ if(nbPassager<3){ tarifKM = 1.90*X; prixPassager=0; }else{ tarifKM = 1.90*X; prixPassager = 30 + ((nbPassager -1) * 10); } } var resultat = tarifKM + prixPassager; var contentResHTML = 'Prix total: <input type="price" id="prix" value="'+prixPassager+'" /><br />' if( nbPassager > 1 ) { contentResHTML += 'Tarif Kilometrique: <input type="price" id="KiloTar" value="'+tarifKM+'" /><br />' contentResHTML += 'Supplement pour ' + nbPassager + ' passagers : <input type="price" id="tarSupp" value="'+prixPassager+'" /><br />' } document.getElementById('ResTar').innerHTML = contentResHTML; document.getElementById('kilom').value = Distance; } }); } </script>
if(X>=45){ if(nbPassager<3){ tarifKM = 1.90*X; prixPassager=0; }else{ tarifKM = 0; // JE CHANGE CA prixPassager = 30 + ((nbPassager -1) * 10); } }
if(X>=45){ if(nbPassager<3){ tarifKM = 1.90*X; prixPassager=0; }else{ tarifKM = 1.90*X; prixPassager = 30 + ((nbPassager -1) * 10); } }
var resultat = tarifKM + prixPassager + 1;
var contentResHTML = 'Prix total: <input type="price" id="prix" value="'+resultat+'" /><br />'
if( nbPassager > 2 && X>=30 && X<=44) {
contentResHTML += 'DONT: <input type="price" id="KiloTar" value="20 euros pour le premier passager" /><br />'
contentResHTML += 'ET: <input type="price" id="tarSupp" value=" 10 euros / passagers supplémentaire" /><br />'
var resultat = tarifKM + prixPassager + 1;
var contentResHTML = 'Prix total: <input type="price" id="prix" value="'+resultat+'" /><br />'
if( nbPassager > 2 && X>45) {
contentResHTML += 'DONT: <input type="price" id="KiloTar" value="20 euros pour le premier passager" /><br />'
contentResHTML += 'ET: <input type="price" id="tarSupp" value=" 20 euros / passagers supplémentaire" /><br />'
if(X>=1 && X<=4){
tarifKM = X;
prixPassager=2*(nbPassager-1);
}
if(X>=5 && X<=29){
tarifKM = X;
prixPassager=1*(nbPassager-1);
}
if(X>=30 && X<=44){
if(nbPassager<3){
tarifKM = 0.90*X;
prixPassager=0;
}else{
tarifKM = 0.90*X;
prixPassager = 20 + ((nbPassager -1) * 10);
}
}
if(X>=45){
if(nbPassager<3){
tarifKM = 0.90*X;
prixPassager=0;
}else{
tarifKM = 0.90*X;
prixPassager = 30 + ((nbPassager -1) * 10);
}
}
var resultat = tarifKM + prixPassager + 1;
var X = parseFloat(Distance);
var descripAdditionnal= ''; //--Ici
var tarifKM;
var prixPassager;
if(X>=5 && X<=29){
tarifKM = X;
prixPassager=1*(nbPassager-1);
descripAdditionnal = "1e supplémentaire par passagers"
}
if( nbPassager > 1 ) {
contentResHTML += 'Tarif Kilometrique: <input type="price" id="KiloTar" value="'+tarifKM+'" /><br />'
contentResHTML += 'Supplement pour ' + nbPassager + ' passagers : <input type="price" id="tarSupp" value="'+prixPassager+'" /><br />'
contentResHTML += '<p>'+descripAdditionnal+"</p>";
}
var directionsService = new google.maps.DirectionsService(); directionsService.route(request, function(result, status) { if (status == google.maps.DirectionsStatus.OK) { var meterDistance = result.routes[0].legs[0].distance.value; var prix = parseInt(document.getElementById('prix').value); var type = parseInt(document.getElementById('type').value); var Distance = parseInt(meterDistance/1000); var X = parseFloat(Distance); var tarifKM; if(type='eco'){ tarifKM = X*2; } if(type='berline'){ tarifKM = X*2,5; } if(type='vanne'){ tarifKM = X*3; } document.getElementById('prix').value = tarifKM; document.getElementById('kilom').value = Distance; }
30 sept. 2016 à 13:35
Tu trouveras les discussions de la demoiselle sur CCM : http://www.commentcamarche.net/forum/s/u/ophelie1512