Leaflet - geoJSON multipolygon - bindPopup with bindTooltip

Viewed 682

I'm a complete beginner when it comes to leaflet but i'm slowly but surely learning the ropes after an introduction course. I've read over the Leaflet documentation but i'm still having trouble combining a permanent toolTip (label) with a bindPopup on click.

I can find success in doing one OR the other but not both. See below for my current code that labels each feature of my geoJSON multipolygon. I would now also like to display feature attribute information from the geoJSON in a popup when that feature polygon is clicked.

      var lyrNeighbourhoods= new L.GeoJSON.AJAX("data/Neigh_Demo1.geojson",
            {style: {weight:1, fillOpacity:0.1},
            onEachFeature: function (feature, layer) {
            layer.bindTooltip(feature.properties.Neigh_Name, {direction:"center",permanent:true, 
            className: 'labelstyle'});
      }
      }).addTo(mymap);

I've been racking my brain over this for too long. Any help is appreciated.

1 Answers

In your onEachFeature option function, there is nothing stopping you from also attaching a popup to your Layer:

function (feature, layer) {
  layer.bindTooltip(feature.properties.Neigh_Name, {
    direction: "center",
    permanent: true, 
    className: 'labelstyle'
  });
  layer.bindPopup("My popup content");
}
Related