Filter 带过滤器的传单动态图标

我正在尝试创建一个简单的csv主传单地图（我是一个初学者）。这真的很好，我想用我的类型显示不同的图标（例如1个学校图标，一个行政管理图标，…）。当我有地图时，我成功地显示了我的不同图标，但当我点击过滤器时，我的图标消失了。事实上，它不起作用，因为当我使用过滤器时，它无法识别我的变量，我可以读取到我的img不再是logos/type1.png，而是logos/undefined.png

这是我的全部代码

var basemap = new L.TileLayer(baseUrl, {maxZoom: 17, attribution: baseAttribution, subdomains: subdomains, opacity: opacity});

var center = new L.LatLng(0, 0);

var map = new L.Map('map', {center: center, zoom: 2, maxZoom: maxZoom, layers: [basemap]});

var popupOpts = {
autoPanPadding: new L.Point(5, 50),
autoPan: true
};

var points = L.geoCsv (null, {
firstLineTitles: true,
fieldSeparator: fieldSeparator,
onEachFeature: function (feature, layer) {
    var popup = '<div class="popup-content"><table class="table table-striped table-condensed">';
    for (var clave in feature.properties) {
        var title = points.getPropertyTitle(clave).strip();
        var attr = feature.properties[clave];
        if (title == labelColumn) {
            layer.bindLabel(feature.properties[clave], {className: 'map-label'});
        }
        if (attr.indexOf('http') === 0) {
            attr = '<a target="_blank" href="' + attr + '">'+ attr + '</a>';
        }
        if (attr) {
            popup += '<tr><th>'+title+'</th><td>'+ attr +'</td></tr>';
        }
    }
    popup += "</table></popup-content>";
    layer.bindPopup(popup, popupOpts);
},
pointToLayer: function (feature, latlng) {
  var logo = feature.properties['type'];
  return L.marker(latlng, {
      icon:L.icon({
          iconUrl: 'logos/'+logo+'.png',
          shadowUrl: 'marker-shadow.png',
          iconSize: [25,41],
          shadowSize:   [41, 41],
          shadowAnchor: [13, 20]
      })
  });
},
filter: function(feature, layer) {
    total += 1;
    if (!filterString) {
        hits += 1;
        return true;
    }
    var hit = false;
    var lowerFilterString = filterString.toLowerCase().strip();
    $.each(feature.properties, function(k, v) {
        var value = v.toLowerCase();
        if (value.indexOf(lowerFilterString) !== -1) {
            hit = true;
            hits += 1;
            return false;
        }
    });
    return hit;
}
});

var hits = 0;
var total = 0;
var filterString;
var markers = new L.MarkerClusterGroup();
var dataCsv;


var addCsvMarkers = function() {
hits = 0;
total = 0;
filterString = document.getElementById('filter-string').value;

if (filterString) {
    $("#clear").fadeIn();
} else {
    $("#clear").fadeOut();
}

map.removeLayer(markers);
points.clearLayers();

markers = new L.MarkerClusterGroup(clusterOptions);
points.addData(dataCsv);
markers.addLayer(points);

map.addLayer(markers);
try {
    var bounds = markers.getBounds();
    if (bounds) {
        map.fitBounds(bounds);
    }
} catch(err) {
    // pass
}
if (total > 0) {
    $('#search-results').html("Showing " + hits + " of " + total);
}
return false; 
};

var typeAheadSource = [];

function ArrayToSet(a) {
var temp = {};
for (var i = 0; i < a.length; i++)
    temp[a[i]] = true;
var r = [];
for (var k in temp)
    r.push(k);
return r;
}

