A procedural tree generator built with Three.js. Over 30 tunable parameters and support for exporting to .glb.

The tree generation code is published as an npm package and can be imported into your own project.

npm i @dgreenheck/tree-js

// Create new instance
const tree = new Tree();

// Set parameters
tree.params.trunk.length = 20;
tree.params.branch.levels = 3;

// Generate tree and add to scene
tree.generate();
scene.add(tree);

Any time the tree parametes are changed, you must call generate() to regenerate the geometry.

For more info, see the demo app for an example on how to create a tree.

The demo application is a Three.js app which allows you to tune the parameters of the tree in real-time. It also has options for exporting the generated mesh to a .glb file, as well as a .png export of the current view for 2D applications.

https://dgreenheck.github.io/tree-js/

npm install
npm run demo

docker compose build
docker compose up -d

• color - Color of the tree trunk
• flare - Multipler for base of trunk
• flatShading - Use face normals for shading instead of vertex normals
• length - Length of the base trunk
• maturity: Growth stage of tree
• radius - Starting radius of the trunk
• textured - Apply bark texture

• gnarliness - Max amplitude of random angle added to each section's orientation
• gnarliness1_R - Same as above, but inversely proportional to the branch radius. The two terms can be used to balance gnarliness of trunk vs. branches
• lengthVariance - % variance in branch length
• lengthMultiplier - Length of child branch relative to parent
• levels - Number of branch recursions ( Keep under 5 )
• minChildren - Minimum number of child branches
• maxChildren - Maximum number of child branches
• radiusMultiplier - Radius of child branch relative to parent
• start - Defines where child branches start forming on the parent branch. A value of 0.6 means the child branches can start forming 60% of the way up the parent branch
• stop - Defines where child branches stop forming on the parent branch. A value of 0.9 means the child branches stop forming 90% of the way up the parent branch
• sweepAngle - Max sweep of the branches (radians)
• taper - Radius of end of branch relative to the start of the branch
• twist - Amount of twisting about the vertical axisq

• lengthVariance - % variance in the nominal section length
• radiusVariance - % variance in the nominal section radius
• randomization - Randomization factor applied to vertices
• sections - Number of sections that make up this branch
• segments - Number of faces around the circumference of the branch

• color - Leaf color
• maxCount - Max number of leaves per branch
• minCount - Min number of leaves per branch
• size - Size of leaf texture
• sizeVariance - Variance in leaf size between branches
• style - Leaf billboard style (single or double)
• type - Leaf type (Ash, Aspen or Oak)

• direction - Influences the direction the tree grows towards
• strength - Strength of the sun influence