Data added for the second house

Rafael
jaume-nualart 7 months ago
parent 4273386191
commit 6ef7246103
  1. 199
      README.md
  2. 33
      web-html/config/datamap.js
  3. 10
      web-html/home.html
  4. BIN
      web-html/imgs/housepilgatan.png
  5. BIN
      web-html/imgs/housepilgratan_map.png
  6. 9
      web-html/js/dash.js
  7. 26
      web-html/js/static.js
  8. 155
      web-html/z_FORMATS_NEEDED.js

@ -1,23 +1,176 @@
-------------------------
git tea help:
touch README.md
git init
git checkout -b main
git add README.md
git commit -m "first commit"
git remote add origin https://leonard.lnu.se/git/jaume-nualart/infravis-trahust.git
git push -u origin main
Pushing an existing repository from the command line
git remote add origin https://leonard.lnu.se/git/jaume-nualart/infravis-trahust.git
git push -u origin main
# Data
Link: https://lnu.box.com/s/5whjdw6f5mft0h62676h30g24kx6xagg
Data: https://lnu.box.com/s/5whjdw6f5mft0h62676h30g24kx6xagg
# Instructions
All the lines below should be run inside the 'py' subdirectory.
1. Run 'python import.py' to create the database.
2. Run 'python -m flask --app main run' to start the API server.
By default the API will be available at http://localhost:5000.
# Endpoints
## Parallel
### /parallel/daily
Returns data formatted for the 'daily' parallel coordinates view.
URL parameters:
* 'day' [Mandatory]: in the format YYYY-MM-DD.
* 'family' [Optional; default: 'S1']: name of family of sensors.
* 'type' [Optional; default: 'celsius']: type of sensor.
### /parallel/weekly
Returns data formatted for the 'weekly' parallel coordinates view.
* 'week' [Optional; default: 1]: week number, 1-52.
* 'year' [Optional; default: 2023]: year.
* 'family' [Optional; default: 'S1']: name of family of sensors.
* 'type' [Optional; default: 'celsius']: type of sensor.
### /parallel/monthly
Returns data formatted for the 'monthly' parallel coordinates view.
* 'month' [Optional; default: 1]: month number, 1-12.
* 'year' [Optional; default: 2023]: year.
* 'family' [Optional; default: 'S1']: name of family of sensors.
* 'type' [Optional; default: 'celsius']: type of sensor.
### /parallel/yearly
Returns data formatted for the 'yearly' parallel coordinates view.
* 'year' [Optional; default: 2023]: year.
* 'family' [Optional; default: 'S1']: name of family of sensors.
* 'type' [Optional; default: 'celsius']: type of sensor.
## Grid
### /grid/weekly
Returns data formatted for the 'weekly' grid view.
* 'week' [Optional; default: 1]: week number, 1-52.
* 'year' [Optional; default: 2023]: year.
* 'sensor' [Optional; default: 'S1:1']: name of the sensor.
* 'type' [Optional; default: 'celsius']: type of sensor.
### /grid/monthly
Returns data formatted for the 'monthly' grid view.
* 'month' [Optional; default: 1]: month number, 1-12.
* 'year' [Optional; default: 2023]: year.
* 'sensor' [Optional; default: 'S1:1']: name of the sensor.
* 'type' [Optional; default: 'celsius']: type of sensor.
### /grid/yearly
Returns data formatted for the 'yearly' grid view.
* 'year' [Optional; default: 2023]: year.
* 'sensor' [Optional; default: 'S1:1']: name of the sensor.
* 'type' [Optional; default: 'celsius']: type of sensor.
## Horizon
### /horizon/daily
Returns data formatted for the 'daily' horizon view.
* 'day' [Optional; default: '2023-01-01']: in the format YYYY-MM-DD.
* 'family' [Optional; default: 'S1']: name of family of sensors.
* 'type' [Optional; default: 'celsius']: type of sensor.
### /horizon/weekly
Returns data formatted for the 'weekly' horizon view.
* 'week' [Optional; default: 1]: week number, 1-52.
* 'year' [Optional; default: 2023]: year.
* 'family' [Optional; default: 'S1']: name of family of sensors.
* 'type' [Optional; default: 'celsius']: type of sensor.
### /horizon/monthly
Returns data formatted for the 'monthly' horizon view.
* 'month' [Optional; default: 1]: month number, 1-12.
* 'year' [Optional; default: 2023]: year.
* 'family' [Optional; default: 'S1']: name of family of sensors.
* 'type' [Optional; default: 'celsius']: type of sensor.
### /horizon/yearly
Returns data formatted for the 'yearly' horizon view.
* 'year' [Optional; default: 2023]: year.
* 'family' [Optional; default: 'S1']: name of family of sensors.
* 'type' [Optional; default: 'celsius']: type of sensor.
*NOTE*: For 2023 the data goes only up to August (8 months).
## Saved Flexiboards
### /boards
[
{
Board_ID [int],
Name [String],
Description [String]
}
]
### /boards/save
Method: POST
Every time we call save, it is a new board.
**ID is auto generated.**
**Name must be unique**.
{
Name [String],
Description [String],
Parallel: [
{
order [int],
id [String],
text [String],
api_url [int]
},
{
...
}
],
}
### /boards/[Board_ID]
{
Board_ID [int],
Name [String],
Description [String],
Parallel: [
{
order [int],
id [String],
text [String],
api_url [int]
},
{
...
}
],
}

