Add OpenHistoricalMap layer to maps

[1ec5]

I’ve added a rudimentary OpenHistoricalMap layer to all the maps in Gramps Web. The maps still default to the OpenStreetMap layer, but the layer selection control is now available just about anywhere there’s a map.

For now, the OpenHistoricalMap layer just shows everything that’s in OHM, regardless of the date. This would obviously confuse the user. It would be straightforward to filter the map by date, either by installing the interactive Leaflet time slider plugin or by passing in a date from the surrounding context. I’m unsure of where to get a relevant date, but it seems like it’s within reach.

Here’s my hometown, Loveland, Ohio, and the late owner of a former hardware store there:

Fixes #437, working towards Mantis #13271.

[jeffreyameyer]

I’m unsure of where to get a relevant date,

Does this refer to "where to get the date from Gramps" or "where to get a date from OHM?". I believe it's Gramps, but I wasn't 100% sure.

[1ec5]

I’m referring to getting dates within the current Gramps view that can be fed into the map component. For example, in one of the screenshots above, I’ve hovered over an event in 1895 – the map could automatically filter to 1895 while hovering over that item.

[DavidMStraub]

Thanks so much, that looks awesome! 😍 I will review it as soon as I can, and for sure will be able to support on the dates question.

[DavidMStraub]

Rebased to main.

[DavidMStraub]

I finally had time to test it and it works & looks great! Also the changes to the code like the use of L make sense.

Concerning the time slider, I feel a more minimal slider would fit better - and we could use it regardless of map layer to only show pins of places with events in a given period.

Do I understand correctly the OHM map can either use a fixed date or a range?

[1ec5]

Yes, the data is all available on the client side; it’s up to the client code to decide what to show or filter out. Unfortunately, the existing time slider library’s UI might be a bit much for some of the map views, but there would be nothing wrong with writing a homegrown UI just for Gramps.

With a slider, we’d need to decide the earliest and latest date the user should be allowed to choose. Alternatively, we could present the user with a date control. A range could simply entail showing two date controls instead of just one. Unfortunately, the HTML slider control only supports one knob, not two knobs, so we’d need to create and style a custom control if we need a double-knob slider to represent a date range.

[DavidMStraub]

Got it! We are using Material Web and they have range sliders (https://material-web.dev/components/slider/stories/), so that would be fairly easy to implement; I want to play around with some options in the next days. I suspect a slider is not so convenient on mobile.

As for the earliest date (the latest date would be today), we could select it based on the earliest event in the tree, but I feel like hard coding it to 1500 or 1600 when using a slider is probably ok because I imagine there are few genealogies that extend beyond it (and we could define the leftmost position of the slider as minus infinity).

[1ec5]

Here’s what the map looks like with the new time slider from 1ec5/gramps-web#1: