Error when enabling clippingPlane on renderer

7nacho · August 15, 2019, 4:54pm

Hello, I’m having a problem trying to get a clipping plane working. I’m getting this message:
“Uncaught TypeError: Cannot read property ‘normal’ of undefined”
I’m very new to three.js, I apologize if this is a simple one to solve but I can’t find a solution online.
I set this up in an apache server, I include the files.
Any help is very appreciated, thnx!

index.html (3.1 KB) mynewmesh.json (2.2 MB)

Mugen87 · August 15, 2019, 5:38pm

As mentioned in the documentation, Material.clippingPlanes is an array. You directly assign instance of THREE.Plane to it which is not valid. Like demonstrated in the example, you have to wrap your clipping plane into an array.

github.com

mrdoob/three.js/blob/e622cc7890e86663011d12ec405847baa4068515/examples/webgl_clipping.html#L76


				var globalPlane = new THREE.Plane( new THREE.Vector3( - 1, 0, 0 ), 0.1 );


				// Geometry


				var material = new THREE.MeshPhongMaterial( {
					color: 0x80ee10,
					shininess: 100,
					side: THREE.DoubleSide,


					// ***** Clipping setup (material): *****
					clippingPlanes: [ localPlane ],
					clipShadows: true


				} );


				var geometry = new THREE.TorusKnotBufferGeometry( 0.4, 0.08, 95, 20 );


				object = new THREE.Mesh( geometry, material );
				object.castShadow = true;
				scene.add( object );

Doing so will resolve the runtime error.

7nacho · August 16, 2019, 2:22pm

Oooops!!.., missed that…
Thank you so much for your help!

Topic		Replies	Views
Three.js clipping Questions clipping , threejs	11	2873	December 8, 2020
The clippingplanes got incorrect results Questions clipping-planes	3	328	January 10, 2023
Clipping Planes - Line by line comments Questions geometry	3	629	January 29, 2021
TypeError: Cannot read property 'center' of undefined when rendering Questions webgl-renderer	4	3450	December 14, 2020
Three.js Line Mesh error Questions	1	281	May 18, 2023

Error when enabling clippingPlane on renderer

Related Topics