Agile育成ブログ
未来を変える喜びを
未分類

react-three-fibar


Warning: count(): Parameter must be an array or an object that implements Countable in /home/xs638785/agile-software.site/public_html/wp-content/plugins/rich-table-of-content/functions.php on line 490

hemisphereLight

  • skyColor 
  • intensity
  • groundColor

spotLight

  • penumbra:減衰するスポットライトコーンの割合
  • intensity
  • angle
  • castShadow:trueに設定すると光は動的な影を落とす。デフォルトはfalse

Canvas

視野角(fov)やカメラ位置(position)を設定します。ほかに背景色やDPRなどを設定できます。

  • ambientLight:環境光
 <Canvas>
      <ambientLight />
      <pointLight position={[10, 10, 10]} />
      <Box position={[-1.2, 0, 0]} />
      <Box position={[1.2, 0, 0]} />
    </Canvas>

OrbitControls

このコンポーネントを追加すると、マウスでカメラの回転、移動、ズームを行うことができます。
どれかしらの機能だけを使う/使わないの設定もできます。

You cannot copy content of this page