Figure 1: A screenshot of the 3D Tree Generator app running in a web browser.

Launch app in new tab...

Overview

The aim of this app is to generate reasonably configurable low-polygon parametric / procedural trees for use with BIM and building performance analysis models. To be used effectively in analysis, tree geometry needs to be as simple and light-weight as possible, but still sufficiently configurable to reasonably represent the size, shape and shading effects of existing or likely trees on a site. Also, the leaf canopy needs to be able to vary its colour and opacity across the year to properly represent the dynamic seasonal effects of deciduous trees that shed and then regrow their leaves annually.

The types of low-poly procedural tree you can generate.
Figure 2: The types of low-poly procedural tree you can generate.

Unfortunately there are very few tools available that can viably model or describe these dynamic seasonal shading effects, which in turn means that most building analysis software either ignore it or provide only limited means to deal with it. Thus, the hope is that having tools that make modelling and describing it relatively simple and straightforward may motivate more analysis tools to better support the dynamic shading effects of deciduous vegetation.

Dynamically modelling seasonal variation in deciduous vegetation.
Figure 3a: Dynamically modelling seasonal variation in deciduous vegetation.
The seasonal variation settings dialog box.
Figure 3b: The seasonal variation settings dialog box.

Geometric Representation

As shown in Figure 2 above, the app can generate both simple abstract geometric representations as well as much more realistic trees that use mapped textures to model the foliage (thanks to proctree.js - see below). Each procedural generator requires a fair number of controls for the various parameters that govern the results, so simple experimentation is the only real way to gain an understanding of what each one does. However, it is probably worth explaining some aspects of the various geometric representations.

There are a number of ways you can generate abstract but natural-looking geometric canopy shapes. One is to use some standard polyhedra and subdivide their surfaces into triangular leaves. Another is to distribute random, semi-random and ordered points over a sphere and then connect those points into facets to form a surface. Alternatively, you can also use various spatial algorithms to calculate values over a 3D volumetric data grid and then generate the canopy as an iso-surface.

The various point/surface distribution methods.
Figure 4: The various point/surface distribution methods.

Polyhedra

This option allows you to select from a range of polyhedra based on Platonic and Archimedean Solids, and then subdivide their surfaces into triangular leaves. As the subdivision is recursive, the total number of leaves can quickly blow out so the subdivisions are dynamically limited by face size and number. This means that leaf size and density is stepped incrementally, so you may need to change the Leaf Count value a lot to see any changes. If no subdivisions are selected, the large flat facetted surfaces will be edged with sketchy lines and the Bushiness value will instead generate additional leaves along the edges.

Fully Random

This option generates a completely random set of azimuth and altitude values, except for the first 5 points which are distributed pseudo-randomly to form a basic octahedron between base and apex to ensure a reasonable shape even with only a very small number of points. The total number of random points is controlled by the Leaf Count value.

Pseudo-Random

This option divides a sphere into roughly equal-area patches based on the square root of Leaf Count or Azimuth/Altitude Band values, and then randomly locates a point within each patch.

Fibonacci Lattice

This uses a Fibonacci spiral or lattice to distribute points from the apex down over the surface of a sphere. This is a surprisingly simple method, but seems to give the best approximation of equal-area subdivision than any other method I have found, and accurately represents the Leaf Count.

See Generating Equidistant Points on a Sphere for more information on the Fibonacci spiral.

Geodesic Subdivision

This option divides the sphere into eight spherical triangles, then iteratively subdivides each triangle based on the square root of the Leaf Count or the given Geodesic Segmentation value. Geodesic subdivision occurs in incremental steps, so you may need to change the Leaf Count value a lot to see any changes.

See Geodesic polyhedron for more information on geodesic subdivision.

Perlin Noise

Generates a 3D volumetric grid based on the current canopy radius and height, and then uses a Perlin noise function to generate values in each cell. The canopy is then creating by determining the iso-surface at an appropriate threshold value. The resolution of the 3D grid is determined from the Leaf Count or Azimuth/Altitude Band values.

See this Wikipedia page for more information on Perlin noise.

