🎩 In almost all BIM applications, elements are highlighted when the user moves the mouse over them or selects them. IFC.js is no exception, and in this tutorial we will see how to achieve this.👩🏫 Previously we have seen how to obtain the ID of an object on which we cast a ray with the Raycaster. Now that we have those IDs, it's possible to highlight those elements using geometric subsets.
Geometric subsets are any group of items in the model. For example: all doors, all ground floor elements or all elements fulfilling a given condition.
The first thing is to create the highlight material.Play with the configuration and make the material look nice! Pro tip: you can use
depthTest=false so that the object is visible from any viewpoint.
☝ Note that geometric subsets are uniquely identified by their material.
If you create a subset with a wall using a material A, and then try to create a subset of another wall with the same material A, the second wall will be added to the subset of the first one.
If you create a subset with a wall using material A, and then try to create another subset of the same wall using material B, you will have created two independent subsets.
🐭 We can create a highlight effect when the user hovers with createSubset.
👀 There are several interesting things to look out for:
The implementation of
cast()was shown previously.
currentModelis used to store a reference of the selected model; this way, when the user is not hovering an object, we are able to remove the previous subset with removeSubset.
The IDs of the items whose subset to create have to be given as an array (even if it's a single ID).
💅💅💅 Working with multiple subsets is as easy as working with a single subset. We just need to create a new material, create a new subset with the same function and associate the creation of that subset to an event.
In this example we are going to bind it to double click to simulate the effect of highlighting objects when they are selected.
👩🏫 If you create a geometry subset and do not specify a highlight material, the subset will have the original materials.
🌚 In the next example we will apply a transparent material to the loaded IFC model and create a subset with the original materials when the mouse hovers over an item. For this we will use almost the same code as before.
🎉🎉🎉 Congratulations! You should now be able to highlight elements and extract geometry from the BIM model. Good job!
📃 However, don't be so quick to claim victory. We haven't talked about the "I" in BIM yet, and that's even more important than the geometry. That's what the next lesson is for.