useFrame не работает, applyMatrix4 не анимирует примитив?

#react-native #three.js #react-three-fiber

Вопрос:

у меня есть этот код:

  useFrame(() => {
    if (
      primitiveRef amp;amp;
      primitiveRef.current amp;amp;
      primitiveRef.current.applyMatrix4
    ) {
      if (!animation || frames.current > TOTAL_FRAMES) {
        return;
      }
      const {from, to, active} = animation;
      if (!init.current) {
        const m = pivotMatrix(SIZE.z / 2, from);
        primitiveRef.current.applyMatrix4(m);
        init.current = true;
      }
      if (!active) return;
      frames.current  = 1;
      const delta = (to - from) / TOTAL_FRAMES;
      const m = pivotMatrix(SIZE.z / 2, delta);
      primitiveRef.current.applyMatrix4(m);
    }
  });
 

когда активное значение истинно, оно, по-видимому, не влияет на примитивное?

 const primitiveRef = useRef<any>(null);

const init = useRef(false);

const frames = useRef(0);

<primitive
  {...{ref: primitiveRef, object, rotation: [-Math.PI / 6, 0, 0]}}
/>

export const pivotMatrix = (z: number, angle: number) => {
  const quaternion = new Quaternion();
  quaternion.setFromAxisAngle(new Vector3(1, 0, 0), angle);
  const m = new Matrix4();
  m.compose(new Vector3(0, 0, 0), quaternion, new Vector3(1, 1, 1));
  const pivot = new Vector3(0, 0, z);
  const px = pivot.x,
    py = pivot.y,
    pz = pivot.z;
  const te = m.elements;
  te[12]  = px - te[0] * px - te[4] * py - te[8] * pz;
  te[13]  = py - te[1] * px - te[5] * py - te[9] * pz;
  te[14]  = pz - te[2] * px - te[6] * py - te[10] * pz;
  return m;
};
 

я просто пытаюсь следовать этому руководству:

 https://www.youtube.com/watch?v=gY0eoJqsVRkamp;t=883s