3

By default popups open wherever you click within the boundaries of polygons in Leaflet geojson layers. Here's an example:

JsFiddle

I would like to anchor the popup either:

so it opens in a specific place on the map (setLatLong)

or

at a specific coordinate relative to where the cursor clicks on the polygon. (anchorPopup)

I know from docs that this can be achieved using anchorPopup or openPopup: if this be the case where does one add this to the code?

My code is similar to the jsfiddle:

var outcroppings = L.geoJson(outcroppings,{ style: function(feature, layer){ return { color: "black", fillColor: "orange", fillOpacity: 6, weight: 2, }; }, onEachFeature: function (feature, layer){ layer.bindPopup( "<img src='" + feature.properties.image + "'style= width:100px >"+ "</p>area: "+feature.properties.Shape_Area ); } }).addTo(map); 

2 Answers 2

1

You could try the setLatLng() method chained onto the popup. If you enter the coordinates where you want the popup to appear, it should stay in that location.

So, I think it should look like this:

onEachFeature: function (feature, layer){ layer.bindPopup( "<img src='" + feature.properties.image + "'style= width:100px >"+ "</p>area: "+feature.properties.Shape_Area ); } }).setLatLng(LatLng).addTo(map); 
5
  • Nope, that made the feature vanish.. :( Commented Jul 3, 2018 at 17:03
  • Do you get a message in the console, or does it just disappear? Commented Jul 6, 2018 at 17:23
  • I get a mesasage: TypeError: L.geoJson(...).setLatLng is not a function. Commented Jul 7, 2018 at 0:11
  • When I follow the error message it highlights ' var outcroppings= L.geojson(outcroppings, ' Commented Jul 7, 2018 at 0:29
  • You cannot call setLatLng() on the layer, but this is what you are trying to do. Commented Sep 9, 2018 at 10:13
0

You need to initiate the popup with a layer source (see the Creation section of the popup documentation) and then set its coordinates:

L.popup(popupOptions,layer).setContent(content).setLatLng(lat_lng) 

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.