2d:null 2e:["$","title",null,{"children":"Logo | randName() | Observable"}] 33:T138c,allPaths = [` M222 89c11-17 11-24 23-4s20 111 19 173-9 62-31 29-70-61-115-70-50-12-19-31 77-40 123-97 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0z M226 109c22-22 27-26 34-7s13 94 1 157-26 60-44 32-58-71-93-84-59-17-22-31 103-43 124-67 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0z M243 116c20-13 27-14 31-1s5 96-18 149-40 53-45 43-48-83-76-105-68-33-25-37 94-28 133-49 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0z M243 130c31-11 46-12 47 4s-6 78-38 128-48 56-58 48-23-85-61-123-49-40-18-34 100-11 128-23 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0z M245 139c35-4 59-13 58 13s-27 75-55 110-71 65-74 51-8-101-29-127-61-62-31-48 96 7 131 1 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0z M243 146c35-4 75-1 76 16s-41 70-74 98-85 70-87 56 7-75 5-99-32-72-49-90 0-7 27 6 78 16 102 13 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0z M242 149c33 1 81 7 92 24s-61 60-92 85-70 49-92 62 19-81 14-112-11-54-38-88-10-19 26 4 66 24 90 25 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0z `,` M137 104c27 0 114 17 167 47s28 55-9 89-66 47-100 67-45 22-35-43-12-98-34-129 4-32 11-31 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0z M138 111c41-14 116 2 159 38s22 69 9 82-78 55-116 66-48 20-43-47-13-79-22-96-13-34 13-43 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0z M150 116c67-28 103-6 135 28s30 75 12 95-67 40-111 47-55 10-51-39-12-70-18-87 4-27 33-44 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0z M164 119c44-31 61-28 99 1 s44 107 25 129-74 28-104 28-64 5-62-38-9-46-11-66 22-33 53-54 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0z M176 123c41-42 44-43 80-5 s34 118 22 149-42 14-85 5-84-13-85-42-5-39-2-53 52-34 70-54 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0z M196 115c21-50 32-38 56 8 s23 83 23 103-9 92-33 75-61-36-90-48-52-13-58-36 9-37 23-42 70-39 79-60 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0z M203 121c21-39 2-59 19-43 s33 66 39 115-1 90-14 120-34-18-54-35-57-45-91-57-27-16-4-24 80-37 105-76 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0z `,` M 95 125c35-22 180 13 219 40s20 30-8 37-52 8-56 72-7 56-23 35-12-14-22-54-28-29-74-53-67-61-36-77 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0z M108 121c64-27 169 15 203 41s15 33-18 47-32 33-41 82-22 13-35 2-13-27-21-41-32-23-41-27-43-22-53-37-22-53 6-67 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0z M109 128c39-41 121-12 130-9s36 12 67 38 11 42-5 50-28 27-34 39-10 49-20 59-16 5-42-24-25-31-56-45-48-47-50-55-7-33 10-53 0 0 0 0 0 0 0 0 0 0 0 0z M113 132c23-29 55-35 87-32s63 18 88 35 33 44 22 60-36 46-40 64-16 41-24 45-29-9-49-23-30-21-60-39-36-52-37-59-2-35 13-51 0 0 0 0 0 0 0 0 0 0 0 0z M115 134c53-59 103-43 130-34s64 41 64 70-4 27-11 47-27 58-44 74-18 12-39 5-54-20-86-46-31-57-31-75 7-29 17-41 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0z M123 127c91-91 174-20 178 27s-4 50-1 63-15 55-46 73-38 4-53 5-48-6-77-33-31-66-27-83 9-35 26-52 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0z M126 126c79-89 170-55 169 23s5 39 9 77-44 60-59 66-29 6-48 9-62-3-83-33-24-54-16-87 17-40 28-55 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0z `,` M107 111c9-35 47-24 70-16s76-35 103-18 20 57 10 92-28 47-17 70 16 66-22 80-94-23-101-58 4-47-12-84-30-39-31-66 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0z M113 116c16-32 50-22 77-15s82-34 102-4 17 44 7 79-27 46-23 79-20 55-44 58-64-13-84-39-7-42-15-75-32-47-20-83 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0z M121 120c21-28 48-24 77-15s84-27 101 9 17 44 5 78-24 47-34 72-24 38-53 40-60-16-78-34-11-45-20-74-13-54 2-76 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0z M128 125c22-27 49-25 73-14s89-27 107 22 10 52 1 77-34 42-46 53-22 37-65 33-57-15-72-33-14-42-17-71 1-47 19-67 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0z M136 130c22-25 53-26 80-19s80-5 93 29 23 47 8 78-35 38-48 36-27 32-67 33-65-3-82-20-23-48-18-69 7-45 34-68 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0z M144 135c22-25 53-26 79-23s74 8 91 36 20 50 11 77-34 31-57 27-34 23-72 26-64 2-83-12-32-30-17-56 25-53 48-75 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0z M151 141c22-25 52-27 72-28s76 9 92 37 21 48 20 74-31 39-66 27-33 9-67 15-46 10-92-2-29-33-14-52 31-46 55-71 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0z `,` M63 116c21-9 94 26 121 35s70 18 102 28 13 41-13 50-75 26-126 47-125-27-135-35 3-32 15-65 28-58 36-60 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0z M82 113c18-8 87 26 111 35s71 22 100 31 3 50-25 61-87 38-103 39-21-2-59-7-57-16-75-24-18-14-15-23 39-106 66-112 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0z M95 112c18-9 88 25 108 34s78 25 97 32 12 42-26 65-86 50-121 35-51-12-77-20-62-16-56-29 47-105 75-117 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0z M117 109c17-6 72 22 98 35s76 26 92 34 4 44-29 67-75 60-113 35-48-20-86-28-58-12-53-23 53-110 91-120 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0z M133 107c19-6 80 26 102 39s80 24 85 37-8 35-32 57-61 57-86 56-40-40-97-47-76-10-74-17 50-100 102-125 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0z M149 105c20-7 78 26 107 43s70 24 71 38-5 26-29 48-53 52-78 66-53-48-97-56-92-2-86-14 18-38 48-70 46-49 64-55 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0z M164 103c25-8 78 28 107 45s66 21 64 39-8 23-34 48-32 27-68 64-47-43-99-59-101 6-89-15 62-92 119-122 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0z `].map((p) => p.split('\n').map((i) => i.trim()).filter((i) => i))34:T748,viewof curve = { const arr = pathText.split(/(M|C|H|V|L|S)/).slice(1) const points = Array.from({ length: arr.length / 2 }, (_, i) => { const ns = arr[i * 2 + 1].trim().split(' ').map((n) => parseFloat(n)) return Array.from({ length: ns.length / 2 }, (_, j) => ({ x: ns[j * 2], y: ns[j * 2 + 1] })) }).flat() const node = svg`` if (!pathText) return node const el = d3.select(node) const toPoint = ({ x, y }) => `${Math.round(x)} ${Math.round(y)}` const dragged = ({ x, y }, d) => (d.x = x, d.y = y, update()) const stretch = el.append('g').attr('fill', 'none').attr('stroke', '#d03').selectAll('path') .data(Array.from({ length: arr.length / 2 }, (_, i) => [points[i * 2], points[i * 2 + 1]])) .enter().append("path").attr('d', d => `M${toPoint(d[0])} L${toPoint(d[1])}`) const bezier = el.append('path').attr('fill', 'none').attr('stroke-width', '1.5px').attr('stroke', '#08e') const point = el.append('g').attr('cursor', 'move').attr('pointer-events', 'all').selectAll("circle") .data(points) .enter().append('circle') .attr('r', 3).attr('fill', '#000') .call(d3.drag().on('drag', dragged)) function update() { point.attr('cx', (d) => d.x).attr('cy', (d) => d.y) stretch.attr('d', (d) => `M${toPoint(d[0])} L${toPoint(d[1])}`) const [p0, p1, p2, p3, ...pts] = points const rest = Array.from({ length: pts.length / 2 }, (_, i) => `S${ toPoint(pts[i * 2])} ${toPoint(pts[i * 2 + 1])}`).join(' ') node.value = `M${toPoint(p0)} C${toPoint(p1)} ${toPoint(p2)} ${toPoint(p3)} ${rest}` bezier.attr('d', node.value) node.dispatchEvent(new CustomEvent('input')) } update() return node }35:T41b,paths = logoParts.slice(4, 11).map((part) => { const pathD = svg``.querySelector('path').getAttribute('d') return pathD.split('Z').map((segment) => { const arr = segment.split(/(M|C|H|V|L)/).slice(1) const centroid = [0, 0] let total = 0 let h = 0 let v = 0 for (let i = 0; i < arr.length / 2; ++i) { const nums = arr[i * 2 + 1].split(' ').map((n) => parseFloat(n)) switch(arr[i * 2]) { case 'H': ++h centroid[0] += nums[0] break case 'V': ++v centroid[1] += nums[0] break default: for (let j = 0; j < nums.length / 2; ++j) { ++total centroid[0] += nums[j * 2] centroid[1] += nums[j * 2 + 1] } } } if (!total) return null const x = (centroid[0] / (total + h)) - 290 const y = (centroid[1] / (total + v)) return [Math.atan2(y - 100, x - 100), x, y] }).filter((i) => i).sort((a, b) => a[0] - b[0]).map(([a, x, y]) => [x, y]) })36:[{"id":"660c7f035d396df8d8bb37c4254ebb029c60db98ae0d27078037568eeee22c0cc7304929078168ec8abc1844afccd38ae504d09676bc6fb59d5b0a19d85e38a1","href":"https://static.observableusercontent.com/files/660c7f035d396df8d8bb37c4254ebb029c60db98ae0d27078037568eeee22c0cc7304929078168ec8abc1844afccd38ae504d09676bc6fb59d5b0a19d85e38a1","name":"govtech_logo.svg","type":"image/svg+xml","lastModified":1616672776663.555,"size":187534},{"id":"e6f6caffd64f4743ce26e40c6975421f1aff1cf77ef368718c2759ee0b67d65e905f10884531af53e3bc650fef1a6c09bba4cd1681dfdf24d003b56965337c87","href":"https://static.observableusercontent.com/files/e6f6caffd64f4743ce26e40c6975421f1aff1cf77ef368718c2759ee0b67d65e905f10884531af53e3bc650fef1a6c09bba4cd1681dfdf24d003b56965337c87","name":"gt_4.png","type":"image/png","lastModified":1616850808522.684,"size":171437}] 31:{"id":"4ed389a8dd92dd27","slug":"govtech-logo","title":"Logo","thumbnail":"6dbb8a7049ad7ba907ac25bc633c1ef01f6a2de6af58b87331a49bed816d258f","access_level":"public","create_time":"$D2021-03-25T11:44:59.427Z","update_time":"$D2022-05-18T15:23:05.397Z","view_time":null,"first_public_time":"$D2021-03-25T13:00:15.453Z","has_unpublished_edits":null,"fork":false,"stars":1,"starred":false,"owner":{"type":"team","id":"af680361d1ea8ba5","login":"randname","name":"randName()","avatar_url":"https://avatars-next.observableusercontent.com/f16c819c73deae04aebd89cd214320d2b848d288cea0ed4487f835cc1b3e9c04","tier":"starter_2024"},"version":1195,"publish_version":1195,"role":null,"authored":false,"authors":[{"type":"individual","id":"6af62fd51a9b60df","login":"randname","name":"randName()","avatar_url":"https://avatars-next.observableusercontent.com/f16c819c73deae04aebd89cd214320d2b848d288cea0ed4487f835cc1b3e9c04","tier":null}],"members":[{"type":"individual","id":"6af62fd51a9b60df","login":"randname","name":"randName()","avatar_url":"https://avatars-next.observableusercontent.com/f16c819c73deae04aebd89cd214320d2b848d288cea0ed4487f835cc1b3e9c04","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":2,"collection":null,"type":"notebook","body":{"title":"Logo","cells":[{"id":0,"value":"md`# Logo`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":9,"value":"logoParts = (await FileAttachment(\"govtech_logo.svg\").text()).split(/\\n/)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":15,"value":"oriPath = svg``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":302,"value":"colors = logoParts.slice(4, 11).map((part, i) => svg``.querySelector('path').getAttribute('fill'))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":493,"value":"`M${paths[0].map(([x, y]) => `${x.toFixed(3)} ${y.toFixed(3)}`).join('L')}Z`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":754,"value":"md`## Bezier approximation`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1084,"value":"$33","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1064,"value":"svg``","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1115,"value":"SEVEN = [0, 1, 2, 3, 4, 5, 6]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":596,"value":"viewof pathText = html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":623,"value":"curve","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":510,"value":"$34","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":388,"value":"md`## Other Curves`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":479,"value":"md`## Circles\nFind the centroid of each mini path and draw a real circle\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":472,"value":"svg``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":294,"value":"$35","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":339,"value":"md`## DFT\nTake the DFT of each curve (${M} coefficients)`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":319,"value":"coefficients = paths.map((path) => {\n const N = path.length\n const arr = Array.from(K, (k) => {\n const c = -Math.PI * k * 2 / N\n return path.reduce((x, p, i) => addmulexp(x, p, c * i), [0, 0]).map((n) => n / N)\n }).map(([a, b]) => `[${a.toFixed(2)},${b.toFixed(2)}]`).join(',')\n return JSON.parse(`[${arr}]`)\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":72,"value":"{\n/*\nhttps://github.com/pbeshai/d3-interpolate-path\nhttps://www.npmjs.com/package/flubber\nsvg``\n*/\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":381,"value":"md`## Appendix`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":512,"value":"d3 = require(\"d3@6\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":845,"value":"allColors = [\n '#a6c637', '#97bf3d', '#7eb742', '#6ab246', '#46a949', '#23a449',\n '#00984f', '#009c5d', '#00a175', '#00a587', '#00ada4', '#00b4bf',\n '#16c2f4', '#01aee6', '#069fdb', '#058ccc', '#007cc2', '#0170bb',\n '#0061af', '#205dab', '#4758a6', '#6053a3', '#784b9e', '#904099',\n '#b41e8c', '#b8238b', '#c2367d', '#cd496f', '#d65762', '#e16451',\n '#f57921', '#e88625', '#db9328', '#cea02c', '#c0ac30', '#b3b933', '#a6c637',\n]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":863,"value":"html`${[0, 1, 2, 3, 4, 5].map((i) => html`${allColors.slice(i * 6, i * 6 + 7).map((c) => html`${c} `)}
`)}`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":274,"value":"M = 50","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":361,"value":"addmulexp = ([rea, ima], [reb, imb], im) => {\n const rec = Math.cos(im)\n const imc = Math.sin(im)\n return [rea + reb * rec - imb * imc, ima + reb * imc + imb * rec]\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":249,"value":"K = Int16Array.from({length: M}, (_, i) => (1 + i >> 1) * (i & 1 ? -1 : 1))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W36","stdlib":"1","titling":"auto"}} 32:"$31:body"