Sunday 28 January 2018

geojson - Leaflet Marker Mouseover Popup



I've tried to make a MouseOver Markers Popup since a couple of days, I'm using Leaflet. I know some solutions I've read in many forums, but I wanna make it work with GeoJSON-Points and I haven't found a solution yet.


Here is a working example, for click popups only:


$('#map').each(function () {
// map initialization
map = new L.map('map');

var gjsonMarker = [{
"type": "Feature",
"properties": {
"name": "start",

"popupContent": "Portoferraio"
},
"geometry": {
"type": "Point",
"coordinates": [10.3163552, 42.8072368, 0.0]
}
},
{
"type": "Feature", "properties": { "name": "stop", "popupContent": "Marciana Marina" },
"geometry": { "type": "Point", "coordinates": [10.1970935, 42.8069535, 0.0] }

},
{
"type": "Feature", "properties": { "name": "stop", "popupContent": "Bastia" },
"geometry": { "type": "Point", "coordinates": [9.4520402, 42.6943563, 0.0] }
},
{
"type": "Feature", "properties": { "name": "stop", "popupContent": "Campoloro" },
"geometry": { "type": "Point", "coordinates": [9.5417333, 42.3393521, 0.0] }
},
{

"type": "Feature", "properties": { "name": "stop", "popupContent": "Cavo" },
"geometry": { "type": "Point", "coordinates": [10.422377586, 42.859476028, 0.0] }
}];

gpsMarker = new L.geoJson(gjsonMarker, {
onEachFeature: function(feature, layer) {
if (feature.properties && feature.properties.popupContent) {
layer.bindPopup(feature.properties.popupContent, {closeButton: false});
}
},

pointToLayer: function (feature, latlng) {
return L.circleMarker(latlng);
}
});

map.addLayer(gpsMarker);
map.fitBounds(gpsMarker.getBounds(), {padding: [0, 0]});
});

Any ideas how to make the Popup with MouseOver effect, and when I leave the point the popup must be hidden again.



Greets!




No comments:

Post a Comment

arcpy - Changing output name when exporting data driven pages to JPG?

Is there a way to save the output JPG, changing the output file name to the page name, instead of page number? I mean changing the script fo...