Skip to content
GitLab
You need to sign in or sign up before continuing.
Commit 86bff050 authored by Sven Schneider's avatar Sven Schneider
Browse files

added aggregation method into appCharts.js

parent 02bd3700
aggregation
No related merge requests found
Expand all Hide whitespace changes
Inline Side-by-side
Showing
with 770 additions and 614 deletions
+770 -614
index.html
+ 84
- 115
View file @ 86bff050
<!DOCTYPE html>
<html lang="en">
<head>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta
name="viewport"
content="width=device-width, initial-scale=1, shrink-to-fit=no"
/>
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
<meta name="description" content="" />
<meta name="author" content="" />
<title>Dashboard - iCity Bosch</title>
<link href="css/styles.css" rel="stylesheet" />
<link
href="https://cdn.datatables.net/1.10.20/css/dataTables.bootstrap4.min.css"
rel="stylesheet"
crossorigin="anonymous"
/>
<link href="https://cdn.datatables.net/1.10.20/css/dataTables.bootstrap4.min.css" rel="stylesheet" crossorigin="anonymous" />
<!-- Font Awesome icons -->
<script
src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.1/js/all.min.js"
crossorigin="anonymous"
></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.1/js/all.min.js" crossorigin="anonymous"></script>
<!-- Axios -->
<!-- <script src="./node_modules/axios/dist/axios.min.js"></script> -->
......@@ -46,122 +37,100 @@
<!-- Cesium lib -->
<script src="https://cesium.com/downloads/cesiumjs/releases/1.48/Build/Cesium/Cesium.js"></script>
<link
href="https://cesium.com/downloads/cesiumjs/releases/1.48/Build/Cesium/Widgets/widgets.css"
rel="stylesheet"
/>
<link href="https://cesium.com/downloads/cesiumjs/releases/1.48/Build/Cesium/Widgets/widgets.css" rel="stylesheet" />
<!-- Bootstrap dashboard template -->
<script
defer
src="https://code.jquery.com/jquery-3.5.1.slim.min.js"
crossorigin="anonymous"
></script>
<script
defer
src="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/js/bootstrap.bundle.min.js"
crossorigin="anonymous"
></script>
<script defer src="https://code.jquery.com/jquery-3.5.1.slim.min.js" crossorigin="anonymous"></script>
<script defer src="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/js/bootstrap.bundle.min.js" crossorigin="anonymous"></script>
<script defer src="js/thirdparty/scripts.js"></script>
<!--
Custom JS -->
<script defer type="module" src="js/appCesium.js"></script>
<script defer type="module" src="js/appChart.js"></script>
</head>
<body class="sb-nav-fixed">
</head>
<body class="sb-nav-fixed">
<nav class="sb-topnav navbar navbar-expand navbar-dark bg-dark">
<a class="navbar-brand" href="index.html">iCity Bosch Dashboard</a>
<button
class="btn btn-link btn-sm order-1 order-lg-0"
id="sidebarToggle"
href="#"
>
<a class="navbar-brand" href="index.html">iCity Bosch Dashboard</a>
<button class="btn btn-link btn-sm order-1 order-lg-0" id="sidebarToggle" href="#">
<i class="fas fa-bars"></i>
</button>
</nav>
<div id="layoutSidenav">
<div id="layoutSidenav_nav">
<nav class="sb-sidenav accordion sb-sidenav-dark" id="sidenavAccordion">
<div class="sb-sidenav-menu">
<div class="nav">
<div class="sb-sidenav-menu-heading">Core</div>
<a class="nav-link" href="index.html">
<div class="sb-nav-link-icon">
<i class="fas fa-tachometer-alt"></i>
<div id="layoutSidenav_nav">
<nav class="sb-sidenav accordion sb-sidenav-dark" id="sidenavAccordion">
<div class="sb-sidenav-menu">
<div class="nav">
<div class="sb-sidenav-menu-heading">Core</div>
<a class="nav-link" href="index.html">
<div class="sb-nav-link-icon">
<i class="fas fa-tachometer-alt"></i>
</div>
Dashboard
</a>
</div>
</div>
Dashboard
</a>
</div>
</div>
</nav>
</div>
<div id="layoutSidenav_content">
<main>
<div class="container-fluid">
<h1 class="mt-4">Dashboard</h1>
<ol class="breadcrumb mb-4">
<li class="breadcrumb-item active">Dashboard</li>
</ol>
</nav>
</div>
<div id="layoutSidenav_content">
<main>
<div class="container-fluid">
<h1 class="mt-4">Dashboard</h1>
<ol class="breadcrumb mb-4">
<li class="breadcrumb-item active">Dashboard</li>
</ol>
<div class="row">
<div class="col-xl-12">
<div class="card mb-4">
<div class="card-header">
<i class="fas fa-globe mr-1"></i>
3D Visualization
</div>
<div class="card-body">
<div
id="cesiumGlobeContainer"
width="100%"
height="40"
></div>
</div>
<div class="row">
<div class="col-xl-12">
<div class="card mb-4">
<div class="card-header">
<i class="fas fa-globe mr-1"></i> 3D Visualization
</div>
<div class="card-body">
<div id="cesiumGlobeContainer" width="100%" height="40">
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-xl-6">
<div class="card mb-4">
<div class="card-header">
<i class="fas fa-chart-line mr-1"></i> Line Chart Example
</div>
<div class="card-body">
<div id="chart-line" width="100%" height="40"></div>
</div>
</div>
</div>
<div class="col-xl-6">
<div class="card mb-4">
<div class="card-header">
<i class="fas fa-chart-area mr-1"></i> Area Chart Example
</div>
<div class="card-body">
<div id="chart-heatmap" width="100%" height="40"></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-xl-6">
<div class="card mb-4">
<div class="card-header">
<i class="fas fa-chart-line mr-1"></i>
Line Chart Example
</div>
<div class="card-body">
<div id="chart-line" width="100%" height="40"></div>
</div>
</main>
<footer class="py-4 bg-light mt-auto">
<div class="container-fluid">
<div class="d-flex align-items-center justify-content-between small">
<div class="text-muted">Copyright &copy; HfT Stuttgart 2021</div>
<div>
<a href="#">Privacy Policy</a> &middot;
<a href="#">Terms &amp; Conditions</a>
</div>
</div>
</div>
</div>
<div class="col-xl-6">
<div class="card mb-4">
<div class="card-header">
<i class="fas fa-chart-area mr-1"></i>
Area Chart Example
</div>
<div class="card-body">
<div id="chart-heatmap" width="100%" height="40"></div>
</div>
</div>
</div>
</div>
</div>
</main>
<footer class="py-4 bg-light mt-auto">
<div class="container-fluid">
<div
class="d-flex align-items-center justify-content-between small"
>
<div class="text-muted">Copyright &copy; HfT Stuttgart 2021</div>
<div>
<a href="#">Privacy Policy</a>
&middot;
<a href="#">Terms &amp; Conditions</a>
</div>
</div>
</div>
</footer>
</div>
</footer>
</div>
</div>
</body>
</html>
</body>
</html>
\ No newline at end of file
public/js/appCesium.js
+ 264
- 259
View file @ 86bff050
......@@ -2,26 +2,27 @@
// Functions
import {
getDatastreamIdFromBuildingNumber,
getObservationsUrl,
createTemporalFilterString,
formatSTAResponseForHeatMap,
drawHeatMapHC,
formatSTAResponseForLineChart,
drawLineChartHC,
followNextLink,
getDatastreamIdFromBuildingNumber,
getObservationsUrl,
createTemporalFilterString,
formatSTAResponseForHeatMap,
drawHeatMapHC,
formatSTAResponseForLineChart,
drawLineChartHC,
followNextLink,
aggregateResponse,
} from "./appChart.js";
// Constants
import {
BASE_URL,
PARAM_RESULT_FORMAT,
PARAM_ORDER_BY,
PARAM_SELECT,
BASE_URL,
PARAM_RESULT_FORMAT,
PARAM_ORDER_BY,
PARAM_SELECT,
} from "./appChart.js";
Cesium.Ion.defaultAccessToken =
"eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiIyODgxYzJlNi1kNDZiLTQ3ZmQtYmUxYy0yMWI0OGM3NDA5MzAiLCJpZCI6NDczOSwic2NvcGVzIjpbImFzciIsImdjIl0sImlhdCI6MTU0MTUyMzU0MX0.shj2hM3pvsvcmE_wMb2aBDuk_cKWmFmbolltInGImwU";
"eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiIyODgxYzJlNi1kNDZiLTQ3ZmQtYmUxYy0yMWI0OGM3NDA5MzAiLCJpZCI6NDczOSwic2NvcGVzIjpbImFzciIsImdjIl0sImlhdCI6MTU0MTUyMzU0MX0.shj2hM3pvsvcmE_wMb2aBDuk_cKWmFmbolltInGImwU";
// Flag to determine models that will be loaded
// Set to `true` or `false`
......@@ -29,10 +30,10 @@ const LOAD_DETAILED_BLDG225 = false;
// Global variable
const viewer = new Cesium.Viewer("cesiumGlobeContainer", {
scene3DOnly: true,
imageryProvider: Cesium.createOpenStreetMapImageryProvider({
url: "https://a.tile.openstreetmap.org/",
}),
scene3DOnly: true,
imageryProvider: Cesium.createOpenStreetMapImageryProvider({
url: "https://a.tile.openstreetmap.org/",
}),
});
/**
......@@ -40,26 +41,25 @@ const viewer = new Cesium.Viewer("cesiumGlobeContainer", {
* @param {String} urlTiles URL to the 3DTiles to be loaded
* @returns {undefined} undefined
*/
const loadTiles = function (urlTiles) {
const tileset = new Cesium.Cesium3DTileset({
url: urlTiles,
});
viewer.scene.primitives.add(tileset);
tileset.readyPromise.then(function () {
viewer
.zoomTo(
tileset,
new Cesium.HeadingPitchRange(
0.0,
-0.5,
tileset.boundingSphere.radius / 0.5
)
)
.otherwise(function (err) {
throw err;
});
});
const loadTiles = function(urlTiles) {
const tileset = new Cesium.Cesium3DTileset({
url: urlTiles,
});
viewer.scene.primitives.add(tileset);
tileset.readyPromise.then(function() {
viewer
.zoomTo(
tileset,
new Cesium.HeadingPitchRange(
0.0, -0.5,
tileset.boundingSphere.radius / 0.5
)
)
.otherwise(function(err) {
throw err;
});
});
};
/**
......@@ -67,12 +67,12 @@ const loadTiles = function (urlTiles) {
* @param{*}
* @returns {undefined} undefined
*/
const loadNonDetailed = function () {
// Paths to data sources
const URL_3DTILES = "data_3d/3dtiles/1_full/tileset.json";
const loadNonDetailed = function() {
// Paths to data sources
const URL_3DTILES = "data_3d/3dtiles/1_full/tileset.json";
// Tileset with all buildings
loadTiles(URL_3DTILES);
// Tileset with all buildings
loadTiles(URL_3DTILES);
};
/**
......@@ -81,19 +81,19 @@ const loadNonDetailed = function () {
* @param {String} gltfId Name of the glTF model file without the extension i.e. exclude the `.gltf` suffix
* @returns {undefined} undefined
*/
const gltfLoad = function (gltfUrl, gltfId) {
const modelMatrix = Cesium.Transforms.eastNorthUpToFixedFrame(
Cesium.Cartesian3.fromDegrees(9.083385, 48.881342, 0)
);
viewer.scene.primitives.add(
Cesium.Model.fromGltf({
url: `${gltfUrl}/${gltfId}.gltf`,
modelMatrix: modelMatrix,
scale: 0.0254,
allowPicking: true,
})
);
const gltfLoad = function(gltfUrl, gltfId) {
const modelMatrix = Cesium.Transforms.eastNorthUpToFixedFrame(
Cesium.Cartesian3.fromDegrees(9.083385, 48.881342, 0)
);
viewer.scene.primitives.add(
Cesium.Model.fromGltf({
url: `${gltfUrl}/${gltfId}.gltf`,
modelMatrix: modelMatrix,
scale: 0.0254,
allowPicking: true,
})
);
};
/**
......@@ -101,64 +101,64 @@ const gltfLoad = function (gltfUrl, gltfId) {
* @param{*}
* @returns {undefined} undefined
*/
const loadDetailed = function () {
// Paths to data sources
const URL_3DTILES = "data_3d/3dtiles/2_partial/tileset.json";
const URL_GLTF = "data_3d/gltf";
// Tileset without building 225
loadTiles(URL_3DTILES);
// Load Building 225
gltfLoad(URL_GLTF, "bosch_si225_3");
// Load sensors in Building 225
const gltfArray = [
"sensor_013",
"sensor_023",
"sensor_033",
"sensor_053",
"sensor_063",
"sensor_073",
"sensor_083",
"sensor_093",
"sensor_103",
"sensor_113",
"sensor_123",
"sensor_133",
"sensor_143",
"sensor_153",
"sensor_163",
"sensor_173",
"sensor_183",
"sensor_213",
"sensor_223",
"sensor_233",
"sensor_253",
"sensor_263",
"sensor_273",
"sensor_283",
"sensor_293",
"sensor_303",
"sensor_313",
"sensor_323",
"sensor_333",
"sensor_343",
"sensor_353",
"sensor_363",
"sensor_373",
"sensor_383_v2",
];
gltfArray.forEach((sensor) => gltfLoad(URL_GLTF, sensor));
const loadDetailed = function() {
// Paths to data sources
const URL_3DTILES = "data_3d/3dtiles/2_partial/tileset.json";
const URL_GLTF = "data_3d/gltf";
// Tileset without building 225
loadTiles(URL_3DTILES);
// Load Building 225
gltfLoad(URL_GLTF, "bosch_si225_3");
// Load sensors in Building 225
const gltfArray = [
"sensor_013",
"sensor_023",
"sensor_033",
"sensor_053",
"sensor_063",
"sensor_073",
"sensor_083",
"sensor_093",
"sensor_103",
"sensor_113",
"sensor_123",
"sensor_133",
"sensor_143",
"sensor_153",
"sensor_163",
"sensor_173",
"sensor_183",
"sensor_213",
"sensor_223",
"sensor_233",
"sensor_253",
"sensor_263",
"sensor_273",
"sensor_283",
"sensor_293",
"sensor_303",
"sensor_313",
"sensor_323",
"sensor_333",
"sensor_343",
"sensor_353",
"sensor_363",
"sensor_373",
"sensor_383_v2",
];
gltfArray.forEach((sensor) => gltfLoad(URL_GLTF, sensor));
};
if (!LOAD_DETAILED_BLDG225) {
// Default case: load only 3dTiles
loadNonDetailed();
// Default case: load only 3dTiles
loadNonDetailed();
} else {
// Alternative case: load 3dTiles + glTF
loadDetailed();
// Alternative case: load 3dTiles + glTF
loadDetailed();
}
/**
......@@ -166,109 +166,109 @@ if (!LOAD_DETAILED_BLDG225) {
* @param {*}
* @returns {undefined}
*/
const activate3DTileFeaturePicking = function () {
// HTML overlay for showing feature name on mouseover
const nameOverlay = document.createElement("div");
viewer.container.appendChild(nameOverlay);
nameOverlay.className = "backdrop";
nameOverlay.style.display = "none";
nameOverlay.style.position = "absolute";
nameOverlay.style.bottom = "0";
nameOverlay.style.left = "0";
nameOverlay.style["pointer-events"] = "none";
nameOverlay.style.padding = "4px";
nameOverlay.style.backgroundColor = "black";
nameOverlay.style.color = "white";
nameOverlay.style.fontFamily = "Fira Sans, sans-serif";
nameOverlay.style.fontSize = "0.75em";
// Information about the currently selected feature
const selected = {
feature: undefined,
originalColor: new Cesium.Color(),
};
// An entity object which will hold info about the currently selected feature for infobox display
const selectedEntity = new Cesium.Entity();
// Get default left click handler for when a feature is not picked on left click
const clickHandler = viewer.screenSpaceEventHandler.getInputAction(
Cesium.ScreenSpaceEventType.LEFT_CLICK
);
// Change the feature color on mouse over
// Information about the currently highlighted feature
const highlighted = {
feature: undefined,
originalColor: new Cesium.Color(),
};
// Color a feature on hover.
viewer.screenSpaceEventHandler.setInputAction(function onMouseMove(movement) {
// If a feature was previously highlighted, undo the highlight
if (Cesium.defined(highlighted.feature)) {
highlighted.feature.color = highlighted.originalColor;
highlighted.feature = undefined;
}
// Pick a new feature
const pickedFeature = viewer.scene.pick(movement.endPosition);
if (!Cesium.defined(pickedFeature)) {
nameOverlay.style.display = "none";
return;
}
// A feature was picked, so show it's overlay content
nameOverlay.style.display = "block";
nameOverlay.style.bottom =
viewer.canvas.clientHeight - movement.endPosition.y + "px";
nameOverlay.style.left = movement.endPosition.x + "px";
let name = pickedFeature.getProperty("_gebaeude");
if (!Cesium.defined(name)) {
name = pickedFeature.getProperty("id");
}
nameOverlay.textContent = name;
// Highlight the feature if it's not already selected.
if (pickedFeature !== selected.feature) {
highlighted.feature = pickedFeature;
Cesium.Color.clone(pickedFeature.color, highlighted.originalColor);
pickedFeature.color = Cesium.Color.GREY;
}
}, Cesium.ScreenSpaceEventType.MOUSE_MOVE);
// Color a feature on selection and show metadata in the InfoBox.
viewer.screenSpaceEventHandler.setInputAction(function onLeftClick(movement) {
// If a feature was previously selected, undo the highlight
if (Cesium.defined(selected.feature)) {
selected.feature.color = selected.originalColor;
selected.feature = undefined;
}
// Pick a new feature
const pickedFeature = viewer.scene.pick(movement.position);
if (!Cesium.defined(pickedFeature)) {
clickHandler(movement);
return;
}
// Select the feature if it's not already selected
if (selected.feature === pickedFeature) {
return;
}
selected.feature = pickedFeature;
// Save the selected feature's original color
if (pickedFeature === highlighted.feature) {
Cesium.Color.clone(highlighted.originalColor, selected.originalColor);
highlighted.feature = undefined;
} else {
Cesium.Color.clone(pickedFeature.color, selected.originalColor);
}
// Highlight newly selected feature
pickedFeature.color = Cesium.Color.LIME;
// Set feature infobox description
const featureName = pickedFeature.getProperty("name");
selectedEntity.name = featureName;
selectedEntity.description =
'Loading <div class="cesium-infoBox-loading"></div>';
viewer.selectedEntity = selectedEntity;
selectedEntity.description = `
const activate3DTileFeaturePicking = function() {
// HTML overlay for showing feature name on mouseover
const nameOverlay = document.createElement("div");
viewer.container.appendChild(nameOverlay);
nameOverlay.className = "backdrop";
nameOverlay.style.display = "none";
nameOverlay.style.position = "absolute";
nameOverlay.style.bottom = "0";
nameOverlay.style.left = "0";
nameOverlay.style["pointer-events"] = "none";
nameOverlay.style.padding = "4px";
nameOverlay.style.backgroundColor = "black";
nameOverlay.style.color = "white";
nameOverlay.style.fontFamily = "Fira Sans, sans-serif";
nameOverlay.style.fontSize = "0.75em";
// Information about the currently selected feature
const selected = {
feature: undefined,
originalColor: new Cesium.Color(),
};
// An entity object which will hold info about the currently selected feature for infobox display
const selectedEntity = new Cesium.Entity();
// Get default left click handler for when a feature is not picked on left click
const clickHandler = viewer.screenSpaceEventHandler.getInputAction(
Cesium.ScreenSpaceEventType.LEFT_CLICK
);
// Change the feature color on mouse over
// Information about the currently highlighted feature
const highlighted = {
feature: undefined,
originalColor: new Cesium.Color(),
};
// Color a feature on hover.
viewer.screenSpaceEventHandler.setInputAction(function onMouseMove(movement) {
// If a feature was previously highlighted, undo the highlight
if (Cesium.defined(highlighted.feature)) {
highlighted.feature.color = highlighted.originalColor;
highlighted.feature = undefined;
}
// Pick a new feature
const pickedFeature = viewer.scene.pick(movement.endPosition);
if (!Cesium.defined(pickedFeature)) {
nameOverlay.style.display = "none";
return;
}
// A feature was picked, so show it's overlay content
nameOverlay.style.display = "block";
nameOverlay.style.bottom =
viewer.canvas.clientHeight - movement.endPosition.y + "px";
nameOverlay.style.left = movement.endPosition.x + "px";
let name = pickedFeature.getProperty("_gebaeude");
if (!Cesium.defined(name)) {
name = pickedFeature.getProperty("id");
}
nameOverlay.textContent = name;
// Highlight the feature if it's not already selected.
if (pickedFeature !== selected.feature) {
highlighted.feature = pickedFeature;
Cesium.Color.clone(pickedFeature.color, highlighted.originalColor);
pickedFeature.color = Cesium.Color.GREY;
}
}, Cesium.ScreenSpaceEventType.MOUSE_MOVE);
// Color a feature on selection and show metadata in the InfoBox.
viewer.screenSpaceEventHandler.setInputAction(function onLeftClick(movement) {
// If a feature was previously selected, undo the highlight
if (Cesium.defined(selected.feature)) {
selected.feature.color = selected.originalColor;
selected.feature = undefined;
}
// Pick a new feature
const pickedFeature = viewer.scene.pick(movement.position);
if (!Cesium.defined(pickedFeature)) {
clickHandler(movement);
return;
}
// Select the feature if it's not already selected
if (selected.feature === pickedFeature) {
return;
}
selected.feature = pickedFeature;
// Save the selected feature's original color
if (pickedFeature === highlighted.feature) {
Cesium.Color.clone(highlighted.originalColor, selected.originalColor);
highlighted.feature = undefined;
} else {
Cesium.Color.clone(pickedFeature.color, selected.originalColor);
}
// Highlight newly selected feature
pickedFeature.color = Cesium.Color.LIME;
// Set feature infobox description
const featureName = pickedFeature.getProperty("name");
selectedEntity.name = featureName;
selectedEntity.description =
'Loading <div class="cesium-infoBox-loading"></div>';
viewer.selectedEntity = selectedEntity;
selectedEntity.description = `
<table class="cesium-infoBox-defaultTable">
<tbody>
<tr><th>Bau</th><td>
......@@ -290,57 +290,62 @@ const activate3DTileFeaturePicking = function () {
</table>
`;
const clickedBuilding = pickedFeature.getProperty("_gebaeude");
const clickedBuildingDatastreamId = getDatastreamIdFromBuildingNumber(
clickedBuilding,
"vl",
"60min"
);
const clickedBuilding = pickedFeature.getProperty("_gebaeude");
const clickedBuildingDatastreamId = getDatastreamIdFromBuildingNumber(
clickedBuilding,
"vl",
"60min"
);
const BASE_URL_OBSERVATIONS = getObservationsUrl(
BASE_URL,
clickedBuildingDatastreamId
);
const PARAM_FILTER = createTemporalFilterString("2020-01-01", "2021-01-01");
const axiosGetRequest = axios.get(BASE_URL_OBSERVATIONS, {
params: {
"$resultFormat": PARAM_RESULT_FORMAT,
"$orderBy": PARAM_ORDER_BY,
"$filter": PARAM_FILTER,
"$select": PARAM_SELECT,
},
});
const BASE_URL_OBSERVATIONS = getObservationsUrl(
BASE_URL,
clickedBuildingDatastreamId
);
const PARAM_FILTER = createTemporalFilterString("2020-01-01", "2021-01-01");
const axiosGetRequest = axios.get(BASE_URL_OBSERVATIONS, {
params: {
"$resultFormat": PARAM_RESULT_FORMAT,
"$orderBy": PARAM_ORDER_BY,
"$filter": PARAM_FILTER,
"$select": PARAM_SELECT,
},
});
// Get "ALL" the Observations that satisfy our query
followNextLink(axiosGetRequest)
.then((success) => {
const successValue = success.data.value;
// Get "ALL" the Observations that satisfy our query
followNextLink(axiosGetRequest)
.then((success) => {
const successValue = success.data.value;
// Array that will hold the combined observations
const combinedObservations = [];
// Array that will hold the combined observations
const combinedObservations = [];
successValue.forEach((dataObj) => {
// Each page of results will have a dataArray that holds the observations
const dataArrays = dataObj.dataArray;
successValue.forEach((dataObj) => {
// Each page of results will have a dataArray that holds the observations
const dataArrays = dataObj.dataArray;
combinedObservations.push(...dataArrays);
});
// DEBUG: Check total number of observations
console.log(combinedObservations.length);
// DEBUG: Print the array of observations
console.log(combinedObservations);
return combinedObservations;
})
.catch((err) => {
console.log(err);
})
.then((observationArr) => {
var agg = aggregateResponse(observationArr, 0, 'mean');
console.log(agg);
drawHeatMapHC(formatSTAResponseForHeatMap(observationArr));
drawLineChartHC(formatSTAResponseForLineChart(observationArr));
});
}, Cesium.ScreenSpaceEventType.LEFT_CLICK);
combinedObservations.push(...dataArrays);
});
// DEBUG: Check total number of observations
console.log(combinedObservations.length);
// DEBUG: Print the array of observations
console.log(combinedObservations);
return combinedObservations;
})
.catch((err) => {
console.log(err);
})
.then((observationArr) => {
drawHeatMapHC(formatSTAResponseForHeatMap(observationArr));
drawLineChartHC(formatSTAResponseForLineChart(observationArr));
});
}, Cesium.ScreenSpaceEventType.LEFT_CLICK);
};
activate3DTileFeaturePicking();
activate3DTileFeaturePicking();
\ No newline at end of file
public/js/appChart.js
+ 422
- 240
View file @ 86bff050
This diff is collapsed.
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