For a long time, I wanted to learn and get started with WebGL. Having done some work with OpenGL I thought WebGL would be a great addition to know ...
For further actions, you may consider blocking this person and/or reporting abuse
Great article!
I really needed it two days ago, since I started experimenting with react-three-fiber and OrtbitControls!
Feedback:
This part felt a bit out of place:
Also, maybe you could rephrase this part:
For the part about Editing the camera settings, do you intend to only do this on initial render further in the article series? If not, I would recommend putting it in a
useEffect
call, to prevent the camera from resetting in each renderOther than a few missing commas here and there, really nice article!
Thanks for the feedback. The camera is used for a couple of other things further down the line but this is a really good suggestion to wrap the camera in an
useEffect
call.This is amazing. Thanks for posting!
Thank you!!
Your first code sample appears to be missing some imports
Could you please point me to that? As far as I remember the code sample will work well.
Creating a basic scene:
First code sample uses mesh, boxBufferGeometry, and meshNormalMaterial, but only imports react. If that's accurate - how does that work?
Sorry for the late reply. So the way this works is if you are aware that the
jsx
we write in React is not valid HTML but there is a plugin that transpiles those calls intoReact.createElement
call. The same way when you write<mesh />
or<boxBufferGeometry>
or any of the components in the three.js catalogreact-three-fiber
will go and convert those calls to three js calls. For starters check out this and thisI'm getting errors when I get to the orbit controls.. "The above error occurred in the component:" "Uncaught TypeError: target is not a constructor" ...
import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls'
looks like this line changed and now needs to be destructured from OrbitControls
Thanks , great tutorial .