Commit 3f9f0e68 authored by Sven Schneider's avatar Sven Schneider
Browse files

updated the 3d building model using the 3dtiles set from steinbeis, delivered via geovolume api

parent e819a054
No related merge requests found
Pipeline #5267 passed with stages
in 31 seconds
Showing with 49 additions and 55 deletions
+49 -55
......@@ -51,18 +51,11 @@
@import url(templates/bucket.css);
</style>
<!-- <header class="backdrop">
<h3> <img src="imgs/INSPIRER.svg" style="height:12%;width:8%;"> HFT Pointclouds Bld 1 & 3</h1>
</header> -->
<div id="cesiumContainer" class=""> </div>
<script src="HFT.js"></script>
<!-- <div id="toolbar">
</div> -->
<!--
<h2 class="" onclick="open3DCMO()" style="cursor:pointer; color:rgb(155, 0, 0)">
<strong><i class="fas fa-copy"></i> Menu</strong>
</h2> -->
<div class="backdrop mainbackdrop" id="DCMO" style="display:show">
<h2> Layer selection </h2>
<table>
......@@ -95,12 +88,7 @@
</table>
</div>
<!-- <div id="loadingOverlay">
<h1>Loading...</h1>
</div> -->
<script src="https://cpwebassets.codepen.io/assets/common/stopExecutionOnTimeout-1b93190375e9ccc259df3a57c1abc0e64599724ae30d7ea4c6877eb615f89387.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
......
......@@ -44,19 +44,57 @@ var zoomAll = function (tileset) {
//////////////////////////// load 3d building tiles or OSM 3d Buildings ///////////////////////
// here is the switch to switch between different 3d buildings
const LOAD_3DTILES = true;
if (LOAD_3DTILES) {
// load 3d Tile set of SToeckach.
var tileset = viewer.scene.primitives.add(
new Cesium.Cesium3DTileset({
url: Cesium.IonResource.fromAssetId(656401),
// var tileset = viewer.scene.primitives.add(
// new Cesium.Cesium3DTileset({
// url: "https://steinbeis-3dps.eu/3DGeoVolumes/collections/Stuttgart/HFTBuildings_3DModel_noTexture/3dtiles/tileset.json"//Cesium.IonResource.fromAssetId(656401),
// })
// );
var load3DTiles = function () {
tilesetLOD1 = viewer.scene.primitives.add(new Cesium.Cesium3DTileset({
url: "https://steinbeis-3dps.eu/3DGeoVolumes/collections/Stuttgart/HFTBuildings_3DModel_noTexture/3dtiles/tileset.json" //Cesium.IonResource.fromAssetId(656401),
}));
//
Cesium.when(tilesetLOD1.readyPromise).then(function (tilesetLOD1) {
viewer.flyTo(tilesetLOD1)
tilesetLOD1.style = new Cesium.Cesium3DTileStyle({
color: {
conditions: [
["${featureType} === 'Window'", "color('blue')"],
["${featureType} === 'WallSurface'", "color('gray')"],
["${featureType} === 'RoofSurface'", "color('red')"],
["${featureType} === 'OuterFloorSurface'", "color('white')"],
["true", "color('white')"],
],
},
show: true
});
// tilesetLOD1.style = new Cesium.Cesium3DTileStyle({
// color: "color('BLACK', 0.3)",
// show: true
// });
var heightOffset = 50.0;
var boundingSphere = tilesetLOD1.boundingSphere;
var cartographic = Cesium.Cartographic.fromCartesian(boundingSphere.center);
var surface = Cesium.Cartesian3.fromRadians(cartographic.longitude, cartographic.latitude, 0.0);
var offset = Cesium.Cartesian3.fromRadians(cartographic.longitude, cartographic.latitude, heightOffset);
var translation = Cesium.Cartesian3.subtract(offset, surface, new Cesium.Cartesian3());
tilesetLOD1.modelMatrix = Cesium.Matrix4.fromTranslation(translation);
})
);
}
load3DTiles()
//////// important value. to find the correct value trail and error is needed for a perfect fit
const BUILDIG_TILESET_HEIGHT_OFFSET = 54;
var tileset = tilesetLOD1
tileset.readyPromise.then(function (tileset) {
var height = BUILDIG_TILESET_HEIGHT_OFFSET;
var cartographic = Cesium.Cartographic.fromCartesian(
......@@ -82,40 +120,8 @@ if (LOAD_3DTILES) {
//return zoomAll(tileset); // zoom or rather go to the translated tileset
});
}
/////////////////////////////////////////////////////////////////////
// Alternatively, instead of using the Stoeckach LOD1 Building 3d Tiles,
// use OSM Buildings from Cesium ION assets - in this case set LOAD_3DTILES variable in Line 41 to 'false'
////////////////////////////////////////////////////////
else {
var osmBuildings = Cesium.createOsmBuildings();
osmBuildings.readyPromise
.then(function (osmBuildings) {
viewer.scene.primitives.add(osmBuildings);
})
.otherwise(function (error) {
console.log(error);
});
// now zoom to target and set camera view angle to some oblique angle: use '-Cesium.Math.PI_OVER_TWO' to look down nadir.
// if you use '+Cesium.Math.PI_OVER_TWO', you look into space.
viewer.camera.setView({
destination: Cesium.Cartesian3.fromDegrees(
9.172183958234173,
48.78029680030391,
20000
),
orientation: {
heading: 0.0,
pitch: -Cesium.Math.PI_OVER_TWO, // set an oblique viewing angle
roll: 0.0,
},
});
}
tileset.style = new Cesium.Cesium3DTileStyle({
show: true
});
////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////
......
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