Overview

Quick links

• Embed FacilMap into any website using an iframe.
• Run your own FacilMap server.
• Use the FacilMap client to programmatically access and modify data on a collaborative map.
• Use the Leaflet components to embed certain feature of FacilMap into a Leaflet map.
• Use the FacilMap frontend to embed an extended or modified version of FacilMap into a website.
• Read about the dev setup to start contributing to the FacilMap code.

Structural overview

FacilMap consists of several layers:

• The Server is a Node.js app that stores the data of collaborative maps in a database and runs a socket.io server to access and modify those maps. It also includes a HTTP server that serves the frontend and the map exports.
• The Client is a JavaScript library that provides methods to access the data on collaborative maps by sending requests to the socket.io server.
• The Leaflet components are a JavaScript library that provides classes to dynamically show the data received by the Client on a Leaflet map.
• The Frontend is a JavaScript app that provides a complete UI written in Vue.js to create, access and modify collaborative maps. It uses the Client to access those maps and the Leaflet components to render them on a map.

FacilMap is completely written in TypeScript. The code base is split into several NPM modules, each of which can be used independently (although some depend on some others):

• facilmap-types provides common TypeScript types for map objects and the socket communication and is used by all other modules.
• facilmap-client contains the FacilMap client.
• facilmap-utils contains helper methods that are used by facilmap-leaflet, facilmap-frontend and facilmap-server, so they can run both in the browser and in Node.js.
• facilmap-leaflet contains the Leaflet components.
• facilmap-frontend contains the Frontend.
• facilmap-server contains the Server.