The layer icon is blank in my leaflet map. In other words, the small gray rectangles inside the box are not visible. How can I make it visible?

And my code for overlays:

  var Commune = new L.LayerGroup();

  var CommuneStVeran = [
  [ 44.654816299146773, 6.948335091404863,], 
  [ 44.652132288291128, 6.939938792686195,],
  [ 44.659796388551648, 6.915266605877861,];

  var polygon = L.polygon(CommuneStVeran, { color: '#666633',
  weight: 5,
  opacity: 0.65,
  fillColor: "ff7800",
  fillOpacity: 0.23}).addTo(Commune);

   var overlays = {
    "Limites de la commune":Commune

    var Centroïde = L.icon({
    iconUrl: 'icon-gamze/centroid.png',
    iconSize: [40,40], // size of the icon,


   overlays ['Centroïde de la commune (lang, lat)'] = L.marker([44.68452505169315, 6.890594241034665], {icon: Centroïde}).bindPopup("<b>Longitude, Latitude</b><br>44.68452, 6.89059").openPopup().addTo(map);
  • Have you created any layer's? If so it will automatically appear on that icon when you hover. Some code will help us to know what you done. Commented Mar 27, 2017 at 12:05
  • I added layers, and please see question again as I just added my code for overlays. @Vignesh Gopalakrishnan
    – Gamze
    Commented Mar 27, 2017 at 12:12
  • 1
    I solved it! But, thanks anyway @VigneshGopalakrishnan
    – Gamze
    Commented Mar 27, 2017 at 12:24

2 Answers 2


Not only css and js files, but also "images" files should be included in the css folder while working in a local setting. All can be downloaded from http://leafletjs.com/download.html


Here I made a JSFIDDLE for you with some code. Hope that should help you.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.