2a:null 2b:["$","title",null,{"children":"Sunflower | Dmitry Baranovskiy | Observable"}] 30:[] 2e:{"id":"09affb35cd571016","slug":"sunflower","title":"Sunflower","thumbnail":"543de75be3f9d552a1dc97c3ab5c332834f95f3abfa1d3b7788645fa7e50052e","access_level":"public","create_time":"$D2020-08-12T09:25:15.512Z","update_time":"$D2025-07-11T11:23:53.962Z","view_time":null,"first_public_time":"$D2020-08-12T10:51:49.451Z","has_unpublished_edits":null,"fork":{"id":"2bc316eaea0e3454","slug":"circular-dots","title":"Circular Dots","owner":{"id":"e3672025b6b6f436","login":"dmitrybaranovskiy","name":"Dmitry Baranovskiy"}},"stars":2,"starred":false,"owner":{"type":"team","id":"e3672025b6b6f436","login":"dmitrybaranovskiy","name":"Dmitry Baranovskiy","avatar_url":"https://avatars-next.observableusercontent.com/c31e7f084a49a6e09f7724ab70028e1f8a03923326f084b8f9e86a014705daf0","tier":"starter_2024"},"version":240,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"230ca2847200ccc9","login":"dmitrybaranovskiy","name":"Dmitry Baranovskiy","avatar_url":"https://avatars-next.observableusercontent.com/c31e7f084a49a6e09f7724ab70028e1f8a03923326f084b8f9e86a014705daf0","tier":null}],"members":[{"type":"individual","id":"230ca2847200ccc9","login":"dmitrybaranovskiy","name":"Dmitry Baranovskiy","avatar_url":"https://avatars-next.observableusercontent.com/c31e7f084a49a6e09f7724ab70028e1f8a03923326f084b8f9e86a014705daf0","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":3,"collection":{"id":"1ccb87aaae809911","slug":"patterns","title":"Patterns","owner":{"id":"e3672025b6b6f436","login":"dmitrybaranovskiy","name":"Dmitry Baranovskiy"}},"type":"notebook","body":{"titling":"auto","title":"Sunflower","cells":[{"id":0,"value":"md`# Sunflower`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":115,"value":"text = md`This experiment with [Vogel spiral](https://en.wikipedia.org/wiki/Fermat%27s_spiral#The_golden_ratio_and_the_golden_angle) gives better distributed dots except for the center. Play with **Angle Multiplier**.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":13,"value":"viewof a = slider({\n min: 5,\n max: 100,\n step: 1,\n value: 15,\n title: \"Distance\",\n description: \"Distance between dots\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":27,"value":"viewof r = slider({\n min: 1,\n max: a * 2,\n precision: 2,\n value: 4,\n title: \"Radius\",\n description: \"Radii of the dots\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":165,"value":"viewof m = slider({\n min: 1,\n max: 10,\n precision: 2,\n value: 10,\n title: \"Angle Multiplier\",\n description: \"Golden angle multiplier\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":228,"value":"viewof max = slider({\n min: 1,\n max: Math.round((size * Math.sqrt(1 + φ * φ)) / 2),\n precision: 2,\n value: Math.round((size * Math.sqrt(1 + φ * φ)) / 2),\n title: \"Max Size\",\n description: \"Cloud radius\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":236,"value":"viewof ir = slider({\n min: 0,\n max: Math.round((size * Math.sqrt(1 + φ * φ)) / 2),\n precision: 2,\n value: 50,\n title: \"Inner Radius\",\n description: \"Hole radius\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":84,"value":"output = html`

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":193,"value":"chart = html`In general case spiral looks like this:
\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":199,"value":"codesample = md`## Sample Code to produce these dots\nThe golden angle constant: ${tex`θ=π(3-\\sqrt{5})`}\n\nThe golden section constant: ${tex`\\phi=\\frac{1+\\sqrt{5}}{2}`}\n~~~js\nconst cx = (size * ф) / 2;\nconst cy = size / 2;\nconst dots = [];\nlet n = 0;\nlet R = 0;\nlet α = 0;\nwhile (R < max) {\n R = a * n ** .5;\n α = n * θ;\n dots.push([cx + R * Math.cos(α), cy + R * Math.sin(α)]);\n n++;\n}\n~~~`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":80,"value":"dots = {\n const cx = (size * φ) / 2;\n const cy = size / 2;\n const dots = [];\n let n = 0;\n let R = 0;\n let α = 0;\n while (R < max) {\n R = a * n ** 0.5;\n α = n * θ;\n if (R > ir) {dots.push([cx + R * Math.cos(α), cy + R * Math.sin(α)]);}\n n++;\n }\n return dots;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":100,"value":"φ = (1 + Math.sqrt(5)) / 2","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":150,"value":"θ = (m / 10) * π * (3 - 5 ** 0.5)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":109,"value":"π = Math.PI","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":36,"value":"size = 300","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":70,"value":"import { slider } from \"@jashkenas/inputs\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W30","stdlib":"1"}} 2f:"$2e:body"