# Filtering
All filtering functionality in the viewer is handled by the FilteringExtension
. In a nutshell you can:
- Hide/show objects
- Isolate/unisolate objects
- Color objects based on properties
All functions provided by the FilteringExtension
take object ids as a means to select objects for filtering.
Like any other extension you need to add it at initialisation time:
const filteringExtension = viewer.createExtension(FilteringExtension);
# Hiding and Showing
Let's say we want to hide all the walls of a model. First thing we need to do is to find out the ids of the walls we want to hide. Depending on the model, a wall object might mean different things, but let's consider a Revit example where a wall object has the RevitWall
speckle type.
const wallNodes = viewer.getWorldTree().findAll((node: TreeNode) => {
if (!node.model.raw.speckle_type) return;
return node.model.raw.speckle_type.includes("RevitWall");
});
const filteringState = filtering.hideObjects(
wallNodes.map((node: TreeNode) => node.model.id)
);
2
3
4
5
6
7
8
# Isolating and Unisolating
Similar to hiding, let's say we want to isolate all floors. Here's how:
const floorNodes = viewer.getWorldTree().findAll((node: TreeNode) => {
if (!node.model.raw.speckle_type) return;
return node.model.raw.speckle_type.includes("RevitFloor");
});
const filteringState = filtering.isolateObjects(
floorNodes.map((node: TreeNode) => node.model.id)
);
2
3
4
5
6
7
8
# Coloring by Properties
This filtering operation is different than the ones before as it involves the notion of properties
. The viewer needs PropertyInfo
objects in order to filter by color, but that's fine because there's a builtin way of getting them by using:
const properties: PropertyInfo[] = await viewer.getObjectProperties();
With properties available, we can now do some color filtering!
/** Find the 'level.name' property info*/
const propertyInfo: PropertyInfo = properties.find((value) => {
return value.key === "level.name";
}) as PropertyInfo;
const filteringState = filtering.setColorFilter(propertyInfo);
2
3
4
5
6
Filters can be combined to a certain extent, but as a general rule of thumb, any particular object in the scene will always look how its last filter (if any) told it to look.
You can run the example live here (opens new window) or