Metaballs

Generates a 3D volumetric grid around a series of spherical ‘clusters’ of leaves within the canopy. Each spherical cluster, or metaball, represents a field of influence and the value at each grid cell is derived from the sum of all the influences within range. When two or more spherical fields are sufficiently close to each other, their field strengths combine in interesting ways. The resulting canopy is then created by determining the iso-surface at an appropriate field strength threshold value. The resolution of the 3D grid is determined from the Leaf Count or Azimuth/Altitude Band values.

When using metaballs, you can click/tap on any of the metaballs to select it and, when the cursor is displayed at its center point, you can use it to interactively move individual balls around to get exactly the shape you want. To edit the radius of each ball, you will need to use the Cluster Radius slider in the CLUSTERS panel.

See this web page for more information on Metaballs.

Surface Generation

The most obvious way to create a surface from a series of spatial points is to simply join them all together with triangles, which is exactly what the Delaunay Triangulation method does. Another way is to generate Voronoi Cells by joining the centers of each adjacent triangle to create more complex polygonal facets. A further method is to generate a Convex Hull from the points, which is essentially just wrapping them in a stretchy fabric such that only the outer-most points define the shape. Finally, you can use an Iso-Surface to show the bounding extents of a given threshold within a 3D volumetric grid with spatially varying values.

The three surface generation methods.
Figure 5: The three surface generation methods.

For all surfaces, the Leaf Count value determines the number of spatial points or the size of surface facets or spatial cells. This is a loose association and may sometimes only increment in steps as some of these methods are based on spatial subdivision rather than surface subdivision. However, experimentation with different leaf count values is the best way to determine the association for yourself.

Background

There are other tree generators out there, but they tend to focus more on realistic visualisation, texturing and rendering. There were not many tools that I could find for generating simple abstract geometry-only trees, other than generic mesh editors which you could bend to that purpose. As I was initially only interested in generating very simple polyhedral and abstract geometric tree forms, it looked like I would need to write my own.

This was fine because I also wanted to be able to deeply integrate parametric / procedural trees directly in my BIM tools. Being able to accurately model site conditions goes a long way towards making an analysis model believable. Thus, the aim was to strike the right balance between something that looked reasonably convincingly like a tree but was still dead simple to model and manipulate, didn’t choke calculations with unnecessary detail, and matched the visual style of my building model editor.

However, it wasn’t long before I discovered Paul Brunt’s excellent proctree.js code, which generates much more realistic tree trunks and uses texture mapping for foliage. Obviously I couldn’t help myself from falling down the rabbit hole and implementing that too – together with creating new textures, adding support for radial branching and twig orientation, etc, etc…

In the end, rather than choose one style over the other, I think there are likely uses for both types of trees in different scenarios. Thus, I have included both of them as options, and kept pretty well all the various geometric methods I experimentated with as well.

Interesting Features

The following are some of this app’s more interesting features:

  • You can use the Bushiness value to deconstruct the generated surface geometry into randomly perturbed facets that better visually simulate tree foliage,

  • To get a better feel for the size and scale of your tree, you can display a human form next to it by toggling the Human Scale button in the bottom left of the window. You can also choose to toggle external dimension lines in the same way,

  • When generating trees using metaballs, you can interactively click on any of the balls within the 3D model to select and dynamically edit them,

  • Making the volumetric iso-surface generation used in the Perlin noise and metaballs methods fast enough to support dynamic interactive manipulation was a pretty interesting challenge. Also, I chose to use Surface Nets instead of Marching Cubes for calculating the iso-surface as the resulting quads just look so much better than typical surface triangulation,

  • The use of Perlin noise to generate tree geometry has lots of potential, so it’s worth spending a little time experimenting with different radial and spatial variations values,

  • I almost didn’t include the Convex Hull method in the final tool as it seemed more suitable for rocks and stones than tree canopies. However, it does look pretty good when you use a high leaf density, high lumpiness and low spikeyness as it create large facets with what appear to be soft edges.


Change Log

0.0.1 2020-02-05

  • Initial release.

Click here to comment on this page.