Skip to main content

ProjectedMaterial

Three.jsで、指定したカメラから見た光景を、TextureにするMaterialです。 また、ProjectedMaterialでは、envMapなども指定できたりします。 一つ注意なのが、project()を一度実行する必要があります。

import React from 'react';
import { extend } from '@react-three/fiber'
import ProjectedMaterial from "three-projected-material";

extend({ ProjectedMaterial });

function Mesh () {
  const ref = React.useRef()
  React.useEffect(() => void ref.current.material.project?.(ref.current), []);
  return (
    <mesh ref={ref}>
      <projectedMaterial args={[{texture, camera}]} />
      <boxGeometry args={[1, 1, 1]} />
    </mesh>
  )
}

REF: [[1], [2], [3], [4]]