CesiumGS · mramato · Jun 19, 2017 · Apr 13, 2017 · Apr 13, 2017 · Apr 13, 2017
diff --git a/Apps/Sandcastle/gallery/3D Tiles Batch Table Hierarchy.html b/Apps/Sandcastle/gallery/3D Tiles Batch Table Hierarchy.html
@@ -0,0 +1,227 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">  <!-- Use Chrome Frame in IE -->
+    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
+    <meta name="description" content="Demonstrates use cases for a batch table hierarchy.">
+    <meta name="cesium-sandcastle-labels" content="3D Tiles">
+    <title>Cesium Demo</title>
+    <script type="text/javascript" src="../Sandcastle-header.js"></script>
+    <script type="text/javascript" src="../../../ThirdParty/requirejs-2.1.20/require.js"></script>
+    <script type="text/javascript">
+    require.config({
+        baseUrl : '../../../Source',
+        waitSeconds : 60
+    });
+    </script>
+</head>
+<body class="sandcastle-loading" data-sandcastle-bucket="bucket-requirejs.html">
+<style>
+    @import url(../templates/bucket.css);
+    #toolbar button { display: block; }
+</style>
+<div id="cesiumContainer" class="fullSize"></div>
+<div id="loadingOverlay"><h1>Loading...</h1></div>
+<div id="toolbar"></div>
+<script id="cesium_sandcastle_script">
+function startup(Cesium) {
+    'use strict';
+//Sandcastle_Begin
+
+// In this demo doorknobs, doors, roofs, and walls are styled via the batch table hierarchy.
+// Since buildings and zones are not backed by geometry they are not styled directly. However
+// styles may be written that take building and zone properties into account.
+//
+// Hierarchy layout (doorknobs are children of doors):
+//
+//   zone0
+//     building0
+//       roof0
+//       wall0
+//       door0 - doorknob0
+//       door1 - doorknob1
+//       door2 - doorknob2
+//       door3 - doorknob3
+//     building1
+//       roof1
+//       wall1
+//       door4 - doorknob4
+//       door5 - doorknob5
+//       door6 - doorknob6
+//       door7 - doorknob7
+//     building2
+//       roof2
+//       wall2
+//       door8 - doorknob8
+//       door9 - doorknob9
+//       door10 - doorknob10
+//       door11 - doorknob11
+//
+// Class properties:
+//
+//   zone:
+//     * zone_building
+//     * zone_name
+//   building:
+//     * building_area
+//     * building_name
+//   wall:
+//     * wall_paint
+//     * wall_windows
+//     * wall_name
+//   roof:
+//     * roof_paint
+//     * roof_name
+//   door:
+//     * door_mass
+//     * door_width
+//     * door_name
+//   doorknob:
+//     * doorknob_size
+//     * doorknob_name
+
+var viewer = new Cesium.Viewer('cesiumContainer');
+viewer.extend(Cesium.viewerCesium3DTilesInspectorMixin);
+var inspectorViewModel = viewer.cesium3DTilesInspector.viewModel;
+
+viewer.clock.currentTime = new Cesium.JulianDate(2457522.154792);
+
+var scene = viewer.scene;
+var url = '../../../Specs/Data/Cesium3DTiles/Hierarchy/BatchTableHierarchy';
+var tileset = scene.primitives.add(new Cesium.Cesium3DTileset({
+    url : url
+}));
+inspectorViewModel.tileset = tileset;
+
+tileset.readyPromise.then(function() {
+    var boundingSphere = tileset.boundingSphere;
+    viewer.camera.viewBoundingSphere(boundingSphere, new Cesium.HeadingPitchRange(0.0, -0.3, 0.0));
+    viewer.camera.lookAtTransform(Cesium.Matrix4.IDENTITY);
+});
+
+var styles = [];
+function addStyle(name, style) {
+    styles.push({
+        name : name,
+        style : style
+    });
+}
+
+addStyle('No style', {});
+
+addStyle('Color by building', {
+    "color" : {
+        "conditions" : [
+            ["${building_name} === 'building0'", "color('purple')"],
+            ["${building_name} === 'building1'", "color('red')"],
+            ["${building_name} === 'building2'", "color('orange')"],
+            ["true", "color('blue')"]
+        ]
+    }
+});
+
+addStyle('Color all doors', {
+    "color" : {
+        "conditions" : [
+            ["isExactClass('door')", "color('orange')"],
+            ["true", "color('white')"]
+        ]
+    }
+});
+
+addStyle('Color all features derived from door', {
+    "color" : {
+        "conditions" : [
+            ["isClass('door')", "color('orange')"],
+            ["true", "color('white')"]
+        ]
+    }
+});
+
+addStyle('Color features by class name', {
+    "expressions" : {
+        "suffix" : "regExp('door(.*)').exec(getExactClassName())"
+    },
+    "color" : {
+        "conditions" : [
+            ["${suffix} === 'knob'", "color('yellow')"],
+            ["${suffix} === ''", "color('lime')"],
+            ["${suffix} === null", "color('gray')"],
+            ["true", "color('blue'"]
+        ]
+    }
+});
+
+addStyle('Style by height', {
+    "color" : {
+        "conditions" : [
+            ["${height} >= 10", "color('purple')"],
+            ["${height} >= 6", "color('red')"],
+            ["${height} >= 5", "color('orange')"],
+            ["true", "color('blue')"]
+        ]
+    }
+});
+
+function setStyle(style) {
+    return function() {
+        tileset.style = new Cesium.Cesium3DTileStyle(style);
+    };
+}
+
+var styleOptions = [];
+for (var i = 0; i < styles.length; ++i) {
+    var style = styles[i];
+    styleOptions.push({
+        text : style.name,
+        onselect : setStyle(style.style)
+    });
+}
+
+Sandcastle.addToolbarMenu(styleOptions);
+
+var handler = new Cesium.ScreenSpaceEventHandler(viewer.canvas);
+
+// When a feature is left clicked, print its class name and properties
+handler.setInputAction(function(movement) {
+    if (!inspectorViewModel.picking) {
+        return;
+    }
+
+    var feature = inspectorViewModel.feature;
+    if (Cesium.defined(feature)) {
+        console.log('Class: ' + feature.getExactClassName());
+        console.log('Properties:');
+        var propertyNames = feature.getPropertyNames();
+        var length = propertyNames.length;
+        for (var i = 0; i < length; ++i) {
+            var name = propertyNames[i];
+            var value = feature.getProperty(name);
+            console.log('  ' + name + ': ' + value);
+        }
+    }
+}, Cesium.ScreenSpaceEventType.LEFT_CLICK);
+
+// When a feature is middle clicked, hide it
+handler.setInputAction(function(movement) {
+    if (!inspectorViewModel.picking) {
+        return;
+    }
+
+    if (Cesium.defined(inspectorViewModel.feature)) {
+        inspectorViewModel.feature.show = false;
+    }
+}, Cesium.ScreenSpaceEventType.MIDDLE_CLICK);
+
+//Sandcastle_End
+Sandcastle.finishedLoading();
+}
+if (typeof Cesium !== "undefined") {
+    startup(Cesium);
+} else if (typeof require === "function") {
+    require(["Cesium"], startup);
+}
+</script>
+</body>
+</html>
diff --git a/Apps/Sandcastle/gallery/3D Tiles Batch Table Hierarchy.jpg b/Apps/Sandcastle/gallery/3D Tiles Batch Table Hierarchy.jpg