Add map rotation and heading controls#2506
Add map rotation and heading controls#2506ArturoManzoli wants to merge 6 commits intobluerobotics:masterfrom
Conversation
Signed-off-by: Arturo Manzoli <arturomanzoli@gmail.com>
Signed-off-by: Arturo Manzoli <arturomanzoli@gmail.com>
Signed-off-by: Arturo Manzoli <arturomanzoli@gmail.com>
… rotation button Signed-off-by: Arturo Manzoli <arturomanzoli@gmail.com>
c113748 to
e38608a
Compare
Signed-off-by: Arturo Manzoli <arturomanzoli@gmail.com>
…drag Signed-off-by: Arturo Manzoli <arturomanzoli@gmail.com>
e38608a to
93ac8e6
Compare
There was a problem hiding this comment.
Haven't tested with a vehicle yet.
- It may be preferable to use a circular component instead of the current square one, to make it clearer it's for rotation, and isn't like the other click-only map buttons.

- I also find the current dark arrow very hard to see over dark backgrounds. I would suggest red instead, but IIRC that's used already in the compass widget for the vehicle heading?
Not sure what's best there, unless we maybe add a white outline to that dark triangle? - We may need to add some antialiasing to the map grid lines - they show up dotted at some angles

- Per discussion in the last meeting it would be good to expand this to allow syncing a map with a compass widget (likely via the data-lake), and ideally allow using the compass to control the rotation (like is being added here via a new component on the map). Not having them synced can be quite confusing, but that's an involved enough improvement that I don't think it should block this PR.
| } | ||
| ControlRotate.prototype._handleMouseDrag = function (e: MouseEvent): void { | ||
| if (!this.dragging) return | ||
| const deltaX = e.clientX - this.dragstartX |
There was a problem hiding this comment.
I'd be more inclined to directly make this North -> direction of mouse/finger from the centre of the icon, instead of being incremental.
I was trying to rotate the map by rotating my mouse around the icon, and thought there was a bug that only allowed rotating through half the angles.
If you think incremental is particularly valuable then we could make it that dragging directly up/down is incremental (with all other angles being direct control), since that's what the button location provides the most space for.
| * Skips loading if the plugin is already available on L.control. | ||
| * @returns {Promise<void>} Resolves when the plugin has been loaded and executed | ||
| */ | ||
| const loadLeafletRotate = async (): Promise<void> => { |
There was a problem hiding this comment.
Is it possible to use a single function for this (e.g. from some kind of map utilities file), instead of duplicating the definition between the map and mission planner?
|
As per the discussion here we should move the tiles fix to a dedicated PR. |
Screenshare.-.2026-03-12.7_58_28.AM.mp4
Close #2370
Relates to #2362
Close #312