@ -1,13 +1,15 @@
var PROJECTS =
{"items": // this is the machine-name and the directory where the data is.
{
"items": // this is the machine-name and the directory where the data is.
[
{
"xname": "house1",
"hname": "My House 1",
"type": "normal", // normal= a standard house.
"type": "house", // normal= a standard house.
"subtitle": `Lorem <a href="#">Ipsum is</a> simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen.`,
"image": "imgs/house.jpg",
"map": "imgs/samplemap.png",
"map_url": "http://",
"families": [
{
"reference": "fam1", // A code to be read by software, not by a human
@ -26,6 +28,33 @@ var PROJECTS =
}
]
]
},
{
"xname": "housepilgayan",
"hname": "Hus Pilgayan",
"type": "house", // normal= a standard house.
"subtitle": `At Pilgatan, we have about 120 sensors as well. It is only Temperature+Humidity sensors. The sensors are connected to two sensor cards, similarly as it is in Charlie. Here, the data files start with v1- and v6- for floor 1 and floor 6, respectively.`,
"image": "imgs/housepilgatan.jpg",
"map": "imgs/housepilgatan_map.png",
"map_url": "https://maps.app.goo.gl/HHj2Xua5doRufLQF6",
"families": [
{
"reference": "fam1", // A code to be read by software, not by a human
"name":"xxxx", // Human name for the family. Can content any character, words o sentence.
"type":"", // type of parameter that the members of the family (sensors) messure: temperature, humidity, what else?. Use a one-member family for the external mesures, like external temperature. Or: you also can group any group of sensors and create a family with them.
"listOfSensors":["a", "b"],
"position":[5, 10, 15, 20, 25, 30]
},
[
{
"reference": "fam1", // A code to be read by software, not by a human
"name":"xxxx", // Human name for the family. Can content any character, words o sentence.
"type":"", // type of parameter that the members of the family (sensors) messure: temperature, humidity, what else?. Use a one-member family for the external mesures, like external temperature. Or: you also can group any group of sensors and create a family with them.
"listOfSensors":["a", "b"],
"position":[5, 10, 15, 20, 25, 30]
}
]
]
}
]

@ -28,22 +28,20 @@
<!-- JS local & config-->
<script src="./config/config.js"></script>
<script src="./config/datamap.js"></script>
<script src="./js/home.js"></script>
<script src="./js/static.js"></script>
<title>TräHus data fkexiboard by Infravis.se</title>
</head>
<body>
<div class="container">
<!-- CHAnge here the title! -->
<h1>Welcome to the TräHus dashboard.</h1>
<div class="container" style="max-width:90%">
<!-- Navbar-->
<nav id ="navbar" class="navbar navbar-dark bg-primary navbar-expand-lg navbar-light bg-light">
</nav>
<h1></h1>
<!-- CHAnge here the title! -->
<h1>Welcome to the TräHus dashboard.</h1>
<p>List of available houses:</p>
<div id="card_list" class="row">
@ -52,6 +50,7 @@
</div>
</div>
<script>
console.log(PROJECTS.items);
// Getting the list of houses and buiding faceted view:
PROJECTS.items.forEach((houses) => {
var card = `
@ -73,7 +72,6 @@
document.getElementById("card_list").innerHTML += card;
});
console.log(PROJECTS.items[1].name)
// Adding HTML navbar
document.getElementById("navbar").innerHTML = HTML_navBar;

Binary file not shown.

After

Width:  |  Height:  |  Size: 12 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 132 KiB

@ -7,16 +7,13 @@ var HTML_navBar = `
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarTogglerDemo01">
<a class="navbar-brand" href="#">
<a class="navbar-brand" href="`+homePagageUrl+`">
<img src="imgs/infravis.jpg" alt="" width="30" height="24" class="d-inline-block align-text-top">
TräHus
</a>
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="#">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Link</a>
<a class="nav-link active" aria-current="page" href="`+homePagageUrl+`">Home</a>
</li>
</ul>
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
@ -43,7 +40,6 @@ for (var i = 0; i < listSensors.length; i++) {
}
var listFamiliesRepeated2 = new Set(listFamiliesRepeated);
var listFamilies = Array.from(listFamiliesRepeated2);
// cl(listFamilies);
var listFamiliesOptions = "";
// Get fammily select options
for (var i = 0; i < listFamilies.length; i++) {
@ -51,7 +47,6 @@ for (var i = 0; i < listFamilies.length; i++) {
}
var listParametersRepeated2 = new Set(listParametersRepeated);
var listParameters = Array.from(listParametersRepeated2);
// cl(listParameters);
var listParametersOptions = "";
// Get parameters select options
for (var i = 0; i < listParameters.length; i++) {

@ -0,0 +1,26 @@
//////////////////////
// HTML static pieces
var HTML_navBar = `
<div class="container-fluid">
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarTogglerDemo01" aria-controls="navbarTogglerDemo01" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarTogglerDemo01">
<a class="navbar-brand" href="`+homePagageUrl+`">
<img src="imgs/infravis.jpg" alt="" width="30" height="24" class="d-inline-block align-text-top">
TräHus
</a>
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="`+homePagageUrl+`">Home</a>
</li>
</ul>
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link" href="http://infravis.se" target="_infravis_se_site" aria-current="page">Powered by Infravis</a>
</li>
</ul>
</div>
</div>
`;

@ -0,0 +1,155 @@
///
// Data formats needed for each the the three diagrams:
// for all the three cases I include dinamycally JS files that content variables
// as arrays. I do this intead of loading CSV values
// IS THIS CORRECT OR BETTER WE MOVE TO LOAD csv?
/////////////////////////////////////////////////////
// tHE THREE DIAGRAMS ARE: pARALLEL, gRID AND hORIZON:
//////////////////////////////////////////
/// 1.PARAllel
// This var is The data. First row gives the positions for the sensors
// of the famimlly (wall depth).
// Then, the raw data is taked as it is but selecting the grup of columns that represent a familly of sensors.
// The example that follows show a sensors-family of 6 sensors at the positions pos_1
sample = [
["pos1", 5, 10, 25, 35, 42, 45],
["2023-01-01 00:10:07", 26.2, 33, 49.5, 53.1, 62.9, 87],
["2023-01-01 00:20:05", 26.5, 33.2, 60.5, 71.3, 78.3, 91.7],
["2023-01-01 00:30:05", 26.7, 33.7, 49.7, 53.7, 63.5, 86.1],
["2023-01-01 00:40:05", 26.6, 33.5, 49.6, 53.6, 63.5, 86.3],
["2023-01-01 00:50:05", 26.6, 33.5, 49.6, 53.5, 63.4, 86.5],
["2023-01-01 01:00:05", 26.5, 33.4, 49.6, 53.5, 63.3, 86.6],
["2023-01-01 01:10:05", 26.4, 33.3, 49.6, 53.4, 63.2, 86.6],
["2023-01-01 01:20:05", 26.3, 33.2, 49.5, 53.3, 63.1, 86.7],
["2023-01-01 01:30:05", 26.3, 33.1, 49.5, 53.2, 63, 86.8]
];
// the xs variables are not depending on the data files.
// They just defina the tick points on the x-axis that are
// highlighted with a vertical axis. This is: they represent
// each sensor belonging to a familly of sensors at the same
// wall position but different depth.
myxs = {
'2023-01-01 00:10:07' : 'pos1',
'2023-01-01 00:20:05' : 'pos1',
'2023-01-01 00:30:05' : 'pos1',
'2023-01-01 00:40:05' : 'pos1',
'2023-01-01 00:50:05' : 'pos1',
'2023-01-01 01:00:05' : 'pos1',
'2023-01-01 01:10:05' : 'pos1',
'2023-01-01 01:20:05' : 'pos1',
'2023-01-01 01:30:05' : 'pos1'
}
> Sensors family selection
//Michael Dorn wishes:
//--> MD:
// Categories:
// yearly - with 12 lines
// monthly - with 4 lines
// weekly - with 7 lines
// daily - with 24 lines
//
// Settings:
// yearly: date: 1st of the month; time: 12:00;
// allow for chosing a different date/time
// monthly: date: choose days 1/8/15/22/29; time; 12:00;
// allow for chosing different date/time
// daily: time: 0-1-2-3-...-24;
// allow for chosing different date/time
//
// Is it possible to allow to supress a line then (hide it)?
//////////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////////////
////// 2.GRID
// it is just a column of the original raw data. At the moment is saved in a JS file as an array with the var name of the original column
// example:
var Temp_MP1_1_Pos4 = [
[11.01, 11.02, 11.01, 11.02, 11.02, 11.01, 11.00, 11.00, 11.02, 11.00, 11.01, 11.00, 11.00, 10.99, 10.99, 10.98, 10.96, 10.97, 10.96, 10.97, 10.96, 10.95, 10.94, 10.94, 10.94, 10.94, 10.94, 10.92, 10.91, 10.90, 10.91, 10.88, 10.88, 10.88, 10.88, 10.86, 10.84, 10.83, 10.82, 10.82, 10.79, 10.78, 10.75, 10.76, 10.74, 10.72, 10.73, 10.71, 10.69, 10.66, 10.66, 10.64, 10.64, 10.60, 10.58, 10.55, 10.52, 10.52, 10.50, 10.48, 10.40, 10.32, 10.28],
['2023-01-01', '2023-01-02', ...],
['00:01.34', '01:01', ...]
]
// IMPORTANT: Just one sensor
//Michael Dorn wishes:
//TIME periods:
// - yearly - 365 days; 12 rows with 28-31 days; at 12:00;
// - monthly - 28 days; 4 rows with 7 days; at 12:00;
// - can this be arranged like in calendar view?
// - weekly - 7 days; 4 rows with 24 hours; at ##:00;
//
// Scale: is it possible here to chose if an actual time is shown or to have the max/min value within a day for the yearly/monthly versions?
//
//
//////////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////////////
////// 3.HORIZON
// The horizon chart has several rows. As it is now, firstly it is defined
// an array of columns from the raw DataTransfer, that will become rows at the horizon chart.As
// so, a list of rows will be:
datas = ["S1:1", "S1:2", "S1:3", "Temp_MP1_1_Pos4", "Temp_MP1_1_Pos5", "Temp_MP1_1_Pos6", "Temp_MP1_2_Pos1", "Temp_MP1_2_Pos2", "Temp_MP1_2_Pos3", "Temp_MP1_2_Pos4", "Temp_MP1_2_Pos5", "Temp_MP1_2_Pos6"];
// And then the values for each row, that comes directly from the raw data columns
// example for the first row "Temp_MP1_1_Pos1"
var Temp_MP1_1_Pos1=[18.71, 18.74, 18.75, 18.76, 18.78, 18.77, 18.77, 18.78, 18.76, 18.77, 18.77, 18.78, 18.78, 18.76, 18.75, 18.75, 18.75, 18.76, 18.78, 18.76, 18.74, 18.74]
// This list can be long. This kind of chart use to represent a big amount og points for each column. Hence, covering a long time period.
// > (Vertical axis) Select a list of sensors
//Michael Dorn wishes
// Horizontal axis:
// Categories:
// year 365 days at 0/6/12/18 h --> 1460 points
// month 28-31 days at 0/1/2/.../23 h --> 744 points
// week 7 days at 0:00/0:15/0:30/... 23:45/24:00 --> 672 points
// day 24 hours all datapoints --> up to 288 points
// Scale:
// it would be good of the width if the browser window is not overflowing sideways
//
//
// vertical axis:
// Temperature:
// - in what steps in °C are you thinking?
// - I expect to have at the most -30°C - +50°C for the weather station
// - can the scale be chosen? E.g. there are steps of 10°C or of 5°C or others?
//###################################
// From Micheal about Naming:
// I attach two files:
// Explanation datafiles.xlsx
// The colored rows on top include channel names / families / units / # of column / ...
// The first part in the name of the channel gives what type of value is measured:
// - temperature (Temp_...)
// - humidity (RH_...)
// - relative dispalcement (RelDisp_...)
// - absolute displacement (AbsDisp)
// - air pressure (AirPres_...)
// - the weather station has many different values
// A row with units is also given.
// Explanation datafiles.pptx
// - Includes information where the sensors and families are located.
// - The last slide includes the distance for the sensors in the walls. Measurement start at the inside of the wall.
// I hope this helps you immediately!
Loading…
Cancel
Save