I'm laying out a network of blood vessels in Three.js. For this I've found THREE.TubeGeometry
very useful. But I obviously can't form a branching network out of one tube. I need to join multiple tubes together. Here's an example:
On the left you see a point where multiple tubes join. In terms of Bézier curves, the three control points and the join-point are perfectly co-linear here. Still, it's obviously an ugly join. In contrast, look at the bend in the curve on the right side, created internally by TubeGeometry
. I'd like my manual joins to be smooth like that.
It seems to be a bad alignment of cross-sections, which are not perfect circles, but 8-segment polygons. Indeed, if I increase the number of segments, the disparity becomes less noticeable, but this brings with it a big performance hit. And really, 8 segments is plenty. I think I just need to adjust their rotation to match, but I'm not sure how.