PruneCluster icon indicating copy to clipboard operation
PruneCluster copied to clipboard

how to set events on marker popup

Open pat1 opened this issue 8 years ago • 2 comments

without PruneCluster to have a "riseOnHover" message I use: L.marker(latlng, {icon: myIcon, riseOnHover: true, riseOffset: 10000, title:feature.properties.date });

and to execute some code on popupopen: leafletMarker.on('popupopen',function myfunction(e) { // my js management
});

How I can do the same with PruneCluster? Thanks in advance Paolo

pat1 avatar Mar 23 '17 14:03 pat1

do this, after create marker
pruneCluster.PrepareLeafletMarker = function(leafletMarker, data) { if (leafletMarker.getPopup()) { leafletMarker.setPopupContent(data.name); } else { leafletMarker.bindPopup(data.name); } leafletMarker.on('popupopen', function(){ //do click event logic here }); }; should work fine

sinijvas avatar Apr 20 '17 10:04 sinijvas

Thanks a lot for your response! At the end all is working with this code: https://github.com/r-map/rmap/blob/master/python/showdata/templates/showdata/spatialseries.html

	pruneCluster.PrepareLeafletMarker = function(leafletMarker, data) {
	    if (leafletMarker.getPopup()) {
		leafletMarker.setPopupContent(setpopup(data.feature));
	    } else {
		//leafletMarker.bindPopup(data.name);
		leafletMarker.bindPopup(setpopup(data.feature));
	    }
	    var vallen= (data.feature.properties.val).toString().length * 6 + 6;
	    leafletMarker.setIcon(
		L.extendedDivIcon
		({
		    iconSize: new L.Point(vallen, 14),
		    html: data.feature.properties.val,
		    className: 'myDivIcon',
		    style: {backgroundColor:getColor(data.feature.properties.val,min,max)}
		})
	    );
	    leafletMarker.bindLabel(data.feature.properties.date);
	    leafletMarker.on('popupopen',function managepreload(e) 
			     {
				 $('#preloadimages img').preload({
				     placeholder:'{% static "showdata/loading.gif" %}',
				     notFound:'{% static "showdata/access-error-logs.png" %}'
				 })
			     });
	};

and:

            $.each(collection.features, function(i,feature) {
	    coords.push( [ feature.geometry.coordinates[1],feature.geometry.coordinates[0] ]);
	    var marker = new PruneCluster.Marker(feature.geometry.coordinates[1], feature.geometry.coordinates[0]);
	    marker.data.feature=feature;
	    var vallen= (feature.properties.val).toString().length * 6 + 6;
                marker.data.icon = L.extendedDivIcon({
		iconSize: new L.Point(vallen, 14),
		html: feature.properties.val,
		className: 'myDivIcon',
		style: {backgroundColor:getColor(feature.properties.val,min,max)}
	    });
	    marker.data.popup = setpopup(feature);
	    pruneCluster.RegisterMarker(marker);
            });
            map.addLayer(pruneCluster);

pat1 avatar Apr 21 '17 14:04 pat1