[GIS] Shapefile not displaying as a layer on leaflet map

leaflet

I've been trying to learn how to display my shapefiles as a layer on leaflet map then i came across calvinmetcalf github . Using his example i was able to display the councils.zip file as a shapefile layer on the map. But, trying to the do the same with my own shapefile produce no result as the shapefile refuse to load on the map. I couldn't see an error in the console either, so i am stuck on what i could be doing wrong. Here is the code below.

    <script>
    var map = L.map('map',
    {
        center:[11.47,8.20],
        zoom: 10
    });
    L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png').addTo(map);
    var shpfile = new L.Shapefile('lg_polygon2.zip', {
        onEachFeature: function(feature, layer) {
            if (feature.properties) {
                layer.bindPopup(Object.keys(feature.properties).map(function(k) {
                    return k + ": " + feature.properties[k];
                }).join("<br />"), {
                    maxHeight: 200
                });
            }
        }
    });
    shpfile.addTo(map);
    shpfile.once("data:loaded", function() {
        console.log("finished loaded shapefile");
    });
</script>

Best Answer

Thanks for your time. I have been able to figure out the problem and it has been resolved. I discovered the shapefile was in .rar format while I was calling .zip in the code. I changed it from .rar to .zip and it now works.

Related Question