Olá a todos,
Sou muito novo no Leaflet.
Estou tentando configurar um dynamicMapLayer para ter um popup para cada camada no serviço de mapa.
Todos os exemplos que vi até agora usam exemplos prontos com definições simples de camadas. Estou usando um serviço de mapa com mais de duas dezenas de camadas, cada uma com um conjunto distinto de campos.
O que eu gostaria de fazer é criar definições de popup que sejam distintas para cada camada. Onde estou travando é que não sei como identificar os nomes das camadas que são reunidos no array featureCollection.
Este é o código que estou usando abaixo. Ele retorna um popup quando identifica uma feição com os campos Facility Identifier e LegacyID.
Idealmente, eu teria um método que retornasse os campos apropriados do popup baseado no nome da camada (ou seja, Sewer Manholes, Streets, Sewer Cleanout, etc...).
Alguém pode me indicar a direção certa? Obrigado.
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>Aprendendo Leaflet</title>
<meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' />
<!-- Carregar Leaflet do 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("você errou.");
return false;
} else {
var obj = featureCollection.features[1].properties;
// info do popup
var facilityID = obj["Facility Identifier"];
var legacyID = obj["LEGACYID"];
// retornar popup
return 'Facility ID: ' + facilityID + "<br>" +
'Legacy ID: ' + legacyID;
}
});
</script>
</body>
</html>
