react-three-fiber react-three-fiber react-three-fiber

Gltf model loader

Loading a gltf model in an r3f scene. Fork on Codesandbox

Live example


Coming Soon

Code

import React, { Suspense } from "react";
import ReactDOM from "react-dom";
import { Canvas } from "react-three-fiber";
import { OrbitControls, Stats } from "@react-three/drei";

import Plane from "./model";

const App = () => (
  <Canvas style=>
    <pointLight position={[5, 5, 5]} />
    <Suspense fallback={null}>
      <Plane rotation={[0, Math.PI * 1.25, 0]} />
    </Suspense>
    <OrbitControls />
    <Stats />
  </Canvas>
);

ReactDOM.render(<App />, document.getElementById("root"));

Running this example

Clone this repo, and then NPM install and NPM start from the relevant directory.

$ cd examples/models/gltf-model-loader
$ npm install && npm run start