Bonjour à tous,
Je suis très débutant avec Leaflet.
J'essaie de configurer un dynamicMapLayer pour avoir un popup pour chaque couche dans le service de carte.
Tous les exemples que j'ai vus jusqu'à présent utilisent des exemples préfabriqués avec des définitions de couches simples. J'utilise un service de carte avec plus d'une vingtaine de couches, chacune ayant un ensemble distinct de champs.
Ce que je voudrais faire, c'est créer des définitions de popup distinctes pour chaque couche. Là où je bloque, c'est que je ne sais pas comment identifier les noms des couches qui sont rassemblés dans le tableau featureCollection.
Voici le code que j'utilise ci-dessous. Il retourne un popup lorsqu'il identifie une entité avec les champs Facility Identifier et LegacyID.
Idéalement, j'aimerais qu'une méthode retourne les champs de popup appropriés en fonction du nom de la couche (c.-à-d. Sewer Manholes, Streets, Sewer Cleanout, etc...).
Quelqu'un pourrait-il m'indiquer la bonne direction ? Merci beaucoup.
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>Apprendre Leaflet</title>
<meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' />
<!-- Charger Leaflet depuis CDN -->
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.css" />
<script src="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.js"></script>
<script src="http://cdn-geoweb.s3.amazonaws.com/esri-leaflet/0.0.1-beta.5/esri-leaflet.js"></script>
<style>
html, body, #map {
width : 100%;
height : 100%;
}
</style>
</head>
<body>
<div id="map"></div>
<script>
document.getElement
var map = L.map('map').setView([35.578, -82.50], 17);
<!-- L.esri.basemapLayer("Gray").addTo(map); -->
var networkInfrastructure = L.esri.dynamicMapLayer('http://gis.msdbc.org/arcgis/rest/services/InternalViewer/NetworkInfrastructureI/MapServer',{useCors: false}).addTo(map);
var networkArray = networkInfrastructure.getLayers();
networkInfrastructure.bindPopup(function(error, featureCollection) {
if (error || featureCollection.features.length === 0) {
alert("vous avez manqué.");
return false;
} else {
var obj = featureCollection.features[1].properties;
// info popup
var facilityID = obj["Facility Identifier"];
var legacyID = obj["LEGACYID"];
// retourner le popup
return 'Facility ID : ' + facilityID + "<br>" +
'Legacy ID : ' + legacyID;
}
});
</script>
</body>
</html>