Flower of Life

Here, we experiment with different ways of creating flower-of-life like images using svg's.

Below is a verson created with graphviz:

graph G { layout=neato overlap=false splines=true bgcolor="transparent" outputorder=edgesfirst // Global hex style node [ shape=polygon sides=6 regular=true orientation=30 width=1.6 height=1.6 fixedsize=true style=filled color="#000000" penwidth=2 fontname="Helvetica" fontsize=16 ] // Edge (arc) style edge [ color="#555555" penwidth=2 ] // Center C [label="one", fillcolor="#FF6F61", pos="0,0!", pin=true] // Spaced outer ring (no collisions) R [label="two", fillcolor="#33FF57", pos=" 1.8,0!", pin=true] L [label="three", fillcolor="#3357FF", pos="-1.8,0!", pin=true] TR [label="four", fillcolor="#5EF3FF", pos=" 0.9, 1.56!", pin=true] TL [label="five", fillcolor="#F5E663", pos="-0.9, 1.56!", pin=true] BR [label="six", fillcolor="#FF66C4", pos=" 0.9,-1.56!", pin=true] BL [label="seven", fillcolor="#A66BFF", pos="-0.9,-1.56!", pin=true] // Arcs from center to each outer hex C -- R; C -- L; C -- TR; C -- TL; C -- BR; C -- BL; }

graph G { layout=neato overlap=false splines=false bgcolor="transparent" outputorder=edgesfirst // Global hex style node [ shape=polygon sides=6 regular=true orientation=30 width=1.6 height=1.6 fixedsize=true style=filled color="#000000" penwidth=2 fontname="Helvetica" fontsize=16 ] // Center C [label="one", fillcolor="#FF6F61", pos="0,0!", pin=true] // Increased spacing (no collisions) R [label="two", fillcolor="#33FF57", pos=" 1.8,0!", pin=true] L [label="three", fillcolor="#3357FF", pos="-1.8,0!", pin=true] TR [label="four", fillcolor="#5EF3FF", pos=" 0.9, 1.56!", pin=true] TL [label="five", fillcolor="#F5E663", pos="-0.9, 1.56!", pin=true] BR [label="six", fillcolor="#FF66C4", pos=" 0.9,-1.56!", pin=true] BL [label="seven", fillcolor="#A66BFF", pos="-0.9,-1.56!", pin=true] }

graph G { layout=neato overlap=false splines=false bgcolor="transparent" outputorder=edgesfirst // Global hex style node [ shape=polygon sides=6 regular=true orientation=30 // flat-top look width=1.6 height=1.6 fixedsize=true style=filled color="#000000" penwidth=2 fontname="Helvetica" fontsize=16 ] // Center C [label="one", fillcolor="#FF6F61", pos="0,0!", pin=true] // Reduced spacing (was ±2.8, ±1.4/±2.42). Now ±2.5 and ±1.25/±2.165. R [label="two", fillcolor="#33FF57", pos=" 2.5,0!", pin=true] L [label="three", fillcolor="#3357FF", pos="-2.5,0!", pin=true] TR [label="four", fillcolor="#5EF3FF", pos=" 1.25, 2.165!", pin=true] TL [label="five", fillcolor="#F5E663", pos="-1.25, 2.165!", pin=true] BR [label="six", fillcolor="#FF66C4", pos=" 1.25,-2.165!", pin=true] BL [label="seven", fillcolor="#A66BFF", pos="-1.25,-2.165!", pin=true] }

graph G { layout=neato overlap=false splines=true bgcolor="transparent" outputorder=edgesfirst // Point-top hexagons node [ shape=polygon sides=6 regular=true orientation=0 // point-up width=1.6 height=1.6 fixedsize=true style=filled color="#000000" penwidth=2 fontname="Helvetica" fontsize=16 ] // Center C [label="one", fillcolor="#FF6F61", pos="0,0!", pin=true] // Ring with a hex directly above and below center // Base radius d=1.8; dx = 0.866*d ≈ 1.56, dy = 0.5*d = 0.9 T [label="two", fillcolor="#33FF57", pos=" 0, 1.8!", pin=true] // top TR [label="three", fillcolor="#3357FF", pos=" 1.56, 0.9!", pin=true] // top-right BR [label="four", fillcolor="#5EF3FF", pos=" 1.56,-0.9!", pin=true] // bottom-right B [label="five", fillcolor="#F5E663", pos=" 0, -1.8!", pin=true] // bottom BL [label="six", fillcolor="#FF66C4", pos="-1.56,-0.9!", pin=true] // bottom-left TL [label="seven", fillcolor="#A66BFF", pos="-1.56, 0.9!", pin=true] // top-left // Curved arcs from center to each outer hex C -- T; C -- TR; C -- BR; C -- B; C -- BL; C -- TL; }