This post explores generating a pythagorean tree using D3.js - one of my favorite libraries to create data based visualizations. A pythagorean tree is a fractal, a fractal is usually a pattern repeating itself over and over, the tree above is similarly constructed by repeating a square block over and over again. Programmatically a fractal can be generated using recursion. The code for the tree above is a simple binary recursion which first generates an in memory representation of the tree. State about position, angle, color and opacity for each block is calculated and stored. This state is then used as data to bind to an SVG embedded in the page. The javascript code located to generate this tree can be found here.
This is based on work by @prcweb.