IBF-dashboard

IBF-dashboard: Web interface of the IBF-system.

Welcome to the GitHub repository of the IBF-dashboard,

• Setup development environment
• Configuration
• Getting Started
• Documentation
• Other resources
• Loading layer info popup descriptions

Setup development environment

Node.js
To prevent conflicts between other projects use a version manager to install and use Node.js.

• On windows: https://docs.microsoft.com/en-us/windows/nodejs/setup-on-windows

• On macOS/Linux: Use NVM - Node Version Manager

  After installing run:

  nvm install

Install other dependencies
See Documentation.

npm install

Configuration

Set the required configuration values in the .env file, by using the provided example.env:

cp example.env .env

Getting Started

To start a local instance of the interface on http://localhost:4200/:

npm start

See other available tasks/scripts with: npm run

Documentation

Documentation of the tools and libraries used.

• Ionic Framework v5
  This UI-kit or library gives us a foundation to quickly build interfaces cross-platform/cross-device-type.
  We use the (default) framework of Angular with(in) Ionic.

  • Available components: https://ionicframework.com/docs/components
  • Icons: https://ionicons.com/

• Angular v10
  This front-end framework gives us a structure to create components that can be connected, combined, share data and can be delivered as a web-app.

  • API Documentation: https://10.angular.io/api
  • Used by Angular, RxJS: https://rxjs.dev/guide/overview

• Leaflet v1.6 A library for maps with multiple interactive layers.

  • API Documentation: https://leafletjs.com/reference-1.6.0.html
  • Angular component(s) used:
    • ngx-leaflet: https://github.com/Asymmetrik/ngx-leaflet

Other resources

• Leaflet Markers
  For easily exchangeable marker-images, see: https://github.com/pointhi/leaflet-color-markers

Loading the layer info popup descriptions

See specific readme here