Exibitera should have a Mapping Application

[alexaverill]

There is a need for a generic mapping application in Exibitera. This comes out of a conversation over email that I wanted to capture as an issue to promote a wider discussion. The main goal would be to leverage leaflet js to use open street map layers, though this would also allow a variety of layers to be used.

I was working on an MVP mapping app that would do the following:

• Users can define a base layer
• Users can define a max zoom-level
• users can define a bounds rectangle locking the map to that region.
• Users can define a spreadsheet containing POI coordinates, a description, and image(s)
• On selection a drawer opens with a title, description,and image gallery

Example UI

Future Scope:

1. Attract Screen
2. Loading GeoJson layers to support additional data representation

@forceflow1049 I would be curious if you have any other thoughts on what would be valuable for an MVP and for future scope.

[David-S-Morgan]

Oooh, this would be quite useful! :+1:

[forceflow1049]

@alexaverill This is a great list to get us starting. In addition to your MVP items, it should:

1. Support multiple languages (there is a standard createLanguageSwitcher function in exhibitera_apps_common.js for building the UI)
2. Support text size adjustment

Those two items are part of Exhibitera's accessibility-by-default philosophy. I would maybe start by duplicating Timeline Explorer, as it supports spreadsheet input, multilingual, and adjustable text. Just swap the functions that build the timeline for ones that build the map.

[alexaverill]

@forceflow1049 those are good suggestions. My current plan is to setup an initial demo and share it here. I am also thinking through the best way to define the exhibit content in a generalize way. Initial testing with setting it up in a spreadsheet/csv. I am going to throw together a more WYSIWYG/guided experience that hopefully create a low barrier to entry. Also my current plan is to try to keep it as loosely coupled to the python backend to make it easier to host independently as a demo for people to play with.

[alexaverill]

Just wanted to share a minor update. I have the initial front-end setup. Its a fairly normal/basic map viewer for points with different base layers and the ability to lock the user to a defined region and zoom levels. A demo is up here at the moment: https://maps.averill.dev/

I am in the middle of working on a WYSIWYG editor that's coming along nicely. (The demo above was built in the editor).

[forceflow1049]

Great update, @alexaverill! It's coming along nicely. I'll have some more comments in a few days—I've been moving apartments this week!

[forceflow1049]

@alexaverill Finally had a chance to play around with this—it is really nice! In addition to a WYSIWYG option for adding points, we probably want to support spreadsheet entry as well. I can imagine situations, such as wanting to mark the locations of all national capitals, where it would be inefficient to have to input them one by one.

Do users have to supply their own API key in order to access the mapping API?

[alexaverill]

CSV Loading is definitely on the todo list. There are some considerations that I need to think through for the data outside of the mapping from Latitude and Longitude to content. Nothing too crazy just managing base layers and map bounds nicely.

So the user wouldn't need to supply any API keys at all, its all based on Leaflet.js which is free and open source. There are some base layer providers that require api keys or accounts, but a user doesn't really have to use those base layers.

I have this as a link in the editor, but here are a ton of the different base layer options: https://leaflet-extras.github.io/leaflet-providers/preview/ (Note there are closed source map layers in that preview, license details are here: https://github.com/leaflet-extras/leaflet-providers)

Another cool thing is as long as a user can find a map tile server that follows the standard it can be maps of anything. For example there are free to use Mars and Moon map tiles that can be dropped in and used. https://www.openplanetary.org/opm/basemaps I plan to put together a couple demos based on them after I get the rest finished

I expect to have the WYSIWYG editor ready for testing sometime this week

[alexaverill]

Here is an initial version of the WYSIWYG editor: https://maps.averill.dev/create.html

I'd love some feedback, especially any suggestions for better verbiage on the dialogs and instructions.

Things that are still in progress:

1. Multiple Language support, need to implement inputting and displaying
2. Bulk Point upload, I am planning to add the ability to upload a CSV during the point addition step, My thoughts are to generate a sample CSV based on the languages setup in the application for a user to fill out with their bulk points.

Love to hear some feedback @forceflow1049 and @David-S-Morgan

[forceflow1049]

@alexaverill This is really cool!

From the end-user app side, I think things are really in pretty good share. A couple of things to consider, in addition to your WiP points from above:

