The function that is called on map click in the epa cwns map app

esri-leaflet-identify-example.js

// this function is called on map click event
showEntities: function(latLng) {
        try {
            cwns.map.removeLayer(cwns.current.selectedGeoJson);
            cwns.current.countyGroupLayer.clearLayers();
            cwns.current.congDistGroupLayer.clearLayers();
            cwns.current.stateGroupLayer.clearLayers();
            cwns.mapMarker.setLatLng(latLng);
            cwns.map.addLayer(cwns.mapMarker);
            cwns.cwnsDynamicLayer.identify()
                .on(cwns.map)
                .at(latLng)
                .tolerance(0)
            //define which layers to identify, not facilities, counties, cong dists and states only if visible    
                .layers('visible:1,2,3')
                .run(function(error, featureCollection, response) {
                //could zoom to all features, but annoying unless a good reason
                //cwns.map.fitBounds(L.geoJson(featureCollection).getBounds());
                var popContent = "<table class='table'>";
                //popContent += "<colgroup><col style='width: 10%;' /><col /><col /><col /></colgroup>";
                popContent += "<thead class='cwns-table-header'><tr><td></td><td>Name</td><td>Total Needs</td><td></td></tr></thead>";
                popContent += "<tbody>";
                if(error) {
                    $("#info-pane").html("<strong>An error occurred attempting to gather needs data</strong>");
                    $("#info-pane").removeClass("cwns-loading");
                    return;
                }
                else {
                    //be sure we got results
                    if(featureCollection.features.length > 0 ) {
                        for(var i=0;i<featureCollection.features.length;i++) {
                            var feat = featureCollection.features[i];
                            var name = "";
                            var totalNeeds = 0;
                            switch(feat.layerId) {
                                    //also getting all facilities and could use them
                                    //case 0:
                                    //name = feat.properties.FACILITY_NAME;
                                    //popContent += "<tr class=''>" + name + "</tr>";
                                    //break;
                                case 1:
                                    //save county feature as current
                                    cwns.current.countyFeature = feat;
                                    cwns.current.countyGeoJson = new L.GeoJSON(cwns.current.countyFeature, {
                                        style: function(){
                                            return {
                                                color: '#064780',
                                                weight: 6,
                                                fill:false
                                            };
                                        }
                                    }).addTo(cwns.current.countyGroupLayer);
                                    name = feat.properties.NAME;
                                    popContent += "<tr class='county-row needs-row 'title='Get County Details'>" +
                                        "<td><button type='button' class='zoom-to-county cwns-zoom-to cwns-btn btn btn-sm' title='Zoom To County'>" +
                                        "<span class='cwns-icon cwns-icon-map-zoom-to'></span>" +
                                        "</button></td>";
                                    if(name != "Null" && name !== null) {
                                        popContent += "<td>" + feat.properties.NAME + " County</td>";
                                        totalNeeds = feat.properties.TotalNeeds;
                                        if(totalNeeds != "Null" && totalNeeds !== null) {
                                            popContent += "<td>" + cwns.formatAmount(totalNeeds.toString()) + "</td>";
                                        } else {
                                            popContent += "<td>" + "$ 0" + "</td>";
                                        }
                                    }
                                    popContent += "<td><span class='cwns-icon cwns-icon-chevron-right'></span></td>";
                                    popContent += "</tr>";
                                    break;
                                case 2:
                                    //save congressional district feature and add its' geometry to the group layer
                                    cwns.current.congDistFeature = feat;
                                    cwns.current.congDistGeoJson = new L.GeoJSON(cwns.current.congDistFeature, {
                                        style: function(){
                                            return {
                                                color: '#F36900',
                                                weight: 8,
                                                fill:false
                                            };
                                        }
                                    }).addTo(cwns.current.congDistGroupLayer);
                                    name = feat.properties.NAMELSAD;
                                    popContent += "<tr class='congressional-district-row needs-row' title='Get District Details'>" +
                                        "<td><button type='button' class='zoom-to-cong-dist cwns-zoom-to cwns-btn btn btn-sm' title='Zoom To District'>" +
                                        "<span class='cwns-icon cwns-icon-map-zoom-to'></span>" +
                                        "</button></td>";
                                    if(name != "Null" && name !== null) {
                                        popContent += "<td>" + feat.properties.NAMELSAD + "</td>";
                                        totalNeeds = feat.properties.TotalNeeds;
                                        if(totalNeeds != "Null" && totalNeeds !== null) {
                                            popContent += "<td>" +
                                                cwns.formatAmount(totalNeeds.toString()) + "</td>";
                                        } else {
                                            popContent += "<td>" + "$ 0" + "</td>";
                                        }
                                    }
                                    popContent += "<td><span class='cwns-icon cwns-icon-chevron-right'></span></td>";
                                    popContent += "</tr>";
                                    break;
                                case 3:
                                    //save state feature and add its' geometry to the group layer
                                    cwns.current.stateFeature = feat;
                                    cwns.current.stateGeoJson = new L.GeoJSON(cwns.current.stateFeature, {
                                        style: function(){
                                            return {
                                                color: '#004120',
                                                weight: 10,
                                                fill:false
                                            };
                                        }
                                    }).addTo(cwns.current.stateGroupLayer);
                                    name = feat.properties.NAME;
                                    popContent += "<tr class='state-row needs-row' title='Get State Details'>" +
                                        "<td><button type='button' class='zoom-to-state cwns-zoom-to cwns-btn btn btn-sm' title='Zoom To State'>" +
                                        "<span class='cwns-icon cwns-icon-map-zoom-to'></span>" +
                                        "</button></td>";
                                    if(name != "Null" && name !== null) {
                                        popContent += "<td>" + feat.properties.NAME + "</td>";
                                        totalNeeds = feat.properties.TotalNeeds;
                                        if(totalNeeds != "Null" && totalNeeds !== null) {
                                            popContent += "<td>" + cwns.formatAmount(totalNeeds.toString()) + "</td>";
                                        } else {
                                            popContent += "<td>" + "$ 0" + "</td>";
                                        }
                                    }
                                    popContent += "<td><span class='cwns-icon cwns-icon-chevron-right'></span></td>";
                                    popContent += "</tr>";
                                    break;
                            }    
                        }
                    }else {
                        $("#info-pane").html("<strong>No needs data found at the selected location</strong>")
                            .removeClass("cwns-loading");
                        return;
                    }
                }
                popContent += "</tbody>";
                popContent += "</table>";
                //popContent += "<span>" + e.latlng.lat + " : " + e.latlng.lng + "</span>";
                /*
                        var popup = L.popup()
                        .setLatLng(e.latlng)
                        .setContent(popContent)
                        .openOn(cwns.map);
                        */
                //Let's try putting the content directly in the info pane instead of a popup
                $("#info-pane").html(popContent);
                cwns.current.entityListContent = popContent;
                $("#info-pane").removeClass("cwns-loading");
            });  
        } catch(err) {
            //console.log(err.message);
        }
    }