//$(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: true, timeline: false, navigationHelpButton: true, navigationInstructionsInitiallyVisible: false, homeButton: false, selectionIndicator: true, geocoder: true, // imageryProviderViewModels: imageryViewModels }); var imageryLayer = viewer.imageryLayers.addImageryProvider( new Cesium.IonImageryProvider({ assetId: 3954 }) ); //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// var tileset = viewer.scene.primitives.add(new Cesium.Cesium3DTileset({ url: 'buildingTiles/Essen/tileset.json', show: true })); tileset.readyPromise.then(function (tileset){ // set tileset height var height = 49; var cartographic = Cesium.Cartographic.fromCartesian(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()); tileset.modelMatrix = Cesium.Matrix4.fromTranslation(translation); return zoomAll(tileset); }); tileset.style = new Cesium.Cesium3DTileStyle({ color: 'color("darkgray")' }); ////////////////////////////////////////////////////////////////// var pointCloud = viewer.scene.primitives.add(new Cesium.Cesium3DTileset({ url: 'results/EssenPointCloud/tileset.json', show: true })); pointCloud.readyPromise.then(function (pointCloud) { var height = -119; var cartographic = Cesium.Cartographic.fromCartesian(pointCloud.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()); pointCloud.modelMatrix = Cesium.Matrix4.fromTranslation(translation); return zoomAll(pointCloud); }); //pointCloud.style = new Cesium.Cesium3DTileStyle({ // color: "color('gray')" }); //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// var pcHull = viewer.scene.primitives.add(new Cesium.Cesium3DTileset({ url: 'results/EssenPCHull/tileset.json', show: true })); pcHull.readyPromise.then(function (pcHull) { var height = -118.3; var cartographic = Cesium.Cartographic.fromCartesian(pcHull.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 v = [0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, translation["x"], translation["y"],translation["z"], 1.0]; pcHull.modelMatrix = Cesium.Matrix4.fromTranslation(translation); return zoomAll(pcHull); }); pcHull.style = new Cesium.Cesium3DTileStyle({ color: "color('yellow')", pointSize: 2 }); ////////////////////////////////////////////////////////////////// ////////////////////////////////////////////////////////////////// var pcBBox = viewer.scene.primitives.add(new Cesium.Cesium3DTileset({ url: 'results/EssenPCBbox/tileset.json', maximumScreenSpaceError: 2 , show: false })); pcBBox.readyPromise.then(function (pcBBoxl) { var height = -118.3; var cartographic = Cesium.Cartographic.fromCartesian(pcBBox.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()); pcbBBox.modelMatrix = Cesium.Matrix4.fromTranslation(translation); return zoomAll(pcBBox); }); pcBBox.style = new Cesium.Cesium3DTileStyle({ color: "color('red')" }); //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// var pcWindows = viewer.scene.primitives.add(new Cesium.Cesium3DTileset({ url: 'results/EssenPCWindows/tileset.json', maximumScreenSpaceError: 2 , show: true })); pcWindows.readyPromise.then(function (pcWindows) { var height = -118.3; var cartographic = Cesium.Cartographic.fromCartesian(pcWindows.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 v = [0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, translation["x"], translation["y"],translation["z"], 1.0]; pcWindows.modelMatrix = Cesium.Matrix4.fromTranslation(translation); return zoomAll(pcWindows); }); pcWindows.style = new Cesium.Cesium3DTileStyle({ color: "color('red')" , pointSize: 3 }); //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// /////////////////////////////////////////////////////// var TurnOnPC = function () { pointCloud.show = true; } var TurnOffPC = function () { pointCloud.show = false; } /////////////////////////////////////////////////////// var TurnOnPCHull = function () { pcHull.show = true; } var TurnOffPCHull = function () { pcHull.show = false; } /////////////////////////////////////////////////////// var TurnOnPCWindows = function () { pcWindows.show = true; } var TurnOffPCWindows = function () { pcWindows.show = false; } /////////////////////////////////////////////////////// /////////////////////////////////////////////////////// var TurnOnEssen3dT = function () { tileset.show = true; } var TurnOffEssen3dT = function () { tileset.show = false; } ////////////////////////////////////////////////////// /* var terrainProvider = new new Cesium.CesiumTerrainProvider({ url: Cesium.IonResource.fromAssetId(1), requestVertexNormals: true ); viewer.terrainProvider = terrainProvider; */ /* var terrainProvider = new Cesium.CesiumTerrainProvider({ url: 'https://assets.agi.com/stk-terrain/v1/tilesets/world/tiles', requestWaterMask: true, // required for water effects requestVertexNormals: true // required for terrain lighting }); viewer.terrainProvider = terrainProvider; */ viewer.scene.globe.enableLighting = true; // set lighting to true var zoomAll = function (pointCloud) { return new Promise(function (resolve, reject) { if (!pointCloud) { reject("Tileset is undifined"); } viewer.camera.viewBoundingSphere(pointCloud.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') + '
AbsoluteHoehe (m)' + pickedFeature.getProperty('AbsoluteHoehe') + '
Lon' + pickedFeature.getProperty('Longitude') + '
Lat' + pickedFeature.getProperty('Latitude') + '
GebaeudeHoehe (m)' + pickedFeature.getProperty('GebaeudeHoehe') + '
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') + '
'; }, 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); function showLegend() { $("#legend").css("display", "block"); } function hideLegend() { $("#legend").css("display", "none"); } // Legend - Colour Table function emptyColourTable() { $(".inner").empty(); } function setHeightTable() { $(".inner").append( "" + "" + "" + "" + "" + "" + "" + "" + "" + "" + "
     >= 40
25.1 - 30 m
20.1 - 25 m
15.1 - 20 m
10.1 - 15 m
7.6 - 10 m
4.1 - 7.5 m
0.1 - 4 m
no data
" ); } /* return Cesium.when(tileset.readyPromise).then(function (tileset) { tileset.style = new Cesium.Cesium3DTileStyle({ color: { conditions: [ ['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")'] ] } }); }); */ //});