Hooks
useCanvasProps

useCanvasProps

With this hook you can add custom props to the canvas element. But there are some props that cannot be overwritten. They are:

  • dpr For now it's fixed to 1. The user can export the canvas with a higher resolution.
  • gl.preserveDrawingBuffer Used for exporting the canvas.
  • style.height Controlled by the user.
  • style.width Controlled by the user.

If you need to overwrite any of these props, please let us know.

Example of use.

 
import { useEffect } from 'react'
import { useCanvasProps } from './effect-control'
 
export default function App({
  const { setCanvasProps } = useCanvasProps()
 
  useEffect(() => {
    setCanvasProps({ flat: true, frameloop: 'demand' })
  }, [])
 
  return (
    <>
      ...
    </>
  )
}