function populateTypeAhead(csv, delimiter) {
var lines = csv.split("\n");
for (var i = lines.length - 1; i >= 1; i--) {
    var items = lines[i].split(delimiter);
    for (var j = items.length - 1; j >= 0; j--) {
        var item = items[j].strip();
        item = item.replace(/"/g,'');
        if (item.indexOf("http") !== 0 && isNaN(parseFloat(item))) {
            typeAheadSource.push(item);
            var words = item.split(/\W+/);
            for (var k = words.length - 1; k >= 0; k--) {
                typeAheadSource.push(words[k]);
            }
        }
    }
}
}

if(typeof(String.prototype.strip) === "undefined") {
String.prototype.strip = function() {
    return String(this).replace(/^\s+|\s+$/g, '');
};
}

map.addLayer(markers);




$(document).ready( function() {
$.ajax ({
    type:'GET',
    dataType:'text',
    url: dataUrl,
    contentType: "text/csv; charset=utf-8",
    error: function() {
        alert('Error retrieving csv file');
    },
    success: function(csv) {
        dataCsv = csv;
        populateTypeAhead(csv, fieldSeparator);
        typeAheadSource = ArrayToSet(typeAheadSource);
        $('#filter-string').typeahead({source: typeAheadSource});
        addCsvMarkers();
    }
});

$("#clear").click(function(evt){
    evt.preventDefault();
    $("#filter-string").val("").focus();
    addCsvMarkers();
});

});

var basemap=newl.TileLayer（baseUrl，{maxZoom:17，attribute:baseattribute，subdomains:subdomains，opacity:opacity}）；
var中心=新的L.LatLng（0,0）；
var map=new L.map（'map'，{center:center，zoom:2，maxZoom:maxZoom，layers:[basemap]}）；
var popupOpts={
自动平移填充：新的L点（5,50），
自动扫描：对
};
变量点=L.geoCsv（空{
一线标题：正确，
字段分隔符：字段分隔符，
onEachFeature：功能（功能，图层）{
var弹出窗口=“”；
for（feature.properties中的var clave）{
var title=points.getPropertyTitle（clave.strip（）；
var attr=feature.properties[clave]；
如果（标题==标签列）{
layer.bindLabel（feature.properties[clave]，{className:'map label'}）；
}
if（attr.indexOf（'http'）==0）{
attr=''；
}
如果（属性）{
弹出+=''+标题+''+属性+''；
}
}
弹出+=“”；
层绑定弹出窗口（弹出窗口，弹出窗口）；
},
pointToLayer：功能（特性、latlng）{
var logo=feature.properties['type']；
返回L.标记（板条{
图标：L.icon({
iconUrl:'logos/'+logo+'.png'，
shadowUrl:'marker shadow.png'，
iconSize:[25,41]，
阴影大小：[41,41]，
影子主播：[13,20]
})
});
},
过滤器：功能（特征、图层）{
总数+=1；
如果（！filterString）{
点击次数+=1；
返回true；
}
var-hit=false；
var lowerFilterString=filterString.toLowerCase（）.strip（）；
$.each（feature.properties，function（k，v）{
var value=v.toLowerCase（）；
if（value.indexOf（lowerFilterString）！=-1）{
命中=真；
点击次数+=1；
返回false；
}
});
回击；
}
});
var=0；
var合计=0；
var过滤器串；
var markers=新的L.MarkerClusterGroup（）；
var-dataCsv；
var addCsvMarkers=函数（）{
点击率=0；
总数=0；
filterString=document.getElementById（'filter-string'）。值；
if（过滤器字符串）{
$（“#清除”）.fadeIn（）；
}否则{
$（“#清除”）.fadeOut（）；
}
地图移除层（标记）；
points.clearLayers（）；
标记=新的L.MarkerClusterGroup（clusterOptions）；
points.addData（数据CSV）；
标记。添加图层（点）；
添加图层（标记）；
试一试{
var bounds=markers.getBounds（）；
如果（边界）{
映射边界（bounds）；
}
}捕捉（错误）{
//通过
}
如果（总数>0）{
$（“#搜索结果”）.html（“显示“+总数”中的“+点击次数+”）；
}
返回false；
};
var typeAheadSource=[]；
函数数组集合（a）{
var temp={}；
对于（变量i=0；i=1；i--）{
变量项=行[i]。拆分（分隔符）；
对于（var j=items.length-1；j>=0；j--）{
var item=items[j].strip（）；
项目=项目。替换（/“/g'”）；
if（item.indexOf（“http”）！==0&&isNaN（parseFloat（item）））{
类型HeadSource.push（项目）；
var words=item.split（/\W+/）；
对于（var k=words.length-1；k>=0；k--）{
typeAheadSource.push（字[k]）；
}
}
}
}
}
if（typeof（String.prototype.strip）=“未定义”）{
String.prototype.strip=函数（）{
返回字符串（this）.replace（/^\s+|\s+$/g'）；
};
}
添加图层（标记）；
$（文档）.ready（函数（）{
$.ajax({
类型：'GET'，
数据类型：'text'，
url:dataUrl，
contentType:“文本/csv；字符集=utf-8”，
错误：函数（）{
警报（“检索csv文件时出错”）；
},
成功：功能（csv）{
dataCsv=csv；
populateTypeAhead（csv，字段分隔符）；
typeAheadSource=ArrayToSet（typeAheadSource）；
$（“#筛选器字符串”）.typeahead（{source:typeAheadSource}）；
addCsvMarkers（）；
}
});
$（“#清除”）。单击（函数（evt）{
evt.preventDefault（）；
$（“#过滤器字符串”）.val（“”.focus（）；
addCsvMarkers（）；
});
});

我使用“pointToLayer”更改我的图标和我的点的类型。当我单击过滤器时，图标会显示出来。当我再次单击时，图标会重新出现。请支持？我真的迷路了