Intersection arbitrary mesh with plane (in THREEJS)

3
votes

Is it currently possible to display the intersection of a mesh and a plane as below in THREEJS:

Display in red, green, yellow the intersection of meshes with a back plane with a texture on it.

enter image description here

If not, which would the best approach be:

  • compute a "line geometry" at the intersection of the mesh and the plane in JavaScript, then renderer it
  • apply a custom shader material to the mesh (with the plane parameters as a uniform) that only colors a pixel if the current triangle intersects the plane

For option #2 are there some demos online already of such shaders?

Thanks,

Nicolas

1
three.jswebglintersectionmeshplane

1 Answers

0
votes

AMI now supports it (https://fnndsc.github.io/ami/#viewers_quadview)

The steps are:

  1. Display intersection between a mesh and a plane

  2. Post process the intersection to display the contours.

There are different techniques to display mesh/plane intersection:

  1. With a stencil buffer (https://github.com/daign/clipping-with-caps)

  2. Playing the the mesh opacity (https://github.com/FNNDSC/ami/tree/dev/examples/viewers_quadview)

All those techniques are computationally expensive at it requires 3 renders pass to display contours of 1 mesh and there may be a better approach but not sure what would be the best alternative.

HTH