Skip to content
GitLab
Commit b8e74352 authored by Pithon Kabiro's avatar Pithon Kabiro
Browse files

Move chart drawing logic to drop down list module

parent fa11200b
Hide whitespace changes
Inline Side-by-side
index.html
View file @ b8e74352
...@@ -72,7 +72,7 @@ ...@@ -72,7 +72,7 @@
Custom JS --> Custom JS -->
<script defer type="module" src="js/appCesium.js"></script> <script defer type="module" src="js/appCesium.js"></script>
<script defer type="module" src="js/appChart.js"></script> <script defer type="module" src="js/appChart.js"></script>
<script defer src="js/dropDownList.js"></script> <script defer type="module" src="js/dropDownList.js"></script>
</head> </head>
<body class="sb-nav-fixed"> <body class="sb-nav-fixed">
<nav class="sb-topnav navbar navbar-expand navbar-dark bg-dark"> <nav class="sb-topnav navbar navbar-expand navbar-dark bg-dark">
......
public/js/appCesium.js
View file @ b8e74352
"use strict"; "use strict";
import {
BASE_URL,
QUERY_PARAMS_COMBINED,
getDatastreamIdFromBuildingNumber,
getDatastreamUrl,
getObservationsUrl,
axiosGetRequest,
getDatastreamMetadata,
formatDatastreamMetadataForChart,
formatSTAResponseForHeatMap,
drawHeatMapHC,
formatSTAResponseForLineChart,
drawLineChartHC,
getCombinedObservationsFromAllNextLinks,
getMetadataPlusObservationsForChart,
} from "./appChart.js";
Cesium.Ion.defaultAccessToken = Cesium.Ion.defaultAccessToken =
"eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiIyODgxYzJlNi1kNDZiLTQ3ZmQtYmUxYy0yMWI0OGM3NDA5MzAiLCJpZCI6NDczOSwic2NvcGVzIjpbImFzciIsImdjIl0sImlhdCI6MTU0MTUyMzU0MX0.shj2hM3pvsvcmE_wMb2aBDuk_cKWmFmbolltInGImwU"; "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiIyODgxYzJlNi1kNDZiLTQ3ZmQtYmUxYy0yMWI0OGM3NDA5MzAiLCJpZCI6NDczOSwic2NvcGVzIjpbImFzciIsImdjIl0sImlhdCI6MTU0MTUyMzU0MX0.shj2hM3pvsvcmE_wMb2aBDuk_cKWmFmbolltInGImwU";
...@@ -296,50 +279,6 @@ const activate3DTileFeaturePicking = function () { ...@@ -296,50 +279,6 @@ const activate3DTileFeaturePicking = function () {
`; `;
const clickedBuilding = pickedFeature.getProperty("_gebaeude"); const clickedBuilding = pickedFeature.getProperty("_gebaeude");
const clickedBuildingDatastreamId = getDatastreamIdFromBuildingNumber(
clickedBuilding,
"vl",
"60min"
);
const URL_DATASTREAM = getDatastreamUrl(
BASE_URL,
clickedBuildingDatastreamId
);
const URL_OBSERVATIONS = getObservationsUrl(
BASE_URL,
clickedBuildingDatastreamId
);
// Create promises
const promiseDatastreamMetadata = getDatastreamMetadata(URL_DATASTREAM);
const promiseCombinedObservations = getCombinedObservationsFromAllNextLinks(
axiosGetRequest(URL_OBSERVATIONS, QUERY_PARAMS_COMBINED)
);
// Pass promises to our async function
getMetadataPlusObservationsForChart([
promiseCombinedObservations,
promiseDatastreamMetadata,
])
.then((metadataAndObs) => {
// Extract the metadata and the observations from resulting array
const combinedObs = metadataAndObs[0];
const datastreamMetadata = metadataAndObs[1];
drawLineChartHC(
formatSTAResponseForLineChart(combinedObs),
formatDatastreamMetadataForChart(datastreamMetadata)
);
drawHeatMapHC(
formatSTAResponseForHeatMap(combinedObs),
formatDatastreamMetadataForChart(datastreamMetadata)
);
})
.catch((err) => {
console.error(err);
});
}, Cesium.ScreenSpaceEventType.LEFT_CLICK); }, Cesium.ScreenSpaceEventType.LEFT_CLICK);
}; };
......
public/js/dropDownList.js
View file @ b8e74352
"use strict"; "use strict";
import {
BASE_URL,
QUERY_PARAMS_COMBINED,
getDatastreamIdFromBuildingNumber,
getDatastreamUrl,
getObservationsUrl,
axiosGetRequest,
getDatastreamMetadata,
formatDatastreamMetadataForChart,
formatSTAResponseForHeatMap,
drawHeatMapHC,
formatSTAResponseForLineChart,
drawLineChartHC,
getCombinedObservationsFromAllNextLinks,
getMetadataPlusObservationsForChart,
} from "./appChart.js";
const buildingsAvailableSensorsArr = [ const buildingsAvailableSensorsArr = [
["--Select--", "", ""], ["--Select--", "", ""],
...@@ -205,3 +222,53 @@ const getBuildingSensorSamplingRateAbbreviation = function ( ...@@ -205,3 +222,53 @@ const getBuildingSensorSamplingRateAbbreviation = function (
return [buildingAbbrev, phenomenonAbbrev, samplingRateAbbrev]; return [buildingAbbrev, phenomenonAbbrev, samplingRateAbbrev];
}; };
const runFromOptionThree = async function () {
try {
const selectedOptions = getSelectedOptionsFromDropDownLists();
const abbreviationsArr = getBuildingSensorSamplingRateAbbreviation(
...selectedOptions
);
const selectedDatastream = getDatastreamIdFromBuildingNumber(
...abbreviationsArr
);
const URL_DATASTREAM = getDatastreamUrl(BASE_URL, selectedDatastream);
const URL_OBSERVATIONS = getObservationsUrl(BASE_URL, selectedDatastream);
// Create promises
const promiseDatastreamMetadata = getDatastreamMetadata(URL_DATASTREAM);
const promiseCombinedObservations = getCombinedObservationsFromAllNextLinks(
axiosGetRequest(URL_OBSERVATIONS, QUERY_PARAMS_COMBINED)
);
// Pass promises to our async function
const metadataPlusObservations = await getMetadataPlusObservationsForChart([
promiseCombinedObservations,
promiseDatastreamMetadata,
]);
// Extract the metadata and the observations from resulting array
const combinedObs = metadataPlusObservations[0];
const datastreamMetadata = metadataPlusObservations[1];
drawLineChartHC(
formatSTAResponseForLineChart(combinedObs),
formatDatastreamMetadataForChart(datastreamMetadata)
);
drawHeatMapHC(
formatSTAResponseForHeatMap(combinedObs),
formatDatastreamMetadataForChart(datastreamMetadata)
);
} catch (err) {
console.error(err);
}
};
document
.querySelector("#drop-down--sampling-rate")
.addEventListener("change", runFromOptionThree);
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment

Dies ist die Gitlab-Instanz des Transferportals der Hochschule für Technik Stuttgart. Hier geht es zurück zum Portal