Replies: 4 comments 6 replies
-
|
Salut! |
Beta Was this translation helpful? Give feedback.
-
|
Alors, Tu regarderas dans le
Dans l'idéal, pour afficher des marqueurs, il faudrait récupérer toutes les coordonnées en même temps. Lorsque les marqueurs sont en nombre fixe comme ça, je vais étudier un système avec des composites :
|
Beta Was this translation helpful? Give feedback.
-
|
Merci,
Mais les coordonnées ne changent pas dans les marqueurs lorsque l’on clique dessus.
|
Beta Was this translation helpful? Give feedback.
-
|
Avec ce // fabrique le contenu de la popup.
const setupPopupContent = (item) => {
const content = L.DomUtil.create('div');
content.innerHTML = `<b>${item.name}</b> [${item.id}]<br>
${item.coords}<br>RSSI : ${item.rs}<br>Distance: ${item.dist}<br><button class="show-details">DETAILS</button>`;
content.addEventListener('click', e => {
// appelée par les boutons détails
if (e.target.classList && e.target.classList.contains('show-details')) {
alert(item.name);
}
});
return content;
};
const _ = {
// la carte
map: null,
// les markers
markers: [],
// les éléments correspondants au markers
items: [
{
name: 'Gateway',
id: 1,
coords: [this.additionals.latGW, this.additionals.lonGW],
rs: [this.additionals.rssi],
dist: [this.additionals.distance],
},
{
name: 'Field Test',
id: 2,
coords: [this.additionals.latFT, this.additionals.lonFT],
rs: [this.additionals.rssi],
dist: [this.additionals.distance],
},
],
// création de la carte
setupMap: () => {
if (_.map) return;
_.map = L.map('mapid');
L.tileLayer('//{s}.tile.openstreetmap.fr/hot/{z}/{x}/{y}.png', {
attribution: 'données © <a href="//osm.org/copyright">OpenStreetMap</a>/ODbL - Tiles courtesy of <a href="https://hot.openstreetmap.org/">Humanitarian OpenStreetMap Team</a>',
minZoom: 1,
maxZoom: 20
}).addTo(_.map);
},
// création des markers à partir des items.
// ils sont recréés à chaque appel.
setupMarkers: () => {
const items = this._.items;
if (_.markers.length > 0) {
for (const marker of _.markers) {
marker.remove();
}
}
// on parcourt les devces pour placer des marqueurs sur la carte.
for (const item of items) {
const marker = L.marker(item.coords).addTo(_.map);
const popupContent = setupPopupContent(item);
const popup = L.popup().setContent(popupContent);
marker.bindPopup(popup);
marker.on('click', e => {
// ouvre la popup.
popup.openPopup();
context.getActor('stack3').dataContext = { item };
// context.getActor('stack4').properties.visible = true;
});
this._.markers.push(marker);
}
},
// synchronisation des coordonnées des items avec celles des markers sur la carte.
syncCoords: () => {
if (_.items.length === 0) return;
if (!_.map) return;
if (!_.markers.length === 0) return;
_.items.forEach((item, index) => {
_.markers[index].setLatLng(L.latLng(...item.coords));
_.markers[index].setPopupContent(setupPopupContent(item));
});
},
// application des coordonnées récupérées sur les items.
setupCoordsItems: () => {
if (_.items.length === 0) return;
if (this.additionals.latGW && this.additionals.lonGW) {
_.items[0].coords = [this.additionals.latGW, this.additionals.lonGW];
}
if (this.additionals.latFT && this.additionals.lonFT) {
_.items[1].coords = [this.additionals.latFT, this.additionals.lonFT];
}
},
// corrige une coordonnée
parseCoord: (coord) => context.utils.isEmpty(coord) ? null : parseFloat(coord.replace(',', '.')),
// addapte la vue pour voir tous les markers.
fitBounds: () => {
if (_.items.length === 0) return;
if (!_.map) return;
const items = _.items.filter(item => item.coords.compact().length === 2).map(item => item.coords);
_.map.fitBounds(items);
},
};
this._ = _; |
Beta Was this translation helpful? Give feedback.
-
|
Super, Merci beaucoup.
Cela sert à quoi « this._ = _; »
Je vais essayer de finir cette appli
|
Beta Was this translation helpful? Give feedback.
-
|
Salut! ++ |
Beta Was this translation helpful? Give feedback.
-
|
Sinon, pourquoi |
Beta Was this translation helpful? Give feedback.
-
|
Bonjour, |
Beta Was this translation helpful? Give feedback.
-
|
Bonjour, pour tout ce qui est du script, je vous invite à vous référer à la documentation des scripts Synapps à cette adresse : https://witsa.github.io/synapps/script-api/ Si l'on souhaite aller chercher les additionnelles d'un autre acteur on peut utiliser |
Beta Was this translation helpful? Give feedback.
-
|
Parfait |
Beta Was this translation helpful? Give feedback.
-
Bonjour,
j'ai fait tout comme Manu à dit, mais je sèche.
quand je liaisonne mes coordonnées aux variables venant du REDY, plus rien ne marche.
J'ai essaye en transformant les variables en Number, idem.
j'ai changé dans onPropertyChanged le context.propertyPath === 'additionals.latGW' en context.propertyPath === 'additionals.latGW.binding.onReadTransform' idem
je joint le template en zip.
Merci
CartoLora.zip
Beta Was this translation helpful? Give feedback.
All reactions