bindPopup on mouseover

[Alexandru Pufan]

Hello!

I am trying to display popups on a geojson file, containing a field of that file. I want the popups to appear when I hover the mouse over the layer, but instead they appear only when I click on it. This is how I'm trying to add the event on my geojson:

function interaction(feature, layer){

layer.on({

mouseover: function over(e) {

layer.bindPopup(feature.properties.Descriere)

}

})

}

Here is the jsfiddle of my code so far:

http://jsfiddle.net/jcocoder/YzhwZ/2/

[Historical Atlas]

Hello Alexandru,

You are assigning the same popup every time (!) the mouse is over the marker. You need to add it once, and hide and show it on mouseenter and mouseout. Here is some pseudo code:

lon = L.marker([51,0]).addTo(map);
lon.bindPopup(L.popup().setContent("YOUR CONTENT"));
lon.on("mouseover", function(evt) { this.openPopup(); });
lon.on("mouseout", function(evt) { this.closePopup(); });

Hope it helps,

HA

--

---
You received this message because you are subscribed to the Google Groups "Leaflet" group.
To unsubscribe from this group and stop receiving emails from it, send an email to leaflet-js+...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[Alexandru Pufan]

Sorry, the correct jsdiffle is this:

http://jsfiddle.net/YzhwZ/20/

[Alexandru Pufan]

I am adding this code to my function: 

trasee.bindPopup(L.popup().setContent(feature.properties.Descriere).setLatLng(e.target))

trasee.on('mouseover', function(e) {this.openPopup()})

Now the popups appear on mouseover, but the position is incorrect, they all appear at the same place.

[Alexandru Pufan]

OK, I got it. This works:

function interaction(feature, layer){

layer.on({

mouseover: function over(e) {

(e.target).setStyle({

color: 'yellow',

weight: 5,

opacity: 0.5

})

layer.bindPopup(L.popup().setContent(feature.properties.Descriere))

layer.openPopup()

},

mouseout: function out(e) {

trasee.resetStyle(e.target)

layer.closePopup()

}

})

}

[Angelo Giammarresi]

Hi!

Thanks a lot for sharing your solution. I'm not very clever but modifying a little your code I got a great result of having both the over popup and click popup.

The change I made was instead of reset I used unbindPopup.

You can see my result here  http://www.wocmultimedia.biz/en/new-collapsible-panel-layers/