Plugin Author
bozdoz
(@bozdoz)
Hello, I am also interested in this.
based on your guide I created this action
add_action('leaflet_map_loaded', 'fs_leaflet_loaded');
function fs_leaflet_loaded() {
wp_enqueue_script('gestures_leaflet', 'https://unpkg.com/[email protected]/dist/leaflet-gesture-handling.min.js', Array('wp_leaflet_map'), '1.0', true);
wp_enqueue_style('gestures_leaflet_styles', 'https://unpkg.com/[email protected]/dist/leaflet-gesture-handling.min.css');
}
for adding the custom JS from your example, the Gesture Handling Script says we must add this
var map = L.map("map", {
gestureHandling: true
});
I am having trouble, where to add it on your custom script example
Plugin Author
bozdoz
(@bozdoz)
I had to take a look at Leaflet handlers (https://leafletjs.com/examples/extending/extending-3-controls.html), but it looks like this can be done by using the for loop, as mentioned in the FAQ, and just calling map.gestureHandling.enable():
for (var i = 0, len = maps.length; i < len; i++) {
var map = maps[i];
map.gestureHandling.enable();
}
Let me know if that works.
-
This reply was modified 6 years, 2 months ago by
bozdoz.
Life saver!
Worked like a charm!
Anonymous User 12905264
(@anonymized-12905264)
Hello, I would like to active this option as well, but I think I make some mistakes, because I could not get it to work.
I have added the following to my function php
add_action('leaflet_map_loaded', 'fs_leaflet_loaded');
function fs_leaflet_loaded() {
wp_enqueue_script('gestures_leaflet', 'https://unpkg.com/[email protected]/dist/leaflet-gesture-handling.min.js', Array('wp_leaflet_map'), '1.0', true);
wp_enqueue_style('gestures_leaflet_styles', 'https://unpkg.com/[email protected]/dist/leaflet-gesture-handling.min.css');
// custom js
wp_enqueue_script('gestures', get_theme_file_uri( '/js/mapgesture.js' ), Array('wp_leaflet_map'), '1.0', true);
}
Created a folder “js” in the theme folder and added a js file “mapgesture.js”
inside this file I have put
(function() {
function main() {
if (!window.WPLeafletMapPlugin) {
console.log("no plugin found!");
return;
}
// iterate any of these: <code>maps</code>, <code>markers</code>, <code>markergroups</code>, <code>lines</code>, <code>circles</code>, <code>geojsons</code>
var maps = window.WPLeafletMapPlugin.maps;
for (var i = 0, len = maps.length; i < len; i++) {
var map = maps[i];
map.gestureHandling.enable();
});
}
}
window.addEventListener("load", main);
})();
It would be great if you could point me to the right solution.
Thank you!!!
Plugin Author
bozdoz
(@bozdoz)
your javascript has too many parentheses. Should be:
(function() {
function main() {
if (!window.WPLeafletMapPlugin) {
console.log(“no plugin found!”);
return;
}
var maps = window.WPLeafletMapPlugin.maps;
for (var i = 0, len = maps.length; i < len; i++) {
var map = maps[i];
map.gestureHandling.enable();
}
}
window.addEventListener(“load”, main);
})();
Anonymous User 12905264
(@anonymized-12905264)
Hello again!
Thank you very much for your fast answer.
I have re-uploaded your corrected JS file, but it sadly is not working on mobile. Scrolling is of the map is still active.
I have first tried to upload your example in the FAQ and this is working tough.
Maybe I have an error in the function php, calling the action?
add_action('leaflet_map_loaded', 'fs_leaflet_loaded');
function fs_leaflet_loaded() {
wp_enqueue_script('gestures_leaflet', 'https://unpkg.com/[email protected]/dist/leaflet-gesture-handling.min.js', Array('wp_leaflet_map'), '1.0', true);
wp_enqueue_style('gestures_leaflet_styles', 'https://unpkg.com/[email protected]/dist/leaflet-gesture-handling.min.css');
// custom js
wp_enqueue_script('gestures', get_theme_file_uri( '/js/mapgesture.js' ), Array('wp_leaflet_map'), '1.0', true);
}
Or do I have to add a special shortcode element to the Leaflet shortcode?
Best wishes!
-
This reply was modified 6 years ago by
Anonymous User 12905264.
Anonymous User 12905264
(@anonymized-12905264)
I have found the error 🙂 I used wp_enqueue_script('gestures', get_theme_file_uri( '/js/mapgesture.js' ), Array('wp_leaflet_map'), '1.0', true); But it must be: wp_enqueue_script('gestures_custom', get_theme_file_uri( '/js/mapgesture.js' ), Array('gestures_leaflet'), '1.0', true);
-
This reply was modified 6 years ago by Anonymous User 12905264.
