ifc.js Hiding示例问题求助：隐藏子集后Hover仍高亮元素

问题背景 #

对应文件为helloworld/main/examples/web-ifc-viewer/hiding/bundle.js，当通过复选框隐藏子集后，隐藏子集中的元素仍会在鼠标悬停时被高亮。Discord给出的解决方案是将子集对应的模型从ifcviewer.context.items.pickableIfcModels数组中移除，以下是具体操作方法：

具体实现步骤 #

1. 定位隐藏子集的逻辑代码 #

在bundle.js中找到处理复选框切换、控制子集显示/隐藏的回调函数，通常是监听复选框change事件的代码块，类似如下结构：

checkbox.addEventListener('change', (event) => {
  const subsetId = event.target.dataset.subsetId;
  const subset = ifcviewer.context.items.subsets[subsetId];
  if (event.target.checked) {
    subset.visible = true;
  } else {
    subset.visible = false;
  }
});

2. 修改逻辑，同步拾取模型数组 #

在切换子集显示状态时，同步修改pickableIfcModels数组：隐藏子集时移除对应模型，显示子集时重新添加。修改后的代码如下：

checkbox.addEventListener('change', (event) => {
  const subsetId = event.target.dataset.subsetId;
  const subset = ifcviewer.context.items.subsets[subsetId];
  const pickableModels = ifcviewer.context.items.pickableIfcModels;
  const modelPosition = pickableModels.indexOf(subset.model);
  
  if (event.target.checked) {
    subset.visible = true;
    // 恢复显示时，若模型不在拾取数组则添加
    if (modelPosition === -1) {
      pickableModels.push(subset.model);
    }
  } else {
    subset.visible = false;
    // 隐藏时，若模型在拾取数组则移除
    if (modelPosition !== -1) {
      pickableModels.splice(modelPosition, 1);
    }
  }
});

3. 关键细节说明 #

• subset.model是子集关联的IFC模型实例，需确保获取的对象正确
• 用indexOf检查模型是否在拾取数组中，避免重复添加或无效移除
• splice用于移除数组中指定位置的元素，push用于重新将模型加入拾取队列

效果验证 #

修改完成后测试：勾选复选框显示子集，鼠标悬停可正常高亮；取消勾选隐藏子集，原子集区域不会再触发悬停高亮。

内容的提问来源于stack exchange，提问作者SWJanitor