2c:null 2d:["$","title",null,{"children":"World Art Nouveau Day June 10th | Brett Cooper | Observable"}] 32:T439,# [Cubic Béziers curves](https://developer.mozilla.org/en-US/docs/Web/SVG/Tutorial/Paths#b%C3%A9zier_curves) Cubic Béziers curves requires a control point on **both the start point and the end point**. ```js C cpx1 cpy1, cpx2 cpy2, x y (or) c cpdx1 cpdy1, cpdx2 cpdy2, dx dy ``` The shortcut for stringing together multiple quadratic Béziers, called with T. ```js S x2 y2, x y (or) s dx2 dy2, dx dy ``` 33:[] 30:{"id":"da6a7476fdbb1a51","slug":"world-art-nouveau-day-june-10th","title":"World Art Nouveau Day June 10th","thumbnail":"8fd04a2db084021e41c6014f0409a95aa9230ad4ce7141487e549d72ffc5486c","access_level":"public","create_time":"$D2022-06-09T11:21:51.091Z","update_time":"$D2022-06-11T15:48:54.596Z","view_time":null,"first_public_time":"$D2022-06-11T15:49:15.712Z","has_unpublished_edits":null,"fork":false,"stars":2,"starred":false,"owner":{"type":"team","id":"ca35562412a365ec","login":"hellonearthis","name":"Brett Cooper","avatar_url":"https://avatars-next.observableusercontent.com/ee05023c4c2a9d53e29a4f85f35e35430ae16d2c4aa6a6ca791175caf667abc2","tier":"starter_2024"},"version":496,"publish_version":496,"role":null,"authored":false,"authors":[{"type":"individual","id":"71df97e2192b6fce","login":"hellonearthis","name":"Brett Cooper","avatar_url":"https://avatars-next.observableusercontent.com/ee05023c4c2a9d53e29a4f85f35e35430ae16d2c4aa6a6ca791175caf667abc2","tier":null}],"members":[{"type":"individual","id":"71df97e2192b6fce","login":"hellonearthis","name":"Brett Cooper","avatar_url":"https://avatars-next.observableusercontent.com/ee05023c4c2a9d53e29a4f85f35e35430ae16d2c4aa6a6ca791175caf667abc2","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":true,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"titling":"auto","title":"World Art Nouveau Day June 10th","cells":[{"id":0,"value":"# World Art Nouveau Day June 10th\t\nhttps://en.wikipedia.org/wiki/World_Art_Nouveau_Day","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":261,"value":"SVG = {\nboop;\nlet path = `M40,20`\n\n path += `C${rnd(100,400)},${rnd(200,400)},${rnd(0,150)},${rnd(0,450)},${40},${380}`\n path += `C${rnd(100,400)},${rnd(200,400)},${rnd(0,150)},${rnd(0,450)},${40},${380} Z`\n \n const svg = d3.create(\"svg\")\n .attr(\"viewBox\", [0, 0, w, h])\n .style('background', \"#fff\")\n .attr('width',w)\n .attr('height',h); \n\n const corn = svg.append('g')\n .attr('class','corner');\n corn.append('g')\n .attr('transform','translate(0,400) scale(1,-1) ') \n .append('path')\n .attr('d',path)\n .attr('fill','#FFB86F40')\n .attr('stroke','goldenrod');\n \n corn.append('g')\n .attr('transform',`rotate(90 200 200) translate(-20,-20)`)\n .append('path')\n .attr('d',path)\n \n .attr('fill','#FFB86F40')\n .attr('stroke','goldenrod')\n \n \n return svg.node()\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":483,"value":"viewof boop = Inputs.button(\"ReDraw\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":416,"value":"frame = {\n let i = 0\n const svg = d3.create('svg').attr(\"width\", f).attr(\"height\", f)\n const main = svg.append(\"g\").attr('id','main')\n \n let other = d3.select(SVG)\n let group = other.selectAll('.corner').clone(true);\n \n main.selectAll('g')\n .data(data).join('g')\n .attr(\"transform\", ([i, j, r]) => `translate(${i},${j}) rotate(${r})`)\n .attr('id', (d,i) => `C2_${i}`)\n .append(() => group.clone(true).node())\n \n return svg.node()\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":421,"value":"data =[[0,0,0], [800,-20,90],[820,780,180],[20,800,270]]","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":461,"value":"f = 800","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":263,"value":"w = 400","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":265,"value":"h= 400","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":213,"value":"rnd = (a,b) => d3.randomInt(a,b)()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":6,"value":"$32","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"}],"files":"$W33","stdlib":"1"}} 31:"$30:body"