In this sample we load a scene containing a building with detailed information and show how to filter specific features in a BuildingSceneLayer using BuildingFilter.

The BuildingFilter class defines a set of conditions that can be used to show or hide specific features of a BuildingSceneLayer in a scene. For example, if you want to see only parts of a building that are on the second level, you can define a BuildingFilterBlock to only show features at that level. The filterExpression determines which features are visible. The filterMode defines how features are drawn when the filter is activated by assigning its id to BuildingSceneLayer.activeFilterId.

const buildingFilter = new BuildingFilter({
  filterBlocks: [{
    // an SQL expression that filters using the BldgLevel field
    filterExpression: "BldgLevel = 3",
    filterMode: {
      type: "wire-frame",
      edges: {
         type: "solid",
         color: [0, 0, 0, 0.8]
      }
    }
  }]
});
// set the filter in the filters array on the layer
buildingLayer.filters = [buildingFilter];
// specify which filter is the one that should be applied
buildingLayer.activeFilterId = buildingFilter.id;

In our case, the sample code creates a BuildingFilter with two BuildingFilterBlocks:

• one block shows the user-selected level range in solid mode
• a second block applies the inverted expression (levels not matching the selected range) and draws them using the selected mode (e.g. x-ray, wire-frame or hidden)

Note: If hidden is selected, the second filter block is not added to the BuildingFilter. In that case, only features within the level range defined by the slider are included by the filter, and features outside the range are not drawn.

const levelModelName = "bldglevel";

const levelsFilter = new BuildingFilter({
  filterBlocks: [
    {
      // Show only features in the selected range
      filterExpression: `(${levelModelName} >= ${min} AND ${levelModelName} <= ${max})`,
      filterMode: { type: "solid" }
    },
    {
      // Draw features below or above the selected range with a different style
      filterExpression: `(${levelModelName} < ${min} AND ${levelModelName} > ${max})`,
      filterMode: { type: "x-ray" } // or "solid" / "wire-frame"
    }
  ]
});

In addition to the customizable filtering approach shown in this sample, our Filter BuildingSceneLayer with Building Explorer sample demonstrates how to filter features in a BuildingSceneLayer using the Building Explorer component.

Another way to explore a BuildingSceneLayer is by using the Slice component. See the BuildingSceneLayer with Slice component sample to understand how it works.