L.control.locate is not a function error help

  • Resolved nikosillo

    (@nikosillo)


    4 years, 2 months ago

    Hello
    I apologize for my English, I have to use Google Translate.
    First of all congratulations for your fantastic plugin, it is impressive and very useful.
    I’ve been looking for information about it but I can’t find anything.
    I try to add the geolocation option as you explain in the documentation for developers and I can’t get it to work, I’ve tried queuing the files, adding the lines in the header and footer, and in all cases the same error always appears:

    Uncaught TypeError: L.control.locate is not a function
    <anonymous> .. /js/script.js?ver=5.9.2:6
    initTravelersMap .. /plugins/travelers-map/includes/public/js/dist/travelersmap-bundle.js?ver=2.1.0:588
    <anonymous> .. /plugins/travelers-map/includes/public/js/dist/travelersmap-bundle.js?ver=2.1.0:595
    EventListener.handleEvent* .. /plugins/travelers-map/includes/public/js/dist/travelersmap-bundle.js?ver=2.1.0:593

    I use Twenty Twenty One theme and Elementor.
    I would greatly appreciate your help.

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

Viewing 5 replies - 1 through 5 (of 5 total)
  • Plugin Author Camille V

    (@socrapop)

    4 years, 2 months ago

    Dear @nikosillo

    If you look at your console, you have another error before this one, triggered by Leaflet Locate itself:
    Uncaught TypeError: can't access property "extend", l.Marker is undefined

    I think the loading order of Leaflet Locate is important, and needs to be loaded after leaflet.js

    Leaflet.js is added in the footer of the page, so you might want to load it after that, here is how to load it after with enqueue :

    wp_enqueue_script('leaflet-locate', 'path/to/file.js', array('leaflet'), false, true);

    Here is the documentation : https://developer.ww.wp.xz.cn/reference/functions/wp_enqueue_script/

    The array('leaflet') tells wordpress to load the script after leaflet.js 🙂

    Tell me if it’s better 🙂
    Have a nice day,
    Camille

    Thread Starter nikosillo

    (@nikosillo)

    4 years, 2 months ago

    Oh boy, thank you very, very much!!! it works perfectly!!! I feel like a fool, I really appreciate it

    Thread Starter nikosillo

    (@nikosillo)

    4 years, 2 months ago

    Camille…. Maybe I can abuse your generosity a little more and ask your opinion about another problem that happens on the same website.
    Every time one of the Points of Interest is opened in a modal window, the map appears locating said point. The information is extracted from a post using the All AE Templates plugin. The map is not displayed unless the browser window is resized, and then it is displayed correctly. Any suggestions how I could fix this problem?

    Plugin Author Camille V

    (@socrapop)

    4 years, 2 months ago

    Hello,

    You will have to trigger a javascript event on the leaflet map object like this :

    cttm_map[i].invalidateSize();
    i being the index of the map on your page (same as in the developers documentation)

    So you will need to find a way to trigger that function when your modal is opened (or just after). Here is the link to the leaflet documentation, on invalidateSize()
    https://leafletjs.com/SlavaUkraini/reference.html#map-invalidatesize

    Thread Starter nikosillo

    (@nikosillo)

    4 years, 2 months ago

    Thanks for the help. I have not found a way to add the instruction and make it work, but it does not matter, with the developer options that it facilitates I have been able to build another more visually attractive map option for my site, so thank you very much

Viewing 5 replies - 1 through 5 (of 5 total)

The topic ‘L.control.locate is not a function error help’ is closed to new replies.