# Clipping geometry weird when setting constant

Hello guys,

I want to slice a sphere according to the clipping plane normal. Everything looks normal when setting constant = 0. But when setting constant not 0, for example constant = 0.4, when rotating the clipping plane (set normal = [1,1,0]), the direction is Ok, but the clipping plane position is not right. I want to keep clipping plane at [0.4,0,0], I tried to set position at clipping plane to 0.4 , but it does not work. How could I get the right slicing sphere when constant is not 0, like yellow line labeled blow pictures. Thanks in advance.

my code snippet

``````function Sphere({ constant, normalx, normaly, normalz }) {
const mesh = useRef();
const plane = useRef();

return (
<mesh ref={mesh} castShadow position={[0, 0, 0]}>
{/* <boxGeometry attach="geometry" args={[1, 1, 1]} /> */}
<sphereGeometry attach="geometry" args={[1, 32, 16]} />
<meshPhongMaterial
color={0x80ee10}
shininess={100}
side={THREE.DoubleSide}
>
<plane
ref={plane}
attach="clippingPlanes-0"
normal={[normalx, normaly, normalz]}
constant={constant}
//position and translate do not work
//   position={[-0.4, 0, 0]}
//   translate={[-0.4, 0, 0]}
/>
</meshPhongMaterial>
</mesh>
);
}
``````

CodeSandBox: crazy-jackson-18y593 - CodeSandbox

This doesn’t look like three.js?

Ture, it is React three fiber, I found it was more difficult using react three fiber than using pure three.js

I think the problem here is that there are just too many points of failure.

If an example works on a certain version then it can at least be narrowed down to your code. This has a whole different layer of indirection. Anything can be happening within these jsx components is my understanding. Now one needs to know what happens in two different libraries before narrowing it down to your code