$(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: 2 })
);
// 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),
// })
// );
const buildingHeightOffset = 55; //53
///////////////////// STOECKACH LOD 1
var stoeckach = viewer.scene.primitives.add(new Cesium.Cesium3DTileset({
url: 'buildingTiles/StoeckachLOD1/tileset.json',
show: true
}));
stoeckach.readyPromise.then(function (stoeckach) {
var R = 0; // roll
var P = 0; // pitch
var Yaw = 0; // yaw
var height = buildingHeightOffset - 1;
var cartographic = Cesium.Cartographic.fromCartesian(stoeckach.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));
stoeckach.modelMatrix = Cesium.Matrix4.fromRotationTranslation(rotation,translation);
return zoomAll(stoeckach);
});
stoeckach.readyPromise.then(function(stoeckach){
stoeckach.style = new Cesium.Cesium3DTileStyle({
color: "color('white',1)",
})
});
///////////////////////////// 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 = 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());
//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('red',0.9)",
})
});
// ///////////////////////////// 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.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();
});
}
//////////////////////////////////////////
//////////////////////////////////////////
// load streamline data from text file and parse it to polyline with multiple colors.
var pos = [];
var cols = [];
var streamID = [];
var Velocity = [];
var pt_to_pt_dist = [];
var avgVelocity = [];
function get_date_time_dt(deltaTime) {
// deltaTime should be given in SECONDS and is then converted to milliseconds
// set deltaTime to 0 if you want to get current date and time
// set to +60000 to get date and time of 60 seconds = 60000 milliseconds in the future
return (currentdate = new Date(
new Date().getTime() + deltaTime * 1000
).toISOString());
}
d3.dsv(",", "results/Kirchturm2.csv").then(function (text) {
const particleDuration = 70; // units in seconds the particle / point should take to move from start to finish
//define the czml structure
var particle_czml = [
{
id: "document",
name: "CZML Point - Time Dynamic",
version: "1.0",
clock: {
interval: get_date_time_dt(0) + "/" + get_date_time_dt(particleDuration), // This is the time range of our simulation
currentTime: '', // This is the time associated with the start view
currentTime: get_date_time_dt(0),
multiplier: 5,
// range: 'LOOP_STOP',
}
},
{
id: "point",
availability: get_date_time_dt(0) + "/" + get_date_time_dt(particleDuration),
position: {
epoch: get_date_time_dt(0),
cartographicDegrees: [
// use 4 coordinates / values : (t,x,y,z) or rather (t,lon,lat,alt)
],
//"interpolationAlgorithm": "LAGRANGE",
//"interpolationDegree": 1
},
point: {
color: {
rgba: [0, 0, 0, 250],
},
outlineColor: {
rgba: [255, 0, 0, 128],
},
outlineWidth: 1,
pixelSize: 6,
},
},
];
//////////////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////////////////
let package_time_faktor = 6.0;
// create an array of deep copies of the original czml data structure, to be modified below.
let czmlArr = [];
for (c=0; c < package_time_faktor; c++){
czmlArr.push(JSON.parse(JSON.stringify(particle_czml)));
czmlArr[c][1].id = "point_arr_" + String(c);
}
var temp = text;
for (var i = 0; i < temp.length; i++) {
// use i+=7 when parsed as d3.text(...)
pos.push([
parseFloat(text[i].x),
parseFloat(text[i].y),
parseFloat(text[i].z),
]);
cols.push([
parseInt(text[i].R),
parseInt(text[i].G),
parseInt(text[i].B),
]);
streamID.push(parseInt(text[i].ID));
Velocity.push(parseFloat(text[i].velocity));
avgVelocity.push(parseFloat(text[i].AverageVelocity));
pt_to_pt_dist.push(parseFloat(text[i].pt_to_pt_dist));
// use these lines if parsed as text. i.e. using d3.text(...)
//pos.push([parseFloat(temp[i+0]), parseFloat(temp[i+1]), parseFloat(temp[i+2])]);
//colors.push([parseFloat(temp[i+3]),parseFloat(temp[i+4]),parseFloat(temp[i+5])])
//streamID.push([parseFloat(temp[i+6])]);
}
const maxID = streamID.reduce(function (a, b) {
return Math.max(a, b);
});
//find out the unique ids within the streamID array
const uniqueStreamID = Array.from(new Set(streamID)); // const uniqueStreamID = [...new Set(streamID)]; // same can be done with spread operator
//get index of each unique id, first element of those
let sIDidx = [];
for (var i = 0; i <= maxID; i++) {
var tmpIdx = streamID.indexOf(i);
if (tmpIdx !== -1) sIDidx.push(tmpIdx);
}
/////////////////////////////////////////////////
// Create and draw a polyline with per vertex colors
/////////////////////////////////////////////////
const heightOffset = 70;
for (var line = 0; line < uniqueStreamID.length; line++) {
let positions = [];
let positionsInDegrees = [];
let colors = [];
let individual_particle_velo = [];
let individual_particle_pt_distance = [];
let individual_particle_avg_velo = [];
curr_pos = sIDidx[line];
for (i = curr_pos; i < streamID.length; ++i) {
if (line === streamID[i]){
positions.push(
Cesium.Cartesian3.fromDegrees(
pos[i][0],
pos[i][1],
pos[i][2] + heightOffset
)
);
positionsInDegrees.push([
pos[i][0],
pos[i][1],
pos[i][2] + heightOffset,
]);
colors.push(
Cesium.Color.fromBytes(cols[i][0], cols[i][1], cols[i][2], 180)
);
individual_particle_avg_velo.push(avgVelocity[i]);
individual_particle_pt_distance.push(pt_to_pt_dist[i]);
individual_particle_velo.push(Velocity[i]);
} // if end brace
}
// For per segment coloring, supply the colors option with
// an array of colors for each vertex. Also set the
// colorsPerVertex option to true.
viewer.scene.primitives.add(
new Cesium.Primitive({
geometryInstances: new Cesium.GeometryInstance({
geometry: new Cesium.PolylineGeometry({
positions: positions,
width: 5.0,
vertexFormat: Cesium.PolylineColorAppearance.VERTEX_FORMAT,
colors: colors,
colorsPerVertex: true,
}),
}),
appearance: new Cesium.PolylineColorAppearance(),
})
);
////////////////////////////////////////////////
// Create and prepare particles for movement
/////////////////////////////////////////////////
let streamDist = individual_particle_pt_distance.reduce(function (a, b) {
return a + b;
}, 0);
// console.log(streamDist);
let t = 0;
let dt = (individual_particle_pt_distance[1] / individual_particle_avg_velo[0]) / 20;
// let dt = streamDist / individual_particle_avg_velo[0] / 500;
/////////////////////////////////////
var temp_pos = [];
for (i = 0; i < positionsInDegrees.length; i++) {
if (i === 0) {
temp_pos.push(
0,
positionsInDegrees[i][0],
positionsInDegrees[i][1],
positionsInDegrees[i][2]
);
} else {
temp_pos.push(
t,
positionsInDegrees[i][0],
positionsInDegrees[i][1],
positionsInDegrees[i][2]
);
dt = individual_particle_pt_distance[i] /individual_particle_avg_velo[0] / 20; // avg_velo is always the same per streamline
// console.log(individual_particle_pt_distance[i] + "/" + individual_particle_avg_velo[i] );
// console.log(dt);
}
t += dt;
}
particle_czml[1].id = "point" + String(line);
particle_czml[1].position.cartographicDegrees = temp_pos;
viewer.dataSources.add(Cesium.CzmlDataSource.load(particle_czml));
////////////////////////////////////////////////
dt = (individual_particle_pt_distance[1] / individual_particle_avg_velo[0]) / 20;
for (c=0; c < czmlArr.length ; c++){
temp_pos = [];
for (i = 0; i < positionsInDegrees.length; i++) {
if (i === 0) {
temp_pos.push(
t,
positionsInDegrees[i][0],
positionsInDegrees[i][1],
positionsInDegrees[i][2]
);
} else {
temp_pos.push(
t,
positionsInDegrees[i][0],
positionsInDegrees[i][1],
positionsInDegrees[i][2]
);
dt = individual_particle_pt_distance[i] /individual_particle_avg_velo[0] / 20;
// console.log(individual_particle_pt_distance[i] + "/" + individual_particle_avg_velo[i] );
// console.log(dt);
}
t += dt;
}
czmlArr[c][1].position.cartographicDegrees = temp_pos;
czmlArr[c][1].id = "point_set_" + String(c) + "_" + String(line);
czmlArr[c][1].position.epoch = get_date_time_dt(0);
viewer.dataSources.add(Cesium.CzmlDataSource.load(czmlArr[c]));
}
} // end bracket for: for (var line = 0; line < uniqueStreamID.length; line++) {
}); // end bracket for: d3.dsv(...).then(...
// 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")']
]
}
});
}); */
});