JS Leaflet : passage de paramètres à une fonction

Fermé

Herve_be Messages postés 1017 Date d'inscription mercredi 4 août 2010 Statut Membre Dernière intervention 25 avril 2024 - 20 févr. 2021 à 16:39
Herve_be Messages postés 1017 Date d'inscription mercredi 4 août 2010 Statut Membre Dernière intervention 25 avril 2024 - 21 févr. 2021 à 10:02

Bonjour,
Un code qui fonctionne très bien ne fonctionne plus une fois qu'il est encapsulé dans une fonction.
Ceci fonctionne très bien pour afficher un popup quand on clique sur une trace

var customLayer = L.geoJson(null, {
 ...
  }, 
  onEachFeature: function(feature, layer) {
    if (feature.properties.name) {
      layer.bindPopup(feature.properties.name);
    }
  } 
});

mais je ne parviens pas à le mettre dans une fonction

function popup(e) {
    layer = e.layer,
    feature = layer.feature;                <==
    if (feature.properties.name) {
      layer.bindPopup(feature.properties.name);
    }
  }
...
function Interaction(feature, layer) {
    layer.on({
        click: popup
    });
}
...
var customLayer = L.geoJson(null, {
 ...
  }, 
  onEachFeature: Interaction
});

quand je clique j'obtiens
Uncaught TypeError: Cannot read property 'feature' of undefined
sur la ligne en face de laquelle j'ai mis une flèche
et si je commente froidement cette ligne j'obtiens
Uncaught ReferenceError: feature is not defined sur la ligne suivante

Je pense qu'il s'agit simplement d'un passage de paramètres mais mes connaissances en JS ne sont pas suffisante pour que je comprenne mon erreur : un petit coup de main ?
Merci

A voir également:

JS Leaflet : passage de paramètres à une fonction
Js/adware.agent.cr ✓ - Forum Virus
Retour à la ligne js ✓ - Forum Javascript
Js/agent.piv ✓ - Forum Virus
Node js virus ✓ - Forum Virus
Onclick js ✓ - Forum Javascript

3 réponses

Réponse 1 / 3

jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650
20 févr. 2021 à 18:02


 onEachFeature: function(feature, layer) {
  Interaction(feature, layer);
}

Réponse 2 / 3

Herve_be Messages postés 1017 Date d'inscription mercredi 4 août 2010 Statut Membre Dernière intervention 25 avril 2024 8
Modifié le 21 févr. 2021 à 09:38

Bonjour,
effectivement, visuellement ça fonctionne comme souhaité, merci beaucoup,
mais j'ai une erreur dans Leaflet quand je clique sur la trace

Uncaught TypeError: Cannot read property 'call' of undefined
at e.fire (leaflet.js:5)
at e._fireDOMEvent (leaflet.js:5)
at e._handleDOMEvent (leaflet.js:5)
at HTMLDivElement.r (leaflet.js:5)

Voici le code complet (j'ai mis directement la fonction Interaction dans onEachFeature mais ça ne change rien)

function popup(feature, layer) {
    if (feature.properties.name) {
      layer.bindPopup(feature.properties.name);
    }
  }
function highlightFeature(e) {
    var layer = e.target;
    layer.setStyle({
        weight: 5,
        color: '#666',
        dashArray: '',
        fillOpacity: 0.7
    });
    if (!L.Browser.ie && !L.Browser.opera && !L.Browser.edge) {
        layer.bringToFront();
    }
}
function resetHighlight(e) {
    customLayer.resetStyle(e.target);
}
...
var customLayer = L.geoJson(null, {
  style: function(feature) {
    if (!feature.properties.id) {
      feature.properties.id = n++;
    }
    var iColor = feature.properties.id % colors.length;
    return { color: colors[iColor] };
  }, 
 onEachFeature: function(feature, layer) {
    layer.on({
        mouseover: highlightFeature,
        mouseout: resetHighlight,
        click: popup(feature, layer)
    });
  }

});

jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650
21 févr. 2021 à 09:40

Tu vois que tes fonctions attendent un (ou plusieurs selon les cas) paramètres ?
( le trucs qui se trouvent entre parenthèses après le nom de la fonction ..... )
par exemple

function resetHighlight(e)

Et par conséquent... quand tu fais appel à ces fonctions... ben... il faut leur passer la variable qui va bien...

Réponse 3 / 3

Herve_be Messages postés 1017 Date d'inscription mercredi 4 août 2010 Statut Membre Dernière intervention 25 avril 2024 8
21 févr. 2021 à 10:02

Je comprends ce que tu écris,
par contre je ne comprends pas pourquoi parmi
mouseover: highlightFeature,
mouseout: resetHighlight,
click: popup(feature, layer)
les 2 premières auxquelles je ne donne pas de paramètre fonctionnent correctement sans erreur
alors que popup à qui je passe 2 paramètres fonctionne très bien aussi mais donne une erreur dans Leaflet.

Discussions similaires

Javascript Arrondi à 2 chiffres après la virgule

code couleur associé a une image

Faire un echo dans un script JS

Cheval de Troie JS/Kryptik.I

'JS/Agent.TS' Qu'est ce que c'est ?

Discussions similaires

Newsletters