Caps & Fills on LatheGeometry / Clipping Planes

Questions
1

I’ve been struggling with getting the clipping planes stencil example to work on the obj I load into it. What I’m looking for is a seamless, responsive user interactive, adjustable (through GUI sliders) SOLID cross section process for my objects.

While clipping plane stencil hasn’t panned out insofar, I’m tending more towards feeling the need for the opposite, a generative process like lathing a profile… Yet all examples seem to never have the ability to “CAP” the insides or ends.

Think complex object, being revealed a-la 3D pie chart, with the inside of the Pac-man mouth seamlessly SOLID, and that area preferably able to have a unique material.

I’ve accomplished this with blender shape keys fine, but there are MANY objects I need to do this with, and the process to hand animate them isn’t realistic now. Plus all my spline paths that would be the sources of the lathe operations are all ready to be accessed as svg paths/shapes etc.

I’ve seen some great things like Constructive Solid Geometry and Prisoners’ fish bowl w the cloud (and that other one with the wood block using materials.) And ThreeP.js

Just wondering if there’s a Three.js native method I haven’t come across yet, because I don’t want this project (which needs to keep evolving with its software) to be handicapped by orphaned add ons down the road, unable to update to new versions without them etc.

Hope I described what I mean well.
Frustrated as to how difficult such an important and useful method wouldn’t be available by now. (Nothing personal devs! :v:)

Thanks guys!

2

I am not sure if I have understood your requirements correctly.

But maybe the examples

Addon to create special / extended geometries
Construction of frames with contour/profile
https://hofk.de/main/threejs/sandboxthreep/

can help.

The area needed to close the figure must always be recalculated. But if the effort for this is not too big, it can be done quickly.

For each new point and when the slider is changed, this is done e.g. at https://hofk.de/main/threejs/ConstructFrame/ConstructFrame.html.

2020-09-23 19.42.40
2020-09-23 19.42.40745×520 58 KB

In the sandbox you would only have to make the appropriate adjustment in the control using sliders. This is surely only useful, if otherwise only a few parameters for the geometry are left variable and the others are made constant.

2020-09-23 19.21.44
2020-09-23 19.21.44787×516 136 KB

This post could also be helpful.
Create a curved plane surface which dynamically changes its size

The drawing of only a part of the total defined values:

" .setDrawRange ( start : Integer, count : Integer ) : null
Set the .drawRange property. For non-indexed BufferGeometry, count is the number of vertices to render. For indexed BufferGeometry, count is the number of indices to render.
https://threejs.org/docs/index.html#api/en/core/BufferGeometry

This allows you to define a BufferGeometry with maximum size, but only draws the existing part."

In this example this is used in the animation. ( slider left side )
https://hofk.de/main/threejs/sandboxthreei/triangulationImplicitSurface.html

function animate( ) {

	g.setDrawRange(  0, range.value * 3 * progressFactor );
	 
	requestAnimationFrame( animate );
	renderer.render( scene, camera );
	controls.update( );
	
}
3

This…

2020-09-23 19.21.44
2020-09-23 19.21.44787×516 136 KB

Is exactly what I’m talking about, if I could smoothly animate that “amount of competition until a full sphere” with a slider.
I use verge 3D and am learning three.js now.
Could you possibly give me a VERY BASIC, simple sample file with JUST the sphere there, and the “amount of competion” as a variable? (Wedges vs used wedges)…
…Then I can go from there and set up a slider and make it interactive. (The source is just too much for me to not make lots of mistakes right now)

I have threeG.js /threeP.js etc already.
I’d be greatly appreciated!!
Thanks hofk!
Ps I see you have an admirer in the other thread haha :wink:

4

that is my ideal scenario…
but in the meantime i am simultaneously working on the Clipping Planes method of showing cut aways

i’m working on my first fork on codepen of someone’s three.js pen they made.
i’m trying to use MY OWN CUSTOM .GLB object in my fork

the goal here is to be able to have my object be clipped by the planes, but no dice.

Can anyone help me figure out what’s wrong? I think it has something to do with the material.

thanks!

original-

my fork-

5

THREEp contains very complex structures and corresponding calculations. You cannot simply extract a part of it and make it executable.

Making it special and very simple for a sphere means reprogramming it.

Also you can’t extend the algorithm ( create slice plane ) from a sphere (with a very simple formula) directly to any model.

6

Ok. I understand.
Great work on your add ons tough.
I’m sure in time I’ll learn a lot from picking through their code.

On a different note, a friend helped me with the Clipping Planes issue I was having.
It was the glb file, which I hadn’t done
getObjectByName() to the object in the scene to be clipped.

Now it’s working!

This may be obvious, but does anyone know if clipping planes can be user-“rotated” as opposed to translated on the different axes?
Thnx

EDIT: got them rotating with the GUI, got the object animated being sliced like a cake. :+1:
A top down pie-chart / Pac man style… Just how I needed.

Need to research radians and degrees now because the rotation either slows then quickly flips as it passes “0”… Or is very slow and limited
.