diff --git a/public/.gitignore b/public/.gitignore
new file mode 100644
index 0000000000000000000000000000000000000000..4d0f72647444a2d4b1192b4e9a1bbd5eb2b87c80
--- /dev/null
+++ b/public/.gitignore
@@ -0,0 +1,4 @@
+/node_modules
+npm-debug.log
+.DS_Store
+/*.env
diff --git a/public/buildingTiles/circularTiles/L1_yellow/b3dms/R.b3dm b/public/buildingTiles/circularTiles/L1_yellow/b3dms/R.b3dm
new file mode 100644
index 0000000000000000000000000000000000000000..57fc2a60689e0914cc1068cfafd2d767b7c70285
Binary files /dev/null and b/public/buildingTiles/circularTiles/L1_yellow/b3dms/R.b3dm differ
diff --git a/public/buildingTiles/circularTiles/L1_yellow/tileset.json b/public/buildingTiles/circularTiles/L1_yellow/tileset.json
new file mode 100644
index 0000000000000000000000000000000000000000..c96deebe6d1844ba175144a2250f9b44856764a3
--- /dev/null
+++ b/public/buildingTiles/circularTiles/L1_yellow/tileset.json
@@ -0,0 +1,130 @@
+{
+ "asset": {
+ "version": "0.0"
+ },
+ "geometricError": 37.18040634705286,
+ "root": {
+ "refine": "ADD",
+ "boundingVolume": {
+ "region": [
+ 0.1604284826654673,
+ 0.8514863285409243,
+ 0.1604475660539477,
+ 0.8514937723783317,
+ 235.04712,
+ 263.98139
+ ]
+ },
+ "content": {
+ "uri": "b3dms/R.b3dm",
+ "boundingVolume": {
+ "region": [
+ 0.1604284826654673,
+ 0.8514863285409243,
+ 0.1604475660539477,
+ 0.8514937723783317,
+ 235.04712,
+ 263.98139
+ ]
+ }
+ },
+ "geometricError": 0.0
+ },
+ "properties": {
+ "gebaeudekennzeichen_1": {},
+ "anzahlDerEinBisZweiZimmerWohnungen": {
+ "maximum": 8,
+ "minimum": 1
+ },
+ "LoD1_datenquelleBodenhoehe": {
+ "maximum": 1000,
+ "minimum": 1000
+ },
+ "gmlIdALKISLageBezeichnung_2": {},
+ "geschossflaeche": {
+ "maximum": 1527,
+ "minimum": 15
+ },
+ "StoreysAboveGround": {
+ "maximum": 7,
+ "minimum": 4
+ },
+ "umbauterRaum": {
+ "maximum": 4971,
+ "minimum": 48
+ },
+ "anzahlDerWohnungenImSondereigentum": {
+ "maximum": 6,
+ "minimum": 5
+ },
+ "MeasuredHeight": {
+ "maximum": 26.3,
+ "minimum": 20.6
+ },
+ "FeatureType": {},
+ "baublockseitenNummer": {
+ "maximum": 3,
+ "minimum": 1
+ },
+ "gmlID": {},
+ "YearOfConstruction": {
+ "maximum": 2011,
+ "minimum": 1956
+ },
+ "anzahlDerDreiBisVierZimmerWohnungen": {
+ "maximum": 12,
+ "minimum": 4
+ },
+ "statusDesGebaeudes": {
+ "maximum": 1,
+ "minimum": 1
+ },
+ "LoD1_datenquelleLage": {
+ "maximum": 1000,
+ "minimum": 1000
+ },
+ "gmlIdALKISLageBezeichnung_1": {},
+ "StoreysBelowGround": {
+ "maximum": 2,
+ "minimum": 0
+ },
+ "dachgeschossausbau": {
+ "maximum": 3000,
+ "minimum": -1000
+ },
+ "hoeheFirst": {
+ "maximum": 270.8,
+ "minimum": 261.4
+ },
+ "gebaeudekennzeichen_2": {},
+ "CreationDate": {},
+ "alkisId": {},
+ "baublockNummer": {
+ "maximum": 107226,
+ "minimum": 107207
+ },
+ "hoeheEFH": {
+ "maximum": 246.55,
+ "minimum": 240.64
+ },
+ "hoeheTrauf": {
+ "maximum": 262.05,
+ "minimum": 252.94
+ },
+ "grundflaeche": {
+ "maximum": 221,
+ "minimum": 3
+ },
+ "LocalityName": {},
+ "ThoroughfareNumber": {},
+ "ThoroughfareName": {},
+ "Longitude": {
+ "maximum": 9.192968368037699,
+ "minimum": 9.192046018248607
+ },
+ "Latitude": {
+ "maximum": 48.7869994389516,
+ "minimum": 48.78671550280119
+ }
+ }
+}
\ No newline at end of file
diff --git a/public/buildingTiles/circularTiles/L2_red/b3dms/R.b3dm b/public/buildingTiles/circularTiles/L2_red/b3dms/R.b3dm
new file mode 100644
index 0000000000000000000000000000000000000000..35c06be0b196873b91b58e7e0d59e075bee08c5e
Binary files /dev/null and b/public/buildingTiles/circularTiles/L2_red/b3dms/R.b3dm differ
diff --git a/public/buildingTiles/circularTiles/L2_red/tileset.json b/public/buildingTiles/circularTiles/L2_red/tileset.json
new file mode 100644
index 0000000000000000000000000000000000000000..6f3d02468db713308d591da7e733694dbe6e5d8e
--- /dev/null
+++ b/public/buildingTiles/circularTiles/L2_red/tileset.json
@@ -0,0 +1,108 @@
+{
+ "asset": {
+ "version": "0.0"
+ },
+ "geometricError": 60.372285006912044,
+ "root": {
+ "refine": "ADD",
+ "boundingVolume": {
+ "region": [
+ 0.16042278896694803,
+ 0.8514758183340863,
+ 0.16045106439644147,
+ 0.8514996024839743,
+ 233.458193,
+ 301.62112
+ ]
+ },
+ "content": {
+ "uri": "b3dms/R.b3dm",
+ "boundingVolume": {
+ "region": [
+ 0.16042278896694803,
+ 0.8514758183340863,
+ 0.16045106439644147,
+ 0.8514996024839743,
+ 233.458193,
+ 301.62112
+ ]
+ }
+ },
+ "geometricError": 0.0
+ },
+ "properties": {
+ "gmlID": {},
+ "StoreysBelowGround": {
+ "maximum": 2,
+ "minimum": 0
+ },
+ "LoD1_datenquelleBodenhoehe": {
+ "maximum": 2000,
+ "minimum": 1000
+ },
+ "baublockNummer": {
+ "maximum": 107226,
+ "minimum": 107205
+ },
+ "dachgeschossausbau": {
+ "maximum": 3000,
+ "minimum": -1000
+ },
+ "gebaeudekennzeichen_1": {},
+ "hoeheFirst": {
+ "maximum": 307.5,
+ "minimum": 242.1
+ },
+ "CreationDate": {},
+ "geschossflaeche": {
+ "maximum": 1482,
+ "minimum": 10
+ },
+ "alkisId": {},
+ "gmlIdALKISLageBezeichnung_1": {},
+ "StoreysAboveGround": {
+ "maximum": 7,
+ "minimum": 1
+ },
+ "YearOfConstruction": {
+ "maximum": 2017,
+ "minimum": 1929
+ },
+ "baublockseitenNummer": {
+ "maximum": 4,
+ "minimum": 1
+ },
+ "LoD1_datenquelleLage": {
+ "maximum": 1000,
+ "minimum": 1000
+ },
+ "umbauterRaum": {
+ "maximum": 11395,
+ "minimum": 28
+ },
+ "grundflaeche": {
+ "maximum": 741,
+ "minimum": 2
+ },
+ "FeatureType": {},
+ "MeasuredHeight": {
+ "maximum": 59.7,
+ "minimum": 1
+ },
+ "statusDesGebaeudes": {
+ "maximum": 1,
+ "minimum": 1
+ },
+ "LocalityName": {},
+ "ThoroughfareNumber": {},
+ "ThoroughfareName": {},
+ "Longitude": {
+ "maximum": 9.193168808297884,
+ "minimum": 9.191674771677906
+ },
+ "Latitude": {
+ "maximum": 48.78733347939904,
+ "minimum": 48.786123496366585
+ }
+ }
+}
\ No newline at end of file
diff --git a/public/buildingTiles/circularTiles/L3_green/b3dms/R.b3dm b/public/buildingTiles/circularTiles/L3_green/b3dms/R.b3dm
new file mode 100644
index 0000000000000000000000000000000000000000..bb362daa9e99dc7bc83cc49ec71199a898f02e0e
Binary files /dev/null and b/public/buildingTiles/circularTiles/L3_green/b3dms/R.b3dm differ
diff --git a/public/buildingTiles/circularTiles/L3_green/tileset.json b/public/buildingTiles/circularTiles/L3_green/tileset.json
new file mode 100644
index 0000000000000000000000000000000000000000..fc96ed2990531ba24cce9cfb6966aa59cf2fb57b
--- /dev/null
+++ b/public/buildingTiles/circularTiles/L3_green/tileset.json
@@ -0,0 +1,110 @@
+{
+ "asset": {
+ "version": "0.0"
+ },
+ "geometricError": 39.084425356368904,
+ "root": {
+ "refine": "ADD",
+ "boundingVolume": {
+ "region": [
+ 0.16041667550827962,
+ 0.8514723909274853,
+ 0.16046363002656053,
+ 0.8515019513081981,
+ 233.195503,
+ 268.220158
+ ]
+ },
+ "content": {
+ "uri": "b3dms/R.b3dm",
+ "boundingVolume": {
+ "region": [
+ 0.16041667550827962,
+ 0.8514723909274853,
+ 0.16046363002656053,
+ 0.8515019513081981,
+ 233.195503,
+ 268.220158
+ ]
+ }
+ },
+ "geometricError": 0.0
+ },
+ "properties": {
+ "gebaeudekennzeichen_2": {},
+ "grundflaeche": {
+ "maximum": 341,
+ "minimum": 3
+ },
+ "dachgeschossausbau": {
+ "maximum": 3000,
+ "minimum": -1000
+ },
+ "FeatureType": {},
+ "statusDesGebaeudes": {
+ "maximum": 1,
+ "minimum": 1
+ },
+ "gmlIdALKISLageBezeichnung_1": {},
+ "StoreysAboveGround": {
+ "maximum": 6,
+ "minimum": 1
+ },
+ "YearOfConstruction": {
+ "maximum": 2015,
+ "minimum": 1949
+ },
+ "baublockseitenNummer": {
+ "maximum": 5,
+ "minimum": 1
+ },
+ "LoD1_datenquelleBodenhoehe": {
+ "maximum": 1000,
+ "minimum": 1000
+ },
+ "LoD1_datenquelleLage": {
+ "maximum": 1000,
+ "minimum": 1000
+ },
+ "umbauterRaum": {
+ "maximum": 5981,
+ "minimum": 8
+ },
+ "gmlIdALKISLageBezeichnung_2": {},
+ "MeasuredHeight": {
+ "maximum": 24.7,
+ "minimum": 0.9
+ },
+ "CreationDate": {},
+ "gebaeudekennzeichen_1": {},
+ "hoeheFirst": {
+ "maximum": 271.3,
+ "minimum": 240.2
+ },
+ "gmlID": {},
+ "geschossflaeche": {
+ "maximum": 2113,
+ "minimum": 3
+ },
+ "alkisId": {},
+ "StoreysBelowGround": {
+ "maximum": 2,
+ "minimum": 0
+ },
+ "baublockNummer": {
+ "maximum": 107227,
+ "minimum": 107205
+ },
+ "LocalityName": {},
+ "ThoroughfareNumber": {},
+ "ThoroughfareName": {},
+ "Longitude": {
+ "maximum": 9.193888765870629,
+ "minimum": 9.191391539460852
+ },
+ "Latitude": {
+ "maximum": 48.78746805711388,
+ "minimum": 48.785921840210726
+ }
+ }
+}
\ No newline at end of file
diff --git a/public/buildingTiles/circularTiles/L4_brown/b3dms/R.b3dm b/public/buildingTiles/circularTiles/L4_brown/b3dms/R.b3dm
new file mode 100644
index 0000000000000000000000000000000000000000..f9397fcfbe6d2594922e04f0bda3d0e51a0e3614
Binary files /dev/null and b/public/buildingTiles/circularTiles/L4_brown/b3dms/R.b3dm differ
diff --git a/public/buildingTiles/circularTiles/L4_brown/tileset.json b/public/buildingTiles/circularTiles/L4_brown/tileset.json
new file mode 100644
index 0000000000000000000000000000000000000000..2c746ecb00750ed8392e93e369af99a2c09284fd
--- /dev/null
+++ b/public/buildingTiles/circularTiles/L4_brown/tileset.json
@@ -0,0 +1,110 @@
+{
+ "asset": {
+ "version": "0.0"
+ },
+ "geometricError": 84.67816281509891,
+ "root": {
+ "refine": "ADD",
+ "boundingVolume": {
+ "region": [
+ 0.1604120669069954,
+ 0.8514671950157275,
+ 0.1604678366170678,
+ 0.8515064828890897,
+ 233.053738,
+ 278.57
+ ]
+ },
+ "content": {
+ "uri": "b3dms/R.b3dm",
+ "boundingVolume": {
+ "region": [
+ 0.1604120669069954,
+ 0.8514671950157275,
+ 0.1604678366170678,
+ 0.8515064828890897,
+ 233.053738,
+ 278.57
+ ]
+ }
+ },
+ "geometricError": 0.0
+ },
+ "properties": {
+ "gebaeudekennzeichen_2": {},
+ "grundflaeche": {
+ "maximum": 879,
+ "minimum": 6
+ },
+ "dachgeschossausbau": {
+ "maximum": 3000,
+ "minimum": -1000
+ },
+ "FeatureType": {},
+ "statusDesGebaeudes": {
+ "maximum": 1,
+ "minimum": 1
+ },
+ "gmlIdALKISLageBezeichnung_1": {},
+ "StoreysAboveGround": {
+ "maximum": 7,
+ "minimum": 1
+ },
+ "YearOfConstruction": {
+ "maximum": 2017,
+ "minimum": 1904
+ },
+ "baublockseitenNummer": {
+ "maximum": 5,
+ "minimum": 1
+ },
+ "LoD1_datenquelleBodenhoehe": {
+ "maximum": 2000,
+ "minimum": 1000
+ },
+ "LoD1_datenquelleLage": {
+ "maximum": 1000,
+ "minimum": 1000
+ },
+ "umbauterRaum": {
+ "maximum": 19095,
+ "minimum": 16
+ },
+ "gmlIdALKISLageBezeichnung_2": {},
+ "MeasuredHeight": {
+ "maximum": 24.3,
+ "minimum": 1.9
+ },
+ "CreationDate": {},
+ "gebaeudekennzeichen_1": {},
+ "hoeheFirst": {
+ "maximum": 282.8,
+ "minimum": 241.5
+ },
+ "gmlID": {},
+ "geschossflaeche": {
+ "maximum": 5778,
+ "minimum": 6
+ },
+ "alkisId": {},
+ "StoreysBelowGround": {
+ "maximum": 4,
+ "minimum": 0
+ },
+ "baublockNummer": {
+ "maximum": 107227,
+ "minimum": 107205
+ },
+ "LocalityName": {},
+ "ThoroughfareNumber": {},
+ "ThoroughfareName": {},
+ "Longitude": {
+ "maximum": 9.194129785752834,
+ "minimum": 9.19116602302604
+ },
+ "Latitude": {
+ "maximum": 48.78772769757349,
+ "minimum": 48.78566245389924
+ }
+ }
+}
\ No newline at end of file
diff --git a/public/buildingTiles/circularTiles/target_black/b3dms/R.b3dm b/public/buildingTiles/circularTiles/target_black/b3dms/R.b3dm
new file mode 100644
index 0000000000000000000000000000000000000000..35bd844b1ff5b3256d33f6568bbfc2fcef271e76
Binary files /dev/null and b/public/buildingTiles/circularTiles/target_black/b3dms/R.b3dm differ
diff --git a/public/buildingTiles/circularTiles/target_black/tileset.json b/public/buildingTiles/circularTiles/target_black/tileset.json
new file mode 100644
index 0000000000000000000000000000000000000000..a205056cdbd3cbac1b40bc6866b9ecc06672ac0b
--- /dev/null
+++ b/public/buildingTiles/circularTiles/target_black/tileset.json
@@ -0,0 +1,118 @@
+{
+ "asset": {
+ "version": "0.0"
+ },
+ "geometricError": 35.93947937894208,
+ "root": {
+ "refine": "ADD",
+ "boundingVolume": {
+ "region": [
+ 0.16043612181516045,
+ 0.8514852982081099,
+ 0.1604435899169862,
+ 0.8514899865142226,
+ 237.745486,
+ 262.385603
+ ]
+ },
+ "content": {
+ "uri": "b3dms/R.b3dm",
+ "boundingVolume": {
+ "region": [
+ 0.16043612181516045,
+ 0.8514852982081099,
+ 0.1604435899169862,
+ 0.8514899865142226,
+ 237.745486,
+ 262.385603
+ ]
+ }
+ },
+ "geometricError": 0.0
+ },
+ "properties": {
+ "gebaeudekennzeichen_1": {},
+ "anzahlDerEinBisZweiZimmerWohnungen": {
+ "maximum": 3,
+ "minimum": 1
+ },
+ "LoD1_datenquelleBodenhoehe": {
+ "maximum": 1000,
+ "minimum": 1000
+ },
+ "gmlIdALKISLageBezeichnung_2": {},
+ "geschossflaeche": {
+ "maximum": 1470,
+ "minimum": 537
+ },
+ "StoreysAboveGround": {
+ "maximum": 6,
+ "minimum": 5
+ },
+ "umbauterRaum": {
+ "maximum": 4655,
+ "minimum": 1761
+ },
+ "MeasuredHeight": {
+ "maximum": 22.4,
+ "minimum": 22
+ },
+ "FeatureType": {},
+ "baublockseitenNummer": {
+ "maximum": 3,
+ "minimum": 1
+ },
+ "gmlID": {},
+ "YearOfConstruction": {
+ "maximum": 1991,
+ "minimum": 1969
+ },
+ "anzahlDerDreiBisVierZimmerWohnungen": {
+ "maximum": 10,
+ "minimum": 5
+ },
+ "statusDesGebaeudes": {
+ "maximum": 1,
+ "minimum": 1
+ },
+ "LoD1_datenquelleLage": {
+ "maximum": 1000,
+ "minimum": 1000
+ },
+ "gmlIdALKISLageBezeichnung_1": {},
+ "StoreysBelowGround": {
+ "maximum": 2,
+ "minimum": 0
+ },
+ "dachgeschossausbau": {
+ "maximum": 3000,
+ "minimum": 3000
+ },
+ "hoeheFirst": {
+ "maximum": 266.8,
+ "minimum": 265.3
+ },
+ "gebaeudekennzeichen_2": {},
+ "CreationDate": {},
+ "alkisId": {},
+ "baublockNummer": {
+ "maximum": 107226,
+ "minimum": 107226
+ },
+ "grundflaeche": {
+ "maximum": 210,
+ "minimum": 105
+ },
+ "LocalityName": {},
+ "ThoroughfareNumber": {},
+ "ThoroughfareName": {},
+ "Longitude": {
+ "maximum": 9.19274055217104,
+ "minimum": 9.192576333508102
+ },
+ "Latitude": {
+ "maximum": 48.78678252491634,
+ "minimum": 48.78667977173829
+ }
+ }
+}
\ No newline at end of file
diff --git a/public/circData.js b/public/circData.js
new file mode 100644
index 0000000000000000000000000000000000000000..502b99e2fc589978ff135bb5ccc3e3ecf52e3d64
--- /dev/null
+++ b/public/circData.js
@@ -0,0 +1,653 @@
+$(function () {
+ Cesium.Ion.defaultAccessToken = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiI5ODI4ZTYyZS1mMTg2LTQ5NGEtYjdiOS02ODg2NzVhNjc0MTAiLCJpZCI6MjkwNCwiaWF0IjoxNTM1MTA5OTAzfQ.kyDX_0ScvJBkYnvXI0DW5NfZbiaRL5ezwtAUhxYnk1Y';
+
+ var imageryViewModels = [];
+ imageryViewModels.push(new Cesium.ProviderViewModel({
+ name: 'Sentinel-2',
+ iconUrl: Cesium.buildModuleUrl('Widgets/Images/ImageryProviders/sentinel-2.png'),
+ tooltip: 'Sentinel-2 cloudless.',
+ creationFunction: function () {
+ return new Cesium.IonImageryProvider({ assetId: 3954 });
+ }
+ }));
+
+ imageryViewModels.push(new Cesium.ProviderViewModel({
+ name: 'Blue Marble',
+ iconUrl: Cesium.buildModuleUrl('Widgets/Images/ImageryProviders/blueMarble.png'),
+ tooltip: 'Blue Marble Next Generation July, 2004 imagery from NASA.',
+ creationFunction: function () {
+ return new Cesium.IonImageryProvider({ assetId: 3845 });
+ }
+ }));
+
+ var viewer = new Cesium.Viewer('cesiumContainer',
+ {
+ imageryProvider: new Cesium.IonImageryProvider({ assetId: 3954 }),
+
+ terrainProvider : new Cesium.CesiumTerrainProvider({
+ url: Cesium.IonResource.fromAssetId(1)
+ }),
+ scene3DOnly: false,
+ shouldAnimate: true,
+ animation: true,
+ infoBox: true,
+ baseLayerPicker: true,
+ fullscreenButton: false,
+ timeline: false,
+ navigationHelpButton: true,
+ navigationInstructionsInitiallyVisible: false,
+ homeButton: false,
+ selectionIndicator: true,
+ geocoder: true,
+ // imageryProviderViewModels: imageryViewModels
+ });
+
+ // var layer = viewer.imageryLayers.addImageryProvider(
+ // new Cesium.IonImageryProvider({ assetId: 3 })
+ // );
+
+ var imageryLayer = viewer.imageryLayers.addImageryProvider(
+ new Cesium.IonImageryProvider({ assetId: 3954 })
+ );
+
+ var canvas = viewer.canvas;
+ canvas.setAttribute('tabindex', '0'); // needed to put focus on the canvas
+ canvas.addEventListener('click', function() {
+ canvas.focus();
+ });
+ canvas.focus();
+ var scene = viewer.scene;
+
+ // var osmBuildings = viewer.scene.primitives.add(
+ // new Cesium.Cesium3DTileset({
+ // url: Cesium.IonResource.fromAssetId(96188),
+ // })
+ // );
+
+ ///////////////////////////// Target //////////////////////////
+
+ var target_tileset = viewer.scene.primitives.add(new Cesium.Cesium3DTileset({
+ url: 'buildingTiles/circularTiles/target_black/tileset.json',
+ show: true
+ }));
+
+
+
+ target_tileset.readyPromise.then(function (target_tileset) {
+
+ var R = 0; // roll
+ var P = 0; // pitch
+ var Yaw = 0; // yaw
+ var height =53;
+ var cartographic = Cesium.Cartographic.fromCartesian(target_tileset.boundingSphere.center);
+ var surface = Cesium.Cartesian3.fromRadians(cartographic.longitude, cartographic.latitude, 0.0);
+ var offset = Cesium.Cartesian3.fromRadians(cartographic.longitude, cartographic.latitude, height);
+ var translation = Cesium.Cartesian3.subtract(offset, surface, new Cesium.Cartesian3());
+
+ //var rotMat = new Cesium.Matrix3();
+ var rotation = new Cesium.Matrix3.fromHeadingPitchRoll(new Cesium.HeadingPitchRoll(Yaw, P, R));
+
+ target_tileset.modelMatrix = Cesium.Matrix4.fromRotationTranslation(rotation,translation);
+
+
+ return zoomAll(target_tileset);
+ });
+
+ target_tileset.readyPromise.then(function(target_tileset){
+ target_tileset.style = new Cesium.Cesium3DTileStyle({
+ color: "color('black',0.5)",
+ })
+ });
+
+
+
+
+ ///////////////////////////// Layer one //////////////////////////
+
+ var L1 = viewer.scene.primitives.add(new Cesium.Cesium3DTileset({
+ url: 'buildingTiles/circularTiles/L1_yellow/tileset.json',
+ show: true,
+
+ }));
+
+ L1.readyPromise.then(function (L1) {
+ return zoomAll(L1);
+ });
+
+ L1.readyPromise.then(function (L1) {
+
+ var R = 0; // roll
+ var P = 0; // pitch
+ var Yaw = 0; // yaw
+ var height =53;
+ var cartographic = Cesium.Cartographic.fromCartesian(L1.boundingSphere.center);
+ var surface = Cesium.Cartesian3.fromRadians(cartographic.longitude, cartographic.latitude, 0.0);
+ var offset = Cesium.Cartesian3.fromRadians(cartographic.longitude, cartographic.latitude, height);
+ var translation = Cesium.Cartesian3.subtract(offset, surface, new Cesium.Cartesian3());
+
+ //var rotMat = new Cesium.Matrix3();
+ var rotation = new Cesium.Matrix3.fromHeadingPitchRoll(new Cesium.HeadingPitchRoll(Yaw, P, R));
+
+ L1.modelMatrix = Cesium.Matrix4.fromRotationTranslation(rotation,translation);
+
+ return zoomAll(L1);
+ });
+
+
+ L1.readyPromise.then(function(L1){
+ L1.style = new Cesium.Cesium3DTileStyle({
+ color: "color('yellow',1)",
+ })
+ });
+
+ ///////////////////////////// Layer 2 //////////////////////////
+
+ var L2 = viewer.scene.primitives.add(new Cesium.Cesium3DTileset({
+ url: 'buildingTiles/circularTiles/L2_red/tileset.json',
+ show: true,
+
+ }));
+
+ L2.readyPromise.then(function (L2) {
+ return zoomAll(L2);
+ });
+
+ L2.readyPromise.then(function (L2) {
+
+ var R = 0; // roll
+ var P = 0; // pitch
+ var Yaw = 0; // yaw
+ var height =53;
+ var cartographic = Cesium.Cartographic.fromCartesian(L2.boundingSphere.center);
+ var surface = Cesium.Cartesian3.fromRadians(cartographic.longitude, cartographic.latitude, 0.0);
+ var offset = Cesium.Cartesian3.fromRadians(cartographic.longitude, cartographic.latitude, height);
+ var translation = Cesium.Cartesian3.subtract(offset, surface, new Cesium.Cartesian3());
+
+ //var rotMat = new Cesium.Matrix3();
+ var rotation = new Cesium.Matrix3.fromHeadingPitchRoll(new Cesium.HeadingPitchRoll(Yaw, P, R));
+
+ L2.modelMatrix = Cesium.Matrix4.fromRotationTranslation(rotation,translation);
+
+ return zoomAll(L2);
+ });
+
+
+ L2.readyPromise.then(function(L2){
+ L2.style = new Cesium.Cesium3DTileStyle({
+ color: "color('red',1)",
+ })
+ });
+
+
+ ///////////////////////////// Layer 3 //////////////////////////
+
+ var L3 = viewer.scene.primitives.add(new Cesium.Cesium3DTileset({
+ url: 'buildingTiles/circularTiles/L3_green/tileset.json',
+ show: true,
+
+ }));
+
+ L3.readyPromise.then(function (L3) {
+ return zoomAll(L3);
+ });
+
+ L3.readyPromise.then(function (L3) {
+
+ var R = 0; // roll
+ var P = 0; // pitch
+ var Yaw = 0; // yaw
+ var height =53;
+ var cartographic = Cesium.Cartographic.fromCartesian(L3.boundingSphere.center);
+ var surface = Cesium.Cartesian3.fromRadians(cartographic.longitude, cartographic.latitude, 0.0);
+ var offset = Cesium.Cartesian3.fromRadians(cartographic.longitude, cartographic.latitude, height);
+ var translation = Cesium.Cartesian3.subtract(offset, surface, new Cesium.Cartesian3());
+
+ //var rotMat = new Cesium.Matrix3();
+ var rotation = new Cesium.Matrix3.fromHeadingPitchRoll(new Cesium.HeadingPitchRoll(Yaw, P, R));
+
+ L3.modelMatrix = Cesium.Matrix4.fromRotationTranslation(rotation,translation);
+
+ return zoomAll(L3);
+ });
+
+
+ L3.readyPromise.then(function(L3){
+ L3.style = new Cesium.Cesium3DTileStyle({
+ color: "color('green',1)",
+ })
+ });
+
+
+ ///////////////////////////// Layer 3 //////////////////////////
+
+ var L4 = viewer.scene.primitives.add(new Cesium.Cesium3DTileset({
+ url: 'buildingTiles/circularTiles/L4_brown/tileset.json',
+ show: true,
+
+ }));
+
+ L4.readyPromise.then(function (L4) {
+ return zoomAll(L4);
+ });
+
+ L4.readyPromise.then(function (L4) {
+
+ var R = 0; // roll
+ var P = 0; // pitch
+ var Yaw = 0; // yaw
+ var height =53;
+ var cartographic = Cesium.Cartographic.fromCartesian(L4.boundingSphere.center);
+ var surface = Cesium.Cartesian3.fromRadians(cartographic.longitude, cartographic.latitude, 0.0);
+ var offset = Cesium.Cartesian3.fromRadians(cartographic.longitude, cartographic.latitude, height);
+ var translation = Cesium.Cartesian3.subtract(offset, surface, new Cesium.Cartesian3());
+
+ //var rotMat = new Cesium.Matrix3();
+ var rotation = new Cesium.Matrix3.fromHeadingPitchRoll(new Cesium.HeadingPitchRoll(Yaw, P, R));
+
+ L4.modelMatrix = Cesium.Matrix4.fromRotationTranslation(rotation,translation);
+
+ return zoomAll(L4);
+ });
+
+
+ L4.readyPromise.then(function(L4){
+ L4.style = new Cesium.Cesium3DTileStyle({
+ color: "color('CORAL',1)",
+ })
+ });
+
+
+ var camera = viewer.camera;
+ var controller = scene.screenSpaceCameraController;
+ var r = 0;
+ var center = new Cesium.Cartesian3();
+
+ var hpRoll = new Cesium.HeadingPitchRoll();
+ var hpRange = new Cesium.HeadingPitchRange();
+ var speed = 0.1;
+ var deltaRadians = Cesium.Math.toRadians(3.0);
+
+ var position = Cesium.Cartesian3.fromDegrees(9.190471, 48.786782, 0.0);
+ var speedVector = new Cesium.Cartesian3();
+ var fixedFrameTransform = Cesium.Transforms.localFrameToFixedFrameGenerator('north', 'west');
+
+
+
+ viewer.scene.globe.enableLighting = true; // set lighting to true
+
+
+ var zoomAll = function (tileset) {
+ return new Promise(function (resolve, reject) {
+ if (!tileset) { reject("Tileset is undifined"); }
+ viewer.camera.viewBoundingSphere(tileset.boundingSphere, new Cesium.HeadingPitchRange(0, -0.5, 1500));
+ viewer.camera.lookAtTransform(Cesium.Matrix4.IDENTITY);
+ resolve();
+ });
+ }
+
+ // HTML overlay for showing feature name on mouseover
+ var 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 = 'green';
+
+ // Information about the currently selected feature
+ var selected = {
+ feature: undefined,
+ originalColor: new Cesium.Color()
+ };
+
+ // Information about the currently highlighted feature
+ var highlighted = {
+ feature: undefined,
+ originalColor: new Cesium.Color()
+ };
+
+ var selectedEntity = new Cesium.Entity();
+
+ // Color a feature yellow 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
+ var 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';
+ var name = pickedFeature.getProperty('name');
+ 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.AQUA;
+ }
+ }, Cesium.ScreenSpaceEventType.MOUSE_MOVE);
+
+ // Color a feature on selection and show metadata in the InfoBox.
+var clickHandler = viewer.screenSpaceEventHandler.getInputAction(Cesium.ScreenSpaceEventType.LEFT_CLICK);
+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
+ var 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.WHITE;
+
+ // Set feature infobox description
+ var featureName = pickedFeature.getProperty('name');
+ selectedEntity.name = featureName;
+ selectedEntity.description = 'Loading
';
+ viewer.selectedEntity = selectedEntity;
+ selectedEntity.description = '' +
+ 'Bld function | ' + pickedFeature.getProperty('Function') + ' |
' +
+ 'gmlID | ' + pickedFeature.getProperty('gmlIDStr') + ' |
' +
+ 'Dachgeschossausbau | ' + pickedFeature.getProperty('dachgeschossausbau') + ' |
' +
+ 'Lon | ' + pickedFeature.getProperty('Longitude') + ' |
' +
+ 'Lat | ' + pickedFeature.getProperty('Latitude') + ' |
' +
+ 'Geschossflaeche (sqm) | ' + pickedFeature.getProperty('geschossflaeche') + ' |
' +
+ 'YearOfConstruction | ' + pickedFeature.getProperty('YearOfConstruction') + ' |
' +
+ 'MeasuredHeight (m): | ' + pickedFeature.getProperty('MeasuredHeight') + ' |
' +
+ 'HoeheFirst (m) | ' + pickedFeature.getProperty('hoeheFirst') + ' |
' +
+ 'HoeheTrauf (m) | ' + pickedFeature.getProperty('hoeheTrauf') + ' |
' +
+ 'Grundflaeche (sqm) | ' + pickedFeature.getProperty('grundflaeche') + ' |
' +
+ 'StoreysAboveGround: | ' + pickedFeature.getProperty('StoreysAboveGround') + ' |
' +
+ 'StoreysBelowGround: | ' + pickedFeature.getProperty('StoreysBelowGround') + ' |
' +
+ 'Durchfahrtsstr.: | ' + pickedFeature.getProperty('ThoroughfareName') + ' |
' +
+ 'Hausnummer.: | ' + pickedFeature.getProperty('ThoroughfareNumber') + ' |
' +
+ '
';
+}, Cesium.ScreenSpaceEventType.LEFT_CLICK);
+
+ var scene = viewer.scene;
+ var longitude;
+ var latitude;
+ var fid;
+ var featuretype;
+ var gmlid;
+ var selID = new Array();
+ var cnt = 0;
+ var lastPickedObject;
+
+ var viewModel = {
+ rightClickAction: 'properties',
+ middleClickAction: 'hide'
+ };
+
+ Cesium.knockout.track(viewModel);
+
+ var handler = new Cesium.ScreenSpaceEventHandler(scene.canvas);
+
+
+ handler.setInputAction(function (movement) {
+ // makes camera go to a certain position given by the coordinates below
+
+ var feature = viewer.scene.pick(movement.position);
+ if (!Cesium.defined(feature)) {
+ console.log("no feature defined")
+ return;
+ }
+ var propertyNames = feature.getPropertyNames();
+ var lat = feature.getProperty("Latitude");
+ var lon = feature.getProperty("Longitude");
+ var tmp = feature.getProperty("YearOfConstruction");
+
+ viewer.camera.flyTo({
+ destination: Cesium.Cartesian3.fromDegrees(lon, lat, 900),
+ maximumHeight: 1500.0,
+ orientation: {
+ heading: Cesium.Math.toRadians(0.0),
+ pitch: Cesium.Math.toRadians(-90.0),
+ roll: Cesium.Math.toRadians(45.0)
+ },
+ duration: 2
+ }); }, Cesium.ScreenSpaceEventType.LEFT_CLICK);
+
+
+
+ handler.setInputAction(function (movement) {
+ var feature = viewer.scene.pick(movement.position);
+ if (!Cesium.defined(feature)) {
+ return;
+ }
+ var action = viewModel.rightClickAction;
+ action === 'properties'
+ printProperties(movement, feature)
+ }, Cesium.ScreenSpaceEventType.RIGHT_CLICK);
+
+
+ function printProperties(movement, feature) {
+ console.log('Properties:');
+ var propertyNames = feature.getPropertyNames();
+ var length = propertyNames.length;
+ for (var i = 0; i < length; ++i) {
+ var propertyName = propertyNames[i];
+ if (propertyName == 'gmlIdALKISLageBezeichnung_1' ||
+ propertyName == 'gmlIdALKISLageBezeichnung_2' ||
+ propertyName == 'gmlIdALKISLageBezeichnung_3' ||
+ propertyName == 'gmlIdALKISLageBezeichnung_4' ||
+ propertyName == 'gmlIdALKISLageBezeichnung_5' ||
+ propertyName == 'gmlIdALKISLageBezeichnung_6')
+ console.log(' ' + propertyName + ': ' + 'zensiert');
+ else
+ console.log(' ' + propertyName + ': ' + feature.getProperty(propertyName));
+ }
+
+ // Evaluate feature description
+ //console.log('Description : ' + tileset.style.meta.description.evaluate(scene.frameState, feature));
+ }
+
+ handler.setInputAction(function (movement) {
+ var feature = viewer.scene.pick(movement.position);
+ if (!Cesium.defined(feature)) {
+ return;
+ }
+
+ var action = viewModel.middleClickAction;
+ if (action === 'hide') {
+ feature.show = false;
+ }
+ }, Cesium.ScreenSpaceEventType.MIDDLE_CLICK);
+
+
+
+ /*
+ return Cesium.when(tileset.readyPromise).then(function (tileset) {
+ tileset.style = new Cesium.Cesium3DTileStyle({
+
+ color: {
+
+ conditions: [
+
+
+ ["${Latitude} >= 48.8170", "color('purple', 0.5)"],
+
+ ["${Latitude} >= 48.7950", "color('red')"],
+
+ ["${Latitude} >= 48.7830", "color('orange')"],
+
+ ["${Latitude} >= 48.7710", "color('yellow')"],
+
+ ["${Latitude} >= 48.7690", "color('lime')"],
+
+ ["${Latitude} >= 48.7570", "color('cyan')"],
+
+ ["${Latitude} >= 48.7470", "color('CORNFLOWERBLUE')"],
+
+ ["${Latitude} >= 48.7370", "color('DARKMAGENTA')"],
+
+ ["true", "color('lightblue')"]
+
+ ]
+
+ }
+
+ });
+ });
+*/
+
+function showLegend() {
+ $("#legend").css("display", "block");
+}
+function hideLegend() {
+ $("#legend").css("display", "none");
+}
+
+// Legend - Colour Table
+function emptyColourTable() {
+ $(".inner").empty();
+}
+
+/*
+function setHeightTable() {
+ $(".inner").append( "" +
+ " | 113007 |
" +
+ " | 113001 |
" +
+ " | 112996 |
" +
+ " | 112991 |
" +
+ " | 112986 |
" +
+ " | 112981 |
" +
+ " | 112976 |
" +
+ "
" );
+}
+*/
+
+/*
+function setHeightTable() {
+ $(".inner").append( "" +
+ " | x |
" +
+ " | y |
" +
+ " | z |
" +
+ "
" );
+}
+*/
+
+
+function setHeightTable() {
+ $(".inner").append( "" +
+ " | >30 |
" +
+ " | 24 |
" +
+ " | 18 |
" +
+ " | 12 |
" +
+ " | 6 |
" +
+ " | 0 |
" +
+ "
" );
+}
+
+ // return Cesium.when(target_tileset.readyPromise).then(function (target_tileset) {
+ // target_tileset.style = new Cesium.Cesium3DTileStyle({
+
+ // color: "color('black',1)",
+
+ // /*color: {
+
+ // conditions: [
+
+
+
+ // ['Number(${MeasuredHeight}) >= 40', 'rgb(255,0,0)'],
+
+ // ['Number(${MeasuredHeight}) >= 30.', 'rgb(255, 93 , 0)'],
+
+ // ['Number(${MeasuredHeight}) >= 25', 'rgb(255, 180, 0)'],
+
+ // ['Number(${MeasuredHeight}) >= 20', 'rgb(255,255,0)'],
+
+ // ['Number(${MeasuredHeight}) >= 15', 'rgb(0,255,0)'],
+
+ // ['Number(${MeasuredHeight}) >= 10', 'rgb(0,0,255)'],
+
+ // ['Number(${MeasuredHeight}) >= 7.5', 'rgb(75, 0, 130)'],
+
+ // ['Number(${MeasuredHeight}) >= 4', 'rgb(248, 100, 221)'],
+
+ // ['Number(${MeasuredHeight}) >= 0.1', 'rgb(248, 100, 221)'],
+
+ // ['true', 'color("lightblue")']
+
+ // ]
+
+ // }
+ // */
+
+ // });
+ // showLegend();
+ // setHeightTable();
+ // });
+
+ /*
+ return Cesium.when(tileset.readyPromise).then(function (tileset) {
+ tileset.style = new Cesium.Cesium3DTileStyle({
+
+ color: {
+
+ conditions: [
+
+ ['Number(${YearOfConstruction}) >= 2015', 'rgb(127,201,127)'],
+
+ ['Number(${YearOfConstruction}) >= 2005', 'rgb(190,174,212)'],
+
+ ['Number(${YearOfConstruction}) >= 1990', 'rgb(253,192,134)'],
+
+ ['Number(${YearOfConstruction}) >= 1975', 'rgb(255,255,153)'],
+
+ ['Number(${YearOfConstruction}) >= 1950', 'rgb(56,108,176)'],
+
+ ['Number(${YearOfConstruction}) >= 1920', 'rgb(240,2,127)'],
+
+ ['Number(${YearOfConstruction}) >= 1900', 'rgb(191,91,23)'],
+
+ ['Number(${YearOfConstruction}) >= 1800', 'rgb(102,102,102)'],
+
+ ['true', 'color("lightblue")']
+
+ ]
+
+ }
+
+ });
+ }); */
+
+});
\ No newline at end of file
diff --git a/public/circularData.html b/public/circularData.html
new file mode 100644
index 0000000000000000000000000000000000000000..a75ab0bdcedf309079532c3b4b44576499720828
--- /dev/null
+++ b/public/circularData.html
@@ -0,0 +1,63 @@
+
+
+
+
+
+
+
+
+
+
+ Stuttgart
+
+
+
+
+
+
+
+
+
+
+
+
+
+ TP2.4 - Prototyp 4: Webbasierte Visualisierung von CFD Simulationsdaten
+
+
+
+
+
+
+
+
+
+
+ Pressure (Pa) |
+ |
+
+
+ |
+ - 113006 - 112976 |
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file