Leaflet shows only part of the markers

437 views Asked by At

I'm using Leaflet, leaflet.geo.csv and leaflet-sidebar to build a map. Map works and shows me markers but only 25 of 200. Not the 25 first but randomly among the 200. And it is always the same ones that appear.

I can't show you my csv (sensitive data) but I have checked it many times, clean it and I think it is fine. My console is empty.

This is a sample of my code :

var map = L.map('map');

var affaires = L.geoCsv(null, {
    onEachFeature: function (feature, layer) {
        var popup = '';
        for (var key in feature.properties) {
            var title = affaires.getPropertyTitle(key);
            popup += '<p class="title">'+title+'</b><p class="info">'+feature.properties[key]+'</p>';
        }
        layer.on('click', function () { 
            sidebar.hide();
            sidebar.show();
            sidebar.setContent(popup); 
        });
    },
    pointToLayer: function (feature, latlng) {
        return L.marker(latlng, {
            icon:L.icon({
                iconUrl: 'marker.png',
                shadowUrl: 'shadow.png',
                iconSize: [25,38],
                shadowSize: [41, 41],
                shadowAnchor: [13, 21]
            })
        });
    },
    firstLineTitles: true,
    fieldSeparator: ','
});

$.ajax ({
    type:'GET',
    dataType:'text',
    url:'mydata.csv',
    error: function() {
     alert('Pas de données');
    },
    success: function(csv) {
      var markers = new L.Marker();
        affaires.addData(csv);
        map.addLayer(affaires);
        map.fitBounds(affaires.getBounds());
        console.log(affaires);
    }
});

L.tileLayer('http://{s}.basemaps.cartocdn.com/light_all/{z}/{x}/{y}.png', {
    attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a> &copy; <a href="http://cartodb.com/attributions">CartoDB</a> | &copy; <a href="http://www.lamontagne.fr/">lamontagne.fr</a> - Julien Jégo',
    subdomains: 'abcd',
    maxZoom: 19
}).addTo(map);

var sidebar = L.control.sidebar('sidebar', {
    closeButton: true,
    position: 'left'
});
map.addControl(sidebar); ...

A screenshot of my map : map example

Any suggestion ?

Thanks

0

There are 0 answers