Simulating Crown Shyness in Tree Canopies

Creating a visual model for the phenomenon where trees leave gaps between themselves in a forest.

The simulator is embedded at the bottom of the page, or you can open it in a new window.

launch crown shyness simulatorin a new window

Performance note: This page contains many resource-intensive embedded animations. It may not render correctly on mobile or older devices.

What is Crown Shyness?

Crown shyness is a striking phenomenon where a forest canopy exhibits distinct gaps between neighboring trees’ crowns. The branches of each tree continuously optimize for light exposure as they grow, filling the available space. But as they approach another tree, its shadow makes further growth in that direction less economical. The result is an organically tesselated pattern mortared by sky when viewed from below.

Examples

Trees exhibiting crown shyness.
Hopea odorata trees in Cambodia exhibiting crown shyness.
Photo by Tom Cowey used with permission.

Another great example is this video of a rātā forest on Instagram by Michael George.

A Teleonomic Process

Teleonomy is a term for when something’s structure is defined by procedural rules it follows in apparent pursuit of a goal like resource optimization. Slime mold networds, termite mound architecture, goose migratory V formations, and even starling murmurations are all examples of teleonomic forms.

These procedural rules can be emulated, and the forms replicated.

Seeing Structure

Our brains have evolved to find patterns, and ascribe rules and principles to the things we observe. Once a pattern is recognized, it can be modeled.

Expressing a Pattern

I’d wanted to use code to abstractly model crown shyness for years—particularly the shapes and gaps that arise organically.

The pattern (or set of procedural rules) that made sense to me was a series of groupings and clustering of points at different scales—analogous to the branching structure of the tree itself: one large trunk, a handful of limbs, several smaller branches, etc.

Starting with a uniformly distributed field of leaves, one can create local divisions and groupings at different scales, shift the leaves in each group slightly towards the group’s center, and produce something that looks passably like a tree canopy.

The Algorithms

This called for two of my favorite algorithms to use in generative art: Poisson disc sampling, and Voronoi plane paritions.

Poisson Disc Sampling

Poisson disc sampling is a method for generating a series of random points where no point is within a certain threshold distance of another point. In other words, randomness with uniformity of density. It’s a happy medium between a truly random distribution (with areas of low and high density) and crystal structures (with uniform density but highly regular arrangement).

This will be how we seed our leaves and define the centroids for each layer of grouping for the trees and branches.

    •
    Visualization demonstrating how the Poisson disc sampling algorithm uses a distance threshold to separate points.

    Mike Bostock has a great visual explanation of exactly how Bridson’s algorithm for Poisson disc sampling (the one used here) works in his article Visualizing Algorithms.

    Voronoi Partitions

    Voronoi partitions divide a plane into regions of points closest to a given set of points. Start with a set of points. Pick one. Draw a shape around the area nearer to that point than any other. Do that for every point. That’s a Voronoi partition.

    For another way to think of it, start with a set of predefined points. Imagine a ripple expands from each point, starting at the same time and moving at the same speed. All of the places that ripple gets to first are within that point’s Voronoi region. And all the places that ripples meet form the edges of those regions:

    •
    Visualization of Voronoi partitions as the result of ripples emanating from predefined points.

    These shapes help visualize which group at each level each leaf falls into, based on proximity.

    Building the Model

    The model can begin to take shape when we combine the concepts of Poisson distributions and Voronoi partitions.

    Step 1

    First, start with a uniformly dense field of random points for our “leaves”.

    •

    Step 2

    Next create a more sparse set of random points for the center of our “branch” groupings and measure which leaves are closest to which branch.

    •

    Step 3

    Then shift each leaf slightly closer to the nearest branch forming branch clusters of leaves.

    •

    Step 4

    Create a new set of sparser points for the “tree” groupings and measure which branch groups are closest to which tree.

    •

    Step 5

    Shift each branch group of leaves slightly towards the nearest tree.

    •

    Result

    The end result of these procedural steps looks passably like an abstract tree canopy! Click the "refresh" button to generate a new result, or open the frame in a new window to view it larger.

    •

    Interactive Version

    An interactive version of the algorithm is embedded below. It’s controls are presented in three groups:

    1. Leaves: Controls the original, uniformly dense, random distribution of leaves, before being grouped and shifted into branches and trees. These leaves are rendered as the bottom-most layer of dots.
    2. Branches: Controls the first, more granular grouping of the leaves—the group size and the amount by which the leaves in a group shift towards its center. The leaves are re-rendered at this point as the middle layer of dots.
    3. Trees: Controls the second, larger grouping of the leaves—the group size and the amount by which the leaves in a group shift towards its center. This renders the top-most layer of leaves (bright green in the default settings), and represent the leaves’ final position after their shifts and transformations by the previous layers.

    See what you can make! Can you fine-tune the perfect settings for a realistic-looking tree canopy? Or are you more interested in exploring abstract forms?

    •

    Next Steps

    With more time, I’d love to add a gentle breeze using a progression of Perlin noise. Each leaf cluster, branch, limb, and trunk would have different levels of flexibility and could bend a certain amount from their original position before flexion brought them back. The original positions of each level of the tree would be relative to the preceding level—i.e., a bending limb would shift all of its branches and all of its leaves.

    Would make for a relaxing screen saver.