Bonjour voici mon problème, j'aimerai pouvoir rajouter ce que j'ai mis en rouge sur le screen (mais fonctionnel exemple si je coche pompier il m'affiche que les marqueurs concernant pompier) : 

http://prntscr.com/m7mock

Du coup mettre un système de filtrage par type de poste voici un exemple de mon fichier json:

  {
      "datasetid":"postes-securite",
      "recordid":"a621866d963c063e9dc437f06b95bd7d1f33cd00",
      "fields":{
         "commune":"FRETIN",
         "code_postal":"59273",
         "objectid":"2068",
         "geometry":{
            "type":"Point",
            "coordinates":[
               3.1122071280526,
               50.573197989243
            ]
         },
         "libelle":"CENTRE D INCENDIE ET DE SECOURS LESQUIN",
         "geo_point_2d":[
            50.573197989243,
            3.1122071280526
         ],
         "url":"https://www.pompiercenter.com/annuaire-sdis/sdis-59-groupement-territoriaux.htm",
         "type_lpu":"POMPIERS1"

http://prntscr.com/m7mp0z

Et voici le code de mon main.js pour gérer le tout, les marqueurs etc...

// On initialise la latitude et la longitude (Nord-Est de la carte)
var lat = 50.638961618404,
    lon = 3.0273555397702; // Nord-Est
var map = null;
var L;

d3.json("data/postes-securite.json").then(
    function (data) {					
			
		var mbAttr = 'Map data &copy; <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, ' +
			'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BYSA</a>, ' +
			'Imagery <a href="https://www.mapbox.com/">Mapbox</a>',
			mbUrl = 'https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token=pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpejY4NXVycTA2emYycXBndHRqcmZ3N3gifQ.rJcFIG214AriISLbB6B5aw';
			
        var grayscale = L.tileLayer(mbUrl, {
            id: 'mapbox.light',
            attribution: mbAttr
        });
		
		var streets = L.tileLayer(mbUrl, {
			id: 'mapbox.streets',
			attribution: mbAttr
		});
		
		var type_lpu = L.layerGroup();
		
		var overlays = {
			"Type de postes": type_lpu
			};

		
		var baseLayers = {
			"Grayscale": grayscale,
			"Streets": streets
		};

        map = L.map('map', {
            center: [lat, lon],
            zoom: 9,
            layers: [grayscale, type_lpu]
        });
        
		L.control.layers(baseLayers, overlays).addTo(map);

		
        for(var i in data){
			
			var fields=data[i].fields;
			
			if (typeof fields.geo_point_2d !== 'undefined'){
				
				console.log(i);
            
				var geo_point_2d = fields.geo_point_2d;
					lat = geo_point_2d[0], lon = geo_point_2d[1];
           
				var marker = L.marker([lat, lon]).addTo(type_lpu);
					marker.bindPopup(fields.libelle);

			}
        
        }
    }
);

-
Edité par Kotex 15 janvier 2019 à 20:33:53

Bonjour, pour faire un filtre tu peux te renseigner sur la fonction filter https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Objets_globaux/Array/filter