Bibliothèque d'accès : Geocode

Utilisation de Gp.Services.geocode() avec options de filtrage

by Géoportail IGNF

HTML

<script src="https://ignf.github.io/geoportal-access-lib/latest/dist/GpServices.js"></script>
<div id="params">
<p>Localisant à géocoder :
    <input type="text" id="location" />
</p>
<p>Critères de Filtrages :</p>
<p>
    <input type="text" size="15" id="filterProp" /> :
    <input type="text" size="15" id="filterValue" />
</p>
<p>Type de Géocodage :
    <select id="type">
        <option value="PositionOfInterest">Toponymes</option>
        <option value="StreetAddress">Adresses</option>
        <option value="CadastralParcel">Parcelles Cadastrales</option>
    </select>
</p>
</div>
<div id="go">
<input type="button" value="Geocode" onclick="go()" />
</div>
<div id="result"></div>
<div id="info"></div>

CSS

#params {
    width: 100%;
    height: 200px;
    box-shadow: 0 0 10px #999;
    font-family: monospace;
}

#go {
    padding: 5px;
    float: center;
    width: 100%;
    height: 30px;
}
#result {
    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;
}

JavaScript

function go() {
    var resultDiv = document.getElementById("result");
    var typeIdx = document.getElementById("type").selectedIndex;
    var filterProp = document.getElementById("filterProp").value;
    var filterValue = document.getElementById("filterValue").value;
    var location = document.getElementById("location").value;
    var fo = {};
    if (filterProp && filterValue) fo[filterProp] = filterValue;
    fo.type = [document.getElementById("type").options[typeIdx].value];
    try {
        Gp.Services.geocode({
            location: location,
            filterOptions: fo,
            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>";