function go() { var lon = document.getElementById("lon").value; var lat = document.getElementById("lat").value; var reverse= document.getElementById("reverse").checked; var limit = document.getElementById("limit").value; var graphIdx = document.getElementById("graph").selectedIndex; var graph = document.getElementById("graph").options[graphIdx].value ; var methodIdx = document.getElementById("method").selectedIndex; var method = document.getElementById("method").options[methodIdx].value ; var resultDiv = document.getElementById("result"); try { console.log(method); Gp.Services.isoCurve({ position: { x: lon, y: lat }, time: (method=="time" ? limit : null), distance: (method=="distance" ? limit : null), graph: graph, reverse: reverse, apiKey: "carte", onSuccess: function(result) { resultDiv.innerHTML = "<p>" + JSON.stringify(result) + "</p>" }, onFailure: function(error) { resultDiv.innerHTML = "<p>" + error + "</p>" } }); } catch (e) { resultDiv.innerHTML = "<p>" + e + "</p>" } } var infoDiv = document.getElementById("info"); infoDiv.innerHTML = "<p> Bibliothèque d'accès version " + Gp.servicesVersion + " (" + Gp.servicesDate + ")</p>";
<div id="params"> <p> longitude : <input type="text" id="lon" size="10"/> latitude : <input type="text" id="lat" size="10"/> </p> <p> <input type="checkbox" value="true" id="reverse"> Position d'arrivée </p> <p>Methode de calcul : <select id="method"> <option value="time">Isochrones</option> <option value="distance">Isodistances</option> </select> </p> <p> Limite de temps (secondes) ou de distance (m) <input type="text" id="limit" size="10"/> </p> <p>Graphe : <select id="graph"> <option value="Pieton">Piéton</option> <option value="Voiture">Voiture</option> </select> </p> </div> <div id="go"> <input type="button" value="IsoChrone" onclick="go()" /> </div> <div id="result"></div> <div id="info"></div>
#params { width: 100%; height: 200px; box-shadow: 0 0 10px #999; font-family: monospace; padding: 5px; } #go { padding: 5px; float: center; width: 100%; height: 30px; } #result { padding: 5px; width: 100%; height: 200px; box-shadow: 0 0 10px #999; font-family: monospace; overflow: scroll; } #info { padding: 5px; width: 100%; height: 20px; font-family: monospace; }