I would like to change material (THREE.MeshPhongMaterial) of elements which were hidden by the viewer. The default hidden elements are still visible, but I want to change their transparency and color.
Here is the example code. I tried to change both theming color and material but no success:
viewer.hideById(dbId);
var color = 0x0000ff; // blue color
viewer.setThemingColor(dbId, color, viewer.model);
var instanceTree = viewer.model.getData().instanceTree;
var fragmentList = viewer.model.getFragmentList();
instanceTree.enumNodeFragments(dbId, function (fragId) {
fragmentList.setMaterial(fragId, new THREE.MeshPhongMaterial( { opacity: 0.5 } ));
});
viewer.impl.invalidate(true);
However, nothing is changed after updating materials of hidden elements. How to fix that. I want my custom hidden elements with different colors and transparency.
With Forge Viewer, if you hide an object, as Augusto mentioned, it seems that the object will be completely hidden, you can not set the material to see it as you want. But, there is a trick workaround may help to achieve what you did with Three.js in http://app.netonapp.com/JavaScript/Three.js/select_inner_objects.html, you can select the inside object, and still can see the outside "hidden" object.
What I did is simple, within the callback function of “mousedown" event, the first thing I did is to set the outside object hidden by API viewer.hideById(dbId), then to select the object by your API viewer.impl.renderer().idAtPixel. In this case, it will ignore the hidden object and just select the inside object. And in the function of “SELECTION_CHANGED_EVENT” event, I added the code viewer.show(dbid) to show the outside object.
By this way, you can set the material as you want for the outside object, the outside object will be shown as other normal objects, but it will be just hidden for a while when you try to select object. The solution seems working on my side, but I did not test it thoroughly, you can try to see if it works.