Faze
v2.0.0-pre
v2.0.0-pre
  • Introduction
  • Getting Started
  • Abstractions
    • IPipeline
    • IGameState
    • IPlayer
    • Rendering
      • ITreePainter
      • IPaintedTreeRenderer
      • IColorInterpolator
  • Engine
    • Agents
  • Rendering
    • Tree Renderers
      • SquareTreeRenderer
      • SliceAndDiceTreeRenderer
    • Color Interpolators
  • Concept
    • Tree Rendering
    • Real-time Rendering
  • Blog
    • Visualising games as fractals
    • Visualising player choice
  • Examples
    • 8 Queens Problem
    • Chess Pieces
    • Gallery
  • Research
    • Renderers
      • Square Tree Renderer
      • Circle Edge Renderer
      • Compressed Square Tree Renderer
  • GitHub Repository
Powered by GitBook
On this page
  • Core rules
  • Maintaining proportional area
  • Defining the gap between children

Was this helpful?

  1. Research
  2. Renderers

Circle Edge Renderer

Research

PreviousSquare Tree RendererNextCompressed Square Tree Renderer

Last updated 3 years ago

Was this helpful?

Core rules

  • Each node in the tree is represented with a circle.

  • Child nodes are spaced equally along the parent circle's edge.

Additional rules

Maintaining proportional area

One restriction could be to make sure the area of the children, directly under the parent, sums to the parent's area.

Ac=ApnA_c = \frac{A_p}{n}Ac​=nAp​​

This can be then written in terms of the radius of parent 'R' and child 'r'. Where n is the number of children R has.

πr2=πR2n\pi r^2 = \frac{\pi R^2}{n}πr2=nπR2​

r=Rnr = \frac{R}{\sqrt{n}}r=n​R​

Given the above restrictions, the results for 1 - 4 children are listed below

One question is to ask how does this render with more children, particularly if the children ever overlap. To find out we can draw the following diagram.

As stated by one of the core rules, children are equally spaced along the edge of the parent and so the angle between each child is given by theta where...

θ=2πn\theta = \frac{2\pi}{n}θ=n2π​

The distance between adjacent children center point is can be seen to have the following equality

2r+x=2R2(1−cos⁡(2πn))2r + x = \sqrt{2R^2(1 - \cos(\frac{2\pi}{n}))}2r+x=2R2(1−cos(n2π​))​

c2=a2+b2−2abcos⁡Cc^2 = a^2 + b^2 - 2ab\cos{C}c2=a2+b2−2abcosC

(2r+x)2=2R2−2R2cos⁡(2πn)(2r + x)^2 = 2R^2 - 2R^2\cos(\frac{2\pi}{n})(2r+x)2=2R2−2R2cos(n2π​)

(2r+x)2=2R2(1−cos⁡(2πn))(2r + x)^2 = 2R^2(1 - \cos(\frac{2\pi}{n}))(2r+x)2=2R2(1−cos(n2π​))

2r+x=2R2(1−cos⁡(2πn))2r + x = \sqrt{2R^2(1 - \cos(\frac{2\pi}{n}}))2r+x=2R2(1−cos(n2π​​))

Refactoring the equation gives us the following equation for x

x=2R2(1−cos⁡(2πn))−2rx = \sqrt{2R^2(1 - \cos(\frac{2\pi}{n}))} - 2rx=2R2(1−cos(n2π​))​−2r

x=2R2(1−cos⁡(2πn))−2Rnx = \sqrt{2R^2(1 - \cos(\frac{2\pi}{n}))} - \frac{2R}{\sqrt{n}}x=2R2(1−cos(n2π​))​−n​2R​

x=(2(1−cos⁡(2πn))−2n)Rx = (\sqrt{2(1 - \cos(\frac{2\pi}{n}))} - \frac{2}{\sqrt{n}})Rx=(2(1−cos(n2π​))​−n​2​)R

Plotting the equation shows us x is positive for n < 10

y=2(1−cos⁡(2πx))−2xy = \sqrt{2(1 - \cos(\frac{2\pi}{x}))} - \frac{2}{\sqrt{x}}y=2(1−cos(x2π​))​−x​2​

For values of x < 0, the edges of the child circles will overlap. See below for zoomed in image for n=10...

Defining the gap between children

This method tweaks the equation for the child radius to achieve a desired gap between circle edges. The result of this would be a loss of proportional area, but could be used in conjunction with the previous section to define a lower limit for the gap e.g. limit so x >= 0 where the proportion is only lost in the case of n > 10 where x drops below 0.

2r+x=2R2(1−cos⁡(2πn))2r + x = \sqrt{2R^2(1 - \cos(\frac{2\pi}{n}))}2r+x=2R2(1−cos(n2π​))​

we can modify the equation for x to fix the value

r=12R1−cos⁡(2πn)−xr = \frac{1}{\sqrt{2}}R\sqrt{1 - \cos(\frac{2\pi}{n})} - xr=2​1​R1−cos(n2π​)​−x

Setting the gap size to zero

where the right hand side comes from the cosine rule

Maintaining proportional area
Defining the gap between children
Adjusting the gap size