martins/S4WEB
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

petit ajout marker on click

Browse Source
This commit is contained in:
martins 2023-03-31 16:31:25 +02:00
parent 172e21090d
commit 4d515a8b00
2 changed files with 8 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
riot/maMap.riot
View File

@ -23,7 +23,7 @@
onUpdated() { onUpdated() {
if (this.props.records) { if (this.props.records) {
this.removeMarks(); this.removeMarks();
this.afficheMarks(this.getLoc(this.props.records)); this.afficheMarks(this.props.records);
this.onMoveEnd(); this.onMoveEnd();
} }
}, },
@ -34,9 +34,12 @@
}); });
}, },
afficheMarks(loc) { afficheMarks(records) {
loc.forEach((coord) => { records.forEach((item) => {
var marker = L.marker([coord[0], coord[1]]).addTo(map); 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); 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" // méthode pour gérer l'événement "moveend"
onMoveEnd() { onMoveEnd() {
let visibleMarkers = this.getVisibleMarkers(); let visibleMarkers = this.getVisibleMarkers();

2
riot/tableuFormation.riot
View File

@ -1,6 +1,6 @@
<tableuFormation> <tableuFormation>
<div id="map"></div> <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" > <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}> <input class="input" type="search" placeholder="nom de l'établissement" id="myInput" oninput={search}>
</div> </div>