petit ajout marker on click

riot/maMap.riot

@@ -23,7 +23,7 @@
         onUpdated() {
           if (this.props.records) {
             this.removeMarks();
-            this.afficheMarks(this.getLoc(this.props.records));
+            this.afficheMarks(this.props.records);
             this.onMoveEnd();
           }
         },
@@ -34,9 +34,12 @@
           });
         },
 
-        afficheMarks(loc) {
-          loc.forEach((coord) => {
-            var marker = L.marker([coord[0], coord[1]]).addTo(map);
+        afficheMarks(records) {
+          records.forEach((item) => {
+            var marker = L.marker([item.fields.g_olocalisation_des_formations[0], item.fields.g_olocalisation_des_formations[1]]).addTo(map);
+            marker.on('click', () => {
+              this.props.afficherModal(item)
+          });
             markers.push(marker);
           });
         },
@@ -54,14 +57,6 @@
 
         },
 
-        getLoc(records) {
-          let loc = [];
-          records.forEach((formation) => {
-            loc.push(formation.fields.g_olocalisation_des_formations);
-          });
-          return loc;
-        },
-
         // méthode pour gérer l'événement "moveend"
         onMoveEnd() {
           let visibleMarkers = this.getVisibleMarkers();

riot/tableuFormation.riot

@@ -1,6 +1,6 @@
 <tableuFormation>
 <div id="map"></div>
-        <maMap if={props.records} records={props.records} modifyByLoc={modifyByLoc}></maMap>
+        <maMap if={props.records} records={props.records} modifyByLoc={modifyByLoc} afficherModal={afficherModal}></maMap>
 <div class="field is-flex is-justify-content-space-between mt-5" >
     <input class="input" type="search" placeholder="nom de l'établissement" id="myInput" oninput={search}>
 </div>