From 23c0d905167b6827fb0cdc99d8da0f90fcef9f6e Mon Sep 17 00:00:00 2001
From: Sven Schneider <icedoggy@gmx.de>
Date: Sat, 3 Jul 2021 00:25:37 +0200
Subject: [PATCH] trying to change process of adding more data to list. Updated
date picker
---
index.html | 39 +++++++++++++++++++++++++++++----------
public/js/aggregation.js | 19 ++++++++++---------
public/js/appCesium.js | 39 +++++++++++++++++++++++++--------------
3 files changed, 64 insertions(+), 33 deletions(-)
diff --git a/index.html b/index.html
index 9ab9c3a..20cda70 100644
--- a/index.html
+++ b/index.html
@@ -73,10 +73,10 @@
</div>
<form id="DatePicker">
<label>Select Date:</label>
- <input type="date" id="DateOfInterest" name="DateOfInterest" min="2020-01-01" max="2020-12-31">
- <input type="submit" value="Submit">
+ <input type="date" id="DateOfInterest" name="DateOfInterest" min="2020-01-01" max="2020-12-31" onchange='DateConvert();'>
+ <!-- <input type="submit" value="Submit"> -->
</form>
- <p>Date selected: <span id="DateSelected"></span> </p>
+ <p>Date selected: <span id="DateSelected">01.01.2020</span> </p>
</div>
</nav>
</div>
@@ -139,14 +139,33 @@
</div>
</div>
<script>
- document.getElementById('DatePicker').onsubmit = function() {
- var dateSelected = document.getElementById('DateOfInterest').value;
- var asDateType = new Date(dateSelected)
- console.log(typeof(dateSelected));
+ // document.getElementById('DatePicker').onsubmit = function() {
+ // var dateSelected = document.getElementById('DateOfInterest').value;
+ // var asDateType = new Date(dateSelected)
+ // console.log(typeof(dateSelected));
- document.getElementById('DateSelected').innerHTML = dateSelected;
- return false;
- };
+ // document.getElementById('DateSelected').innerHTML = dateSelected;
+ // return false;
+ // };
+
+ function DateConvert() {
+ var MyDate = document.getElementById("DateOfInterest").value;
+ //Need to take Raw Date into the moment function or it will be subject to Javascript Date Shifting
+ //Note no time stamp on this one.
+ //Make New Date Object
+ MyDate = new Date(MyDate);
+ //Convert OldSchool
+ ConvertMyDate(MyDate);
+ }
+
+ function ConvertMyDate(MyDate) {
+ MyDate = new Date(MyDate);
+ var Year = String(MyDate.getFullYear());
+ var Month = ("0" + (String(MyDate.getMonth() + 1))).slice(-2);
+ var Day = ("0" + (String(MyDate.getDate() + 0))).slice(-2);
+ MyDate = Day + "." + Month + "." + Year;
+ document.getElementById("DateSelected").innerHTML = MyDate;
+ }
</script>
</body>
diff --git a/public/js/aggregation.js b/public/js/aggregation.js
index b2a6404..9b60e47 100644
--- a/public/js/aggregation.js
+++ b/public/js/aggregation.js
@@ -1,4 +1,3 @@
-
/**
*
* @param {JSON} obj JSON object on which to replace a specific key.
@@ -7,7 +6,7 @@
* usage: myjson.forEach((obj) => renameKey(obj, "oldkey", "newkey"));
*/
- function renameKey(obj, oldKey, newKey) {
+function renameKey(obj, oldKey, newKey) {
obj[newKey] = obj[oldKey];
delete obj[oldKey];
}
@@ -96,7 +95,7 @@ export const aggregateResponse = function(obsArray, hours, method) {
aggregatedVals.push(vals.reduce(function(a, b) { return Math.max(a, b); }));
break;
default:
- aggregatedVals.push(vals.reduce(function(a, b) { return a + b / vals.length; },-1));
+ aggregatedVals.push(vals.reduce(function(a, b) { return a + b / vals.length; }, -1));
}
vals = []; // clear the daily value vector
vals.push(jsonData[d].temperature); // now push first entry of new day into my temp value vector.
@@ -142,7 +141,7 @@ export const aggregateResponse = function(obsArray, hours, method) {
aggregatedVals.push(vals.reduce(function(a, b) { return Math.max(a, b); }, ));
break;
default:
- aggregatedVals.push(vals.reduce(function(a, b) { return a + b / vals.length; },-1));
+ aggregatedVals.push(vals.reduce(function(a, b) { return a + b / vals.length; }, -1));
}
vals = []; // clear the daily value vector
vals.push(jsonData[d].temperature); // now push first entry of new day into my temp value vector.
@@ -158,8 +157,10 @@ export const aggregateResponse = function(obsArray, hours, method) {
} // end else
-
-
-
- return newOutput;
-}
+ // return newOutput;
+ return {
+ originalFormat: newOutput,
+ aggDates: aggDates,
+ aggVals: aggregatedVals
+ };
+}
\ No newline at end of file
diff --git a/public/js/appCesium.js b/public/js/appCesium.js
index 342c849..80c014d 100644
--- a/public/js/appCesium.js
+++ b/public/js/appCesium.js
@@ -48,13 +48,13 @@ const viewer = new Cesium.Viewer("cesiumGlobeContainer", {
* @param {String} urlTiles URL to the 3DTiles to be loaded
* @returns {undefined} undefined
*/
-const loadTiles = function (urlTiles) {
+const loadTiles = function(urlTiles) {
const tileset = new Cesium.Cesium3DTileset({
url: urlTiles,
});
viewer.scene.primitives.add(tileset);
- tileset.readyPromise.then(function () {
+ tileset.readyPromise.then(function() {
viewer
.zoomTo(
tileset,
@@ -63,7 +63,7 @@ const loadTiles = function (urlTiles) {
tileset.boundingSphere.radius / 0.5
)
)
- .otherwise(function (err) {
+ .otherwise(function(err) {
throw err;
});
});
@@ -74,7 +74,7 @@ const loadTiles = function (urlTiles) {
* @param{*}
* @returns {undefined} undefined
*/
-const loadNonDetailed = function () {
+const loadNonDetailed = function() {
// Paths to data sources
const URL_3DTILES = "data_3d/3dtiles/1_full/tileset.json";
@@ -88,7 +88,7 @@ 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 gltfLoad = function(gltfUrl, gltfId) {
const modelMatrix = Cesium.Transforms.eastNorthUpToFixedFrame(
Cesium.Cartesian3.fromDegrees(9.083385, 48.881342, 0)
);
@@ -108,7 +108,7 @@ const gltfLoad = function (gltfUrl, gltfId) {
* @param{*}
* @returns {undefined} undefined
*/
-const loadDetailed = function () {
+const loadDetailed = function() {
// Paths to data sources
const URL_3DTILES = "data_3d/3dtiles/2_partial/tileset.json";
const URL_GLTF = "data_3d/gltf";
@@ -173,7 +173,7 @@ if (!LOAD_DETAILED_BLDG225) {
* @param {*}
* @returns {undefined}
*/
-const activate3DTileFeaturePicking = function () {
+const activate3DTileFeaturePicking = function() {
// HTML overlay for showing feature name on mouseover
const nameOverlay = document.createElement("div");
viewer.container.appendChild(nameOverlay);
@@ -319,12 +319,14 @@ const activate3DTileFeaturePicking = function () {
// },
// });
- const buildingIDs = [75, 76, 77, 78, 79, 80];
- // var ALLDATA = [];
+ const BUILDING_STREAM_ID = [75, 76, 77, 78, 79, 80];
+ const BUILDING_ID = ["101", "102", "107", "112, 118", "125", "225"];
+ // ALLDATA = [];
+ var bld = 0;
- for (var bld = 0; bld < buildingIDs.length; bld++) {
+ for (bld = 0; bld < BUILDING_STREAM_ID.length; bld++) {
- var baseUrlBld = getObservationsUrl(BASE_URL, buildingIDs[bld]);
+ var baseUrlBld = getObservationsUrl(BASE_URL, BUILDING_STREAM_ID[bld]);
const axiosGetRequest = axios.get(baseUrlBld, {
params: {
"$resultFormat": PARAM_RESULT_FORMAT,
@@ -361,11 +363,20 @@ const activate3DTileFeaturePicking = function () {
})
.then((observationArr) => {
var agg = aggregateResponse(observationArr, 0, 'mean');
- ALLDATA.push(agg);
+ var tmpObj = {
+ id: BUILDING_ID[bld],
+ streamID: BUILDING_STREAM_ID[bld],
+ timestamp: agg.aggDates,
+ data: agg.aggVals,
+ };
+ ALLDATA.push(tmpObj);
// console.log(agg);
- drawHeatMapHC(formatSTAResponseForHeatMap(agg));
- drawLineChartHC(formatSTAResponseForLineChart(agg));
+ drawHeatMapHC(formatSTAResponseForHeatMap(agg.originalFormat));
+ drawLineChartHC(formatSTAResponseForLineChart(agg.originalFormat));
console.log(ALLDATA.length);
+ var selectedDate = document.getElementById("DateSelected").value;
+ console.log(selectedDate);
+
// alert('waiting...');
});
--
GitLab