• We can't have any active links to outside the app (or people will escape). Currently there is a link to both Leaflet and the layer credit. I imagine we need to provide layer credit, but if it needs to be a link, then it should pop up as a QR code.
• There should be some kind of option for a header, like "Battlefields of World War I" or "Shipwreck Locations"
• Maybe a reset view button that takes you back to the initial view?

From a setup perspective, I want things to be consistent across the apps in Exhibitera. So, instead of having the setup steps overlay the map, we should clone one of the existing setup pages and modify it. Maybe we have the interactable map near the top, with your various setup steps below that. The righthand-column will still be a preview of the overall app that updates as changes get made (like after each step is complete). A few more specifics:

• We will need to offer the ability to change colors/fonts/etc in line with the other Exhibitera apps.
• There should be an option for an attractor screen (with a timeout to return to it).
• It would be cool if you could set a unique icon for the pins. Either as a bulk setting (i.e., change to a shipwreck icon uniformly) or on a per-item basis (i.e., different icons for earthquakes vs. tornadoes vs. landslides).
• It would be good to have a dropdown list of common basemap options to select from, in addition to the chance to supply your own link.
• The end result will need to be a definition file that conforms to the Exhibitera Apps format, because that is needed by Hub to handle switching between different apps, etc. The definition file can refer to a user-supplied CSV if we want (like in Media Browser).

I feel really positive about how the app is going to turn out! Given the amount of stuff on the setup end to do, I'm going to move this to the Exhibitera 6 milestone so it doesn't block other releases. If we get everything done sooner, we can always move it back up.

Thanks so much for all your work on this!

[alexaverill]

@forceflow1049 Thanks for the feedback, I think there are a lot of good suggestions here. I’ll double check what the licenses for leaflet and the base maps require and sort out if we can get away with text or a QR code.

Reset and a title are also good calls, an Attract Screen and custom pointers are also on the todo list, but lower down at the moment.

I am not sure a dropdown with common base maps adds much, currently I put in the street and satellite as the defaults, since based on what I have seen building out similar types of exhibits for clients that covers 99% of what people want. The link to the complete list then covers anyone else.

In terms of the definition file is there a reason to not just embed the output of the editor into the existing definition?

While I understand the desire for a unified UI across setup, I don’t think it’s the best use case for this exhibit, or as a general rule for all exhibits. I think having a wizard based or walkthrough based setup process unique per exhibit helps lower the bar to entry, and makes it easier for first time users to get started quickly. Even with my experience building out and developing exhibits I have had some trouble getting demos of the app up and running quickly and easily. I would argue that slowly building out more user focused UI’s would help the average museum curator feel more comfortable and confident moving forward.

I think there could also be value in treating this mapping as a Exhibitera Compatible mapping application and use this as a good time to build out documentation and an npm package to enable more developers to build comparable apps that compliment the core apps but might not fit directly into the Exhibitera setup process.

[forceflow1049]

@alexaverill I like the idea of trying it as a compatible app. I also hear you about the complexity of setup for some of the Exhibitera apps. I think your setup wizard is a nice improvement—I may try to implement something similar for one of my apps as a test.

[alexaverill]

Just following up on this since its been a few weeks, I have most of the functionality complete, but have been a bit busy and haven't spent too much time on it at the moment. I have some outstanding work to do for timeouts and Exhibitera integration, and need to write up some documentation. I'll keep chipping away at it,and update as I finish things off

[forceflow1049]

Thanks for the update, @alexaverill! I am working on a test of a setup wizard for Media Browser, inspired by what you created for the mapping app. I will share for feedback once I have it working.

[forceflow1049]

@alexaverill I've finished a working version of the setup wizard for Media Browser (probably one of the most complicated apps alongside InfoStation). I've love to hear your feedback on it—check out the Dev_5.2_setup_wizard branch

https://github.com/Cosmic-Chatter/Exhibitera/tree/Dev_5.2_setup_wizard

[alexaverill]

@forceflow1049 Awesome! I will pull it and take a look tomorrow morning and let you know what I think! I am still working on finishing up some of the editor flow on the mapping, and getting documentation together. Work has been keeping me busy so it’s been a lower priority.