Client location marker

Created on 30 March 2023, over 1 year ago
Updated 29 May 2023, over 1 year ago

I've read many issues about this in the issue queues of various modules including geofield and geolocation etc but there doesnt seem to be a solution.

If I want to simply add a marker for the users current location to a leaflet map that has been rendered in views, how would i go about 'injecting' the js to do so?

Maybe I'm wrong, but my understanding is that this can be achieved with something as simple as the below code using the getCurrentPosition function. But it looks so simple it makes me wonder why it it is so difficult to add to Leaflet in Drupal?

navigator.geolocation.getCurrentPosition(function (position) {
console.log(position);
console.log(position.coords.latitude)
console.log(position.coords.longitude)
var marker = L.marker([position.coords.latitude,position.coords.longitude]).addTo(mymap);
})

To be clear, I just want the Leaflet view to render as normal with the markers from geofield, but then I just want to add one additional marker to the map for the user current location, it does not need to interact at all with anything else which is why Im thinking of doing it within Leaflet and not in Geofield for example, although it would be nice to be able to center the map on this marker if possible, but that is a secondary thing that I'm not worried about right now.

I know this would be better done in a Drupal module or patch, and I'm more than willing to attempt that, but is there a quick and dirty way that I can just add the above js to test this out? I'm just not really sure where to start in adding this code and getting the map name variable etc. If I can get a starting point i can try and work out the rest myself, and potentially provide a patch to include this as an option in the views settings.

💬 Support request
Status

Fixed

Version

10.0

Component

Documentation

Created by

🇬🇧United Kingdom problue solutions Northern Ireland

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

  • Issue created by @problue solutions
  • 🇬🇧United Kingdom problue solutions Northern Ireland
  • Status changed to Fixed over 1 year ago
  • 🇮🇹Italy itamair

    @Problue Solutions
    I attach here a "user_html5_location" module that I quickly developed and that does exactly (and only) what you ask here.
    Simply un-zip and enable it.
    Every Leaflet map of your Drupal application will be (automatically) added with the user html5 location and its view bounds will be extended to contain it also.

    You can inspect all its code and get what is the proper technique to achieve this with the Drupal Leaflet module.
    Basically you should look into the js/leaflet_map_user_html5_location.js file and realise that it is replying on reacting on the 'leafletMapInit' event, triggered here (from the Leaflet map module): https://git.drupalcode.org/project/leaflet/-/blob/10.0.x/js/leaflet.drup...

    Confident that you will be able to go on and scope & customise what you exactly need and that this fully satisfies your support request.

  • 🇬🇧United Kingdom problue solutions Northern Ireland

    itamair, I havent even looked at the module yet but based on the help and expertise I have seen you offering in other threads I am sure this will be more than enough to help me on my way.

    I appreciate this so much and thank you for the guidance, I couldnt have hoped for a better reply to this! Your response motivates me to also try and give back to the Drupal community in some way, thank you again.

  • 🇮🇹Italy itamair

    You are welcome Problue Solutions.

  • Automatically closed - issue fixed for 2 weeks with no activity.

  • Status changed to Fixed over 1 year ago
  • 🇺🇸United States w01f

    Just commenting that this would be a fantastic submodule - I just installed it and it's working fine in D10 as well. If possible, it would be great to be able to enable this in the UI in a view, and possibly also some UI options for changing the icon, etc.

Production build 0.71.5 2024