How to integrate leafleat-rotate-map npm package ?

[killianweid]

Hello, in order to rotate the map according to the direction of movement of the user (I developed a GPS on leaflet maps) I would like to integrate the npm package leafleat-rotate-map but I don't know how to go about it.
I have already tried to install it via the command "npm install leaflet-rotate-map" then include it in the waymark.js file via line 27 of the "Gruntfile.js" file as an attachment. But then when I try to use the "setBearing()" method in the "Waymark_Map.js" file (which is created in the previous package) it is not recognized..
Gruntfile.js.zip

[morehawes]

Hi @killianweid,

Thanks for reaching out and creating a discussion on this, because going forward this is something I want to improve.

Integrating each new Leaflet plugin/JS library into Waymark has been a challenge even for me and after all these years I know the codebase quite well! 🤯

Part of my current effort is to try to make Waymark more modular, more modern and a better experience for developers. This is takes alot of time however!

in order to rotate the map according to the direction of movement of the user

Is your desire for there to be a button, which once pressed orientates that Map according to the device compass (if available?). If so I would definitely also like to see this included at some point.

Thanks again for your input.

Joe

[killianweid]

Hello @morehawes,
thanks for your fast response.

I have already developed a button on the map that allows the user to be geolocated and tracked (GPS).
The user's position is characterized by a custom marker (arrow icon) and is updated after a certain period of time (1sec) and if the new position is 2 meters further than the old one (in order not to update day too many times).
The orientation of the marker is calculated with a mathematical equation and works perfectly well.

What I would like is that when you click the button a second time, the map is oriented according to the devis compass as you said.
Finally I succeed to integrate the "leaflet-rotate-map" with just including the "leaflet-rotate-src.js" file of the package. I put this file in "waymark-js/libs/js" directory of your plugin.
The setBearing() method works fine but now I'm having trouble calculating the orientation angle of the map. 😅
If you are interested in all this code I can provide it to you, and maybe you could help me to find the right calculation method?

Best regards,
Killian

[morehawes]

Hi @killianweid,

Apologies for my delay in getting back to you - I am away making Tracks at the moment :)

If you are interested in all this code I can provide it to you, and maybe you could help me to find the right calculation method?

Feel free to fork Waymark and commit your changes. This will allow me to quickly see your edits and replicate on my end.

While I am happy to take a quick look at this once I get some more free time, I have to be honest about my hesitation to "bake" any more plugins/libraries/features into the plugin. Things are already so "interwoven" (read as ... "spaghetti" ;) that I am actively trying to remove and simplify the core codebase.

Instead I would eventually like to make Waymark more extensible by standardising/documenting/creating "hooks" that developers can use to add extra functionailty... like how WordPress does with plugins.

This is long-term goal however and in the mean time I would be happy to look at what you have, but I can not guarantee I will be of much help... or that it will be merged into Waymark.

Cheers,

Joe