A lightweight (~800 bytes) and position-aware wrapper for Three.js in React.
How to use it:
1. Installation.
# Yarn $ yarn add react-three-paper # NPM $ npm i react-three-paper --save
2. Import the Three Paper component and your Thress.js project.
import { Paper } from "paper"; import { main } from "./main.js";
3. pass your script to the component.
<Paper script={main} />
4. Available props.
- script: ThreeJS script
- style: CSS styles for the canvas
- onExit: Fired when canvas exits the viewport
- onEntry: Fired when canvas exits the viewport
- onError: Fired when an error occurred
Preview:
Download Details:
Author: FarazzShaikh
Live Demo: View The Demo
Download Link: Download The Source Code
Official Website: https://github.com/FarazzShaikh/react-three-paper
License: MIT