Elementor conflicts and query

  • Hello. Thanks for creating such a great plugin! I have got a nice cluster map working on my testing site, but I have a couple of queries…

    https://wkd.designbymint.com/leaflet-map/

    1. I’m using the shortcodes in Elementor, these seem to work fine. However, I’m trying to use some custom code to display a counter of total markers that are in the viewing area (like how this works: https://www.worldcancerday.org/map-activities ) – but no matter what javascript code I try, I always get ‘Uncaught ReferenceError: L is not defined’ in the console, and no counter output is displayed. Do the shortcode maps use a different reference other than ‘L’? Could you advise what I need to do?
    2. I also noticed when viewing the console log for my map, that it is trying to load two pages of javascript; leaflet-gesture-handling.min.js.map and leaflet.markercluster.js.map – both with the ‘.map’ extension – which seem to produce a 404 error. Could it be this that is causing the error?

    If anbody can help with how to produce a counter like the link above I would be ever so grateful! I will be happy to contribute to your cause if you are able to help! Thank you very much!

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Author hupe13

    (@hupe13)

    See this example and change the code:

    <script>
window.WPLeafletMapPlugin = window.WPLeafletMapPlugin || [];
window.WPLeafletMapPlugin.push(function () {
var map = window.WPLeafletMapPlugin.getCurrentMap();
if ( WPLeafletMapPlugin.markers.length > 0 ) {
for (var i = 0; i < WPLeafletMapPlugin.markers.length; i++) {
var mymarker = WPLeafletMapPlugin.markers[i];
//write your code
}
});
}
}
});
</script>

    both with the ‘.map’ extension – which seem to produce a 404 error. Could it be this that is causing the error?

    Please ask your favorite search engine “disable source map in developer console”.

    Thread Starter sadrobot

    (@sadrobot)

    Hi there. Thank you so much for your quick response on this! That’s been very helpful! I have managed to return the total number just fine on the initial load, but the number doesn’t alter when moving the map / zooming in etc. I just really need a ‘live’ counter of the viewable number of markers. Could you point me in the right direction? Again, I’m happy to pay for your help! Thank you very much!

    Plugin Author hupe13

    (@hupe13)

    Yo need to handle an event: https://leafletjs.com/reference.html#map-event. Maybe zoomend and/or moveend.

    <script>
window.WPLeafletMapPlugin = window.WPLeafletMapPlugin || [];
	window.WPLeafletMapPlugin.push(function () {
		var map = window.WPLeafletMapPlugin.getCurrentMap();
                map.on("moveend zoomend", function(e) {
		      //your code here
		});
	});
</script>

    Your code need to get getBounds() (?) and to detemine if a marker is in this bounds and count.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Elementor conflicts and query’ is closed to new replies.