Leaflet地图pointToLayer函数异常：自定义图标不显示求助

嘿，我帮你找到了代码里的关键问题，这就是自定义图标没生效、地图还显示默认图标的原因：

核心错误：两处拼写失误 #

• 配置项名称拼写错误：你把Leaflet的pointToLayer写成了pointTolayer（注意是To不是Tol），Leaflet识别不到这个自定义配置，自然就用默认图标了。
• 回调参数拼写错误：回调函数里的参数feture应该是feature（少了一个字母a），这个虽然暂时不影响图标显示，但后续如果要用到要素属性的话会出问题，最好一起修正。

修复后的完整代码 #

$.getJSON("https://gist.githubusercontent.com/vassilaros/3791204ca226d5b236b4cd3106ef23cf/raw/PicnicSites.geojson",function(data){ 
  var baseline_person = L.icon({ 
    iconUrl: 'baseline_person.png', 
    iconSize: [18,18] 
  }); 
  // add GeoJSON layer to the map once the file is loaded 
  L.geoJson(data, { 
    pointToLayer: function(feature, latlng){ 
      return L.marker(latlng,{icon: baseline_person}); 
    } 
  }).addTo(map); 
});

额外注意事项 #

• 确认baseline_person.png的路径正确：如果图标文件和你的HTML不在同一目录，要写对相对路径（比如放在images文件夹里就写成'./images/baseline_person.png'）。
• 可以打开浏览器开发者工具的「网络」面板，检查图标文件是否返回404错误，如果有说明路径不对或者文件不存在。

内容的提问来源于stack exchange，提问作者Vassilis