Support for displaying gps data (gpx)

@jazzper i've been trying to do this for a couple of days now, a route with poi along the way using paragraphs on a Route content type.

I just can't get to show the gpx route line on the geolocation layer, any ideas?

@effortDee sorry no idea. There is a lot of info and screenshots in this post. If you follow it I think it should work (I have no time to re-read everything). It's working on my website: https://khaosanroad-online.com/route/thailand/north-thailand/phrae/large... so it should be possible.

@jazzper thanks for getting back, what you show me is exactly what i'm after but i just can't get it to work and spent almost a week trying every combination I can think of to get it to work.

I am using geolocation v4 though so maybe that is why? It seems to work completely differently to the previous module version and saves the gpx routes differently.

I'm using Geolocation Field 8.x-3.12. Version 4 is in alpha so that definitely could be the reason it's not working for you. Why are you not using the stable version?

@jazzper I have managed to do it!! It seems Geolocation v4 works compeltely differently and saves GPX routes/files as their own entities and there are brand new views integration and even after many days I could not get my head around it and no documentation or answers online.

I now have pretty much what you set up with contextual filter and block view to only show that route and its poi related to that node.

Some more questions if I may.

It looks like you used one Paragraphy Type for the Route GPX and one Paragraph Type for the Points of Interest?

Is this true?

If so, how do you differentiate between the different points of interest, landmark, shops, toilets, water, etc?

I have one for the route and many paragraph types for the POI, one for each of toilets, shops, water, etc.

How do you get the icons/images etc on the markers for the POI? Can I do that just by adding in a title, image field with the POI paragraph type and use that field in views for the marker to inherit?

Thanks so much for your feedback and your original writeup of this approach above ^

@effortDee sorry for the late reply, I'm very busy.

Good to hear you managed to get it working. Can you post your setup here with some screenshots of your views? That would be very helpful for me and other people when upgrading to V4.

It looks like you used one Paragraphy Type for the Route GPX and one Paragraph Type for the Points of Interest?

Yes

If so, how do you differentiate between the different points of interest, landmark, shops, toilets, water, etc?

Taxonomy on the POI paragraph

How do you get the icons/images etc on the markers for the POI?

I have a “marker_icon” field on my “POI” paragraph. In my view I reference this field under: advanced settings – icon source field.

There is a marker icon example Geolocation Demo module → you might want to check that if it's also available for the version you are using.

@jazzper very pretty your website with Olivero. How did you manage to present the summaries and filters in collapses ?

@zenimagine

Thanx for the compliment! I overrode a view template in my custom theme and added a details element around the filter. Like so:

<div class="details-wrapper">
  <details>
    <summary>Filter Map</summary>
      {{ exposed }}
  </details>
</div>

@jazzper Thank you for your help, I managed to do it on my web suite and it is much cleaner :

https://www.cocorinet.fr/points-dinteret

https://www.cocorinet.fr/le-roc-au-chien

I have one last question, you presented your content with a summary, which points to parts of the page. I did a few similar things, but using the links in this ckeditor, entering an ID without putting a link. The problem is that the destination ID appears as a link with an empty href.

On your website it is very clean. How did you do this. I could add the IDs manually in the text of the page but it is very long.

THANKS

@zenimagine

Happy to hear that you got it working, looks nice!

The summary (table of content) is a views block. I use a title paragraph (and the layout paragraphs → module -nice module for content editing from the front end, but not relevant to generating the table of content-) and make a view block:

I use js that I took from a youtube video (I cant write js code but understand it a little when reading it):

Drupal.behaviors.smoothScroll = {
  attach: function (context, settings) {
    // Your custom JavaScript goes inside this function...
    // This JS prefents overlap off the menu over the titles/anchor links by putting
    // the content lower by the height of the menu (#block-views-block-toc-toc-3) + 36px
    // https://www.youtube.com/watch?v=iGUSTyG-CYw
    const navigationHeight = document.querySelector('#block-views-block-toc-toc-3').offsetHeight;

    document.documentElement.style.setProperty('--scroll-padding', navigationHeight + 36 + "px");

    // When clicking outside menu. Close menu.
    var details = [...document.querySelectorAll('details')];
      document.addEventListener('click', function(e) {
        if (!details.some(f => f.contains(e.target))) {
          details.forEach(f => f.removeAttribute('open'));
        } else {
          details.forEach(f => !f.contains(e.target) ? f.removeAttribute('open') : '');
        }
      })
  }
};

What I didn't manage to do is to make the table of content collapse after clicking one of the links. Please let me know if you manage to do that :)

I use the display suite module to add the anchor id with tokens (but I think you should be able to add the anchor link in the view as well when you set the view to show fields and rewrite the field with a token to make the anchor link):

This is what I can recall. I made the TOC quite a while ago.

@jazzper Thanks, I don't use paragraph, prefer to be 100% ckeditor. I will look for another solution. thanks for these informations