This is a web application developed by Infravis.se for the Structural Health Monitoring research group at the Department at Building Technology, all from the Linneuniversitetet, Växjö, Sweden. This project has been developed from March to December 2023-
TimberVis Flexiboard is a data visualization and exploration web-based tool that allows researchers and participating companies to quickly and reliably analyse ongoing monitoring projects where continuous measurements at real buildings and at laboratory scale are done.
The building and projects are equipped with several sensors (temperature. vibration, humidity). The data is collected continuously every few minutes and saved for analysis. The result time-series data for each sensor's position inside the construction structure.
In order to visualize and explore this kind of data, it is very popular the use of dashboard that allow data filtering for a pre-defined number of diagrams. With TimberVis we wanted to go beyond a classic dashboard and be able to have a bit more freedom when creating the dashboard and, at the same time, cover a wider number of user cases: from researchers to companies, from students to general audience. According to this goal we created what we call a Flexiborad, where a user of the TimberVis interface is able to generate as many diagrams are needed, as well as texts that give context to the representations.
Technically, TimberVis is a web application that uses just HTML-CSS ad JavaScript for the frontend, and SQLte and API in python flask for the backend.
# What does the application do?
The TimberVis Flexiboard app allows to create an save multiple dashboard for defined datasets.
Since the app is created ofr prokects monitoring timber buildings, the data gave a time series format with values for several parameters depending on the sensors installed on each building/project.
This first version of the app allows three types of diagrams:
- Parallel-like diagram (Called Parallel in the application)
- Heat-map calendars: weekly, monthly and yearly (Called Grid in the application)
- Joy plot (Called Horizon in the application)
# GIT Repository
The code of this application is accessible and can be downloaded from the Git repository:
* /Data/ -> datasets for each project. Create a folder name for each project. This folder name must be defined in web-html/config/datamap.js [Check Installation ( Instructions for the files(folders structure for each project]\
* Data/Charlie\
* Data/Pilgatan
* /py/\
* Data/Boards -> Saved boards are here. For a fresh installation, this folder can be empty\
* output_import.txt\
* Charlie.db\
* main.py\
* Pilgatan.db\
* README.md
* /web-html/\
* web-html/config -> Configuration files that need to be edited\
* config.js -> General variables\
* datamap.js -> Specific variables for each project included in the flexiboard
* web-html/css -> CSS styles used\
* bootstrap-datepicker3.css\
* c3.css\
* quill.snow.css\
* bootstrap-icons.css\
* dash.css\
* winbox.min.css\
* bootstrap.min.css\
* font-awesome.min.css
* web-html/js -> JS flexiboard functions\
* dash.js\
* home.js
* web-html/lib .> JS libraries used\
* bootstrap.bundle.min.js\
* d3-horizon-chart0.0.5.js\
* moment.min.js\
* bootstrap-datepicker.min.js\
* d3.v4.js\
* quill.js\
* bootstrap-datetimepicker.min.js\
* jquery-3.7.0.min.js\
* c3.js\
* jquery-ui.js
* web-html/imgs -> Put here the images defined in web-html/config/datamap.js\