Hi, im fairly new to threejs and react-three and im working on a project that consists of various points in a scene conected by a line, these points have the Html react three drei component.
My objective is to prevent the vertices of the lines from appearing inside the circles without ruining the prespective, like this:
I have tried several ideas to accomplish this but none worked, right now all i’ve got is this:
Here’s the sandbox
Previously I didnt include the occlude prop on the component wich caused all the circles to overlay the lines wich ruined the prespective
so the blue things are actually html overlays/annotations and you want them to occlude the lines, while lines that are technically in front should overlay the annotations.
in fiber that is technically possible, easily even and you were close, it’s not a ring shape but a circle shape. but since the lines have thickness they will still create a small dot in the middle because they peak through the occluding shape.
i would still recommend not overusing html. annotations are expensive if you have too many, it would imo be better to make these connectors in threejs.
