MapStore, a year in review FOSS4G 2021 edition

MapStore is an open source product developed for creating, saving and sharing in a simple and intuitive way maps, dashboards, charts and geostories, directly online in your browser.

MapStore is built on top of React and Redux, it is cross-browser and mobile ready; it does not explicitly depend on any mapping engine but it supports both OpenLayers, Leaflet and Cesium; additional engines could also be supported (MapBox GL is in the working).

The presentation will give an overview of the product, covering current and planned functionalities as well as a few case studies.

Transcript

1. MapStore MapStore, a year (+1) in review Lorenzo Natali Tobia Di Pisa GeoSolutions
2. GeoSolutions • Offices in Italy & US, Clients worldwide • 30+ collaborators, 25+ Engineers • Our products • Our Offer Enterprise Support Services Deployment Subscription Professional Training Customized Solutions GeoNode
3. Affiliations We strongly support Open Source, it Is in our core We actively participate in OGC working groups and get funded to advance new open standards We support standards critical to GEOINT
4. Contents • What is MapStore? • What does MapStore do? • What did we do in last 2 years? • Where MapStore is going
5. What is MapStore?
6. What is MapStore? It is also a Product Use it as is or slightly modifying the look & feel
7. What is MapStore? It’s a Framework You can build many different applications with its plugins (and by developing your own)
8. What does MapStore do?
9. What does MapStore do? MapStore Home Page Manage your contents !
10. What does MapStore do? Load Layers Create a new content (e.g. a Map) Share it Save a Map and set permissions Create contents and share them: Maps, Contexts, Dashboards and GeoStories
11. What does MapStore do? Manage users and user groups
12. What does MapStore do? MapViewer mobile layout => Many tools Time traveling Widgets annotations geocoder ...
13. What does MapStore do? Multiple Mapping Engines
14. What does MapStore do? Dashboard GeoStory (new)
15. What does MapStore do? Application Contexts
16. What did we do last 2 years
17. 4 Major Releases The main features released: • 2019.02 ◦ Filter Layer ◦ Timeline Map Sync • 2020.01 ◦ Backgrounds editing with catalog ◦ Migration to React 16 • 2020.02 ◦ GeoStory ◦ Application Contexts • 2021.01 ◦ Visual Style Editor ◦ Advanced charts with PlotlyJS ◦ Improved Annotation tool ◦ Compare tool ◦ Extensions … and hundreds of other improvements !!!
18. 2019.02 - Filter Layer • It is possible to filter a layer directly from the TOC
19. 2019.02 - Timeline Map Sync • It is possible to filter the timeline to show only times of the features in the current map viewport
20. 2020.01 - Background Selector • The editor of the map can add background layers using the catalog tool
21. 2020.01 - migration to React 16 This is a more a thing for developers, that allows to use new functionalities and improves stability and performances.
22. 2020.02 - GeoStory • Build your fascinating stories using MapStore contents and more
23. 2020.02 - GeoStory • Customize everything, from the theme to the single content styles
24. 2020.02 - Application Contexts • Build and configure your own map viewer, share it and create maps on it
25. 2020.02 - Application Contexts Share Create maps in context Search by context
26. One Installation - Many Applications !! 2020.02 - Application Contexts
27. One Installation - Many Applications !! 2020.02 - Application Contexts
28. 2021.01 - Visual Style Editor Fill Style Line Style Point Style • The Style Editor tool has been improved with a new UI to enhance the user experience in editing and creating new styles
29. 2021.01 - Visual Style Editor Classification Text Style Patterns Text Style
30. 2021.01 - PlotlyJS Charts Time series Advanced options Improved legends • The support for Chart widgets has been improved with the migration to Plotly JS
31. 2021.01 - Annotations • The Annotation tool has been re-designed to provide an improved user interface
32. 2020.01 - Annotations • Everything in the same view
33. 2021.01 - Compare tool • The Compare tool is available from TOC as soon as a layer is selected Both Swipe and Spy glass modes are available!
34. 2021.01 - MapStore Extensions • You can develop your extension and install it in a MapStore context
35. 2021.01 - MapStore Extensions
36. Where MapStore is going
37. 2021.02 - Context Theme • Context Theme: the application context system will be enhanced with a new step to customize the theme from UI
38. 2021.02 - Theme System Review • Review of the theme system: the support for custom themes in MapStore has been reviewed and improved to also easily override the default and to provide multiple themes to be selected for a context • Can customize on the fly using CSS variables --ms-main-bg: #333333;
39. 2021.02 - GeoCarousel • GeoCarousel Section: GeoStory has been enhanced with a new interesting section type
40. 2021.02 - Visual Style Editor Raster Style
41. 2021.02 - Performance Improvements Advantages: • Reduced bundle size of 23%, 15% gizipped. • Initial page load 1 second faster • Now building MapStore do not require Gigabytes of memory and is faster. →We can remove from build NODE_OPTIONS=--max_old_space_size=4096 Various optimization on library loading and bundle size: • tree shaking • lazy loading
42. 2021.02 - Other Improvements A lot of other minor enhancements to the existing MapStore capabilities will be included • Added the UniqueInterval classification method for both raster and vector styles • Improved the GeoLocate tool • Enhanced Catalog advanced options • Added autocomplete for cross layer filtering • Added the catalog service selector also for dashboards • ...and more and more
43. 2022.Q1 - MapStore projects Brand New project system • No need to clone MapStore, only use `npx` • Reduces the boilerplate to minimal ◦ Less files to maintain ◦ No git sub-module for MapStore ◦ Convention over configuration strategy ◦ Easier migration for future versions ◦ Same tool for Extensions and Projects $ npx mapstore-project create [..] - Name of project (default mapstore-project): custom-project - Include backend (yes/no default yes): yes - Optional features (printing, ldap): printing - Run npm install after creation setup (yes/no default yes): yes create project - success $ cd custom-project $ tree custom-project/ ├── assets │ └── img │ └── favicon.ico ├── build.sh ├── configs │ ├── newgeostory.json │ └── new.json ├── java │ ├── pom.xml │ ├── services │ │ ├── pom.xml │ │ └── src │ └── web └── [...] │ ├── pom.xml │ └── src ├── js └── [...] │ └── apps │ ├── embedded.jsx │ ├── mapstore.jsx │ └── ms2-api.js ├── package.json ├── package-lock.json ├── themes │ └── default │ ├── theme.less │ └── variables.less ├── translations │ ├── data.de-DE.json │ ├── data.en-US.json │ ├── data.es-ES.json │ ├── data.fr-FR.json │ └── data.it-IT.json └── version.txt
44. 2022.Q1 - 3D Tiles • 3D Tiles support: we are planning the inclusion of the 3D Tiles support in MapStore • Cesium update to latest version • UI/Configuration support to add/load 3D tiles layers in Cesium map • Styling support for 3D tiles
45. 2022.Q2 - Further Performance Improvements Speed Up first page load by: • including only the libraries effectively needed for the current page • Speed up theme loading and remove bottlenecks
46. Who uses MapStore?
47. Who uses MapStore? • Halliburton • Rennes Metropole (via geOrchestra) • Austrocontrol • MapStand • UN FAO • EMSA • World Bank (via GeoNode) • Unesco (via GeoNode) • EARTH-IArno river basin authority • Region of Tuscany (Hydrologic Service) • Region of Tuscany (Urbanistic Department) • LaMMa • City of Munich • City of Florence • City of Genova • City of Bozen • City of Brussels • IGB (via GeoNode)
48. GeoNode
49. IGAD GeoPortal
50. World Bank - HEV-E
51. EU - DECAT
52. Rennes Metropole - geOrchestra
53. Neftex® WebMapper
54. NPA Terrain Explorer
55. AustroControl SDI
56. CSI Piemonte SIRA
57. City of Bozen
58. City of Brussels
59. City of Genoa
60. City of Florence
61. Resources • Demo Online - mapstore.geosolutionsgroup.com • User Doc - mapstore.readthedocs.io/en/latest/user-guide • Dev Doc - mapstore.readthedocs.io/en/latest/developer-guide • Youtube Videos - https://www.youtube.com/playlist?list=PLe2yzutVrnZ5tjYGYYcK mZzo_M9ku5I9X • Mailing Lists - https://groups.google.com/g/mapstore-users • MapStore Training’s documentation - http://training.mapstore.geosolutionsgroup.com.s3-website-eu-west-1.amazonaw s.com/index.html
62. That’s all folks! Questions? info@geosolutionsgroup.com