Commit cf0e6357 authored by Sven Schneider's avatar Sven Schneider
Browse files

made some change requests from Martina regarding text on main page and using...

made some change requests from Martina regarding text on main page and using the Stoeckach Lod1 instead of OSM Building layer
parent 6588d258
$(function () { $(function () {
Cesium.Ion.defaultAccessToken = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiI5ODI4ZTYyZS1mMTg2LTQ5NGEtYjdiOS02ODg2NzVhNjc0MTAiLCJpZCI6MjkwNCwiaWF0IjoxNTM1MTA5OTAzfQ.kyDX_0ScvJBkYnvXI0DW5NfZbiaRL5ezwtAUhxYnk1Y'; Cesium.Ion.defaultAccessToken =
"eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiI5ODI4ZTYyZS1mMTg2LTQ5NGEtYjdiOS02ODg2NzVhNjc0MTAiLCJpZCI6MjkwNCwiaWF0IjoxNTM1MTA5OTAzfQ.kyDX_0ScvJBkYnvXI0DW5NfZbiaRL5ezwtAUhxYnk1Y";
var imageryViewModels = [];
imageryViewModels.push(new Cesium.ProviderViewModel({ var imageryViewModels = [];
name: 'Sentinel-2', imageryViewModels.push(
iconUrl: Cesium.buildModuleUrl('Widgets/Images/ImageryProviders/sentinel-2.png'), new Cesium.ProviderViewModel({
tooltip: 'Sentinel-2 cloudless.', name: "Sentinel-2",
creationFunction: function () { iconUrl: Cesium.buildModuleUrl(
return new Cesium.IonImageryProvider({ assetId: 3954 }); "Widgets/Images/ImageryProviders/sentinel-2.png"
} ),
})); tooltip: "Sentinel-2 cloudless.",
creationFunction: function () {
imageryViewModels.push(new Cesium.ProviderViewModel({ return new Cesium.IonImageryProvider({ assetId: 3954 });
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 }); imageryViewModels.push(
} new Cesium.ProviderViewModel({
})); name: "Blue Marble",
iconUrl: Cesium.buildModuleUrl(
var viewer = new Cesium.Viewer('cesiumContainer', "Widgets/Images/ImageryProviders/blueMarble.png"
{ ),
imageryProvider: new Cesium.IonImageryProvider({ assetId: 3954 }), tooltip: "Blue Marble Next Generation July, 2004 imagery from NASA.",
creationFunction: function () {
terrainProvider : new Cesium.CesiumTerrainProvider({ return new Cesium.IonImageryProvider({ assetId: 3845 });
url: Cesium.IonResource.fromAssetId(1) },
}), })
scene3DOnly: false, );
shouldAnimate: true,
animation: true, var viewer = new Cesium.Viewer("cesiumContainer", {
infoBox: true, imageryProvider: new Cesium.IonImageryProvider({ assetId: 3954 }),
baseLayerPicker: true,
fullscreenButton: false, terrainProvider: new Cesium.CesiumTerrainProvider({
timeline: false, url: Cesium.IonResource.fromAssetId(1),
navigationHelpButton: true, }),
navigationInstructionsInitiallyVisible: false, scene3DOnly: false,
homeButton: false, shouldAnimate: true,
selectionIndicator: true, animation: true,
geocoder: true, infoBox: true,
// imageryProviderViewModels: imageryViewModels baseLayerPicker: true,
}); fullscreenButton: false,
timeline: false,
var layer = viewer.imageryLayers.addImageryProvider( navigationHelpButton: true,
new Cesium.IonImageryProvider({ assetId: 2 }) navigationInstructionsInitiallyVisible: false,
); homeButton: false,
selectionIndicator: true,
// var imageryLayer = viewer.imageryLayers.addImageryProvider( geocoder: true,
// new Cesium.IonImageryProvider({ assetId: 3954 }) // imageryProviderViewModels: imageryViewModels
// ); });
var layer = viewer.imageryLayers.addImageryProvider(
var canvas = viewer.canvas; new Cesium.IonImageryProvider({ assetId: 2 })
canvas.setAttribute('tabindex', '0'); // needed to put focus on the canvas );
canvas.addEventListener('click', function() {
canvas.focus(); // var imageryLayer = viewer.imageryLayers.addImageryProvider(
}); // new Cesium.IonImageryProvider({ assetId: 3954 })
canvas.focus(); // );
var scene = viewer.scene;
var canvas = viewer.canvas;
var osmBuildings = viewer.scene.primitives.add( canvas.setAttribute("tabindex", "0"); // needed to put focus on the canvas
new Cesium.Cesium3DTileset({ canvas.addEventListener("click", function () {
url: Cesium.IonResource.fromAssetId(96188), canvas.focus();
}) });
); canvas.focus();
var scene = viewer.scene;
const buildingHeightOffset = 60; //53
///////////////////// STOECKACH LOD 1 // viewer.scene.globe.depthTestAgainstTerrain = false;
// var stoeckach = viewer.scene.primitives.add(new Cesium.Cesium3DTileset({ // var osmBuildings = Cesium.createOsmBuildings();
// url: 'buildingTiles/StoeckachLOD1/tileset.json', // osmBuildings.readyPromise
// show: true // .then(function (osmBuildings) {
// })); // viewer.scene.primitives.add(osmBuildings);
// })
// .otherwise(function (error) {
// console.log(error);
// stoeckach.readyPromise.then(function (stoeckach) { // });
// var R = 0; // roll // osmBuildings.readyPromise.then(function (osmBuildings) {
// var P = 0; // pitch // var height = 60;
// var Yaw = 0; // yaw // var cartographic = Cesium.Cartographic.fromCartesian(
// var height = buildingHeightOffset; // osmBuildings.boundingSphere.center
// var cartographic = Cesium.Cartographic.fromCartesian(stoeckach.boundingSphere.center); // );
// var surface = Cesium.Cartesian3.fromRadians(cartographic.longitude, cartographic.latitude, 0.0); // var surface = Cesium.Cartesian3.fromRadians(
// var offset = Cesium.Cartesian3.fromRadians(cartographic.longitude, cartographic.latitude, height); // cartographic.longitude,
// var translation = Cesium.Cartesian3.subtract(offset, surface, new Cesium.Cartesian3()); // cartographic.latitude,
// 0.0
// //var rotMat = new Cesium.Matrix3(); // );
// var rotation = new Cesium.Matrix3.fromHeadingPitchRoll(new Cesium.HeadingPitchRoll(Yaw, P, R)); // var offset = Cesium.Cartesian3.fromRadians(
// cartographic.longitude,
// stoeckach.modelMatrix = Cesium.Matrix4.fromRotationTranslation(rotation,translation); // cartographic.latitude,
// height
// );
// return zoomAll(stoeckach); // var translation = Cesium.Cartesian3.subtract(
// }); // offset,
// surface,
// stoeckach.readyPromise.then(function(stoeckach){ // new Cesium.Cartesian3()
// stoeckach.style = new Cesium.Cesium3DTileStyle({ // );
// color: "color('white',0.5)",
// }) // osmBuildings.modelMatrix = Cesium.Matrix4.fromTranslation(translation);
// });
// });
// viewer.terrainProvider = new Cesium.CesiumTerrainProvider({
///////////////////////////// Target ////////////////////////// // url: Cesium.IonResource.fromAssetId(1)
// })
var target_tileset = viewer.scene.primitives.add(new Cesium.Cesium3DTileset({
url: 'buildingTiles/circularTiles/target_black/tileset.json', const buildingHeightOffset = 60; //53
show: true
}));
// --------------------------------------------------------------------
target_tileset.readyPromise.then(function (target_tileset) { var relativeHeight = 0.0;
var scale = 1.5
var R = 0; // roll
var P = 0; // pitch function getEastNorthUpTransform(tileset, relativeHeight) {
var Yaw = 0; // yaw var origin = tileset.boundingSphere.center;
var height = buildingHeightOffset; var cartographic = Cesium.Cartographic.fromCartesian(origin);
var cartographic = Cesium.Cartographic.fromCartesian(target_tileset.boundingSphere.center); cartographic.height = relativeHeight;
var surface = Cesium.Cartesian3.fromRadians(cartographic.longitude, cartographic.latitude, 0.0); origin = Cesium.Cartographic.toCartesian(cartographic);
var offset = Cesium.Cartesian3.fromRadians(cartographic.longitude, cartographic.latitude, height); var enu = Cesium.Transforms.eastNorthUpToFixedFrame(origin);
var translation = Cesium.Cartesian3.subtract(offset, surface, new Cesium.Cartesian3()); return enu;
}
//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 = buildingHeightOffset;
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 = buildingHeightOffset;
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({ function getScaleTransform(tileset, scale, relativeHeight) {
url: 'buildingTiles/circularTiles/L3_green/tileset.json', var toGlobal = getEastNorthUpTransform(tileset, relativeHeight);
show: true, var toLocal = Cesium.Matrix4.inverse(toGlobal, new Cesium.Matrix4());
var localScale = new Cesium.Cartesian3(scale, scale, scale);
})); var localScaleMatrix = Cesium.Matrix4.fromScale(localScale);
var transform = Cesium.Matrix4.multiply(toGlobal, Cesium.Matrix4.multiply(localScaleMatrix, toLocal, new Cesium.Matrix4()), new Cesium.Matrix4());
return transform;
}
L3.readyPromise.then(function (L3) {
return zoomAll(L3);
});
L3.readyPromise.then(function (L3) {
//////////////////////////////////////////////////////////////////////
///////////////////////////// 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 height = buildingHeightOffset;
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()
);
target_tileset.modelMatrix = Cesium.Matrix4.fromTranslation(
translation
);
});
target_tileset.readyPromise.then(function (target_tileset) {
target_tileset.style = new Cesium.Cesium3DTileStyle({
color: "color('black',0.5)",
});
});
// target_tileset.root.transform = getScaleTransform(target_tileset, scale, relativeHeight);
///////////////////////////// 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 = buildingHeightOffset;
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 = buildingHeightOffset;
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 = buildingHeightOffset;
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 = buildingHeightOffset;
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.