Closed VictorTrumpel closed 1 month ago
You are right! We temporarily removed the highlight feature for the new refactor, as the way the highlight works has changed drastically. This is not a but. But don't worry, we'll put it back the next milestone. I'll remove the bug
flag and add a feature
flag instead
Hi @agviegas any update on this issue/feature? I noticed this as well in my recent migration to the new refactor.
I'll do it asap. We have few hands. Hopefully these weeks, I'll post any updates here
Thanks for the update @agviegas
Shall I take it up and create a pull request once done? I would like to contribute if possible.
For temporary solution I use this code. Maybe It will helpful for somebody
const highlightMats = {
default: new MeshBasicMaterial({
color: '#674db3',
depthTest: false,
opacity: 0.8,
transparent: true,
}),
};
const highlightFragment = (fragmentMap: FragmentIdMap) => {
const components = new Components();
const fragmentsManager = components.get(OBC.FragmentsManager);
for (const fragID in fragmentMap) {
const fragment = fragmentsManager.list.get(fragID);
if (!fragment) continue;
fragment.mesh.material = [highlightMats.default];
}
};
It looks like this
Yeah, this workaround is good.
But, one extra thing it probably needs is to make a copy of the mesh and highlight the copy so that the original mesh retains it materials once the highlight is disabled. The copy can be deleted on highlight removal.
I'm actually currently implementing Fragment cloning. Once I solve that, implementing this should be a piece of cake.
Will be available from @thatopen/components-front@2.1.18
(I hope to publish later today). Now there's an outline component that allows to add outlines to fragments and can be used with the highlighter easily. With this code:
const outliner = components.get(OBCF.Outliner);
outliner.world = world;
outliner.enabled = true;
outliner.create(
"example",
new THREE.MeshBasicMaterial({
color: 0xbcf124,
transparent: true,
opacity: 0.5,
}),
);
highlighter.events.select.onHighlight.add((fragIdMap) => {
outliner.clear("example");
outliner.add("example", fragIdMap);
});
This is the result:
https://github.com/user-attachments/assets/155fc404-825e-4faf-b005-be50c72cbe1a
The highlighter tutorial will also be updated with this.
Describe the bug 📝
Why does the highlighter not highlight, but simply recolor? If I highlight a chair, it won't be visible throw the walls the way it worked before.
Example from docks: https://thatopen.github.io/engine_components/examples/Highlighter/ https://docs.thatopen.com/Tutorials/Components/Front/Highlighter
How to make it so that the backlight not only recolors, but also shines through?
Reproduction ▶️
https://thatopen.github.io/engine_components/examples/Highlighter/
Steps to reproduce 🔢
https://thatopen.github.io/engine_components/examples/Highlighter/
System Info 💻
Used Package Manager 📦
npm
Error Trace/Logs 📃
No response
Validations ✅