29:null 2a:["$","title",null,{"children":"Origami platypus base ratios | Gilmore Davidson | Observable"}] 2f:T403,# Origami platypus base ratios This is a tool that I initially wrote to help me figure out the design for an origami model of a duck-billed platypus. I ended up adding more and more bits and pieces, some of which might only make sense to me. It was also a learning exercise for various trigonometry calculations. More context is available in [a blog post elsewhere](https://shoehornwithteeth.com/ramblings/2022/04/origami-platypus/). The width and mark sliders control the reference points for the primary folds that define the base. Each can be read as a percentage of the width/height of a square of paper where each side is 1 unit. * Body width separates the two mirror-image halves of the model, while effectively squashing the crease patterns on either side. * The head mark is measured from the top of the paper. It defines the location of the tip of the bill (and therefore how long the colour-changed bill should be). * The leg mark is measured from the bottom of the paper, where the tip of the back leg should be.30:T4d9,htl.html``31:T661,htl.html``32:Ta7d,points = (function () { let BG = 1, AB = (BG - markWidth) / 2; let BC = markHead; let FG = markLeg; // Corner points let A = [0, 0]; let B = [AB, 0]; let G = [AB, BG]; let H = [0, BG]; // Axial points let AJ = BG - FG; let C = [AB, BC]; let J = [0, AJ]; // Triangle molecule midpoints let AC = Math.hypot(AB, BC); let JM = AJ - BC; let CJ = Math.hypot(AB, JM); let N = midpoint(A, C, J, CJ, AJ, AC); let AL = N[1]; let L = [0, AL]; let CG = BG - BC; let GJ = Math.hypot(AB, FG); let Q = midpoint(G, C, J, CJ, GJ, CG); let EG = BG - Q[1]; let E = [AB, BG - EG]; // Hinge points let aAJC = angleFromPoints(A, J, C); let JP = AJ - AL; let P = [Math.sin(aAJC) * JP, AJ - Math.cos(aAJC) * JP]; let CD = CJ - JP; let DE = BG - BC - CD - EG; let JK = CJ - CD - DE; let D = [AB, BC + CD]; let K = [0, AL + DE]; let EQ = E[0] - Q[0]; let tQCE = EQ / (CD + DE); // tan of angle QCE let T = [AB - tQCE * CD, D[1]]; let LN = N[0]; let tNJL = LN / (JK + DE); // tan of angle NJL let U = [tNJL * JK, K[1]]; // Border intersections for guides let aACN = angleFromPoints(A, C, N); let aACB = Math.atan(AB / BC); let tBCS = Math.tan(aACB - aACN); let SB = tBCS * BC; let S = [AB - SB, 0]; let xAB1 = [BC / AB * N[1] + N[0], 0]; // Hinge from N to top border let tHGJ = FG / AB; let xGH1x = Q[0] - (tHGJ * (BG - Q[1])); let xGH1y = BG; if (xGH1x < 0) { xGH1y -= (0 - xGH1x) / tHGJ; xGH1x = 0; } let xGH1 = [xGH1x, xGH1y]; // Hinge from Q to either left or bottom border // Extra guides let xB1 = [0.5, 0]; // 50% of paper width let xB2 = [AB + markWidth, 0]; // 50% + (body width / 2) let xB3 = [xB2[0] + 0.1, 0]; // indicator of extra paper let xG1 = [0.5, 1]; let xG2 = [AB + markWidth, 1]; let xG3 = [xB2[0] + 0.1, 1]; // Points on folded base let BD = BC + CD; let bA = [AB, BD + AL]; let bB = [AB, BC * 2]; let bJ = [AB, BG - EG + JK]; let NP = Math.hypot(P[0] - N[0], P[1] - N[1]); let bN = [AB - NP, BD]; let bBS = NP / CD * BC; let bS = [AB - bBS, bB[1]]; let bT = T; let bxT1 = [T[0], 1]; let bxB2 = [xB2[0], BC]; return { // Crease Pattern cp: { A, B, C, D, E, G, H, J, K, L, N, P, Q, S, T, U, xAB1, xGH1, xB1, xB2, xB3, xG1, xG2, xG3, }, base: { // Head to tail, axial B: bB, C, D, E, G, // Body width xB2: bxB2, xG2, // Limbs A: bA, J: bJ, N: bN, Q, // Derivatives S: bS, T: bT, xT1: bxT1, }, lengths: { head: CD, arms: AL, body: DE, legs: JK, tail: EG, }, }; })();33:[] 2d:{"id":"7aabc104bf21e4b1","slug":"origami-platypus-base-ratios","title":"Origami platypus base ratios","thumbnail":"4fbb643d922c8a4a67f85493ca98b6a7e069857b98e1820a3b61aa7073136553","access_level":"public","create_time":"$D2021-09-17T06:26:48.888Z","update_time":"$D2024-09-11T23:43:41.063Z","view_time":null,"first_public_time":"$D2022-04-14T06:12:50.864Z","has_unpublished_edits":null,"fork":{"id":"e57692300453779b","slug":"interactive-svg","title":"Interactive SVG","owner":{"id":"f35c755083683fe5","login":"observablehq","name":"Observable"}},"stars":4,"starred":false,"owner":{"type":"team","id":"f55ed877764964a2","login":"gilmoreorless","name":"Gilmore Davidson","avatar_url":"https://avatars-next.observableusercontent.com/c5ca01f5d987fb9aa8cad5293eb21be5cef06ed31eb8af566b541a1018aa71a9","tier":"starter_2024"},"version":1128,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"000f2f22dc882a0b","login":"gilmoreorless","name":"Gilmore Davidson","avatar_url":"https://avatars-next.observableusercontent.com/c5ca01f5d987fb9aa8cad5293eb21be5cef06ed31eb8af566b541a1018aa71a9","tier":null}],"members":[{"type":"individual","id":"000f2f22dc882a0b","login":"gilmoreorless","name":"Gilmore Davidson","avatar_url":"https://avatars-next.observableusercontent.com/c5ca01f5d987fb9aa8cad5293eb21be5cef06ed31eb8af566b541a1018aa71a9","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":true,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":{"id":"6a0528209d2e64da","slug":"origami","title":"Origami","owner":{"id":"f55ed877764964a2","login":"gilmoreorless","name":"Gilmore Davidson"}},"type":"notebook","body":{"title":"Origami platypus base ratios","cells":[{"id":1081,"value":"$2f","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":1093,"value":"The relative ratios of each part are affected in different ways by the different sliders. On the left are the precise lengths of each part. On the right is the “skeleton” of the model. The thicker, highlighted red line indicates the length of the colour-change on the bill.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":478,"value":"viewof markWidth = Inputs.range([0, 0.25], {label: \"Body width\", value: 0.125})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10,"value":"viewof markHead = Inputs.range([0, 0.5], {label: \"Head mark\", value: 0.18, step: 0.01})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":29,"value":"viewof markLeg = Inputs.range([0, 0.5], {label: \"Leg mark\", value: 0.25, step: 0.01})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":255,"value":"$30","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1098,"value":"Below is the basic crease pattern and folded base for the left half of the model.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":670,"value":"$31","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1126,"value":"The right half of the pattern would obviously be the same but mirrored horizontally. This is using Robert J. Lang’s crease colouring system (green = axial; red = ridge; blue = hinge; black = paper’s edge). Grey lines are reference marks but aren’t folded.\n\n(And yes, it’s quite easy to adjust the sliders to a point where things break. I haven’t accounted for all the edge cases because this isn’t meant to be a 100% complete solution.)","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":635,"value":"$32","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":176,"value":"height = 150","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":67,"value":"lengths = points.lengths","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":963,"value":"cp = points.cp","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":966,"value":"base = points.base","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":528,"value":"tree = (() => {\n let angleDeg = 45;\n let angleRad = angleDeg / 180 * Math.PI;\n let armX = lengths.head + (lengths.arms * Math.cos(angleRad));\n let armY = lengths.arms * Math.sin(angleRad);\n let legX = lengths.head + lengths.body + (lengths.legs * Math.cos(angleRad));\n let legY = lengths.legs * Math.sin(angleRad);\n return {\n length: (lengths.head + lengths.body + lengths.tail) * 100,\n angleDeg,\n angleRad,\n armPoint: lengths.head * 100,\n legPoint: (lengths.head + lengths.body) * 100,\n armX: armX * 100,\n armY: armY * 100,\n legX: legX * 100,\n legY: legY * 100,\n };\n})();","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":106,"value":"function midpoint(pA, pB, pC, La, Lb, Lc) {\n // La = Line opposite point A, same for Lb/pB, Lc/pC\n let perimeter = La + Lb + Lc;\n let weighted = (i) => pA[i] * La + pB[i] * Lb + pC[i] * Lc;\n return [\n weighted(0) / perimeter,\n weighted(1) / perimeter,\n ];\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1028,"value":"function angleFromPoints(pA, pB, pC) {\n // Angle at point B (between lines AB and BC)\n let AB = Math.hypot(pB[0] - pA[0], pB[1] - pA[1]);\n let BC = Math.hypot(pC[0] - pB[0], pC[1] - pB[1]);\n let AC = Math.hypot(pC[0] - pA[0], pC[1] - pA[1]);\n // Law of cosines\n return Math.acos(\n (AB ** 2 + BC ** 2 - AC ** 2)\n / (2 * AB * BC)\n );\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":695,"value":"function line(pts, className = '', pointSet = points.cp) {\n let title = '';\n let p1 = [];\n let p2 = [];\n if (typeof pts === 'string') {\n title = pts;\n p1 = pointSet[pts[0]];\n p2 = pointSet[pts[1]];\n } else {\n p1 = pts[0];\n p2 = pts[1];\n }\n return htl.svg``\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":982,"value":"lineBase = (pts, className = '') => line(pts, className, points.base)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":374,"value":"htl.html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W33","stdlib":"1","titling":"auto"}} 2e:"$2d:body"