Leaflet Géoportail Ext : SearchEngine control
Utilisation de L.geoportalControl.SearchEngine
by Géoportail IGNF
HTML
<script src="https://unpkg.com/leaflet@1.0.1/dist/leaflet.js"></script>
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.0.1/dist/leaflet.css">
<script src="https://ignf.github.io/geoportal-extensions/leaflet-latest/dist/GpPluginLeaflet.js"></script>
<link rel="stylesheet" href="https://ignf.github.io/geoportal-extensions/leaflet-latest/dist/GpPluginLeaflet.css">
<div id="map"></div>
<div id="info"></div>
CSS
#map {
padding: 5px;
width: 100%;
height: 500px;
box-shadow: 0 0 10px #999;
}
#info {
padding: 5px;
width: 100%;
height: 20px;
font-family: monospace;
}
JavaScript
function go() {
map = L.map("map").setView([47, 2.424], 12);
var lyrMaps = L.geoportalLayer.WMTS({
layer: "GEOGRAPHICALGRIDSYSTEMS.PLANIGNV2",
}, { // leafletParams
opacity: 0.7
});
map.addLayer(lyrMaps);
var searchCtrl = L.geoportalControl.SearchEngine({
autocompleteOptions : {
serviceOptions : {
filterOptions : {
territory : ['11']
}
}
}
});
map.addControl(searchCtrl);
}
Gp.Services.getConfig({
apiKey: "cartes",
onSuccess: go
});
var infoDiv = document.getElementById("info");
infoDiv.innerHTML = "<p> Extension Leaflet version " + Gp.leafletExtVersion + " (" + Gp.leafletExtDate + ")</p>";