Skip to content

Commit

Permalink
Hide polylines when labels are hidden.
Browse files Browse the repository at this point in the history
  • Loading branch information
@bagnell
bagnell committed May 4, 2017
1 parent 7883f0b commit b1731c4
Show file tree
Hide file tree
Showing 2 changed files with 39 additions and 229 deletions.
261 changes: 32 additions & 229 deletions Apps/Sandcastle/gallery/3D Tiles.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -34,169 +34,56 @@
'use strict';
//Sandcastle_Begin

var viewer = new Cesium.Viewer('cesiumContainer', {
shadows : true
});

var cesiumTerrainProviderMeshes = new Cesium.CesiumTerrainProvider({
var viewer = new Cesium.Viewer('cesiumContainer');
viewer.terrainProvider = new Cesium.CesiumTerrainProvider({
url : 'https://assets.agi.com/stk-terrain/world',
requestWaterMask : true,
requestVertexNormals : true
});
viewer.terrainProvider = cesiumTerrainProviderMeshes;

viewer.scene.globe.depthTestAgainstTerrain = true;

viewer.extend(Cesium.viewerCesium3DTilesInspectorMixin);
var inspectorViewModel = viewer.cesium3DTilesInspector.viewModel;

viewer.scene.camera.setView({
var scene = viewer.scene;
scene.fog.enabled = false;
scene.globe.depthTestAgainstTerrain = true;

scene.camera.setView({
destination : new Cesium.Cartesian3(4401474.366791085, 580205.784567315, 4569699.393603603),
orientation : {
direction : new Cesium.Cartesian3(-0.4827023520286348, 0.8293835575592474, -0.2812851823263897),
up : new Cesium.Cartesian3(0.5280482156151897, 0.5318550203510545, 0.6620387596757412)
}
});

var scene = viewer.scene;
scene.fog.enabled = false;

var annotations = scene.primitives.add(new Cesium.LabelCollection());

var tileset;

var viewModel = {
tilesets: [
{
name: 'Tileset',
url: '../../../Specs/Data/Cesium3DTiles/Tilesets/Tileset/'
}, {
name: 'Translucent',
url: '../../../Specs/Data/Cesium3DTiles/Batched/BatchedTranslucent/'
}, {
name: 'Translucent/Opaque',
url: '../../../Specs/Data/Cesium3DTiles/Batched/BatchedTranslucentOpaqueMix/'
}, {
name: 'Multi-color',
url: '../../../Specs/Data/Cesium3DTiles/Batched/BatchedColors/'
}, {
name: 'Request Volume',
url: '../../../Specs/Data/Cesium3DTiles/Tilesets/TilesetWithViewerRequestVolume/'
}, {
name: 'Batched',
url: '../../../Specs/Data/Cesium3DTiles/Batched/BatchedWithBatchTable/'
}, {
name: 'Instanced',
url: '../../../Specs/Data/Cesium3DTiles/Instanced/InstancedWithBatchTable/'
}, {
name: 'Instanced/Orientation',
url: '../../../Specs/Data/Cesium3DTiles/Instanced/InstancedOrientation/'
}, {
name: 'Composite',
url: '../../../Specs/Data/Cesium3DTiles/Composite/Composite/'
}, {
name: 'PointCloud',
url: '../../../Specs/Data/Cesium3DTiles/PointCloud/PointCloudRGB/'
}, {
name: 'PointCloudConstantColor',
url: '../../../Specs/Data/Cesium3DTiles/PointCloud/PointCloudConstantColor/'
}, {
name: 'PointCloudNormals',
url: '../../../Specs/Data/Cesium3DTiles/PointCloud/PointCloudQuantizedOctEncoded/'
}, {
name: 'PointCloudBatched',
url: '../../../Specs/Data/Cesium3DTiles/PointCloud/PointCloudBatched/'
}
],
selectedTileset: undefined,
annotate: false
};

Cesium.knockout.track(viewModel);

var toolbar = document.getElementById('toolbar');
Cesium.knockout.applyBindings(viewModel, toolbar);

Cesium.knockout.getObservable(viewModel, 'selectedTileset').subscribe(function(options) {
if (Cesium.defined(tileset)) {
annotations.removeAll();
scene.primitives.remove(tileset);
}
if (!Cesium.defined(options)) {
inspectorViewModel.tileset = undefined;
return;
}
tileset = new Cesium.Cesium3DTileset({
url: options.url
});
inspectorViewModel.tileset = tileset;
scene.primitives.add(tileset);
tileset.readyPromise.then(function(tileset) {
/*
var boundingSphere = tileset.boundingSphere;
viewer.camera.viewBoundingSphere(boundingSphere, new Cesium.HeadingPitchRange(0, -2.0, 0));
viewer.camera.lookAtTransform(Cesium.Matrix4.IDENTITY);
var properties = tileset.properties;
if (Cesium.defined(properties) && Cesium.defined(properties.Height)) {
tileset.style = new Cesium.Cesium3DTileStyle({
color: {
conditions: [
["${Height} >= 83", "color('purple', 0.5)"],
["${Height} >= 80", "color('red')"],
["${Height} >= 70", "color('orange')"],
["${Height} >= 12", "color('yellow')"],
["${Height} >= 7", "color('lime')"],
["${Height} >= 1", "color('cyan')"],
["true", "color('blue')"]
]
},
meta: {
description: "'Building id ${id} has height ${Height}.'"
}
});
}
*/

tileset.style = new Cesium.Cesium3DTileStyle({
"color" : "rgb(100, 255, 190)",
"outlineColor" : "rgb(255, 0, 0)",
"outlineWidth" : "10",
"labelStyle" : "2",
"font" : "'50px cursive'",
"backgroundEnabled" : "true",
"scaleByDistanceNearRange" : "1000.0",
"scaleByDistanceNearValue" : "2.0",
"scaleByDistanceFarRange" : " 10000.0",
"scaleByDistanceFarValue" : "0.5",
"translucencyByDistanceNearRange" : "10000.0",
"translucencyByDistanceNearValue" : "1.0",
"translucencyByDistanceFarRange" : " 20000.0",
"translucencyByDistanceFarValue" : "0.1",
"distanceDisplayConditionNear" : "0",
"distanceDisplayConditionFar" : "30000.0"
});
var tileset = scene.primitives.add(new Cesium.Cesium3DTileset({
url: '../../../Specs/Data/Cesium3DTiles/Tilesets/Tileset/'
}));

tileset.readyPromise.then(function(tileset) {
tileset.style = new Cesium.Cesium3DTileStyle({
"color" : "rgb(100, 255, 190)",
"outlineColor" : "rgb(255, 0, 0)",
"outlineWidth" : "10",
"labelStyle" : "2",
"font" : "'50px cursive'",
"backgroundEnabled" : "true",
"scaleByDistanceNearRange" : "1000.0",
"scaleByDistanceNearValue" : "2.0",
"scaleByDistanceFarRange" : " 10000.0",
"scaleByDistanceFarValue" : "0.5",
"translucencyByDistanceNearRange" : "10000.0",
"translucencyByDistanceNearValue" : "1.0",
"translucencyByDistanceFarRange" : " 20000.0",
"translucencyByDistanceFarValue" : "0.1",
"distanceDisplayConditionNear" : "0",
"distanceDisplayConditionFar" : "30000.0"
});
});

viewModel.selectedTileset = viewModel.tilesets[0];

var canvas = viewer.canvas;
canvas.setAttribute('tabindex', '0'); // needed to put focus on the canvas
canvas.onclick = function() {
// To get key events
canvas.focus();
};

document.addEventListener('keyup', function(e) {
if (e.keyCode === 'W'.charCodeAt(0)) {
viewModel.annotate = !viewModel.annotate;
}
}, false);
var inspectorViewModel = viewer.cesium3DTilesInspector.viewModel;
inspectorViewModel.tileset = tileset;

var handler = new Cesium.ScreenSpaceEventHandler(viewer.canvas);

handler.setInputAction(function(movement) {
handler.setInputAction(function() {
var feature = inspectorViewModel.feature;
if (Cesium.defined(feature)) {
var properties = feature.primitive.properties; // get properties from tileset
Expand All @@ -217,90 +104,6 @@
}
}, Cesium.ScreenSpaceEventType.LEFT_CLICK);

handler.setInputAction(function(movement) {
if (viewModel.annotate) {
// Add annotation showing the height at the click location
annotate(movement);
} else {
// When a feature is right clicked, zoom to it
zoom(movement);
}
}, Cesium.ScreenSpaceEventType.RIGHT_CLICK);

//When a feature is double middle clicked, hide it
handler.setInputAction(function(movement) {
var feature = inspectorViewModel.feature;
if (Cesium.defined(feature)) {
feature.show = false;
}
}, Cesium.ScreenSpaceEventType.MIDDLE_CLICK);

function annotate(movement) {
if (Cesium.defined(inspectorViewModel.feature) && scene.pickPositionSupported) {
var cartesian = scene.pickPosition(movement.position);
var cartographic = Cesium.Cartographic.fromCartesian(cartesian);
var height = cartographic.height.toFixed(2) + ' m';

annotations.add({
position : cartesian,
text : height,
horizontalOrigin : Cesium.HorizontalOrigin.LEFT,
verticalOrigin : Cesium.VerticalOrigin.BOTTOM,
eyeOffset : new Cesium.Cartesian3(0.0, 0.0, -1.0)
});
}
}

function offsetFromHeadingPitchRange(heading, pitch, range) {
pitch = Cesium.Math.clamp(pitch, -Cesium.Math.PI_OVER_TWO, Cesium.Math.PI_OVER_TWO);
heading = Cesium.Math.zeroToTwoPi(heading) - Cesium.Math.PI_OVER_TWO;

var pitchQuat = Cesium.Quaternion.fromAxisAngle(Cesium.Cartesian3.UNIT_Y, -pitch);
var headingQuat = Cesium.Quaternion.fromAxisAngle(Cesium.Cartesian3.UNIT_Z, -heading);
var rotQuat = Cesium.Quaternion.multiply(headingQuat, pitchQuat, headingQuat);
var rotMatrix = Cesium.Matrix3.fromQuaternion(rotQuat);

var offset = Cesium.Cartesian3.clone(Cesium.Cartesian3.UNIT_X);
Cesium.Matrix3.multiplyByVector(rotMatrix, offset, offset);
Cesium.Cartesian3.negate(offset, offset);
Cesium.Cartesian3.multiplyByScalar(offset, range, offset);
return offset;
}

function zoom(movement) {
var feature = inspectorViewModel.feature;
if (Cesium.defined(feature)) {
var longitude = feature.getProperty('Longitude');
var latitude = feature.getProperty('Latitude');
var height = feature.getProperty('Height');

if (!Cesium.defined(longitude) || !Cesium.defined(latitude) || !Cesium.defined(height)) {
return;
}

var positionCartographic = new Cesium.Cartographic(longitude, latitude, height * 0.5);
var position = scene.globe.ellipsoid.cartographicToCartesian(positionCartographic);

var camera = scene.camera;
var heading = camera.heading;
var pitch = camera.pitch;

var offset = offsetFromHeadingPitchRange(heading, pitch, height * 2.0);

var transform = Cesium.Transforms.eastNorthUpToFixedFrame(position);
Cesium.Matrix4.multiplyByPoint(transform, offset, position);

camera.flyTo({
destination : position,
orientation : {
heading : heading,
pitch : pitch
},
easingFunction : Cesium.EasingFunction.QUADRATIC_OUT
});
}
}

//Sandcastle_End
Sandcastle.finishedLoading();
}
Expand Down
7 changes: 7 additions & 0 deletions Source/Scene/Cesium3DTileFeature.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -47,6 +47,7 @@ define([
this._content = content;
this._batchTable = content.batchTable;
this._labelCollection = content._labelCollection;
this._polylineCollection = content._polylineCollection;
this._batchId = batchId;
this._color = undefined; // for calling getColor

Expand Down Expand Up @@ -82,6 +83,8 @@ define([
if (defined(this._labelCollection)) {
var label = this._labelCollection.get(this._batchId);
label.show = value;
var polyline = this._polylineCollection.get(this._batchId);
polyline.show = value;
} else {
this._batchTable.setShow(this._batchId, value);
}
Expand Down Expand Up @@ -118,6 +121,8 @@ define([
if (defined(this._labelCollection)) {
var label = this._labelCollection.get(this._batchId);
label.fillColor = value;
var polyline = this._polylineCollection.get(this._batchId);
polyline.show = value.alpha > 0.0;
} else {
this._batchTable.setColor(this._batchId, value);
}
Expand Down Expand Up @@ -296,6 +301,8 @@ define([
if (defined(this._labelCollection)) {
var label = this._labelCollection.get(this._batchId);
label.distanceDisplayCondition = value;
var polyline = this._polylineCollection.get(this._batchId);
polyline.distanceDisplayCondition = value;
}
}
}
Expand Down

0 comments on commit b1731c4

Please sign in to comment.