Improve route hover popup

[MinhxNguyen7]

Currently, it is very difficult to hover over a route in such a way that the popup (displaying distance and duration) shows up. I think it's quite a helpful feature that should be easier to make use of.

Making the margins for error larger for the hover would probably be good. Also, we should consider letting users click on the route to display the popup to make it usable on touchscreen devices,

[ap0nia]

I recently took a look at this component and simplified it as best as I could. I think was able to reproduce most of the behaviors I can discern...bar specifically this one.

Here's my implementation: https://github.com/icssc/AntAlmanac/blob/aponia/src/components/Map/Routes.tsx

The main blocker I ran into was the routeLine option when configuring the router (it automatically fetches the data and draws lines to the map), and somehow getting the rendered route lines to do something on hover or interaction

[ap0nia]

Closing as I think I've been able implement this sufficiently: https://github.com/icssc/AntAlmanac/blob/aponia/src/components/Map/Routes.tsx

What should happen

• If you successfully move your mouse across the line or click on it, a popup will open with info about the route and will stay open until you explicitly click outside of the line
• I also got the bigger hover radius to work by setting multiple styles somehow? The first line is light blue and represents the click/hover radius. The second line is stacked on top and represents the actual route

Strategy

• Using the routing API, I added a "hover" and "click" event listener to all layers of the line rendered for the route

Caveats

• I wasn't able mimic the current (and possibly undesired) effect of immediately closing the popup when the mouse leaves (which I think is unnecessary?)
• The custom inner HTML is nested inside of two divs specifically for Leaflet's popup, so there's some padding/styling that I haven't figured out how to remove. I don't really care or think it matters unless someone says otherwise?

[EricPedley]

Reopening until this change makes it onto the live site.