Skip to content

ZachSaucier/threejs-camera-spline-follower

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

5 Commits
 
 
 
 
 
 

Repository files navigation

Three.js Camera Spline Follower

This file makes it easy to have a Three.js camera follow a given open or closed spline (curve).

This code is a modification of this example in the Three.js documentation, which can also be viewed on GitHub.


Usage

First include the follow-spline JS file.

Then inside your JS make sure to do the following on initialization:

// Set your camera you want to use to the camera that is returned from
// the initialization function
camera = initFollowCamera(<scene>, [offset from center of curve], [look ahead boolean]);

// Create the object from the curve given
addTube(<curve>, [number of segments], [closed or not boolean], [number of radius segments], [mesh to use], [scale], [side to render], [color]);

And inside of your render function make sure to call renderFollowCamera();

That's it!


By default, the camera is placed inside of the curve. You can place it outside of the curve by changing the offset when instantiating the camera.

For a full example, look at this CodePen or download the files and open /examples/index.html in a web browser that runs WebGL.

About

Enables a Three.js camera to follow along a curve

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published